Next.js Discord

Discord Forum

Can't use Object.values in Next.js?

Answered
Byte posted this in #help-forum
Open in Discord
ByteOP
Hi all,

In my Next.js app, I am calling a util from layout.tsx which has the following code:
  if (!Object.values(ThemeMode).includes(themeMode as ThemeMode)) {
    throw Error();
  }


Next.js throws a error:
Server Error

Error: 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

Seems to be the Object.values causing it. What is the issue here? I thought I'd be able to do a Typescript enum include check on the server? What is the workaround?

Thank you! 🙇‍♂️
Answered by Havana
It's not the Object.values, probably the ThemeMode causes an issue.
In SSR components, you cannot use contexts, and any sorts of hooks (use*).
View full answer

4 Replies

Havana
It's not the Object.values, probably the ThemeMode causes an issue.
In SSR components, you cannot use contexts, and any sorts of hooks (use*).
Answer
Havana
If it's an external util that doesn't exist within layout.tsx you could just type "use client" on top of it to make sure it can access contexts
ByteOP
Genius! @Havana

Thank you!

The issue was I actually have multiple objects named 'ThemeMode'. One is SSR friendly, other is not. I imported the wrong one 🙂

I was going a bit crazy trying to figure out why Object.value was using context.

Solved ✅