/
use-shinryoukoui-search.tsx
48 lines (40 loc) · 1.36 KB
/
use-shinryoukoui-search.tsx
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
import { useRouter } from "next/navigation";
import { useCallback } from "react";
import { SEARCH_PARAM_NAMES } from "@/search-param-names";
export type SearchParamNames = typeof SEARCH_PARAM_NAMES["SEARCH"][keyof typeof SEARCH_PARAM_NAMES["SEARCH"]];
type Options = {
preserveExtraSearchParams: boolean
}
export function useShinryoukouiSearch({
preserveExtraSearchParams,
}: Options) {
const { push } = useRouter();
return useCallback((params: {
[key in SearchParamNames]?: string | undefined
}) => {
const currentSearchParams = new URLSearchParams(window.location.search);
const searchParams = new URLSearchParams();
const searchParamNames = Object.values(SEARCH_PARAM_NAMES.SEARCH);
currentSearchParams.forEach((value, key) => {
if (preserveExtraSearchParams || searchParamNames.includes(key as SearchParamNames)) {
searchParams.set(key, value);
}
});
Object.entries(params).forEach(([key, value]) => {
if (value) {
searchParams.set(key, value);
} else {
searchParams.delete(key);
}
});
push(`/s?${searchParams.toString()}`);
}, [preserveExtraSearchParams, push]);
}
export function useShinryoukouiSearchByQuery() {
const search = useShinryoukouiSearch({preserveExtraSearchParams: false});
return useCallback((q: string) => {
search({
q,
});
}, [search]);
}