'use client';

import React, { useState, useCallback, useMemo } from 'react';
import {
  Dialog,
  DialogTrigger,
  DialogContent,
  DialogTitle,
  DialogDescription,
  DialogClose,
} from '@/components/ui/dialog';
import CommonImage from '@/components/common/CommonImage';
import { Text } from '@/components/ui/text';
import { VisuallyHidden } from '@radix-ui/react-visually-hidden';
import { useForm } from 'react-hook-form';
import { Form } from '@/components/ui/form';
import { z } from 'zod';
import { zodResolver } from '@hookform/resolvers/zod';
import {
  API_ENDPOINTS,
  VC_ASSOCIATE_TYPES,
  VC_COMMISSION_TYPE,
} from '@/constants';
import { useToast } from '@/hooks/use-toast';
import { UnknownRecord } from '@/types';
import { globalApiGet, globalApiPost } from '@/services/global/globalApiCalls';
import { Button } from '@/components/ui/button';
import CommissionCards from '../form-components/CommissionCards';
import StepOneInfo from '../form-components/StepOneInfo';
import { getMonthShortName } from '@/utils/formatDate';
import { AddCommissionContractProps } from '../../contracts/forms/constants';
import { VCM_M } from '@/constants/typo/submit-alerts';
import { useAppToast } from '@/hooks/useAppToast';

