import {TableSearchAction, useTableSearchContextReducer} from '@hooks';
import {Auth, Footer} from '@components';
import {Dispatch, ReactElement, ReactNode} from 'react';
import {Context} from 'use-context-selector';

type Props<T> = {
  context: Context<[T, Dispatch<TableSearchAction<T>>]>;
  state: Readonly<T>;
  children: ReactNode;
};

function TableSearchProvider<T extends Record<string, unknown>>({
  context,
  state,
  children,
}: Props<T>): ReactElement {
  const {Provider} = context;
  const value = useTableSearchContextReducer(state);

  return (
    <Auth>
      <Provider value={value}>{children}</Provider>
      <Footer color='#bbb' />
    </Auth>
  );
}

export default TableSearchProvider;
