title: Why do i get the error setLoading doesnt exist on type {} while using createContext using react and typescript?
body: <p>i want to use the context provider to set the state of loading using react and typescript.</p>
  
  <p>what i am trying to do?
  i want to set loading state to true or false when request starts and ends and provide access to this loading state to all components within main component.</p>
  
  <p>i have tried to do so like in code below,</p>
  
  <pre><code>function useAnother(Id: string) {
      const [compId, setCompId] = React.useState(undefined);
      const [isLoading, setIsLoading] = React.useState(false);
      const comp = useCurrentComp(Id);
      const load = useLoad();
      if (comp &amp;&amp; comp.id !== compId) {
          setCompId(comp.id);
          const prevCompId = compId !== undefined;
          if (prevCompId) {
              setIsLoading(true);
              load().then(() =&gt; {
                  setIsLoading(false);
              });
          }
      }
  }
  
  function Main ({user}: Props) {
      useAnother(user.id); //fetching isLoading here from useHook
      return (
          &lt;Wrapper&gt;
              &lt;React.suspense&gt;
                  &lt;Switch&gt;
                      &lt;Route 
                          path="/" 
                          render={routeProps =&gt; (
                              &lt;FirstComp {...routeProps} /&gt;
                          )}
                      /&gt;
                      &lt;Route 
                          path="/items" 
                          render={routeProps =&gt; (
                              &lt;SecondComp {...routeProps} /&gt;
                          )}
                      /&gt;
                      //many other routes like these
                  &lt;/Switch&gt;
              &lt;/React.suspense&gt;
          &lt;/Wrapper&gt;
      );
  }
  
  
  function FirstComponent (isLoading) {
      return (
          &lt;Wrapper isLoading={isLoadin}/&gt;
      );
  }
  </code></pre>
  
  <p>with the context provider i have tried like below,</p>
  
  <pre><code>function useAnother(Id: string) {
      const [compId, setCompId] = React.useState(undefined);
      const loading = React.useContext(LoadingContext); //accessing context here
      const comp = useCurrentComp(Id);
      const load = useLoad();
      if (comp &amp;&amp; comp.id !== compId) {
          setCompId(comp.id);
          const prevCompId = compId !== undefined;
          if (prevCompId) {
              loading.setIsLoading(true); //gives error setIsLoading doesnt exist on type {}
              load().then(() =&gt; {
                  loading.setIsLoading(false); //gives error setIsLoading doesnt exist on type {}
              });
          }
      }
  }
  
  
  
  export const LoadingContext = React.createContext({});
  
  export const LoadingContextProvider = ({ children }: any) =&gt; {
      const [isLoading, setIsLoading] = React.useState(false);
  
      return (
          &lt;LoadingContext.Provider
              value={{
                  isLoading,
                  setIsLoading,
              }}
          &gt;
              {children}
          &lt;/LoadingContext.Provider&gt;
      );
  };
  
  
  function Main ({user}: Props) {
      useAnother(user.id); //fetching isLoading here from useHook
      return (
          &lt;Wrapper&gt;
              &lt;React.suspense&gt;
                  &lt;LoadingContext.Provider&gt;
                      &lt;Switch&gt;
                          &lt;Route 
                              path="/" 
                              render={routeProps =&gt; (
                                  &lt;FirstComp {...routeProps} /&gt;
                              )}
                          /&gt;
                          &lt;Route 
                              path="/items" 
                              render={routeProps =&gt; (
                                  &lt;SecondComp {...routeProps} /&gt;
                              )}
                          /&gt;
                          //many other routes like these
                     &lt;/Switch&gt;
                  &lt;/LoadingContext.Provider&gt;
              &lt;/React.suspense&gt;
          &lt;/Wrapper&gt;
      );
  }
  </code></pre>
  
  <p>I am not sure why i get the error setIsLoading doesnt exist on type {} when i try to access the context in useAnother hook.</p>
  
  <p>could someone help me with this. thanks.</p>