"use client";

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

import { PageHeader } from "@/components/shared/page-header";
import { DocumentForm } from "@/components/documents/document-form";
import { useCreateDocument } from "@/lib/hooks/use-documents";
import { useDataProvider } from "@/lib/demo/data-provider-context";

export default function NewDocumentPage() {
  const router = useRouter();
  const { basePath } = useDataProvider();
  const createDocument = useCreateDocument();

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

      <DocumentForm
        loading={createDocument.isPending}
        onSubmit={(data, file) => {
          createDocument.mutate(
            { data, file },
            {
              onSuccess: (res) => {
                toast.success("Document created");
                router.push(`${basePath}/documents/${res.id}`);
              },
              onError: () => {
                toast.error("Failed to create document");
              },
            },
          );
        }}
      />
    </div>
  );
}
