How can I clear the local storage by closing all the tabs of the same domain (not closing one tab) or the entire browser? Session storage is not useful here as it cant share data with other tabs, so I haven't used session storage here. If I use event listeners like beforeunload, it is getting triggered even on page refresh, So what is the possible way to implement this concept in React?
Upon trying with taking count of tabs on loading and unloading, still, it is causing problems when there is one tab remaining. Can anyone please help me with an idea for this concept?
Use sessionStorage. There's a trick that involves writing token to localStorage that would tell the sessionStorage that there's shared data between tabs which can be retrieved using that token. See https://medium.com/@marciomariani/sharing-sessionstorage-between-tabs-5b6f42c6348c
I will try to paste some snippets from there, but really I don't know if that's allowed
You might want to look at the Broadcast Channel API
https://developer.mozilla.org/en-US/docs/Web/API/Broadcast_Channel_API
This API allow you to communicate between tabs, iframes, etc. sitting on the same origin.