mirror of
https://github.com/Redocly/redoc.git
synced 2025-08-08 14:14:56 +03:00
Add debounce for 300 ms when searching
This commit is contained in:
parent
dc5430e53d
commit
0a68db1f38
|
@ -7,6 +7,7 @@ import { MenuItem } from '../SideMenu/MenuItem';
|
||||||
import { MarkerService } from '../../services/MarkerService';
|
import { MarkerService } from '../../services/MarkerService';
|
||||||
import { SearchResult } from '../../services/SearchWorker.worker';
|
import { SearchResult } from '../../services/SearchWorker.worker';
|
||||||
|
|
||||||
|
import { bind, debounce } from 'decko';
|
||||||
import { PerfectScrollbarWrap } from '../../common-elements/perfect-scrollbar';
|
import { PerfectScrollbarWrap } from '../../common-elements/perfect-scrollbar';
|
||||||
import {
|
import {
|
||||||
ClearIcon,
|
ClearIcon,
|
||||||
|
@ -99,6 +100,14 @@ export class SearchBox extends React.PureComponent<SearchBoxProps, SearchBoxStat
|
||||||
this.props.marker.mark(term);
|
this.props.marker.mark(term);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@bind
|
||||||
|
@debounce(300)
|
||||||
|
searchCallback(searchTerm: string) {
|
||||||
|
this.props.search.search(searchTerm).then(res => {
|
||||||
|
this.setResults(res, searchTerm);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
search = (event: React.ChangeEvent<HTMLInputElement>) => {
|
search = (event: React.ChangeEvent<HTMLInputElement>) => {
|
||||||
const q = event.target.value;
|
const q = event.target.value;
|
||||||
if (q.length < 3) {
|
if (q.length < 3) {
|
||||||
|
@ -106,13 +115,12 @@ export class SearchBox extends React.PureComponent<SearchBoxProps, SearchBoxStat
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
this.setState({
|
this.setState(
|
||||||
term: q,
|
{
|
||||||
});
|
term: q,
|
||||||
|
},
|
||||||
this.props.search.search(event.target.value).then(res => {
|
() => this.searchCallback(this.state.term),
|
||||||
this.setResults(res, q);
|
);
|
||||||
});
|
|
||||||
};
|
};
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
|
|
|
@ -387,7 +387,9 @@ describe('Utils', () => {
|
||||||
expect(pluralizeType('objects (Pet)')).toEqual('objects (Pet)');
|
expect(pluralizeType('objects (Pet)')).toEqual('objects (Pet)');
|
||||||
expect(pluralizeType('strings <email>')).toEqual('strings <email>');
|
expect(pluralizeType('strings <email>')).toEqual('strings <email>');
|
||||||
expect(pluralizeType('objects or strings')).toEqual('objects or strings');
|
expect(pluralizeType('objects or strings')).toEqual('objects or strings');
|
||||||
expect(pluralizeType('objects (Pet) or numbers <int64>')).toEqual('objects (Pet) or numbers <int64>');
|
expect(pluralizeType('objects (Pet) or numbers <int64>')).toEqual(
|
||||||
|
'objects (Pet) or numbers <int64>',
|
||||||
|
);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue
Block a user