Added a search filter for greater than 3 characters.
This commit is contained in:
@@ -8,7 +8,7 @@ import { GLOBAL_SEARCH_QUERY } from "../../graphql/search.queries";
|
|||||||
import PhoneNumberFormatter from "../../utils/PhoneFormatter";
|
import PhoneNumberFormatter from "../../utils/PhoneFormatter";
|
||||||
import AlertComponent from "../alert/alert.component";
|
import AlertComponent from "../alert/alert.component";
|
||||||
import OwnerNameDisplay, {
|
import OwnerNameDisplay, {
|
||||||
OwnerNameDisplayFunction
|
OwnerNameDisplayFunction,
|
||||||
} from "../owner-name-display/owner-name-display.component";
|
} from "../owner-name-display/owner-name-display.component";
|
||||||
import VehicleVinDisplay from "../vehicle-vin-display/vehicle-vin-display.component";
|
import VehicleVinDisplay from "../vehicle-vin-display/vehicle-vin-display.component";
|
||||||
export default function GlobalSearch() {
|
export default function GlobalSearch() {
|
||||||
@@ -18,11 +18,18 @@ export default function GlobalSearch() {
|
|||||||
useLazyQuery(GLOBAL_SEARCH_QUERY);
|
useLazyQuery(GLOBAL_SEARCH_QUERY);
|
||||||
|
|
||||||
const executeSearch = (v) => {
|
const executeSearch = (v) => {
|
||||||
if (v && v.variables.search && v.variables.search !== "") callSearch(v);
|
if (
|
||||||
|
v &&
|
||||||
|
v.variables.search &&
|
||||||
|
v.variables.search !== "" &&
|
||||||
|
v.variables.search.length >= 3
|
||||||
|
)
|
||||||
|
callSearch(v);
|
||||||
};
|
};
|
||||||
const debouncedExecuteSearch = _.debounce(executeSearch, 750);
|
const debouncedExecuteSearch = _.debounce(executeSearch, 750);
|
||||||
|
|
||||||
const handleSearch = (value) => {
|
const handleSearch = (value) => {
|
||||||
|
console.log("Handle Search");
|
||||||
debouncedExecuteSearch({ variables: { search: value } });
|
debouncedExecuteSearch({ variables: { search: value } });
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -177,6 +184,7 @@ export default function GlobalSearch() {
|
|||||||
<AutoComplete
|
<AutoComplete
|
||||||
options={options}
|
options={options}
|
||||||
onSearch={handleSearch}
|
onSearch={handleSearch}
|
||||||
|
|
||||||
defaultActiveFirstOption
|
defaultActiveFirstOption
|
||||||
onSelect={(val, opt) => {
|
onSelect={(val, opt) => {
|
||||||
history.push(opt.label.props.to);
|
history.push(opt.label.props.to);
|
||||||
|
|||||||
Reference in New Issue
Block a user