Nextjs Zustand state persistence

Job ID: 33923338

Budget: $10 – $30 CAD

I have this github repo: https://github.com/salmanfazal01/next-firebase-starter

Basically I am creating a basic boilerplate with NextJS, Firebase and Zustand as a global state manager

I am unable to persist a few states like theme, user, etc in Zustand. After refreshing the window, it defaults back to the default theme.

I did try the persist middleware provided by zustand and even though that works, it causes other errors (content mismatch from the server and client)

Here is my stackoverflow question - https://stackoverflow.com/questions/72639355/react-warning-expected-server-html-to-contain-a-matching-p-in-div

Task: There isnt much coding required, all I need help is with persisting the state values with no errors.

Do not bid if you do not have experience with this, I'm not looking to waste my time if you are just going to experiment.
Related categories: JavaScript HTML5 React.js Next.js