Kiu/VictoriaMetrics
Kiu/VictoriaMetrics
1
0
Fork 0
mirror of https://github.com/VictoriaMetrics/VictoriaMetrics.git synced 2024-11-23 20:37:12 +01:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

fix: prevent run query when selecting autocomplete option (#3480)

Browse Source
This commit is contained in:
Yury Molodov 2022-12-13 18:30:05 +01:00 committed by GitHub
parent 0d41d933e9
commit d3418bafc0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 11 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
app/vmui/packages/vmui/src/components/Configurators/QueryEditor/QueryEditor.tsx
View File

@ -1,4 +1,4 @@
import React, { FC, useRef } from "preact/compat";
import React, { FC, useRef, useState } from "preact/compat";
import { KeyboardEvent } from "react";
import { ErrorTypes } from "../../../types";
import TextField from "../../Main/TextField/TextField";
@ -32,6 +32,7 @@ const QueryEditor: FC<QueryEditorProps> = ({
disabled = false
}) => {
const [openAutocomplete, setOpenAutocomplete] = useState(false);
const autocompleteAnchorEl = useRef<HTMLDivElement>(null);
const handleSelect = (val: string) => {
@ -59,7 +60,7 @@ const QueryEditor: FC<QueryEditorProps> = ({
}
// execute query
if (enter && !shiftKey) {
if (enter && !shiftKey && !openAutocomplete) {
onEnter();
}
};
@ -84,6 +85,7 @@ const QueryEditor: FC<QueryEditorProps> = ({
options={options}
anchor={autocompleteAnchorEl}
onSelect={handleSelect}
onOpenAutocomplete={setOpenAutocomplete}
/>
)}
</div>;

8
app/vmui/packages/vmui/src/components/Main/Autocomplete/Autocomplete.tsx
View File

@ -10,7 +10,8 @@ interface AutocompleteProps {
anchor: Ref<HTMLElement>
disabled?: boolean
maxWords?: number
onSelect: (val: string) => void
onSelect: (val: string) => void,
onOpenAutocomplete?: (val: boolean) => void
}
const Autocomplete: FC<AutocompleteProps> = ({
@ -20,6 +21,7 @@ const Autocomplete: FC<AutocompleteProps> = ({
disabled,
maxWords = 1,
onSelect,
onOpenAutocomplete
}) => {
const wrapperEl = useRef<HTMLDivElement>(null);
@ -99,6 +101,10 @@ const Autocomplete: FC<AutocompleteProps> = ({
setFocusOption(-1);
}, [foundOptions]);
useEffect(() => {
onOpenAutocomplete && onOpenAutocomplete(openAutocomplete);
}, [openAutocomplete]);
useClickOutside(wrapperEl, handleCloseAutocomplete);
return (