Problem state of overlay on first load
Unanswered
Devon Rex posted this in #help-forum
Devon RexOP
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?
Devon RexOP
what do you mean?
@Devon Rex what do you mean?
Western paper wasp
are you using like medusa?
Devon RexOP
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?
Devon RexOP
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
Devon RexOP
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
Devon RexOP
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
Devon RexOP
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