useCookie does not react to changes in the passed in "cookieName"

[ajwootto]

What is the current behavior?
Since the useCookie hook works by initializing a piece of state to the value of Cookie.get with the passed in cookie name, it does not react to any changes to the cookie name that is passed in to the hook, if that value is dynamic.

Steps to reproduce it and if possible a minimal demo of the problem. Your bug will get fixed much faster if we can run your code and it doesn't have extra dependencies other than react-use. Paste the link to your JSFiddle or CodeSandbox example below:

For example:

const MyComponent = ({cookieName}) => {
   const cookieValue = useCookie(cookieName)
...
}

cookieValue will always be the value corresponding to the first cookieName that is passed in, and if that value changes on a subsequent re-render then the hook does not react to it changing and continues to serve the value from the first cookieName

What is the expected behavior?
The hook should react appropriately to the cookieName that is passed in and change the returned value to reflect the value of that cookie.

[matieydjato]

Hi! It looks like there might be an issue with how the useCookie hook is being used. Review the react-use documentation on useCookie to ensure it's being implemented correctly. It covers how to properly initialize and manage cookies within your components.

[ajwootto]

Hi @matieydjato, I have read that documentation, the issue is that the hook assumes the cookie name being passed to it is a static string. If the name itself is dynamic and can change, the hook fails to react properly to the change in name. If that is intended behaviour then I think it would be good to explicitly call that out, since normally I'd expect a hook to respond reactively to any change in its arguments.