"use client";

import { Card, Space } from "antd";
import InputItem from "@/app/Components/FormItems";
import { handleChange } from "@/app/utils/form";
import { CardTitle } from "@/app/utils/CardTitle";
import { parseArrayField } from "@/app/utils/parseArrayField";
import { useSiteContext } from "@/app/Context/SiteContext";
import { useEffect, useMemo, useState } from "react";
import SelectCustomer from "../SelectCustomer";
import SectionValidator from "../SectionValidator";
import LineItemFormTable from "../LineItemFormTable";
import Summary from "../Summary";
import SendingOptions from "../SendingOptions";
import { AlertMessage } from "../AlertMessage";
import UploadDoc from "../UploadDoc";
import EnableRecurring from "../EnableRecurring";

export default function InvoiceForm({
  form,
  setForm,
  settings,
  enableGlobalDiscount = false,
  onReferenceChange,
  currency,
  brandSettings,
  allQuotes,
  allProforma,
  allDeliveryNote,
  allInventory,
  isEditMode,
  allPayments,
  allProformas,
  type,
}) {
  const {
    setLineItems,
    customerRelatedData,
    lineItems,
    setPaidDeliveryNotes,
    editLineData,
    setEditLineData,
    quoteLineItems,
    setQuoteLineItems,
    setRemovedDeliveryNotes,
  } = useSiteContext();

  useEffect(() => {
    try {
      const getFirst = (val) => (Array.isArray(val) ? val[0] : val);

      const quote = allQuotes.find(
        (q) => q.quote_number === getFirst(form?.quote_ref_number),
      );

      const proforma = allProforma.find(
        (p) => p.proforma_number === getFirst(form?.proforma_ref_number),
      );

      //  Support multiple delivery notes
      const selectedDeliveryNotes = allDeliveryNote.filter((d) =>
        form?.delivery_note_ref_number?.includes(d.deliverynote_number),
      );

      let deliveryNoteItems = [];
      if (selectedDeliveryNotes.length > 0) {
        deliveryNoteItems = selectedDeliveryNotes.flatMap((d) => {
          const items =
            typeof d.line_items === "string"
              ? JSON.parse(d.line_items)
              : d.line_items;
          return Array.isArray(items) ? items : [];
        });
      }

      // Fallback if no delivery note
      const fallbackRaw = quote?.line_items || proforma?.line_items;

      const fallbackItems =
        typeof fallbackRaw === "string" ? JSON.parse(fallbackRaw) : fallbackRaw;

      const finalItems =
        deliveryNoteItems.length > 0
          ? deliveryNoteItems
          : Array.isArray(fallbackItems)
            ? fallbackItems
            : [];

      setLineItems(finalItems);
      setQuoteLineItems(finalItems);
    } catch (e) {
      console.warn("Invalid JSON in line_items:", e);
      setLineItems([]);
    }
  }, [
    form?.quote_ref_number,
    form?.proforma_ref_number,
    form?.delivery_note_ref_number,
    allQuotes,
    allProforma,
    allDeliveryNote,
    isEditMode,
    form?.line_items,
  ]);

  const filteredDeliveryNote = customerRelatedData?.[0]?.delivery_notes?.filter(
    (deliverynote) =>
      parseArrayField(deliverynote?.status)?.[0]?.id !== 3 &&
      parseArrayField(deliverynote?.status)?.[0]?.id !== 4,
  );

  const [beforeRefNumbers, setBeforeRefNumbers] = useState([]);

  useEffect(() => {
    if (
      form?.delivery_note_ref_number?.length > 0 &&
      beforeRefNumbers.length === 0
    ) {
      // Deep copy → prevents mutation
      setBeforeRefNumbers(
        JSON.parse(JSON.stringify(form.delivery_note_ref_number)),
      );
    }
  }, [form]);

  const handleDeliveryNoteRefChange = async (eventOrValue) => {
    const rawValue = eventOrValue?.target?.value || eventOrValue;
    const selectedValues = Array.isArray(rawValue) ? rawValue : [rawValue];

    // Find all selected delivery notes
    const selectedNotes = filteredDeliveryNote?.filter((d) =>
      selectedValues.includes(d.deliverynote_number),
    );

    // Combine totals (if multiple notes are selected)
    const totalValue = selectedNotes?.reduce(
      (sum, note) => sum + (Number(note.total_delivery_note_value) || 0),
      0,
    );

    const balanceAmount = selectedNotes?.reduce(
      (sum, note) => sum + (Number(note.balance_amount) || 0),
      0,
    );

    if (onReferenceChange) {
      onReferenceChange("deliverynote", selectedValues);
    } else {
      setForm((prev) => ({
        ...prev,
        delivery_note_ref_number: selectedValues,
        quote_ref_number: [],
        proforma_ref_number: [],
        total_value: totalValue,
        balance_amount: balanceAmount,
      }));
    }

    const after = selectedValues;

    const removed = beforeRefNumbers.filter((item) => !after.includes(item));

    setRemovedDeliveryNotes(removed);
  };

  const filtered = customerRelatedData?.[0]?.delivery_notes?.filter((item) =>
    Array.isArray(form?.delivery_note_ref_number)
      ? form.delivery_note_ref_number.includes(item.deliverynote_number)
      : item.deliverynote_number === String(form?.delivery_note_ref_number),
  );

  useEffect(() => {
    setPaidDeliveryNotes(filtered);
  }, [form?.delivery_note_ref_number]);

  // useEffect(() => {
  //   if (parseArrayField(form.line_items).length !== 0) {
  //     setEditLineData(parseArrayField(form.line_items));
  //   }
  // }, [form]);

  useEffect(() => {
    if (!form?.line_items) return;

    const parsedLineItems = parseArrayField(form.line_items);
    if (parsedLineItems.length > 0) {
      setEditLineData(parsedLineItems);
    }
  }, [form.line_items]);

  const calculateEndDate = (startDate, repeatEvery) => {
    const date = new Date(startDate);

    if (repeatEvery === "month") date.setMonth(date.getMonth() + 1);
    else if (repeatEvery === "sixmonth") date.setMonth(date.getMonth() + 6);
    else if (repeatEvery === "year") date.setFullYear(date.getFullYear() + 1);

    return date.toISOString().split("T")[0]; // YYYY-MM-DD for <input type="date">
  };

  if (!form?.itemNumber || form?.itemNumber === "-NaN") {
    return (
      <div className={`container sm:!my-5 !my-3 grid sm:gap-5 gap-3`}>
        <AlertMessage
          type="error"
          message={`Item number is not valid. Please go to Settings to set up the prefix and padding.`}
        />
      </div>
    );
  }

  const filteredNotes =
    customerRelatedData?.[0]?.delivery_notes?.filter((item) =>
      form?.delivery_note_ref_number?.includes(item.deliverynote_number),
    ) || [];

  const firstNote = filteredNotes[0];

  const currentLpoNumber = customerRelatedData?.[0]?.quotes?.find(
    (item) => item.quote_number === firstNote?.quote_id,
  );

  useEffect(() => {
    if (currentLpoNumber?.lpo_number) {
      setForm((prev) => ({
        ...prev,
        lpo_number:
          Number(currentLpoNumber.lpo_number) || currentLpoNumber.lpo_number,
      }));
    } else {
      setForm((prev) => ({
        ...prev,
        lpo_number: prev.lpo_number || "",
      }));
    }
  }, [currentLpoNumber]);

  const quoteRef = useMemo(() => {
    return (
      customerRelatedData?.[0]?.delivery_notes?.filter((item) =>
        form?.delivery_note_ref_number?.includes(item.deliverynote_number),
      ) || []
    );
  }, [customerRelatedData, form?.delivery_note_ref_number]);

  useEffect(() => {
    if (quoteRef.length > 0) {
      setForm((prev) => ({
        ...prev,
        quoteRef,
      }));
    }
  }, [quoteRef]);

  return (
    <div className="container  grid gap-6">

      {/* ================= PRIMARY INFO ================= */}
      <div className="grid gap-6">

        <div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
          <SelectCustomer
            name="customer_name"
            value={form.customer_name}
            onChange={(e) => handleChange(e, setForm)}
            setForm={setForm}
            form={form}
            customerId={form?.customer_id}
          />

          <InputItem
            type="textspecial"
            typeField="number"
            label="Invoice Number"
            name="itemNumber"
            placeholder="Invoice Number"
            value={(form?.customer_name && form?.itemNumber) || "-"}
            onChange={(e) => handleChange(e, setForm)}
            disabled={true}
          />

          <InputItem
            type="date"
            label="Date"
            name="invoice_date"
            value={form?.invoice_date || new Date()}
            onChange={(e) => handleChange(e, setForm)}
          />

          <InputItem
            type="tag_ant"
            label="Select Delivery Note"
            name="delivery_note_ref_number"
            value={form?.delivery_note_ref_number}
            onChange={handleDeliveryNoteRefChange}
            options={filteredDeliveryNote}
            disabled={!form?.customer_name}
          />

          <InputItem
            type="textspecial"
            label="LPO Number"
            name="lpo_number"
            onChange={(e) => handleChange(e, setForm)}
            value={currentLpoNumber?.lpo_number || form.lpo_number || ""}
            disabled={currentLpoNumber?.lpo_number ? true : false}
          />

          <div className="pt-8">
            <EnableRecurring
              form={form}
              setForm={setForm}
              settings={settings}
              selectedCustomer={form?.customer_name}
            />
          </div>
        </div>

        <div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
          <InputItem
            type="editor"
            label="Terms and Conditions"
            name="terms"
            value={form?.terms || settings?.terms_conditions}
            onChange={(e) => handleChange(e, setForm)}
          />

          <InputItem
            type="editor"
            label="Internal Notes"
            name="notes"
            value={form?.notes}
            onChange={(e) => handleChange(e, setForm)}
          />
        </div>

        <div className="flex gap-6">
          <InputItem
            type="checkbox"
            label="Add eSignature"
            name="digital_signature"
            className="no-width"
            value={form?.digital_signature}
            onChange={(e) => handleChange(e, setForm)}
          />

          <InputItem
            type="checkbox"
            label="Add Attachments?"
            name="attachments"
            className="no-width"
            value={form?.attachments}
            onChange={(e) => handleChange(e, setForm)}
          />

          <SendingOptions />
        </div>

      </div>

      {/* ================= LINE ITEMS ================= */}
      {form.customer_name !== "" &&
        form?.delivery_note_ref_number?.length !== 0 && (
          <div className="grid gap-4">

            {parseArrayField(form?.line_items).length === 0 && (
              <SectionValidator
                item="line_items"
                field={lineItems}
                text="At least one line item is required."
              />
            )}

            <LineItemFormTable
              tax={true}
              activelineItems={
                isEditMode
                  ? quoteLineItems.length !== 0
                    ? quoteLineItems
                    : parseArrayField(editLineData)
                  : quoteLineItems.length !== 0
                    ? quoteLineItems
                    : allInventory
              }
              refdata={quoteLineItems?.length !== 0 ? true : false}
              purchase={true}
              customercurrency={form?.currency}
              form={form}
              setForm={setForm}
              type={type}
              disabled={true}
              editQty={false}
            />

          </div>
        )}

      {/* ================= DOCUMENTS ================= */}
      <div className="grid gap-3">
        <h2 className="text-base font-semibold uppercase my-4">Upload Documents</h2>

        <UploadDoc
          form={form}
          setForm={setForm}
          isEditMode={isEditMode}
          location="invoice_docs"
          expiry={false}
        />
      </div>

      {/* ================= SUMMARY ================= */}
      {lineItems?.length !== 0 && (
        <div className="flex justify-end">
          <div className="lg:w-[50%]">
            <Summary
              type="invoice"
              form={form}
              setForm={setForm}
              currency={currency}
              enableGlobalDiscount={enableGlobalDiscount}
              brandSettings={brandSettings}
              proformas={allProformas}
              allPayments={allPayments}
            />
          </div>
        </div>
      )}

    </div>
  );

}