2020-04-26 00:52:32 +00:00
|
|
|
import { Dispatch, SetStateAction, useEffect, useState } from 'react';
|
|
|
|
|
2022-06-26 19:13:52 +00:00
|
|
|
export function usePersistedState<S = undefined>(
|
|
|
|
key: string,
|
2022-11-25 20:25:03 +00:00
|
|
|
defaultValue: S,
|
2022-06-26 19:13:52 +00:00
|
|
|
): [S | undefined, Dispatch<SetStateAction<S | undefined>>] {
|
|
|
|
const [state, setState] = useState(() => {
|
|
|
|
try {
|
|
|
|
const item = localStorage.getItem(key);
|
2020-04-26 00:52:32 +00:00
|
|
|
|
2022-06-26 19:13:52 +00:00
|
|
|
return JSON.parse(item || String(defaultValue));
|
|
|
|
} catch (e) {
|
|
|
|
console.warn('Failed to retrieve persisted value from store.', e);
|
2020-04-26 00:52:32 +00:00
|
|
|
|
2022-06-26 19:13:52 +00:00
|
|
|
return defaultValue;
|
|
|
|
}
|
|
|
|
});
|
2020-04-26 00:52:32 +00:00
|
|
|
|
|
|
|
useEffect(() => {
|
2020-07-05 01:30:50 +00:00
|
|
|
localStorage.setItem(key, JSON.stringify(state));
|
2022-06-26 19:13:52 +00:00
|
|
|
}, [key, state]);
|
2020-04-26 00:52:32 +00:00
|
|
|
|
2022-06-26 19:13:52 +00:00
|
|
|
return [state, setState];
|
2020-04-26 00:52:32 +00:00
|
|
|
}
|