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 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 | 126x 126x 126x 34x 126x 126x 6x 36x 36x 126x 126x 126x 126x 126x 126x | import { useLocation, useNavigate } from "react-router-dom";
import { useCallback, useMemo } from "react";
export function useQueryParams() {
const location = useLocation();
const navigate = useNavigate();
const queryParams = useMemo(
() => new URLSearchParams(location.search),
[location.search],
);
const get = useCallback((key: string) => queryParams.get(key), [queryParams]);
const getMany = useCallback(
(keys: string[]) =>
keys.reduce<Record<string, string | null>>((acc, key) => {
acc[key] = queryParams.get(key);
return acc;
}, {}),
[queryParams],
);
const getAll = useCallback(
(key: string) => queryParams.getAll(key),
[queryParams],
);
const set = useCallback(
(key: string, value: string, { sync = true, replace = true } = {}) => {
queryParams.set(key, value);
if (sync) {
navigate({ search: queryParams.toString() }, { replace });
}
return queryParams;
},
[queryParams, navigate],
);
const setMany = useCallback(
(entries: Record<string, string>, { sync = true, replace = true } = {}) => {
Object.entries(entries).forEach(([key, value]) =>
queryParams.set(key, value),
);
if (sync) {
navigate({ search: queryParams.toString() }, { replace });
}
return queryParams;
},
[queryParams, navigate],
);
const remove = useCallback(
(keys: string[], { sync = true, replace = true } = {}) => {
keys.forEach((key) => queryParams.delete(key));
if (sync) {
navigate({ search: queryParams.toString() }, { replace });
}
return queryParams;
},
[queryParams, navigate],
);
const clear = useCallback(
({ sync = true, replace = true } = {}) => {
if (sync) {
navigate({ search: "" }, { replace });
}
return new URLSearchParams();
},
[navigate],
);
return { queryParams, get, getMany, getAll, set, setMany, remove, clear };
}
|