fix(1-3296): don't navigate through the list on tab (#9259)

Prevents tab from navigating you through the list of results. Instead
makes it so that the tab key always takes you to the next item in the
same hierarchy.

As a bonus: also automatically closes the menu when you navigate
away (the previous implementation has a bug where it wouldn't if you
shift-tab).

The behavior of not letting you navigate the list with tab is
consistent with native HTML select elements as well as MUI select
elements. You typically navigate them with the arrow keys.

frontend/src/component/commandBar/CommandBar.tsx

@@ -288,6 +288,10 @@ export const CommandBar = () => {
         },
     );
 
+    useKeyboardShortcut({ key: 'Tab' }, () => {
+        setShowSuggestions(false);
+    });
+
     useOnClickOutside([searchContainerRef], hideSuggestions);
     const onKeyDown = (event: React.KeyboardEvent) => {
         if (event.key === 'Escape') {
@@ -301,15 +305,6 @@ export const CommandBar = () => {
         }
     };
 
-    const onBlur = (evt: React.FocusEvent) => {
-        if (
-            evt.relatedTarget === null ||
-            !searchContainerRef.current?.contains(evt.relatedTarget)
-        ) {
-            hideSuggestions();
-        }
-    };
-
     return (
         <StyledContainer
             ref={searchContainerRef}
@@ -382,10 +377,7 @@ export const CommandBar = () => {
             <ConditionallyRender
                 condition={Boolean(value) && showSuggestions}
                 show={
-                    <CommandResultsPaper
-                        onKeyDownCapture={onKeyDown}
-                        onBlur={onBlur}
-                    >
+                    <CommandResultsPaper onKeyDownCapture={onKeyDown}>
                         {searchString !== undefined && (
                             <CommandSearchFeatures
                                 searchString={searchString}
@@ -423,10 +415,7 @@ export const CommandBar = () => {
                 }
                 elseShow={
                     showSuggestions && (
-                        <CommandResultsPaper
-                            onKeyDownCapture={onKeyDown}
-                            onBlur={onBlur}
-                        >
+                        <CommandResultsPaper onKeyDownCapture={onKeyDown}>
                             <CommandQuickSuggestions
                                 routes={allRoutes}
                                 onClick={clearSearchValue}