const EditCommissionEnquiry: React.FC<AddCommissionContractProps> = ({
  record,
  triggerIcon,
  bucket,
  handlePaginatedRecords,
}) => {
  const { toast } = useToast();
  const { showSuccess, showError } = useAppToast();

  const [isOpen, setIsOpen] = useState(false);
  const [nextStepValues, setNextStepValues] = useState<UnknownRecord[]>([]);
  const [eligibleCases, setEligibleCases] = useState<UnknownRecord[]>([]);
  const [filterEligibleCases, setFilterEligibleCases] = useState<
    UnknownRecord[]
  >([]);

  const EditCommissionEnquirySchema = bucket?.crud?.edit.schema.validator;

  const DEFAULT_COMMISSION_FORM_VALUES = {
    associate_id: String(record?.associate_id ?? ''),
    currency: String(record?.currency ?? ''),
    net_amount: String(record?.net_amount ?? ''),
    remarks: String(record?.remarks ?? ''),
    items: record?.items ?? [],
    visa_service_country_id: String(record?.visa_service_country_id ?? ''),
    institute_id: String(record?.institute_id ?? ''),
    client_from_country_id: String(record?.client_from_country_id ?? ''),
    intake_id: String(record?.intake_id ?? ''),
    applicable_on_id: String(record?.applicable_on_id ?? ''),
    contract_set_id: String(record?.contract_set_id ?? ''),
    commission_instance_id: String(record?.commission_instance ?? ''),
    invoice_branch_id: String(record?.invoice_branch_id ?? ''),
    invoice_bank_account_id: String(record?.invoice_bank_account_id ?? ''),
    ma_commission_type: String(record?.ma_commission_type ?? ''),
    ma_commission_percentage: String(record?.ma_commission_percentage ?? ''),
    ma_commission_amount: String(record?.ma_commission_amount ?? ''),
  };

  const form = useForm<z.infer<typeof EditCommissionEnquirySchema>>({
    resolver: zodResolver(EditCommissionEnquirySchema),
    defaultValues: DEFAULT_COMMISSION_FORM_VALUES,
  });

  const {
    control,
    formState: { isSubmitting },
    getValues,
  } = form;

  const enquiryType = useMemo(
    () => bucket?.additional_info?.contract_type,
    [bucket],
  );

  const enquiryTypeLabel = useMemo(
    () => (enquiryType ? VC_ASSOCIATE_TYPES[enquiryType as string] : ''),
    [enquiryType],
  );

  const handleDialogOpen = async () => {
    const details = await globalApiPost(
      API_ENDPOINTS.VC_ENQUIRY.DETAILS_BY_ID,
      { id: String(record?.id), association_type: enquiryType },
    );

    setEligibleCases(Array.isArray(details) ? details : []);
    setFilterEligibleCases(Array.isArray(details) ? details : []);
  };

  const handleOpenChange = async (open: boolean) => {
    setIsOpen(open);
    if (open) {
      await handleDialogOpen();

      const set: UnknownRecord = await globalApiGet(
        `${API_ENDPOINTS.VCM.CONTRACT_SET_DETAILS_BY_ID}/${record?.contract_set_id}`,
      );

      const applicableOnId = record?.applicable_on_id ?? 0;

      const applicableOn: UnknownRecord = await globalApiPost(
        `${API_ENDPOINTS.VCM.CONTRACT_APPLICABLE_ON_BY_ID}`,
        { id: String(applicableOnId), type: '2' },
      );

      let applicableOnIndex = 0;
      if (applicableOn && applicableOnId) {
        applicableOnIndex = applicableOn.findIndex(
          (item: { id: number | string }) =>
            String(item.id) === String(applicableOnId),
        );
      }

      const baseValues = [
        { title: 'Client Country', value: record?.client_country?.name },
        { title: 'Visa Service Country', value: record?.visa_country?.name },
        {
          title: 'Institute',
          value: `${record?.institute?.institueName} (${record?.institute?.UID})`,
        },
        {
          title: 'Intake',
          value: `${getMonthShortName(record?.intake?.intakemonth, false)}-${record?.intake?.intakeyear}`,
        },
        {
          title: 'Applicable On',
          value: `Applicable On Set - ${applicableOnIndex + 1}`,
        },
        { title: 'Contract Set', value: `${set?.set_name}` },
        {
          title: 'Commission Instance',
          value: `Instance ${record?.instance?.instance}`,
        },
        { title: 'Invoice Branch', value: record?.branch?.center_name },
        {
          title: 'Invoice Bank Account',
          value: `${record?.bank?.acc_number} - ${record?.bank?.bank_name}, ${record?.bank?.company_bank_address}`,
        },
      ];

      if (Number(enquiryType) === 2) {
        baseValues.splice(2, 0, {
          title: 'Associate',
          value:
            `${record?.associate?.masteragentName} (${record?.associate?.uid})` ||
            'N/A',
        });
      }

      const commissionType = Number(record?.ma_commission_type);

      const commissionTypeObj = VC_COMMISSION_TYPE.find(
        (item) => item.id === commissionType,
      );

      let maCommissionField: any[] = [];

      if (commissionType === 1) {
        maCommissionField = [
          {
            title: '(MA) Commission Amount',
            value: record?.ma_commission_amount ?? 'N/A',
          },
        ];
      } else if (commissionType === 2) {
        maCommissionField = [
          {
            title: '(MA) Commission Percentage',
            value: record?.ma_commission_percentage
              ? `${record.ma_commission_percentage}%`
              : 'N/A',
          },
        ];
      }

      const finalValues =
        Number(enquiryType) === 2
          ? [
              ...baseValues,
              {
                title: '(MA) Commission Type',
                value: commissionTypeObj?.label || 'N/A',
              },
              ...maCommissionField,
            ]
          : baseValues;

      setNextStepValues(finalValues);

      form.reset(DEFAULT_COMMISSION_FORM_VALUES);
    } else {
      form.reset();
    }
  };

  const getMasterAgentCommissionValues = useCallback(
    (items: UnknownRecord[]) => {
      const firstItem = items[0] ?? {};

      return {
        ma_commission_type: String(
          firstItem.ma_commission_type ?? getValues('ma_commission_type') ?? '',
        ),
        ma_commission_percentage: String(
          firstItem.ma_commission_percentage ??
            getValues('ma_commission_percentage') ??
            '',
        ),
        ma_commission_amount: String(
          firstItem.ma_commission_amount ??
            getValues('ma_commission_amount') ??
            '',
        ),
      };
    },
    [getValues],
  );

  const onSubmit = useCallback(
    async (data: z.infer<typeof EditCommissionEnquirySchema>) => {
      try {
        const items = getValues(`items`);
        let netAmount = 0;

        items.forEach((item: Record<string, any>) => {
          netAmount += parseFloat(item.commission_amount) || 0;
        });
        netAmount = parseFloat(netAmount.toFixed(2));

        data.id = String(record?.id ?? '');
        data.currency = items[0]?.tuition_fees_currency;
        data.net_amount = String(netAmount);
        data.association_type = Number(enquiryType);
        const post = {
          ...data,
          ...(enquiryType === '2' ? getMasterAgentCommissionValues(items) : {}),
          items,
        };

        const res = await globalApiPost(
          API_ENDPOINTS.VC_ENQUIRY.EDIT,
          post,
          false,
        );

        if ((res as any).success) {
          handlePaginatedRecords(1, {});
          form.reset();
          setIsOpen(false);
          showSuccess(VCM_M.ENQUIRY.SUBMIT);
        } else {
          showError((res as any).errors, VCM_M.ENQUIRY.SUBMIT_ERROR);
        }
      } catch (error) {
        console.error('Submission error:', error);
        showError(error, VCM_M.ENQUIRY.SUBMIT_ERROR);
      }
    },
    [handlePaginatedRecords, form, toast, getMasterAgentCommissionValues],
  );

  return (
    <Dialog open={isOpen} onOpenChange={handleOpenChange}>
      <DialogTrigger asChild>
        {triggerIcon || (
          <Button className="button-action">
            <CommonImage
              src={
                String(record?.received_recorded) !== '1'
                  ? `/main/edit-icon.png`
                  : `/main/pass-show.webp`
              }
              width={15}
              height={15}
              alt={'Edit Record'}
              classname="info-icon"
            />
          </Button>
        )}
      </DialogTrigger>

      <DialogContent
        aria-describedby={undefined}
        className="modal-common-widget w-full max-w-7xl p-0 m-0 table-modal-settings state-widget"
        onInteractOutside={(e) => e.preventDefault()}
        onEscapeKeyDown={(e) => e.preventDefault()}
        onClick={(e) => e.stopPropagation()}
      >
        <DialogTitle className="p-5 modal-header">
          {String(record?.received_recorded) !== '1' ? 'Edit' : 'View'}{' '}
          Commission Enquiry - {enquiryTypeLabel}
        </DialogTitle>
        <DialogDescription>{''}</DialogDescription>
        <DialogClose asChild>
          <button
            onClick={() => setIsOpen(false)}
            className="dialog-close absolute right-4 top-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 focus:outline-none z-[9]"
            aria-label="Close"
          >
            <CommonImage
              src="/main/cross-arrow.webp"
              width={15}
              height={15}
              alt="Close"
              classname="dialog-close-img"
            />
          </button>
        </DialogClose>
        <VisuallyHidden>
          <DialogTitle>Hidden Title</DialogTitle>
        </VisuallyHidden>

        <Form {...form}>
          <form
            onSubmit={form.handleSubmit(onSubmit, (errors) => {
              console.log('Validation failed:', errors);
            })}
          >
            <Text className="main-scroll-widget">
              {/* <h6 className="font-semibold ml-6">Raise Commission Enquiry</h6> */}
              <Text className="flex flex-wrap p-2 form-mid mt-0">
                <StepOneInfo titles={nextStepValues} />
                <CommissionCards
                  instanceSelected={{}}
                  control={control}
                  records={eligibleCases}
                  enquiryType={enquiryType as string}
                  filterEligibleCases={filterEligibleCases}
                />
              </Text>
            </Text>
            {(String(record?.accept_status) !== '' ||
              record?.accept_status !== null) && (
              <div
                className={`modal-footer flex justify-end items-end footer-modal text-right gap-2 m-0 pr-4 p-2`}
              >
                <Button
                  type="submit"
                  disabled={isSubmitting}
                  className="m-0 filter-search-btn tracking-wider w-40 primary-button"
                >
                  {isSubmitting && (
                    <span className="h-4 w-4 animate-spin rounded-full border-2 border-white border-t-transparent" />
                  )}
                  {isSubmitting ? 'Submitting...' : 'Submit'}
                </Button>
              </div>
            )}
          </form>
        </Form>
      </DialogContent>
    </Dialog>
  );
};

export default EditCommissionEnquiry;