/**
 * Copyright 2024 Phenix Real Time Solutions, Inc. Confidential and Proprietary. All Rights Reserved.
 */
import {useState, useEffect, useRef, Dispatch, SetStateAction, RefObject} from 'react';
import {DirectionType, ITableSort} from 'interfaces/tableProps';
import AuthService from 'services/Authentication.service';

const getWidth = () => window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;

export const useCurrentWidth = (): number => {
  const [width, setWidth] = useState(getWidth());

  useEffect(() => {
    const resizeListener = () => setWidth(getWidth());

    window.addEventListener('resize', resizeListener);

    return () => window.removeEventListener('resize', resizeListener);
  }, []);

  return width;
};

export const useComponentVisible = (
  initialIsVisible: boolean
): {
  ref: RefObject<HTMLDivElement>;
  isComponentVisible: boolean;
  setIsComponentVisible: Dispatch<SetStateAction<boolean>>;
} => {
  const [isComponentVisible, setIsComponentVisible] = useState(initialIsVisible);
  const ref = useRef(null);
  const handleClickOutside = () => {
    setIsComponentVisible(false);
  };

  useEffect(() => {
    document.addEventListener('click', handleClickOutside, true);

    return () => {
      document.removeEventListener('click', handleClickOutside, true);
    };
  }, []);

  return {
    ref,
    isComponentVisible,
    setIsComponentVisible
  };
};

export const useHeightResize = (heightOffset: number): [number] => {
  const [height, setHeight] = useState(window.innerHeight - heightOffset);

  useEffect(() => {
    const handleResize = () => {
      setHeight(window.innerHeight - heightOffset);
    };

    window.addEventListener('resize', handleResize);

    return () => window.removeEventListener('resize', handleResize);
    // eslint-disable-next-line
  }, []);

  return [height];
};

export const useSearch = (propsSearchValue?: string): [string, Dispatch<SetStateAction<string>>] => {
  const [searchValue, setSearchValue] = useState<string | undefined>(propsSearchValue);

  useEffect(() => {
    setSearchValue(propsSearchValue);
  }, [propsSearchValue, setSearchValue]);

  return [searchValue, setSearchValue];
};

export const useSort = ({sortColumn, sortDirection}: Partial<ITableSort>): [ITableSort, Dispatch<SetStateAction<ITableSort>>] => {
  const [sortData, setSortData] = useState<ITableSort | null>(null);

  useEffect(() => {
    if ((sortColumn && !sortData) || sortColumn !== sortData?.sortColumn || sortDirection !== sortData?.sortDirection) {
      const newSortDirection = sortDirection || sortData?.sortDirection || DirectionType.Asc;
      const newSortColumn = sortColumn || sortData?.sortColumn;

      setSortData({
        sortDirection: newSortDirection,
        sortColumn: newSortColumn ?? ''
      });
    }
  }, [sortColumn, sortDirection, sortData, setSortData]);

  return [sortData, setSortData];
};

export const useLoginStatus = (applicationId: string): [boolean] => {
  const [isLoggedIn, setLoginStatus] = useState(false);

  useEffect(() => {
    AuthService.hasLoginToken().then((response: boolean) => setLoginStatus(response));
  }, [applicationId]);

  return [isLoggedIn];
};