"use client";

import { isApiSuccess } from "@/lib/api-messages";
import Link from "next/link";
import { useEffect, useMemo, useState } from "react";
import { useRouter } from "next/navigation";
import { zodResolver } from "@hookform/resolvers/zod";
import { ChartCandlestick, Plus } 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 { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { requestDashboardApi } from "@/lib/dashboard-api-client";

import { CREATE_HREF, LIST_HREF } from "../constants";
import type { DerivativeMasterRow } from "../schema";
import {
  derivativeMasterFormSchema,
  type DerivativeMasterFormValues,
} from "./schema";

type Props = {
  mode: "create" | "update";
  initialRow?: DerivativeMasterRow;
};

const defaults: DerivativeMasterFormValues = {
  parentIsin: "",
  currency: "",
  marketPrice: "",
};

function rowToValues(row: DerivativeMasterRow): DerivativeMasterFormValues {
  return {
    parentIsin: row.parentIsin,
    currency: row.currency,
    marketPrice: row.marketPrice,
  };
}

export function DerivativeMasterForm({ mode, initialRow }: Props) {
  const router = useRouter();
  const isUpdate = mode === "update";
  const [isSaving, setIsSaving] = useState(false);

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

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

  const {
    register,
    handleSubmit,
    formState: { errors },
  } = form;

  useEffect(() => {
    form.reset(initialRow ? rowToValues(initialRow) : defaults);
  }, [form, initialRow]);

  const onSubmit = handleSubmit(async (values) => {
    setIsSaving(true);
    try {
      const url = isUpdate
        ? "/dashboard/master-table/derivative-master/update"
        : "/dashboard/master-table/derivative-master/create/submit";

      const body = isUpdate
        ? {
            srNo: initialRow?.srNo,
            parentIsin: values.parentIsin,
            currency: values.currency,
            marketPrice: values.marketPrice,
          }
        : values;

      const data = await requestDashboardApi<{ status?: string; message?: string }>({
        url,
        method: "POST",
        body,
        fallbackError: `Derivative master could not be ${isUpdate ? "updated" : "created"}.`,
        validate: (payload) => isApiSuccess(payload),
      });

      toast.success(
        data.message ?? `Derivative master ${isUpdate ? "updated" : "created"}.`,
      );
      router.push(LIST_HREF);
      router.refresh();
    } catch (error) {
      toast.error(
        error instanceof Error
          ? error.message
          : `Derivative master could not be ${isUpdate ? "updated" : "created"}.`,
      );
    } 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: "Derivative Master", href: LIST_HREF },
          { label: isUpdate ? "Update" : "Create new" },
        ]}
        titleIcon={<ChartCandlestick className="size-5 text-primary" />}
        title={isUpdate ? "Update derivative master" : "Create new derivative master"}
        description="Parent ISIN, currency, and market price for derivative instruments."
        meta={
          isUpdate ? (
            <Button size="sm" className="gap-1.5" asChild>
              <Link href={CREATE_HREF}>
                <Plus className="size-4" />
                Create new
              </Link>
            </Button>
          ) : null
        }
      />

      <FormPanel title="Derivative details">
        <div className="grid gap-6 md:grid-cols-3">
          <FormField
            label="Parent ISIN"
            htmlFor="parentIsin"
            required
            error={errors.parentIsin}
          >
            <Input
              id="parentIsin"
              className="font-mono"
              {...register("parentIsin")}
            />
          </FormField>
          <FormField
            label="Currency"
            htmlFor="currency"
            required
            error={errors.currency}
          >
            <Input id="currency" {...register("currency")} />
          </FormField>
          <FormField
            label="Market price"
            htmlFor="marketPrice"
            required
            error={errors.marketPrice}
          >
            <Input id="marketPrice" {...register("marketPrice")} />
          </FormField>
        </div>
      </FormPanel>

      <FormSaveBar
        cancelHref={LIST_HREF}
        isSaving={isSaving}
        onReset={() => form.reset(initialRow ? rowToValues(initialRow) : defaults)}
      />
    </form>
  );
}