"use client";

import { useRouter } from "next/navigation";
import { toast } from "sonner";

import { PageHeader } from "@/components/shared/page-header";
import { ResidenceForm } from "@/components/residences/residence-form";
import { useCreateResidence } from "@/lib/hooks/use-residences";
import { useDataProvider } from "@/lib/demo/data-provider-context";

export default function NewResidencePage() {
  const router = useRouter();
  const { basePath } = useDataProvider();
  const createResidence = useCreateResidence();

  return (
    <div className="space-y-6 w-full max-w-2xl mx-auto">
      <PageHeader title="New Residence" description="Add a new property" />

      <ResidenceForm
        loading={createResidence.isPending}
        onSubmit={(data) => {
          createResidence.mutate(data, {
            onSuccess: (res) => {
              toast.success("Residence created");
              router.push(`${basePath}/residences/${res.id}`);
            },
            onError: () => {
              toast.error("Failed to create residence");
            },
          });
        }}
      />
    </div>
  );
}
