I'm saving the state (open/closed) of a sidebar(drawer) in localStorage, and if the saved stated is != default state, the sidebar flickers when freshly loading the page. Is there anything that can be made in order to avoid this?

I've written up a page to show this issue: https://stackblitz.com/edit/stackblitz-starters-2ehkff?file=app%2Fpage.tsx

I've also written up a similar page to show a potential fix, but due to SSR happening it shows an error instead: https://stackblitz.com/edit/stackblitz-starters-9qpfa3?file=app%2Fpage.tsx -- Warning: Text content did not match. Server: "light" Client: "dark".

Am I doing something wrong? Is there a way to achieve what I want using nextjs and/or jotai or a different state management?