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