/* eslint-disable react-hooks/exhaustive-deps */

"use client";

import type { ForwardedRef } from "react";
import { forwardRef, useEffect, useImperativeHandle, useState } from "react";

import { Button } from "@/components/ui/button/button";
import Card from "@/components/ui/card/card";
import LIcon from "@/components/ui/lucid-icon/lucid-icon";
import type { EventPayload } from "@/components/widget/core-list/core-list";
import CoreList from "@/components/widget/core-list/core-list";
import { DUMMY_TRANSFER_SEARCH_REQUEST } from "@/data/dummy/transfer/search-list";
import { useTransferDetailMutation } from "@/services/eva-display/transfer/transfer-detail.service";
import { useTransferListService } from "@/services/eva-display/transfer/transfer-search/transfer-search.services";
import type {
  ITransferSearchRequest,
  ITransferSearchResponseItem,
} from "@/services/eva-display/transfer/transfer-search/transfer-search.types";
import type { ITransferList } from "@/services/eva-display/transfer/transfer-search/transfer-search-service.serializer";

import { transferListItemFromApi } from "../libs/transfer-list-serializers";
import TransferListItem from "./transfer-list-item";

interface TransferListProps {
  renderHeader?: (params: {
    sortValue: string;
    resetDirectionStates: VoidFunction;
  }) => JSX.Element;
  defaultRequestData: Partial<ITransferSearchRequest>;
  passengerInformation: {
    adult: number;
    child: number;
  };
  noFilter?: boolean;
  onItemSelect: (params: {
    items: string[];
    searchId: string;
    searchItemKey: string;
    info?: {
      images?: string[];
    };
  }) => void;
}

export interface TransferListHandles {
  sort: (value: "ASC" | "DESC" | "RECOMMENDED") => void;
  reset: VoidFunction;
}

