From 1bf2635a344380c5d115eeafaf3e7e38a25b7dcb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C5=81ukasz=20Mierzwa?= <l.mierzwa@gmail.com>
Date: Mon, 31 Oct 2022 12:06:32 +0000
Subject: [PATCH] fix(ui): migrate to downshift 7.x

---
 .../__snapshots__/index.test.tsx.snap         | 26 +++++++------------
 .../Components/NavBar/FilterInput/index.tsx   |  6 +----
 2 files changed, 11 insertions(+), 21 deletions(-)

diff --git a/ui/src/Components/NavBar/FilterInput/__snapshots__/index.test.tsx.snap b/ui/src/Components/NavBar/FilterInput/__snapshots__/index.test.tsx.snap
index 1406eec56..5f182bbe1 100644
--- a/ui/src/Components/NavBar/FilterInput/__snapshots__/index.test.tsx.snap
+++ b/ui/src/Components/NavBar/FilterInput/__snapshots__/index.test.tsx.snap
@@ -8,13 +8,7 @@ exports[`<FilterInput /> matches snapshot with no filters 1`] = `
 >
   <div class=\\"input-group w-100 me-2 components-filterinput-outer bg-focused\\">
     <div class=\\"form-control components-filterinput border-0 rounded-0 bg-inherit\\">
-      <div
-        class=\\"autosuggest d-inline-block mw-100\\"
-        role=\\"combobox\\"
-        aria-haspopup=\\"listbox\\"
-        aria-owns=\\"downshift-0-menu\\"
-        aria-expanded=\\"false\\"
-      >
+      <div class=\\"autosuggest d-inline-block mw-100\\">
         <span class=\\"input-group-text text-muted d-inline-block me-2 border-0 bg-inherit px-1\\">
           <svg
             aria-hidden=\\"true\\"
@@ -36,11 +30,14 @@ exports[`<FilterInput /> matches snapshot with no filters 1`] = `
         <input
           class=\\"components-filterinput-wrapper text-white mw-100\\"
           size=\\"1\\"
-          id=\\"downshift-0-input\\"
+          aria-activedescendant
           aria-autocomplete=\\"list\\"
           aria-controls=\\"downshift-0-menu\\"
+          aria-expanded=\\"false\\"
           aria-labelledby=\\"downshift-0-label\\"
           autocomplete=\\"off\\"
+          id=\\"downshift-0-input\\"
+          role=\\"combobox\\"
           value
         >
       </div>
@@ -181,21 +178,18 @@ exports[`<FilterInput /> matches snapshot with some filters 1`] = `
           </path>
         </svg>
       </button>
-      <div
-        class=\\"autosuggest d-inline-block mw-100\\"
-        role=\\"combobox\\"
-        aria-haspopup=\\"listbox\\"
-        aria-owns=\\"downshift-2-menu\\"
-        aria-expanded=\\"false\\"
-      >
+      <div class=\\"autosuggest d-inline-block mw-100\\">
         <input
           class=\\"components-filterinput-wrapper text-white mw-100\\"
           size=\\"1\\"
-          id=\\"downshift-2-input\\"
+          aria-activedescendant
           aria-autocomplete=\\"list\\"
           aria-controls=\\"downshift-2-menu\\"
+          aria-expanded=\\"false\\"
           aria-labelledby=\\"downshift-2-label\\"
           autocomplete=\\"off\\"
+          id=\\"downshift-2-input\\"
+          role=\\"combobox\\"
           value
         >
       </div>
diff --git a/ui/src/Components/NavBar/FilterInput/index.tsx b/ui/src/Components/NavBar/FilterInput/index.tsx
index 8775108fd..a19240f6b 100644
--- a/ui/src/Components/NavBar/FilterInput/index.tsx
+++ b/ui/src/Components/NavBar/FilterInput/index.tsx
@@ -66,7 +66,6 @@ const FilterInput: FC<{
     isOpen,
     getMenuProps,
     getInputProps,
-    getComboboxProps,
     highlightedIndex,
     getItemProps,
     setInputValue,
@@ -155,10 +154,7 @@ const FilterInput: FC<{
               filter={filter}
             />
           ))}
-          <div
-            className="autosuggest d-inline-block mw-100"
-            {...getComboboxProps()}
-          >
+          <div className="autosuggest d-inline-block mw-100">
             {alertStore.filters.values.length ? null : (
               <span className="input-group-text text-muted d-inline-block me-2 border-0 bg-inherit px-1">
                 <FontAwesomeIcon icon={faSearch} />