diff --git a/frontend/src/component/commandBar/CommandBar.tsx b/frontend/src/component/commandBar/CommandBar.tsx index 25cb4889eaa6..98e1171f0a31 100644 --- a/frontend/src/component/commandBar/CommandBar.tsx +++ b/frontend/src/component/commandBar/CommandBar.tsx @@ -171,6 +171,12 @@ export const CommandBar = () => { debouncedSetSearchState(value); }, [searchedFlagCount]); + useEffect(() => { + if (!searchLoading) { + selectFirstItem(); + } + }, [searchLoading, searchString]); + const onSearchChange = (value: string) => { debouncedSetSearchState(value); setValue(value); @@ -265,6 +271,13 @@ export const CommandBar = () => { }, ); + const selectFirstItem = () => { + const itemsAndIndex = findCommandBarLinksAndSelectedIndex(); + if (!itemsAndIndex) return; + const { allCommandBarLinks } = itemsAndIndex; + (allCommandBarLinks[0] as HTMLElement).focus(); + }; + useOnClickOutside([searchContainerRef], hideSuggestions); const onKeyDown = (event: React.KeyboardEvent) => { if (event.key === 'Escape') {