Implement Dark mode in React Router 7

[wispy crypt]

yes it does

localStorage is only on client

u have to get and set the state in the useEffect

[tranquil anvil]

So how do I create a client-side component on React Router 7?

[tranquil anvil]

Literally the code I use and it doesn't work as I said before

[tranquil anvil]

I know

[wispy crypt]

i told u the fix above

[tranquil anvil]

But the code you provide here doesn't set the theme state in useEffect

[wispy crypt]

localStorage is used in useState above useEffect

and that will not work

until useEffect, everything is server rendered by default

[wispy crypt]

.

[tranquil anvil]

Ok I'll try later. Thanks for your help

[tranquil anvil]

You suggestion work but at what costs? 🥲
https://eslint-react.xyz/docs/rules/hooks-extra-no-direct-set-state-in-use-effect#failing

[tranquil anvil]

Fixed using ClientAction: https://reactrouter.com/start/framework/actions

[placid isle]

you have somewhere example code I could take a look?

[last shadow]

I like this solution https://github.com/sergiodxa/react-router-color-scheme-example