Invalid Hook Call. React

问题:

I am new to React.js and I bought source code of web application. I have good experience in pure javascript. so I did all thing's and everything is working fine. except one I am getting the error shown in the ​screenshot.

import React, { useReducer } from 'react';

const initialState = {
  isOpen: false,
};

function reducer(state, action) {
  switch (action.type) {
    case 'TOGGLE':
      return {
        ...state,
        isOpen: !state.isOpen,
      };
    default:
      return state;
  }
}
export const DrawerContext = React.createContext({});

export const DrawerProvider = ({ children }) => { <-- Error
  const [state, dispatch] = useReducer(reducer, initialState);
  return (
    <DrawerContext.Provider value={{ state, dispatch }}>
      {children}
    </DrawerContext.Provider>
  );
};