import { createContext, use, useState } from 'react';

const DatatableContext = createContext({});

const { Provider } = DatatableContext;

// eslint-disable-next-line react/prop-types
function DatatableProvider({ children }) {
  const [customButtons, setCustomButtons] = useState([]);
  const [customPreButtons, setCustomPreButtons] = useState([]);
  const [loading, setLoading] = useState(false);
  const [disabled, setDisabled] = useState(false);
  const [filterLabel, setFilterLabel] = useState('Filter');

  const value = {
    customButtons,
    setCustomButtons,
    customPreButtons,
    setCustomPreButtons,
    filterLabel,
    setFilterLabel,
    loading,
    setLoading,
    disabled,
    setDisabled,
  };

  return <Provider value={value}>{children}</Provider>;
}

function useDatatableContext() {
  return use(DatatableContext);
}

export { DatatableProvider, useDatatableContext };
