Wasn't able to use react router hooks along with that hook

[Taha-Seddik]

I was doing some logic that depends on search query

so I did use useLocation inside a hook that will be shared across other hooks

I got this error :

Sandbox : https://codesandbox.io/s/react-router-basic-forked-c00hm4?file=/example.js

[melloware]

I think this is a duplicate of what is explained in #21

[betula]

Thanks @melloware, absolutely true.
The answer explained in the comment #21 (comment)

---

The useLocation hook internally uses the React context.
The error looks like this:

Hook "useContext" no possible to using inside useBetween scope.

There is no way to use the React context inside shared states, since they exist outside the React component hierarchy.

We will create a component like this (https://codesandbox.io/s/react-router-forked-cbz4b?file=/components/state.js:517-713):

export const SharedConnector = () => {
  const location = useLocation(); // We can only use inside React component's, as it uses the React context internally.

  const {setLocation} = useSharedHook();
  useEffect(() => {
    setLocation(location.pathname); // Set "location.pathname" to the shared state
  }, [location]);
  return null;
};

Which will forward location.pathname inside our shared state.

And put it inside the Router element to use its context. (https://codesandbox.io/s/react-router-forked-cbz4b?file=/index.js:309-323)

const BasicExample = () => (
  <Router>
    <SharedConnector />
    ...