princefishthrower/react-use-please-stay

Prevent Repeat Calls of usePleaseStay

princefishthrower opened this issue · 4 comments

princefishthrower commented

As the README states, one pitfall of this hook is that it should only be called once across an entire codebase - otherwise, it will create multiple timeout interactions on the document.title and will ruin the effect, not to mention add extra load to the browser. I'm looking for a code-based way to prevent this from occurring - perhaps by assigning an ID from the setInterval command:

https://developer.mozilla.org/en-US/docs/Web/API/setInterval

Logic should be something like as follows:

  • I would expect a setInterval ID to be saved in state (or I think a ref would work)
  • if the usePleaseStay() hook was called a second time and it was found this ID was already set, the developer should:
    • in development mode, see a new Error() be thrown
    • in production mode, prevent further execution of the second calling of the hook (simply return from the function)
hari-narah commented

can I work on this?

princefishthrower commented

Definitely! I've assigned you.

  • 👍1
hari-narah commented
  • I would expect a setInterval ID to be saved in state (or I think a ref would work)

When the custom hook usePleaseStay is triggered from 2 different components, we can't share a common state/ref between the custom hook called from those 2 different components.

Hence tracked whether animation is triggerd or not by setting a variable on windows object in #8 . Is this fine?

princefishthrower commented

@Hariharan-Ingersal - sure. But please make the value of it the interval ID - and then we should also be sure to remove the interval on hook unmount. I'm not sure if I do that yet, I haven't looked at the hook code in detail in a while. Then for the dev / prod checking I think there are some examples in the existing code how to do that.

  • 👍1