Problem state of overlay on first load
Unanswered
American Bobtail posted this in #help-forum
American BobtailOP
Hello,
I am facing an issue within ssr/serverState/clientState.
context:
when an user come to my website, unless he is explicitely clicking on the getting start on the overlay, the overlay will be above all the pages.
I did try using
going to
navigating to
navigating back to
closing the overlay
the overlay will show before disappearing until the user does a refresh.
I then tried to use localStorage which is working pretty well BUT because it is only on the client side, even if the user close the overlay, the user will always see the overlay before it close automatically (localStorage loading time I suppose).
solution I am thinking of:
I can implement both serverside (cookies) and clientside (localStorage) and check both to never display again the overlay when the user swap page, etc... But seems to be overthinking or doing the same job twice.
Any ideas of how to achieve this in a "smart" way?
I am facing an issue within ssr/serverState/clientState.
context:
when an user come to my website, unless he is explicitely clicking on the getting start on the overlay, the overlay will be above all the pages.
I did try using
cookies however if the user do the following:going to
/navigating to
/page2navigating back to
/closing the overlay
the overlay will show before disappearing until the user does a refresh.
I then tried to use localStorage which is working pretty well BUT because it is only on the client side, even if the user close the overlay, the user will always see the overlay before it close automatically (localStorage loading time I suppose).
solution I am thinking of:
I can implement both serverside (cookies) and clientside (localStorage) and check both to never display again the overlay when the user swap page, etc... But seems to be overthinking or doing the same job twice.
Any ideas of how to achieve this in a "smart" way?
21 Replies
Western paper wasp
are you building from scratch?
@Western paper wasp are you building from scratch?
American BobtailOP
what do you mean?
@American Bobtail what do you mean?
Western paper wasp
are you using like medusa?
American BobtailOP
no sorry, nextjs only
built within the nextjs getting start
Is this supposed to be a onboarding overlay?
Like you need to complete onboarding/initial setup before you can access the real content?
@Clown Like you need to complete onboarding/initial setup before you can access the real content?
American BobtailOP
kinda yes, it is showing text that you need to approve once
Hmm.. you should look into middleware
Instead of messing around with an overlay
Although cookie should work pretty well aswell
@Clown Hmm.. you should look into middleware
American BobtailOP
but the profile + tabs are still usable within the overlay (that's half screen overlay :s)
I see..
@Clown Although cookie should work pretty well aswell
American BobtailOP
within the cookie, I have the issue that the page is still showing the overlay for few ms before disappering because of
I did try using cookies however if the user do the following:
going to /
navigating to /page2
navigating back to /
closing the overlayuntil I hard refresh the page 😦
one solution would be to hard refresh when clicking on the button, but does not seem cool neither...
Maybe the cookie is being returned as undefined for a split second. Dont know why that is happening
Maybe you'll need to try and adding a loading state in between to eliminate this false positive
Also try testing on production build aswell if the problem continues
@Clown Also try testing on production build aswell if the problem continues
American BobtailOP
basically when I am changing between
/ and page1, the cookie is logged once, and never logged anymore until I hard refresh (so the cookie state for page1 is still false until I hard refreshseems that its value is stll cached