React has detected a change in the order of Hooks

[Schmell]

I am thinking of maybe trying to migrate to Nextjs. I am sure I am using Nextjs wrong but I get this error when using useDocument or useDocumentData directly on a page route.

`next-dev.js?3515:20 Warning: React has detected a change in the order of Hooks called by MobileNav. This will lead to bugs and errors if not fixed. For more information, read the Rules of Hooks: https://reactjs.org/link/rules-of-hooks

Previous render Next render

1. useReducer useReducer
2. useCallback useCallback
3. useCallback useCallback
4. useCallback useCallback
5. useMemo useMemo
6. useEffect useEffect
7. useReducer useReducer
8. useCallback useCallback
9. useCallback useCallback
10. useCallback useCallback
11. useMemo useMemo
12. useRef useRef
13. useEffect useEffect
14. useEffect useEffect
15. useContext useContext
16. useContext useContext
17. undefined useContext
    ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^`

BTW. I wouldn't have created an issue if there was a discussion area
Sorry