@plq/use-persisted-state
Version:
useState hook with persistence in storage
38 lines • 2.04 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.default = createPersistedState;
const react_1 = require("react");
const use_storage_handler_1 = __importDefault(require("./utils/use-storage-handler"));
const get_new_value_1 = __importDefault(require("./utils/get-new-value"));
const get_new_item_1 = __importDefault(require("./utils/get-new-item"));
const get_persisted_value_1 = __importDefault(require("./utils/get-persisted-value"));
function createPersistedState(storageKey, storage) {
const safeStorageKey = `persisted_state_hook:${storageKey}`;
const clear = () => {
storage.remove(safeStorageKey);
};
const usePersistedState = (key, initialValue) => {
const persist = storage.get(safeStorageKey);
const persistedState = persist[safeStorageKey];
const initialOrPersistedValue = (0, get_persisted_value_1.default)(key, initialValue, persistedState);
const [state, setState] = (0, react_1.useState)(initialOrPersistedValue);
const setPersistedState = (newState) => {
const newValue = (0, get_new_value_1.default)(newState, state);
setState(newValue);
const persistedItem = storage.get(safeStorageKey)[safeStorageKey];
const newItem = (0, get_new_item_1.default)(key, persistedItem, newValue);
storage.set({ [safeStorageKey]: newItem });
};
(0, react_1.useEffect)(() => {
const initialOrPersistedValue = (0, get_persisted_value_1.default)(key, initialValue, persistedState);
setState(initialOrPersistedValue);
}, [initialValue, key, persistedState]);
(0, use_storage_handler_1.default)(key, safeStorageKey, setState, storage, initialValue);
return [state, setPersistedState];
};
return [usePersistedState, clear];
}
//# sourceMappingURL=create-persisted-state.js.map