"use client";

import { Card, Space } from "antd";
import { useEffect, useMemo } from "react";

import InputItem from "@/app/Components/FormItems";
import { handleChange } from "@/app/utils/form";
import { CardTitle } from "@/app/utils/CardTitle";
import { useSiteContext } from "@/app/Context/SiteContext";
import { getStatusById } from "@/app/utils/status";

import SelectCustomer from "../SelectCustomer";
import SectionValidator from "../SectionValidator";
import SendingOptions from "../SendingOptions";
import { SalesReturnItems } from "../SalesReturnItems";
import { AlertMessage } from "../AlertMessage";
import { getPaymentByInvoiceNumber } from "@/app/utils/getPaymentByInvoiceId";
import { parseArrayField } from "@/app/utils/parseArrayField";

export default function SalesReturnForm({
  form,
  setForm,
  settings,
  allDeliveryNote,
  allPayments,
  pathname,
  isEditMode,
}) {
  const { setEditLineData, customerRelatedData } = useSiteContext();

  /* ======================================================
     FILTERED INVOICES (PAID + PARTIALLY PAID)
  ====================================================== */

  const paidInvoices = useMemo(() => {
    const invoices = customerRelatedData?.[0]?.invoices || [];

    const allowedStatusIds = [
      getStatusById(8)?.id, // paid
      getStatusById(9)?.id, // partially paid
    ];

    return invoices.filter((invoice) => {
      const statusId = parseArrayField(invoice?.status)?.[0]?.id;
      return allowedStatusIds.includes(statusId);
    });
  }, [customerRelatedData]);

  const selectedPaidInvoice = useMemo(() => {
    const invoices = customerRelatedData?.[0]?.invoices || [];

    const allowedStatusIds = [
      getStatusById(8)?.id, // paid
      getStatusById(9)?.id, // partially paid
    ];

    const selectedInvoiceNo = form?.invoice_number;

    if (!selectedInvoiceNo) return [];

    return invoices.filter((invoice) => {
      const statusId = parseArrayField(invoice?.status)?.[0]?.id;

      return (
        allowedStatusIds.includes(statusId) &&
        invoice.invoice_number === selectedInvoiceNo
      );
    });
  }, [customerRelatedData, form?.invoice_number]);

  /* ======================================================
     LOAD LINE ITEMS
  ====================================================== */
  const lineItems = useMemo(() => {
    // EDIT MODE → use stored updated items
    if (isEditMode && Array.isArray(form?.updated_line_items)) {
      return form.updated_line_items;
    }

    // CREATE MODE → load from selected invoice
    if (Array.isArray(paidInvoices) && form?.invoice_number) {
      return (
        paidInvoices.find((inv) => inv.invoice_number === form.invoice_number)
          ?.line_items ?? []
      );
    }

    return [];
  }, [
    isEditMode,
    form?.invoice_number,
    paidInvoices,
    form?.updated_line_items,
  ]);

  /* ======================================================
     SYNC EDIT LINE DATA (ON EDIT)
  ====================================================== */
  useEffect(() => {
    if (!form?.line_items) return;

    const parsed = parseArrayField(form.line_items);
    if (parsed.length) {
      setEditLineData(parsed);
    }
  }, [form.line_items, pathname]);

  /* ======================================================
     CLEAR EDIT LINE DATA WHEN SWITCHING INVOICE (CREATE)
  ====================================================== */
  useEffect(() => {
    if (!isEditMode) {
      setEditLineData([]);
    }
  }, [form.invoice_number]);

  /* ======================================================
     DELIVERY NOTES + SERIALIZATION
  ====================================================== */
  function getDeliveryNotesByInvoice(deliverynotes = [], invoiceNo) {
    const deliveryNoteRefs = [];
    const usedSerializations = [];

    deliverynotes.forEach((item) => {
      if (!item.locked) return;

      const lockedValue = String(item.locked).replace(/"/g, "");
      if (lockedValue !== invoiceNo) return;

      deliveryNoteRefs.push(item.deliverynote_number);

      try {
        const parsed = JSON.parse(item.serializationSerial || "[]");

        parsed.forEach((p) => {
          usedSerializations.push({
            inventory_id: p.inventory_id,
            used_serialization: {
              deliverynote_number: "",
              usedSerial: p?.used_serialization?.usedSerial || [],
            },
          });
        });
      } catch {
        // ignore invalid JSON
      }
    });

    return { deliveryNoteRefs, usedSerializations };
  }

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

    const { deliveryNoteRefs, usedSerializations } = getDeliveryNotesByInvoice(
      allDeliveryNote,
      form.invoice_number,
    );

    setForm((prev) => {
      const sameNotes =
        JSON.stringify(prev.delivery_note_ref_number) ===
        JSON.stringify(deliveryNoteRefs);

      const sameSerials =
        JSON.stringify(prev.serialization) ===
        JSON.stringify(usedSerializations);

      if (sameNotes && sameSerials) return prev;

      return {
        ...prev,
        delivery_note_ref_number: deliveryNoteRefs,
        serialization: usedSerializations,
      };
    });
  }, [allDeliveryNote, form.invoice_number]);

  /* ======================================================
     INVOICE INFO (SET ONCE PER CUSTOMER)
  ====================================================== */
  useEffect(() => {
    if (!selectedPaidInvoice.length) return;

    setForm((prev) => {
      if (prev.invoice_info === selectedPaidInvoice) return prev;
      return { ...prev, invoice_info: selectedPaidInvoice };
    });
  }, [selectedPaidInvoice]);

  const result = getPaymentByInvoiceNumber(allPayments, form.invoice_number);

  useEffect(() => {
    if (!result?.payment) return;

    setForm((prev) => {
      if (prev.payment_info?.payment_id === result.payment.payment_id) {
        return prev;
      }

      return {
        ...prev,
        payment_info: result.payment,
      };
    });
  }, [result?.payment?.payment_id]);

  /* ======================================================
     INVALID ITEM NUMBER GUARD
  ====================================================== */
  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 configure prefix and padding in Settings."
        />
      </div>
    );
  }

  /* ======================================================
     RENDER
  ====================================================== */

  const resolvedLineItems = useMemo(() => {
    // EDIT MODE → always trust updated_line_items
    if (isEditMode) {
      return Array.isArray(form?.updated_line_items)
        ? form.updated_line_items
        : [];
    }

    // CREATE MODE → from selected invoice
    if (form?.invoice_number && paidInvoices.length) {
      return (
        paidInvoices.find((inv) => inv.invoice_number === form.invoice_number)
          ?.line_items || []
      );
    }

    return [];
  }, [
    isEditMode,
    form?.updated_line_items,
    form?.invoice_number,
    paidInvoices,
  ]);

  const stableLineItems = useMemo(() => {
    // EDIT MODE → load once
    if (isEditMode) {
      return parseArrayField(form?.line_items);
    }

    // CREATE MODE → invoice items
    if (form?.invoice_number && paidInvoices.length) {
      return (
        paidInvoices.find((inv) => inv.invoice_number === form.invoice_number)
          ?.line_items || []
      );
    }

    return [];
  }, [isEditMode, form?.invoice_number, paidInvoices]);

 return (
  <div className="container !my-5 grid sm:gap-5 gap-3">

    {/* Primary Info */}

    <div className="grid gap-6">

      <div className="grid grid-cols-1 lg:grid-cols-2 gap-6 w-full">
        <SectionValidator
          formValidation="customer_name"
          field={form.customer_name}
          text="At least one customer is required."
        />

        <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="Sales Return Number"
          name="itemNumber"
          value={(form.customer_name && form.itemNumber) || "-"}
          disabled
        />

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

        <InputItem
          allowClear
          disabled={!form.customer_name}
          type="select"
          label="Select Invoice"
          name="invoice_number"
          value={form.invoice_number}
          onChange={(e) => handleChange(e, setForm)}
          options={paidInvoices.map((inv) => ({
            label: inv.invoice_number,
            value: inv.invoice_number,
          }))}
        />
      </div>

      <div className="grid grid-cols-1 lg:grid-cols-2 gap-6 w-full">
        <InputItem
          type="editor"
          label="Terms and Conditions"
          name="general_terms_conditions"
          value={form.general_terms_conditions || 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 no-width gap-3">
        <InputItem
          type="checkbox"
          label="Add eSignature"
          name="digital_signature"
          value={form.digital_signature}
          onChange={(e) => handleChange(e, setForm)}
        />

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

        <SendingOptions settings={settings} />
      </div>
    </div>

    {/* Returnable Items */}

    {form.customer_name && (
      <div className="pb-6">
        <SalesReturnItems
          lineItems={
            isEditMode
              ? lineItems
              : Array.isArray(selectedPaidInvoice?.[0]?.updated_line_items) &&
                selectedPaidInvoice[0].updated_line_items.length > 0
              ? selectedPaidInvoice[0].updated_line_items
              : lineItems
          }
          form={form}
          setForm={setForm}
          selectedPaidInvoice={selectedPaidInvoice || []}
        />
      </div>
    )}

  </div>
);

}