50 lines
1.4 KiB
TypeScript
50 lines
1.4 KiB
TypeScript
import {useState} from 'react';
|
|
|
|
export function useStoredState(storageKey: string, initialState: () => string): [string, ((newState: string) => void)] {
|
|
const [state, setState] = useState<string>(() => localStorage.getItem(storageKey) || initialState());
|
|
|
|
const setSavedState = (newState: string) => {
|
|
localStorage.setItem(storageKey, newState);
|
|
setState(newState);
|
|
};
|
|
|
|
return [state, setSavedState];
|
|
}
|
|
|
|
export function useStoredObjectState<T>(
|
|
storageKey: string,
|
|
initialState: () => T,
|
|
options?: {
|
|
load?: (value: T) => void;
|
|
save?: (value: T) => void;
|
|
}
|
|
): [T, (mutator: (oldState: T) => T) => void] {
|
|
const getInitialState = () => {
|
|
const localStorageJson = localStorage.getItem(storageKey);
|
|
|
|
let result = (localStorageJson !== null && localStorageJson !== '')
|
|
? JSON.parse(localStorageJson) as T
|
|
: initialState();
|
|
|
|
if (options?.load)
|
|
options.load(result);
|
|
|
|
return result;
|
|
};
|
|
|
|
const [state, setState] = useState<T>(getInitialState);
|
|
|
|
const setSavedState = (mut: (oldState: T) => T) => {
|
|
setState(prevState => {
|
|
const newState = mut(prevState);
|
|
|
|
if (options?.save)
|
|
options.save(newState);
|
|
|
|
localStorage.setItem(storageKey, JSON.stringify(newState));
|
|
return newState;
|
|
});
|
|
};
|
|
|
|
return [state, setSavedState];
|
|
}
|