'use client';

import React, { useState, useCallback, useMemo, useEffect } 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 {
  globalApiFormDataPost,
  globalApiGet,
  globalApiPost,
} from '@/services/global/globalApiCalls';
import { Button } from '@/components/ui/button';
import StepOneInfo from '../form-components/StepOneInfo';
import { getMonthShortName } from '@/utils/formatDate';
import CommissionResponseCards from '../form-components/CommissionResponseCards';
import {
  AddCommissionContractProps,
  objectToFormData,
} from '../../contracts/forms/constants';
import { useFileManager } from '@/hooks/useFileManager';
import { VCM_M } from '@/constants/typo/submit-alerts';

const ReceivedRecorded: React.FC<AddCommissionContractProps> = ({
  record,
  triggerIcon,
  bucket,
  handlePaginatedRecords,
}) => {
  const { toast } = useToast();
  const [dialogKey, setDialogKey] = useState(0);
  const [isOpen, setIsOpen] = useState(false);
  const [nextStepValues, setNextStepValues] = useState<UnknownRecord[]>([]);
  const [eligibleCases, setEligibleCases] = useState<UnknownRecord[]>([]);
  const [reasons, setReasons] = useState<UnknownRecord[]>([]);
  const [isFormInitialized, setIsFormInitialized] = useState(false);
  const [existingCommissionAmount, setExistingCommissionAmount] = useState<
    any[]
  >([]);
  const [totalCommission, setTotalCommission] = useState<string | number>('');
  const [isLoading, setIsLoading] = useState(false);
  const [differenceReasons, setDifferenceReasons] = useState<UnknownRecord[]>(
    [],
  );

  const EditCommissionEnquirySchema =
    bucket?.crud?.edit.schema.validatorResponse;
  const fileManager = useFileManager();

  const responses = useMemo(() => {
    if (!isFormInitialized || eligibleCases.length === 0) return [];
    return eligibleCases.map((rec) => String(rec.response || ''));
  }, [eligibleCases, isFormInitialized]);

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

  const getDefaultValues = useCallback(() => {
    return {
      association_type: enquiryType,
      associate_id: String(record?.associate_id ?? ''),
      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) || '1',
      ma_commission_percentage: String(record?.ma_commission_percentage) || '0',
      ma_commission_amount: String(record?.ma_commission_amount) || '0',
      items: [],
      received: {
        association_type: enquiryType,
        commission_enquiry_id: String(record?.id || ''),
        total_amount: record?.net_amount,
        currency: String(record?.currency || ''),
        conversion_rate: '0',
        total_amount_inr: '',
        tax_details: null,
        total_tax_amount: '',
        other_deductions: '',
        deduction_reason: '',
        net_amount_inr: '',
        payment_date: null,
        payment_mode_id: '',
        bank_account_id: '',
        transaction_id: '',
        attachment_file: null,
        remarks: '',
        taxes: [],
      },
    };
  }, [record]);

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

  const {
    control,
    formState: { isSubmitting, errors },
    getValues,
    setError,
    clearErrors,
    setValue,
    reset,
  } = form;

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

  useEffect(() => {
    if (eligibleCases.length > 0 && !isFormInitialized && !isLoading) {
      const initialItems = eligibleCases.map((rec, index) => {
        const visaCaseId = String(rec.visa_case_id ?? rec.id);

        const sameCaseRecords = eligibleCases.filter(
          (r) => String(r.visa_case_id ?? r.id) === visaCaseId,
        );

        const initialItem = {
          response: rec.response || '',
          commission_date: rec.commission_date || '',
          difference: rec.difference || '',
          difference_reason: rec.difference_reason || '',
          remarks: rec.remarks || '',
          response_reason: rec.response_reason || '',
          response_reason_id: rec.response_reason_id || '',
          difference_reason_id: rec.difference_reason_id || '',

          // Commission data
          tuition_fees: rec.tuition_fees || '0',
          commission_type: rec.commission_type || '1',
          commission_percentage: rec.commission_percentage || '0',
          commission_amount: rec.commission_amount || '0',
          tuition_fees_currency: rec.tuition_fees_currency || 'USD',
          commission_currency: rec.commission_currency || 'USD',
          ma_commission_type: rec.ma_commission_type || '1',
          ma_commission_percentage: rec.ma_commission_percentage || '0',
          ma_commission_amount: rec.ma_commission_amount || '0',

          // Student data
          case_uid: rec.case_uid,
          course_end_date: rec.course_end_date,
          course_start_date: rec.course_start_date,
          fname: rec.fname,
          lname: rec.lname,
          student_uid: rec.student_uid,
          visa_result_on: rec.visa_result_on,
          visa_status: rec.visa_status,
          id: rec.main_id ?? rec.id,
          visa_case_id: visaCaseId,
          modified_by_user: String(rec.modified_by_user ?? ''),
          is_revised: rec.response === '' ? '1' : '0',

          // Grouping metadata
          group_index: sameCaseRecords.findIndex(
            (r) => r.main_id === rec.main_id || r.id === rec.id,
          ),
          group_total: sameCaseRecords.length,
          group_id: visaCaseId,
        };

        return initialItem;
      });

      let commissionAmount = 0;

      // Reset existing commission amounts
      setExistingCommissionAmount([]);

      initialItems.forEach((item: any, index) => {
        const amount = parseFloat(item.commission_amount) || 0;
        commissionAmount += amount;

        setExistingCommissionAmount((prev) => ({
          ...prev,
          [index]: item,
        }));

        Object.keys(item).forEach((key) => {
          setValue(`items.${index}.${key}`, item[key]);
        });
      });

      commissionAmount = parseFloat(commissionAmount.toFixed(2));
      // setValue(`received.total_amount`, String(commissionAmount));
      setTotalCommission(commissionAmount);

      setIsFormInitialized(true);
    }
  }, [eligibleCases, isFormInitialized, setValue, isLoading]);

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

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

      const diffReasons = (await globalApiGet(
        API_ENDPOINTS.VC_ENQUIRY.DIFFERENCE_REASONS,
      )) as { list?: UnknownRecord[] };

      setDifferenceReasons(
        Array.isArray(diffReasons.list) ? diffReasons.list : [],
      );
    } catch (error) {
      console.error('Error fetching details:', error);
      setEligibleCases([]);
    }
  };

  const handleOpenChange = async (open: boolean) => {
    setIsOpen(open);
    if (open) {
      setIsLoading(true);

      // Reset ALL states completely
      setDialogKey((prev) => prev + 1);
      setEligibleCases([]);
      setReasons([]);
      setNextStepValues([]);
      setExistingCommissionAmount([]);
      setTotalCommission('');
      setIsFormInitialized(false);
      reset(getDefaultValues());

      try {
        await handleDialogOpen();

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

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

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

        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);

        const responseReasons = (await globalApiGet(
          API_ENDPOINTS.VC_ENQUIRY.RESPONSE_REASONS,
        )) as { list?: UnknownRecord[] };

        setReasons(
          Array.isArray(responseReasons.list) ? responseReasons.list : [],
        );
      } catch (error) {
        console.error('Error loading dialog data:', error);
        toast({
          variant: 'destructive',
          title: 'Failed to load dialog data',
          duration: 2000,
        });
      } finally {
        setIsLoading(false);
      }
    } else {
      // Clean up when closing
      setIsFormInitialized(false);
      setEligibleCases([]);
      setNextStepValues([]);
      setReasons([]);
      setExistingCommissionAmount([]);
      setTotalCommission('');
    }
  };

  const onSubmit = useCallback(
    async (data: z.infer<typeof EditCommissionEnquirySchema>) => {
      try {
        const latestFormValues = getValues();
        const items = data.items || [];

        if (items.length === 0) {
          toast({
            variant: 'destructive',
            title: 'No commission items to submit.',
            duration: 2000,
          });
          return;
        }

        if (
          latestFormValues.received.conversion_rate === '' ||
          latestFormValues.received.conversion_rate <= 0
        ) {
          setError('received.conversion_rate', {
            type: 'manual',
            message: 'Conversion Rate is required.',
          });
          return;
        }

        if (parseFloat(latestFormValues.received.net_amount_inr || '0') < 0) {
          setError('received.net_amount_inr', {
            type: 'manual',
            message: 'Total Amount in INR cannot be negative.',
          });
          return;
        }

        if (
          latestFormValues.received.payment_date === '' ||
          latestFormValues.received.payment_date === null
        ) {
          setError('received.payment_date', {
            type: 'manual',
            message: 'Payment Date is required.',
          });
          return;
        }

        const paymentDate = latestFormValues.received.payment_date;

        if (!paymentDate) {
          setError('received.payment_date', {
            type: 'manual',
            message: 'Payment Date is required.',
          });
          return;
        }

        const dateRegex = /^(0[1-9]|[12][0-9]|3[01])\/(0[1-9]|1[0-2])\/\d{4}$/;

        if (!dateRegex.test(paymentDate)) {
          setError('received.payment_date', {
            type: 'manual',
            message: 'Payment Date must be in DD/MM/YYYY format.',
          });
          return;
        }

        const [day, month, year] = paymentDate.split('/').map(Number);

        const enteredDate = new Date(year, month - 1, day);

        if (
          enteredDate.getDate() !== day ||
          enteredDate.getMonth() !== month - 1 ||
          enteredDate.getFullYear() !== year
        ) {
          setError('received.payment_date', {
            type: 'manual',
            message: 'Invalid Payment Date.',
          });
          return;
        }

        enteredDate.setHours(0, 0, 0, 0);

        const today = new Date();
        today.setHours(0, 0, 0, 0);

        if (enteredDate > today) {
          setError('received.payment_date', {
            type: 'manual',
            message: 'Payment Date cannot be a future date.',
          });
          return;
        }

        if (
          latestFormValues.received.payment_mode_id === '' ||
          latestFormValues.received.payment_mode_id === null
        ) {
          setError('received.payment_mode_id', {
            type: 'manual',
            message: 'Payment Mode is required.',
          });
          return;
        }

        if (latestFormValues.received.payment_mode_id !== '1') {
          if (
            latestFormValues.received.bank_account_id === '' ||
            latestFormValues.received.bank_account_id === null
          ) {
            setError('received.bank_account_id', {
              type: 'manual',
              message: 'Bank Account is required.',
            });
            return;
          }
          if (
            latestFormValues.received.transaction_id === '' ||
            latestFormValues.received.transaction_id === null
          ) {
            setError('received.transaction_id', {
              type: 'manual',
              message: 'Transaction ID is required.',
            });
            return;
          }
        }

        if (latestFormValues.received.payment_mode_id == '1') {
          latestFormValues.received.bank_account_id = 0;
          latestFormValues.received.transaction_id = '';
        }

        let netAmount = 0;
        items.forEach((item: any) => {
          const amount = parseFloat(item.commission_amount) || 0;
          netAmount += amount;
        });
        netAmount = parseFloat(netAmount.toFixed(2));

        let submissionData = {
          ...data,
          id: String(record?.id ?? ''),
        };

        const received = latestFormValues.received;

        let totalTaxAmount = 0;
        received?.taxes.forEach((tax: Record<string, any>) => {
          totalTaxAmount += parseFloat(tax.tax_amount) || 0;
        });
        received.total_tax_amount = parseFloat(totalTaxAmount.toFixed(2));

        submissionData = {
          ...received,
          items: items && items.length > 0 ? JSON.stringify(items) : null,
          tax_details:
            received?.taxes && received?.taxes.length > 0
              ? JSON.stringify(received?.taxes)
              : null,
        };
        delete submissionData.taxes;
        const finalPostData = objectToFormData(submissionData);
        const attachmentFiles =
          fileManager.filesByIndex['attachment_files' as any] || [];

        attachmentFiles.forEach((file: File) => {
          finalPostData.append('attachment_files', file);
        });

        await globalApiFormDataPost(
          API_ENDPOINTS.VC_ENQUIRY.ADD_RECEIVED,
          finalPostData,
        );

        handlePaginatedRecords(1, {});
        setIsOpen(false);

        toast({
          variant: 'success',
          title: VCM_M.ENQUIRY.R_R_SUBMIT,
          duration: 2000,
        });
      } catch (error) {
        console.error('Submission error:', error);
        toast({
          variant: 'destructive',
          title: VCM_M.ENQUIRY.R_R_SUBMIT_ERROR,
          duration: 2000,
        });
      }
    },
    [
      getValues,
      handlePaginatedRecords,
      toast,
      record?.id,
      responses,
      fileManager.filesByIndex,
    ],
  );

  return (
    <Dialog open={isOpen} onOpenChange={handleOpenChange}>
      <DialogTrigger asChild>
        {triggerIcon || (
          <Button className="button-action">
            <CommonImage
              src={'/main/check-mark.webp'}
              width={15}
              height={15}
              alt={'Received Record'}
              classname="info-icon"
            />
          </Button>
        )}
      </DialogTrigger>

      <DialogContent
        key={dialogKey}
        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">
          {`Commission Received Record - ${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>

        {isLoading ? (
          <div className="flex justify-center items-center p-8">
            <Text>Loading commission data...</Text>
          </div>
        ) : (
          <Form {...form}>
            <form
              onSubmit={form.handleSubmit(onSubmit, (errors) => {
                console.log('Validation failed:', errors);
              })}
            >
              <Text className="main-scroll-widget">
                <Text className="flex flex-wrap p-2 form-mid mt-0">
                  <StepOneInfo titles={nextStepValues} />
                  {isFormInitialized && eligibleCases.length > 0 && (
                    <CommissionResponseCards
                      instanceSelected={{}}
                      control={control}
                      records={eligibleCases}
                      reasons={reasons}
                      setValue={setValue}
                      existingCommissionAmount={existingCommissionAmount}
                      totalCommission={totalCommission}
                      responses={responses}
                      setError={setError}
                      clearErrors={clearErrors}
                      differenceReasons={differenceReasons}
                      isReceived={true}
                      enquiryType={enquiryType as string}
                      fileManager={fileManager}
                    />
                  )}
                </Text>
              </Text>
              {(!responses.includes('3') || !responses.includes('')) && (
                <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 ReceivedRecorded;