30 lines
633 B
TypeScript
30 lines
633 B
TypeScript
|
import React from "react";
|
||
|
|
|
||
|
|
import { ChangeEvent } from "@saleor/hooks/useForm";
|
||
|
|
|
||
|
|
export type UseSearchQuery = [string, (event: ChangeEvent) => void, () => void];
|
||
|
|
function useSearchQuery(
|
||
|
|
onFetch: (query: string) => void,
|
||
|
|
initial?: string
|
||
|
|
): UseSearchQuery {
|
||
|
|
const [query, setQuery] = React.useState(initial || "");
|
||
|
|
const change = (event: ChangeEvent) => {
|
||
|
|
const value = event.target.value;
|
||
|
|
|
||
|
|
onFetch(value);
|
||
|
|
setQuery(value);
|
||
|
|
};
|
||
|
|
|
||
|
|
const reset = () =>
|
||
|
|
change({
|
||
|
|
target: {
|
||
|
|
name: "",
|
||
|
|
value: initial || ""
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
return [query, change, reset];
|
||
|
|
}
|
||
|
|
|
||
|
|
export default useSearchQuery;
|