@botonic/react
Version:
Build Chatbots using React
38 lines • 1.76 kB
JavaScript
import { useCallback, useEffect, useState } from 'react';
// Code taken from https://github.com/leny/react-use-storage/blob/master/src/index.js
const IS_BROWSER = typeof window !== 'undefined' &&
typeof navigator !== 'undefined' &&
typeof document !== 'undefined';
export function useStorageState(storage, key, defaultValue) {
var _a, _b;
let evtTarget;
try {
evtTarget = new EventTarget();
}
catch (_c) {
evtTarget = (_b = (_a = (IS_BROWSER ? document : {})) === null || _a === void 0 ? void 0 : _a.createElement) === null || _b === void 0 ? void 0 : _b.call(_a, 'phony');
}
const raw = storage === null || storage === void 0 ? void 0 : storage.getItem(key);
const [value, setValue] = useState(raw ? JSON.parse(raw) : defaultValue);
const updater = useCallback((updatedValue, remove = false) => {
setValue(updatedValue);
storage[remove ? 'removeItem' : 'setItem'](key, JSON.stringify(updatedValue));
evtTarget.dispatchEvent(new CustomEvent('storage_change', { detail: { key } }));
}, [key]);
defaultValue != null && !raw && updater(defaultValue);
useEffect(() => {
const listener = ({ detail }) => {
if (detail.key === key) {
const lraw = storage === null || storage === void 0 ? void 0 : storage.getItem(key);
lraw !== raw && setValue(JSON.parse(lraw));
}
};
evtTarget.addEventListener('storage_change', listener);
return () => evtTarget.removeEventListener('storage_change', listener);
});
if (storage === null) {
return [undefined, undefined];
}
return [value, updater, () => updater(null, true)];
}
//# sourceMappingURL=use-storage-state-hook.js.map