Redocly/redoc
1
1
Fork 0
mirror of https://github.com/Redocly/redoc.git synced 2025-08-06 13:20:19 +03:00
Code Issues Packages Projects Releases Wiki Activity

Implement configurable min char len to init search

Browse Source
This commit is contained in:
Chintan Radia 2020-10-05 12:19:59 +05:30
parent f805271d90
commit 1c0fea02b8
2 changed files with 15 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/components/SearchBox/SearchBox.tsx
View File

@ -7,6 +7,9 @@ import { MenuItem } from '../SideMenu/MenuItem';
import { MarkerService } from '../../services/MarkerService';
import { SearchResult } from '../../services/SearchWorker.worker';
import { OptionsContext } from '../OptionsProvider';
import { RedocRawOptions } from '../../services/RedocNormalizedOptions';
import { bind, debounce } from 'decko';
import { PerfectScrollbarWrap } from '../../common-elements/perfect-scrollbar';
import {
@ -35,6 +38,8 @@ export interface SearchBoxState {
export class SearchBox extends React.PureComponent<SearchBoxProps, SearchBoxState> {
activeItemRef: MenuItem | null = null;
static contextType = OptionsContext;
constructor(props) {
super(props);
this.state = {
@ -102,14 +107,15 @@ export class SearchBox extends React.PureComponent<SearchBoxProps, SearchBoxStat
@bind
@debounce(400)
searchCallback(searchTerm: string) {
this.props.search.search(searchTerm).then(res => {
this.props.search.search(searchTerm).then((res) => {
this.setResults(res, searchTerm);
});
}
search = (event: React.ChangeEvent<HTMLInputElement>) => {
const { minCharacterLengthToInitSearch = 3 } = this.context as RedocRawOptions;
const q = event.target.value;
if (q.length < 3) {
if (q.length < minCharacterLengthToInitSearch) {
this.clearResults(q);
return;
}
@ -124,7 +130,7 @@ export class SearchBox extends React.PureComponent<SearchBoxProps, SearchBoxStat
render() {
const { activeItemIdx } = this.state;
const results = this.state.results.map(res => ({
const results = this.state.results.map((res) => ({
item: this.props.getItemById(res.meta)!,
score: res.score,
}));

7
src/services/RedocNormalizedOptions.ts
View File

@ -41,6 +41,7 @@ export interface RedocRawOptions {
expandDefaultServerVariables?: boolean;
maxDisplayedEnumValues?: number;
ignoreNamedSchemas?: string[] | string;
minCharacterLengthToInitSearch?: number;
}
function argValueToBoolean(val?: string | boolean, defaultValue?: boolean): boolean {
@ -194,6 +195,7 @@ export class RedocNormalizedOptions {
maxDisplayedEnumValues?: number;
ignoreNamedSchemas: Set<string>;
minCharacterLengthToInitSearch?: number;
constructor(raw: RedocRawOptions, defaults: RedocRawOptions = {}) {
raw = { ...defaults, ...raw };
@ -250,7 +252,10 @@ export class RedocNormalizedOptions {
this.expandDefaultServerVariables = argValueToBoolean(raw.expandDefaultServerVariables);
this.maxDisplayedEnumValues = argValueToNumber(raw.maxDisplayedEnumValues);
const ignoreNamedSchemas = Array.isArray(raw.ignoreNamedSchemas) ? raw.ignoreNamedSchemas : raw.ignoreNamedSchemas?.split(',').map(s => s.trim());
const ignoreNamedSchemas = Array.isArray(raw.ignoreNamedSchemas)
? raw.ignoreNamedSchemas
: raw.ignoreNamedSchemas?.split(',').map((s) => s.trim());
this.ignoreNamedSchemas = new Set(ignoreNamedSchemas);
this.minCharacterLengthToInitSearch = argValueToNumber(raw.minCharacterLengthToInitSearch);
}
}