Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 | 1x 1x 1x 3x 2x 3x 3x 3x 3x 1x 3x 3x 3x 3x 1x | import { useCallback, useEffect, useState } from "react";
const toggleableListCache: Record<string, unknown[]> = {};
const useToggleableList = <T>(initialState: T[], cacheKey?: string) => {
const [values, setValues] = useState<T[]>(() =>
cacheKey && toggleableListCache[cacheKey]
? (toggleableListCache[cacheKey] as T[])
: initialState,
);
useEffect(() => {
Eif (cacheKey) {
toggleableListCache[cacheKey] = values;
}
}, [cacheKey, values]);
const set = useCallback((id: T) => {
setValues((value) => ([] as T[]).concat(value, id));
}, []);
const unset = useCallback((id: T) => {
setValues((value) => value.filter((s) => s !== id));
}, []);
const isSet = useCallback(
(id: T) => {
return values.includes(id);
},
[values],
);
const toggle = useCallback(
(id: T) => {
if (isSet(id)) {
unset(id);
} else {
set(id);
}
},
[isSet, set, unset],
);
return { values, setValues, isSet, toggle, set, unset } as const;
};
export default useToggleableList;
|