couds / react-bulma-components

React components for Bulma framework
MIT License
1.2k stars 129 forks source link

Can't use Navbar in Next.js server component #419

Closed davetapley closed 4 months ago

davetapley commented 1 year ago

Describe the bug

Can't use Navbar in Next.js server component because: https://github.com/couds/react-bulma-components/blob/82d13fc9d8c9ffee46c21318450127b92cbf128e/src/components/navbar/context.js#L3

frustrating because I don't need the active toggle anyway 😑

Screenshots

Server Error
TypeError: createContext only works in Client Components. Add the "use client" directive at the top of the file to use it. Read more: https://nextjs.org/docs/messages/context-in-server-component

This error happened while generating the page. Any console logs will be displayed in the terminal window.
couds commented 4 months ago

I know it late, but due how the navbar handle the open state of the meny it needs the context and server component do not allow it.

To use this component you will need to wrap it on a Cliend component.

A Recommended practice its to do someething like

filename="src/components/react-bulma"

'use client'

export * from 'react-bulma-components'

and your code import from src/client/react-bulma like

import { Navbar } from '@/components/react-bulma`

// ... rest of the code

In future release we might expose a build with the 'use client' on it but is not a priority right now