diff --git a/src/plugins/data/public/ui/filter_bar/filter_editor/phrase_suggestor.tsx b/src/plugins/data/public/ui/filter_bar/filter_editor/phrase_suggestor.tsx index 8e8054ac204d..719827a98cc6 100644 --- a/src/plugins/data/public/ui/filter_bar/filter_editor/phrase_suggestor.tsx +++ b/src/plugins/data/public/ui/filter_bar/filter_editor/phrase_suggestor.tsx @@ -45,6 +45,7 @@ export class PhraseSuggestorUI extends React.Com PhraseSuggestorState > { private services = this.props.kibana.services; + private abortController?: AbortController; public state: PhraseSuggestorState = { suggestions: [], isLoading: false, @@ -54,6 +55,10 @@ export class PhraseSuggestorUI extends React.Com this.updateSuggestions(); } + public componentWillUnmount() { + if (this.abortController) this.abortController.abort(); + } + protected isSuggestingValues() { const shouldSuggestValues = this.services.uiSettings.get( UI_SETTINGS.FILTERS_EDITOR_SUGGEST_VALUES @@ -67,6 +72,8 @@ export class PhraseSuggestorUI extends React.Com }; protected updateSuggestions = debounce(async (query: string = '') => { + if (this.abortController) this.abortController.abort(); + this.abortController = new AbortController(); const { indexPattern, field } = this.props as PhraseSuggestorProps; if (!field || !this.isSuggestingValues()) { return; @@ -77,6 +84,7 @@ export class PhraseSuggestorUI extends React.Com indexPattern, field, query, + signal: this.abortController.signal, }); this.setState({ suggestions, isLoading: false }); diff --git a/src/plugins/data/public/ui/query_string_input/query_string_input.tsx b/src/plugins/data/public/ui/query_string_input/query_string_input.tsx index 32295745ce21..120bbf3b68f7 100644 --- a/src/plugins/data/public/ui/query_string_input/query_string_input.tsx +++ b/src/plugins/data/public/ui/query_string_input/query_string_input.tsx @@ -95,7 +95,7 @@ export class QueryStringInputUI extends Component { public inputRef: HTMLInputElement | null = null; private persistedLog: PersistedLog | undefined; - private abortController: AbortController | undefined; + private abortController?: AbortController; private services = this.props.kibana.services; private componentIsUnmounting = false; @@ -497,6 +497,7 @@ export class QueryStringInputUI extends Component { } public componentWillUnmount() { + if (this.abortController) this.abortController.abort(); this.updateSuggestions.cancel(); this.componentIsUnmounting = true; }