"use client";

import { isApiSuccess } from "@/lib/api-messages";
import { useMemo, useState } from "react";
import { useRouter } from "next/navigation";
import { zodResolver } from "@hookform/resolvers/zod";
import { CalendarClock } from "lucide-react";
import { useForm } from "react-hook-form";
import { toast } from "sonner";

import {
  FormPageHeader,
  FormPanel,
  FormSaveBar,
} from "@/app/dashboard/_components/form";
import { FormField } from "@/components/form/form-field";
import { Input } from "@/components/ui/input";
import { requestDashboardApi } from "@/lib/dashboard-api-client";
import { MasterTableDateField } from "../../../_components/master-table-date-field";
import { LIST_HREF } from "../constants";
import type { BondMaturityRow } from "../schema";
import {
  bondMaturityFormSchema,
  type BondMaturityFormValues,
} from "./schema";

const UPDATE_HREF = "/dashboard/master-table/bond-maturity/update";

type Props = {
  recordId: string;
  initialRow: BondMaturityRow;
};

function rowToValues(row: BondMaturityRow): BondMaturityFormValues {
  return { isin: row.isin, maturity: row.maturity };
}

export function BondMaturityForm({ recordId, initialRow }: Props) {
  const router = useRouter();
  const [isSaving, setIsSaving] = useState(false);

  const defaultValues = useMemo(() => rowToValues(initialRow), [initialRow]);

  const form = useForm<BondMaturityFormValues>({
    resolver: zodResolver(bondMaturityFormSchema),
    defaultValues,
  });

  const { register, handleSubmit } = form;

  const onSubmit = handleSubmit(async (values) => {
    setIsSaving(true);
    try {
      const data = await requestDashboardApi<{ status?: string; message?: string }>({
        url: UPDATE_HREF,
        method: "POST",
        body: {
          id: recordId,
          isin: values.isin,
          maturity: values.maturity,
        },
        fallbackError: "Bond maturity could not be updated.",
        validate: (payload) => isApiSuccess(payload),
      });

      toast.success(data.message ?? "Bond maturity updated.");
      router.push(LIST_HREF);
      router.refresh();
    } catch (error) {
      toast.error(
        error instanceof Error
          ? error.message
          : "Bond maturity could not be updated.",
      );
    } finally {
      setIsSaving(false);
    }
  });

  return (
    <form onSubmit={(e) => void onSubmit(e)} className="pb-4">
      <FormPageHeader
        backHref={LIST_HREF}
        breadcrumb={[
          { label: "Master Table", href: LIST_HREF },
          { label: "Bond Maturity", href: LIST_HREF },
          { label: "Update" },
        ]}
        titleIcon={<CalendarClock className="size-5 text-primary" />}
        title="Update bond maturity"
        description="Edit maturity date for the selected bond ISIN."
      />

      <FormPanel title="Bond details">
        <div className="grid max-w-xl gap-6">
          <FormField label="ISIN" htmlFor="isin" required>
            <Input
              id="isin"
              readOnly
              className="font-mono bg-muted"
              {...register("isin")}
            />
          </FormField>
          <MasterTableDateField
            control={form.control}
            name="maturity"
            label="Maturity"
            htmlFor="maturity"
            required
          />
        </div>
      </FormPanel>

      <FormSaveBar
        cancelHref={LIST_HREF}
        isSaving={isSaving}
        saveLabel="Save changes"
        onReset={() => form.reset(rowToValues(initialRow))}
      />
    </form>
  );
}