contexthook.js

// custom hook: useStore

const ctx = createContext();

export const Store = ({  children }) => {
    const [state, setState] = useState(initialState);

    const mergeState = useCallback((obj) => {
        setState(state => ({ ...state, ...obj }));
    }, []);

    return <ctx.Provider
        value={{ store: state, setStore: mergeState }}
        children={children}
    />
}

export const useStore = () => {
    const { store, setStore } = useContext(ctx);
    return [store, setStore];
}