const TransferListPure = (
  props: TransferListProps,
  ref: ForwardedRef<TransferListHandles>,
) => {
  const [state, setState] = useState({
    data: [] as ITransferSearchResponseItem[],
    loading: true,
    filterMeta: null as any | null,
    searchMetaData: {
      searchId: null,
      requestKey: null,
    },
    lastResponse: null as ITransferList | null,
    groupId: 0,
    selectedItem: null as ITransferSearchResponseItem | null,
    selectedDetailKey: null as string | null,
    initialPriceValue: {
      min: null as number | null,
      max: null as number | null,
    },
    info: {
      images: [] as string[],
    },
  });
  const { getTransferListService } = useTransferListService();
  const [gettingItemKey, setGettingItemKey] = useState<string | null>(null);
  const transferDetailMutation = useTransferDetailMutation();
  const [requestDatas, setRequestData] = useState<
    Partial<ITransferSearchRequest>
  >({
    ...DUMMY_TRANSFER_SEARCH_REQUEST,
    ...props.defaultRequestData,
  });

  async function getData(params: any) {
    const requestData = { ...params };
    setState((prevState) => ({
      ...prevState,
      loading: true,
    }));
    const requestDataPassengers: any[] = [];
    const adultCount = props.passengerInformation.adult;
    const childCount = props.passengerInformation.child;
    Array(adultCount)
      .fill(adultCount)
      .forEach((_) => {
        requestDataPassengers.push({
          PassengerType: "Adult",
          Age: 20,
        });
      });
    Array(childCount)
      .fill(childCount)
      .forEach((_) => {
        requestDataPassengers.push({
          PassengerType: "Child",
          Age: 10,
        });
      });
    requestData.Passengers = requestDataPassengers;

    requestData.Filter = {
      ...requestData.Filter,
      GroupId: state.groupId,
    };

    if (state.groupId === 1) {
      requestData.SearchId = state.searchMetaData.searchId;
    }

    const response = await getTransferListService(requestData as any);

    if (response) {
      setState((prevState) => ({
        ...prevState,
        data: response.items ?? [],
        filterMeta: response.filter,
        totalCount: response.totalCount,
        loading: false,
        lastResponse: response,
        searchMetaData: {
          searchId: response.searchId ?? null,
          requestKey: null,
        },
        initialPriceValue: !prevState.initialPriceValue.min
          ? {
              min: response.filter?.priceMin ?? null,
              max: response.filter?.priceMax ?? null,
            }
          : prevState.initialPriceValue,
      }));
    }
  }

  const handleChangeFilter = (eventPayload: EventPayload) => {
    if (eventPayload.type === "sort") {
      if (
        eventPayload.payload.name === "price" &&
        eventPayload.payload.value === "PriceAscending"
      ) {
        setRequestData((prevState: any) => ({
          ...prevState,
          SearchId: state.searchMetaData.searchId,
          Filter: {
            ...prevState.Filter,
            IsPriceSortedByDesc: false,
          },
        }));
      } else if (
        eventPayload.payload.name === "price" &&
        eventPayload.payload.value === "PriceDescending"
      ) {
        setRequestData((prevState: any) => ({
          ...prevState,
          SearchId: state.searchMetaData.searchId,
          Filter: {
            ...prevState.Filter,
            IsPriceSortedByDesc: true,
          },
        }));
      } else {
        setRequestData((prevState: any) => {
          return {
            ...prevState,
            SearchId: state.searchMetaData.searchId,
            Filter: {
              ...prevState.Filter,
              IsPriceSortedByDesc: null,
            },
          };
        });
      }
    }
  };

  const handleClearFilter = () => {
    setRequestData((prevState: any) => ({
      ...prevState,
      Filter: {},
    }));
  };

  const sortValue = () => {
    switch (state?.filterMeta?.isPriceSortedByDesc) {
      case true:
        return "PriceDescending";
      case false:
        return "PriceAscending";
      default:
        return "Average";
    }
  };

  const isMultiple = requestDatas.SearchLegs?.length === 2;

  function filterItem(x: ITransferSearchResponseItem): boolean {
    if (!isMultiple) return true;

    if (!state.selectedItem) {
      return x.groupId === 0;
    }

    const conditions = [
      x.groupId === 1,
      x.isEconomic === state.selectedItem.isEconomic,
      x.quota === state.selectedItem.quota,
      x.name === state.selectedItem.name,
    ];

    return !conditions.includes(false);
  }

  useEffect(() => {
    getData(requestDatas);
  }, [requestDatas, state.groupId]);

  useImperativeHandle(ref, () => ({
    sort(value) {
      setRequestData((prevState: any) => ({
        ...prevState,
        SearchId: state.searchMetaData.searchId,
        Filter: {
          ...prevState.Filter,
          IsPriceSortedByDesc:
            value === "RECOMMENDED" ? null : value === "DESC",
        },
      }));
    },
    reset() {
      setState((prev) => ({
        ...prev,
        selectedItem: null,
        selectedDetailKey: null,
        groupId: 0,
      }));
    },
  }));

  return (
    <div>
      <CoreList
        data={state.data.filter(filterItem)}
        filterOptions={[]}
        renderItem={(item) => (
          <TransferListItem
            isLoading={gettingItemKey === item.key}
            item={transferListItemFromApi(item)}
            onClick={async () => {
              setGettingItemKey(item.key);
              const resp = await transferDetailMutation.mutateAsync({
                TransferDetailRequest: {
                  ProductKey: item.key,
                  searchId: state.lastResponse?.searchId,
                },
              });
              setGettingItemKey(null);
              const detailKey = resp?.result?.transferSegmentGroupItem[0]?.key;
              if (!detailKey) {
                return;
              }
              const summaryData = {
                searchId: state.lastResponse?.searchId,
                transferSegmentGroupItemKey: detailKey,
                searchItemKey: item.key,
              };

              if (isMultiple) {
                if (!state.selectedItem) {
                  // setSearchAndDetailData({
                  //   detailKey: [detailKey ?? ""],
                  //   passengersKeys: state.lastResponse?.passengerList ?? [],
                  //   searchId: summaryData.searchId,
                  //   searchItemKey: summaryData.searchItemKey,
                  // });
                  props.onItemSelect({
                    items: [detailKey ?? ""],
                    searchId: summaryData.searchId ?? "",
                    searchItemKey: summaryData.searchItemKey ?? "",
                    info: {
                      images: [item.pictureUrl],
                    },
                  });
                  setState((prev) => ({
                    ...prev,
                    selectedItem: item,
                    selectedDetailKey: detailKey,
                    groupId: 1,
                    info: {
                      images: [item.pictureUrl],
                    },
                  }));
                } else {
                  // setSearchAndDetailData({
                  //   detailKey: [
                  //     ...(data.payload.detailKey ?? []),
                  //     summaryData.transferSegmentGroupItemKey ?? "",
                  //   ],
                  //   passengersKeys: state.lastResponse?.passengerList ?? [],
                  //   searchId: summaryData.searchId,
                  //   searchItemKey: summaryData.searchItemKey,
                  // });
                  props.onItemSelect({
                    items: [
                      state.selectedDetailKey ?? "",
                      summaryData.transferSegmentGroupItemKey ?? "",
                    ],
                    searchId: summaryData.searchId,
                    searchItemKey: summaryData.searchItemKey,
                    info: {
                      images: [...state.info.images, item.pictureUrl],
                    },
                  });
                }
              } else {
                props.onItemSelect({
                  items: [summaryData.transferSegmentGroupItemKey ?? ""],
                  searchId: summaryData.searchId,
                  searchItemKey: summaryData.searchItemKey,
                  info: {
                    images: [item.pictureUrl],
                  },
                });
              }

              // setSearchAndDetailData({
              //   detailKey: [summaryData.transferSegmentGroupItemKey ?? ""],
              //   passengersKeys: state.lastResponse?.passengerList ?? [],
              //   searchId: summaryData.searchId,
              //   searchItemKey: summaryData.searchItemKey,
              // });
            }}
          />
        )}
        hasMore={state.lastResponse?.totalCount !== state.data?.length}
        isLoading={state.loading}
        isEmpty={!state.loading && state.data.length === 0}
        onChange={handleChangeFilter}
        onClearFilter={handleClearFilter}
        sortValue={sortValue()}
        totalCount={state.lastResponse?.totalCount}
        renderHeader={() => {
          if (props.renderHeader) {
            return props.renderHeader({
              sortValue: sortValue(),
              resetDirectionStates: () => {
                setState((prev) => ({
                  ...prev,
                  selectedItem: null,
                  groupId: 0,
                }));
              },
            });
          }
          return (
            <div>
              {isMultiple && state.selectedItem && (
                <Card className="mb-2 space-y-2">
                  <div className="flex justify-between">
                    <div className="flex items-center gap-2 text-sm font-semibold">
                      <LIcon name="Check" className="size-4" />
                      <span>Gidiş transferi seçildi.</span>
                    </div>
                    <Button
                      variant="primary-text"
                      onClick={() => {
                        setState((prev) => ({
                          ...prev,
                          selectedItem: null,
                          groupId: 0,
                        }));
                      }}
                    >
                      Değiştir
                    </Button>
                  </div>
                  <TransferListItem
                    isCompact
                    noWrappedCard
                    item={transferListItemFromApi(state.selectedItem)}
                  />
                </Card>
              )}
              <div className="flex items-center gap-3">
                {isMultiple && (
                  <div>{state.groupId === 0 ? "Gidiş" : "Dönüş"}</div>
                )}
                <div className="mt-1 text-sm text-gray-500">
                  {state.data.filter(filterItem).length} sonuç bulundu
                </div>
              </div>
            </div>
          );
        }}
        hideFilter={props.noFilter}
        hiderSort
      />
    </div>
  );
};

export default forwardRef(TransferListPure);