[8.10] [ML] Fix query bar not switching from KQL to Lucene and vice versa in Anomaly explorer (#163625) (#164247)

# Backport

This will backport the following commits from `main` to `8.10`:
- [[ML] Fix query bar not switching from KQL to Lucene and vice versa in
Anomaly explorer
(#163625)](https://github.com/elastic/kibana/pull/163625)

<!--- Backport version: 8.9.7 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sqren/backport)

<!--BACKPORT [{"author":{"name":"Quynh Nguyen
(Quinn)","email":"43350163+qn895@users.noreply.github.com"},"sourceCommit":{"committedDate":"2023-08-18T16:52:25Z","message":"[ML]
Fix query bar not switching from KQL to Lucene and vice versa in Anomaly
explorer
(#163625)","sha":"5cfb693701a3b26d3ea9c4879707135cf23a1e84","branchLabelMapping":{"^v8.10.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:fix",":ml","Feature:Anomaly
Detection","v8.10.0","v8.11.0"],"number":163625,"url":"https://github.com/elastic/kibana/pull/163625","mergeCommit":{"message":"[ML]
Fix query bar not switching from KQL to Lucene and vice versa in Anomaly
explorer
(#163625)","sha":"5cfb693701a3b26d3ea9c4879707135cf23a1e84"}},"sourceBranch":"main","suggestedTargetBranches":["8.11"],"targetPullRequestStates":[{"branch":"main","label":"v8.10.0","labelRegex":"^v8.10.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/163625","number":163625,"mergeCommit":{"message":"[ML]
Fix query bar not switching from KQL to Lucene and vice versa in Anomaly
explorer
(#163625)","sha":"5cfb693701a3b26d3ea9c4879707135cf23a1e84"}},{"branch":"8.11","label":"v8.11.0","labelRegex":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"}]}]
BACKPORT-->

Co-authored-by: Quynh Nguyen (Quinn) <43350163+qn895@users.noreply.github.com>
This commit is contained in:
Kibana Machine 2023-08-18 12:58:26 -04:00 committed by GitHub
parent 255dfa4a47
commit 2b5b603171
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -5,7 +5,7 @@
* 2.0.
*/
import React, { FC, useState, useEffect } from 'react';
import React, { FC, useEffect, useState } from 'react';
import { EuiCode, EuiInputPopover } from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { fromKueryExpression, luceneStringToDsl, toElasticsearchQuery } from '@kbn/es-query';
@ -78,23 +78,16 @@ export function getKqlQueryValues({
}
function getInitSearchInputState({
filterActive,
queryString,
searchInput,
}: {
filterActive: boolean;
queryString?: string;
searchInput?: Query;
}) {
if (queryString !== undefined && filterActive === true) {
return {
language: SEARCH_QUERY_LANGUAGE.KUERY,
query: queryString,
};
} else {
return {
query: '',
language: DEFAULT_QUERY_LANG,
};
}
return {
language: searchInput?.language ?? DEFAULT_QUERY_LANG,
query: queryString ?? '',
};
}
interface ExplorerQueryBarProps {
@ -129,18 +122,17 @@ export const ExplorerQueryBar: FC<ExplorerQueryBarProps> = ({
} = services;
// The internal state of the input query bar updated on every key stroke.
const [searchInput, setSearchInput] = useState<Query>(
getInitSearchInputState({ filterActive, queryString })
);
const [searchInput, setSearchInput] = useState<Query>(getInitSearchInputState({ queryString }));
const [queryErrorMessage, setQueryErrorMessage] = useState<QueryErrorMessage | undefined>(
undefined
);
useEffect(
function updateSearchInputFromFilter() {
setSearchInput(getInitSearchInputState({ filterActive, queryString }));
setSearchInput(getInitSearchInputState({ queryString, searchInput }));
},
[filterActive, queryString]
// eslint-disable-next-line react-hooks/exhaustive-deps
[queryString, searchInput.language]
);
const searchChangeHandler = (query: Query) => {