When using persist, it initializes with "null" data briefly before populating the localstorage data.

[oscadev]

Including my zustand code. When I use persist, "user" is briefly "null" before updating to the user data when I load a page. I am using next JS, and so it wont let me use localstorage directly in zustand like other projects in the past have. In the past, when using localstorage, it is syncrounous and so it always loads with the user data immediately. It says persist is supposed to be synchronous by default. I am trying ot have the app know that the user is already logged in immediately upon load, but right now, it briefly flashes as not logged in before updating to correctly being logged in.
`import { User } from "@/generated/graphql";
import { destroyCookie, setCookie } from "nookies";
import { create } from "zustand";
import { persist } from "zustand/middleware";

type UserStore = {
user: User | null;
setUser: (user: User) => void;
logout: () => void;
};

export const useUserStore = create()(
persist(
(set) => ({
user: null,
setUser: (user) => {
if (user.authToken) {
setCookie(null, "authorization", user.authToken, {
maxAge: 30 * 24 * 60 * 60,
path: "/",
});
}
set({ user });
},
logout: () => {
set({ user: null });
destroyCookie(null, "authorization");
},
}),
{
name: "user-storage",
}
)
);
`

[GustavoMelloGit]

I am having the same issue here

[dbritto-dev]

@oscadev @GustavoMelloGit Hey peeps we need more context here. Are you talking about a nextjs app, vite app?

BTW, did you read our nextjs and ssr + hydration guides?