useLocalStorage doesn't fire when localStorage is changed from another tab

[vadzim]

I believe useLocalStorage should fire and update its value when local storage is changed from another browser tab, isn't it?

[zhengbigbig]

Component which used useLocalStroage should be forced to mount again.

[zhengbigbig]

If you read and write it frequently, suggest you encapsulate it yourself, It could be costly.

[sungwoo91]

I think useLocalStorage just modify the value in the window.localStorage. So you should register storage eventListener to update another tab page.

Like below

const Demo = () => {
  const [value, setValue] = useLocalStorage('hello-key', 'foo', {raw: true});
  const [removableValue, setRemovableValue, remove] = useLocalStorage('removeable-key');

  const callback = React.useCallback((e) => {
    setValue(e.newValue);
  }, [setValue]);

  useEvent('storage', callback);
  
  return (
    <div>
      <div>Value: {value}</div>
      <button onClick={() => setValue('bar')}>bar</button>
      <button onClick={() => setValue('baz')}>baz</button>
      <br />
      <br />
      <div>Removable Value: {removableValue}</div>
      <button onClick={() => setRemovableValue('foo')}>foo</button>
      <button onClick={() => setRemovableValue('bar')}>bar</button>
      <button onClick={() => remove()}>Remove</button>
    </div>
  );
};

[Svish]

I tried registering for storage events in a local useLocalStorage variant of mine, and... found it was very easy to end up in infinite update-loops. If it's going to be a feature in this library, it should be very well tested.

[xobotyi]

If anyone interested it is implemented in upcoming hook of @react-hookz/web react-hookz/web#43

[innrvoice]

Draft PR for possible solution #2307

[innrvoice]

@streamich fyi

[innrvoice]

Can anyone ping one of the maintainers or contributors. My pr stuck in workflow because I am "First-time contributor".
@vadzim @Svish @sungwoo91

Thanks!

[Svish]

@innrvoice It's not stuck because you're a "First-time contributor", it's stuck because this project is kind of dead. If you look at the history, there haven't been any proper PR's merged for a long time.

[innrvoice]

@Svish thank you for the answer. Its a pity that this project is no longer needed.