I am using the nextJs 14 app router in the webapp... using firebase9 for Auth and Zustand for Global State with no provider to wrap the app....Now i have used the store for storing the some of the fields from the user object returned from the firebase....and storing it into global store... now I am using a conditional rendering to show thesignIn & userProfile with a help of global state variable isLoggedIn which is set to false in default , after signin in set to true with zustand's actions...again to false after signin out... and the Navbar component is shared across the app by keeping it in the app/layout.tsx....inside Navbar, its useEffect listening to onAuthStateChanged auth-listener from firebase is again setting the firebase user and isLoggedIn to true.......

# issue...
1. the conditional rendering breaks for a little time after refresh as zustand creates new instances everytime........so a loader can be there untill the new instance of the store gets into action.....
2. With every reroute with router from useRouter from next/navigation is also doing the same things, like showing a glimpse of signIn button before showing userAvatar.. how rerouting is effecting the global store.....how to solve that,
should i set the userObject directly on the zustand store actions definition as setting store values from multiple component may effect.....