import isEqual from 'lodash/isEqual';
import { useFirstMountState } from 'react-use/lib/useFirstMountState';

import { Dispatch, SetStateAction } from 'react';
import { SelectedView, ApolloColumnType, Ordering, SelectedViewsProps } from '../interfaces';
import { filterSearchToComponent } from '../utils/filterSearchToComponent';
import { localFilterToComponent } from '../utils/localFilterToComponent';
import useEventListener from '../../_util/hooks/useEventListener';

interface UsePopStateProps<T> {
  searchParams: Record<string, any>;
  setActiveKey: Dispatch<SetStateAction<string>>;
  setQueryValue: Dispatch<SetStateAction<string>>;
  setFilterValues: Dispatch<SetStateAction<Record<string, any>>>;
  setSortValue: Dispatch<SetStateAction<string>>;
  setBefore: Dispatch<SetStateAction<string>>;
  setAfter: Dispatch<SetStateAction<string>>;
  columns: ApolloColumnType<T>[];
  selectedViews?: SelectedViewsProps;
  localValue?: SelectedView[];
  serverSelectedViews: SelectedView[];
  defaultSortValue?: Ordering;
  onCleanSelected: () => void;
  /** 是否开启 */
  on: boolean | undefined;
  onMount: () => void;
}

const usePopState = <T>({
  on,
  onCleanSelected,
  selectedViews,
  searchParams,
  columns,
  localValue,
  serverSelectedViews,
  defaultSortValue,
  setQueryValue,
  setFilterValues,
  setSortValue,
  setActiveKey,
  setBefore,
  setAfter,
  onMount,
}: UsePopStateProps<T>) => {
  const isFirstMount = useFirstMountState();

  const changePopState = () => {
    if (isFirstMount || !on) return;

    onCleanSelected();

    const newFilterValues = filterSearchToComponent(searchParams, columns);

    let _activeKey = 'all';

    const fn = () => {
      setFilterValues(newFilterValues);
      setQueryValue((searchParams.query as string) || '');

      if (_activeKey === 'all') {
        if (searchParams.order) {
          setSortValue(searchParams.order as string);
        } else if (defaultSortValue) {
          setSortValue(`${defaultSortValue.field} ${defaultSortValue.direction}`);
        }
      } else {
        setSortValue((searchParams.order as string) || '');
      }
    };

    if (selectedViews?.store) {
      if (searchParams.saved_search_id) {
        const current = serverSelectedViews.find(item => item.id === searchParams.saved_search_id);
        if (current) {
          setQueryValue(current.query || '');
          setFilterValues(current.filters || {});
          setSortValue(
            current.orderBy ? `${current.orderBy.field} ${current.orderBy.direction}` : '',
          );
        }
        _activeKey = searchParams.saved_search_id;
      } else {
        const current = selectedViews?.config?.find(item => item.id === searchParams.selectedView);
        if (current) {
          _activeKey = current.id;
        } else {
          _activeKey = 'all';
        }
        fn();
      }
    } else {
      // 如果为 savedSearch，判断条件是不是相等
      // eslint-disable-next-line no-lonely-if
      if (searchParams.selectedView === 'savedSearch') {
        const current = localValue?.find(
          item =>
            (searchParams.query || '') === (item.query || '') &&
            (searchParams.order || '') ===
              (item.orderBy ? `${item.orderBy.field} ${item.orderBy.direction}` : '') &&
            isEqual(newFilterValues, localFilterToComponent(item.filters || {}, columns)),
        );
        if (current) {
          _activeKey = current.id;
        } else {
          _activeKey = 'all';
        }
        // 否则判断是不是配置的
      } else {
        const current = selectedViews?.config?.find(item => item.id === searchParams.selectedView);
        if (current) {
          _activeKey = current.id;
        } else {
          _activeKey = 'all';
        }
      }
      fn();
    }

    setActiveKey(_activeKey);

    if (searchParams.before) {
      setBefore(searchParams.before);
    } else {
      setBefore('');
    }

    if (searchParams.after) {
      setAfter(searchParams.after);
    } else {
      setAfter('');
    }

    onMount();
  };

  useEventListener('popstate', changePopState);
};

export default usePopState;