import {useContext} from '@hooks';
import {Dispatch, useCallback, useReducer} from 'react';
import {createContext} from 'use-context-selector';

export type SearchContextState = {
  isSearching: boolean,
};

export type SearchContextAction = {type: 'CHANGE_SEARCH_STATE', payload: boolean};

export function initSearchContextState(init?: Partial<SearchContextState>): SearchContextState {
  return {isSearching: init?.isSearching ?? false};
}

function reducer(state: SearchContextState, action: SearchContextAction): SearchContextState {
  switch (action.type) {
    case 'CHANGE_SEARCH_STATE':
      return {isSearching: action.payload};
    default:
      return state;
  }
}

export function useSearchContextReducer() {
  return useReducer(reducer, initSearchContextState());
}

export const createSearchContext = () => createContext<[
  SearchContextState, Dispatch<SearchContextAction>,
]>([
  initSearchContextState(),
  () => null,
]);

export function useTableSearch(context: ReturnType<typeof createSearchContext>) {
  const [{isSearching}, dispatch] = useContext(context);

  const onSearchChange = useCallback(function(state: boolean) {
    dispatch({type: 'CHANGE_SEARCH_STATE', payload: state});
  }, [dispatch]);

  return [isSearching, onSearchChange] as const;
}
