TypeError: Cannot read properties of null (reading 'useContext')

[tall crag]

Hi @ionic haven. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

---

The error message you're seeing typically occurs when you're trying to use a hook outside of a React component or if the hook is not properly imported. In your case, it seems like you're trying to use the useRouter hook from Next.js.

Here's the correct way to import and use the useRouter hook in a Next.js component:

import { useRouter } from 'next/router'

export default function Page() {
 const router = useRouter()
 // rest of your code
}

This code is extracted from the Next.js documentation (https://nextjs.org/docs/pages/api-reference/functions/use-router).

If you're still seeing the error, it could be due to a few reasons:

1. You might be using the useRouter hook outside of a functional component. Hooks can only be called inside the body of a function component.

2. The component where you're using the hook might not be inside the Next.js app, i.e., it's not part of the pages or components that are rendered as part of the Next.js routing.

3. There might be a problem with your Next.js or React version. Make sure you're using a version of Next.js that supports the useRouter hook.

If none of these solutions work, please provide more context or code snippets so I can give a more accurate solution.

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

@turbid portal kapa.ai is still learning and improving, please let us how it did by reacting below