on master help sign in
Merge pull request #1417 from urbit/mp/debounce-search
bb0e479matildepark
components/Search.js+3−2
@@ -1,6 +1,7 @@
1import { Component, createRef } from "react";
1import { Component, createRef } from "react";
2import { glossary } from "../lib/glossary";
2import { glossary } from "../lib/glossary";
3import { withRouter } from "next/router";
3import { withRouter } from "next/router";
4+import debounce from "lodash.debounce";
4import Downshift from "downshift";
5import Downshift from "downshift";
5
6
6class Search extends Component {
7class Search extends Component {
@@ -38,7 +39,7 @@ class Search extends Component {
38 this.props.closeSearch();
39 this.props.closeSearch();
39 }
40 }
40
41
41− onInputValueChange(query) {
42+ onInputValueChange = debounce((query) => {
42 if (query.length) {
43 if (query.length) {
43 fetch(this.searchEndpoint(query))
44 fetch(this.searchEndpoint(query))
44 .then((res) => res.json())
45 .then((res) => res.json())
@@ -61,7 +62,7 @@ class Search extends Component {
61 } else {
62 } else {
62 this.setState({ results: [] });
63 this.setState({ results: [] });
63 }
64 }
64− }
65+ }, 250);
65
66
66 render() {
67 render() {
67 const { state, props } = this;
68 const { state, props } = this;
package-lock.json+11
@@ -19,6 +19,7 @@
19 "fuzzy-search": "^3.2.1",
19 "fuzzy-search": "^3.2.1",
20 "gray-matter": "^4.0.3",
20 "gray-matter": "^4.0.3",
21 "html-entities": "^2.3.2",
21 "html-entities": "^2.3.2",
22+ "lodash.debounce": "^4.0.8",
22 "luxon": "^2.0.2",
23 "luxon": "^2.0.2",
23 "next": "^12.1.5",
24 "next": "^12.1.5",
24 "path-browserify": "^1.0.1",
25 "path-browserify": "^1.0.1",
@@ -1909,6 +1910,11 @@
1909 "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
1910 "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
1910 "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
1911 "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
1911 },
1912 },
1913+ "node_modules/lodash.debounce": {
1914+ "version": "4.0.8",
1915+ "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
1916+ "integrity": "sha1-gteb/zCmfEAF/9XiUVMArZyk168="
1917+ },
1912 "node_modules/longest-streak": {
1918 "node_modules/longest-streak": {
1913 "version": "3.0.1",
1919 "version": "3.0.1",
1914 "resolved": "https://registry.npmjs.org/longest-streak/-/longest-streak-3.0.1.tgz",
1920 "resolved": "https://registry.npmjs.org/longest-streak/-/longest-streak-3.0.1.tgz",
@@ -6294,6 +6300,11 @@
6294 "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
6300 "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
6295 "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
6301 "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
6296 },
6302 },
6303+ "lodash.debounce": {
6304+ "version": "4.0.8",
6305+ "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
6306+ "integrity": "sha1-gteb/zCmfEAF/9XiUVMArZyk168="
6307+ },
6297 "longest-streak": {
6308 "longest-streak": {
6298 "version": "3.0.1",
6309 "version": "3.0.1",
6299 "resolved": "https://registry.npmjs.org/longest-streak/-/longest-streak-3.0.1.tgz",
6310 "resolved": "https://registry.npmjs.org/longest-streak/-/longest-streak-3.0.1.tgz",
package.json+1
@@ -23,6 +23,7 @@
23 "fuzzy-search": "^3.2.1",
23 "fuzzy-search": "^3.2.1",
24 "gray-matter": "^4.0.3",
24 "gray-matter": "^4.0.3",
25 "html-entities": "^2.3.2",
25 "html-entities": "^2.3.2",
26+ "lodash.debounce": "^4.0.8",
26 "luxon": "^2.0.2",
27 "luxon": "^2.0.2",
27 "next": "^12.1.5",
28 "next": "^12.1.5",
28 "path-browserify": "^1.0.1",
29 "path-browserify": "^1.0.1",