3

Disclaimer: This is for learning purposes and not a real project, if what I am trying to achieve makes no sense, feel free to point that out.

What I want to do:

If the user visits my website, he has to accept cookies.
If he tries to signup, but has not yet accepted the cookies, signup is not possible and there will be a message hinting at this.

What I have done so far:

I installed a third-party library to display a cookie-consent banner on entering the website.

import CookieConsent from 'react-cookie-consent'  

To guarantee that the consent-banner shows up everywhere, I added the CookieConsent-component inside my _app.js file, which is used whenever a page is intialized. This works fine, I can see the cookie-banner whereever I go, until I accept the cookie.

Now here is where I am uncertain of how to address this properly.
How do listen to a change of my CookieConsent (which is created by the above mentioned 3rd party library, it has a boolean value inside)?
When I am in control of my component, I always use useState and, if needed, useEffect.
But this time, the value of a cookie doesn't get changed by a react-hook, so listening to a change / re-rendering of a page won't work.

So yeah, that's pretty much the question: What is the proper way to do this?

All I can come up with in my mind is to create my own cookie-component and add subscriber/observer events there. But this seems like a bad approach, because then I had to create my own components for CookieConsent and CookieRetrieval, therefore re-inventing the wheel.

Leviathan
  • 644
  • 1
  • 15
  • 30
  • Hey Leviathan, did you find any solution for this? I'm stuck with it as well. – Pankaj Patidar Mar 19 '21 at 03:35
  • 2
    Hey, sadly no. I haven't really worked on that any more. But looking at the question right now, I guess what I would suggest you to try is using React's Context feature. – Leviathan Mar 29 '21 at 09:28

0 Answers0