chore: Remove debounced search (#2625)

* Remove debounced search

* fix hover color on filter options

app/components/FilterOptions.js

@@ -76,11 +76,6 @@ const FilterOptions = ({
   );
 };
 
-const LabelWithNote = styled.div`
-  font-weight: 500;
-  text-align: left;
-`;
-
 const Note = styled(HelpText)`
   margin-top: 2px;
   margin-bottom: 0;
@@ -90,6 +85,15 @@ const Note = styled(HelpText)`
   color: ${(props) => props.theme.textTertiary};
 `;
 
+const LabelWithNote = styled.div`
+  font-weight: 500;
+  text-align: left;
+
+  &:hover ${Note} {
+    color: ${(props) => props.theme.white50};
+  }
+`;
+
 const StyledButton = styled(Button)`
   box-shadow: none;
   text-transform: none;

app/components/InputSearchPage.js

@@ -40,14 +40,20 @@ class InputSearchPage extends React.Component<Props> {
     }
   }
 
-  handleSearchInput = (ev: SyntheticInputEvent<>) => {
-    ev.preventDefault();
-    this.props.history.push(
-      searchUrl(ev.target.value, {
-        collectionId: this.props.collectionId,
-        ref: this.props.source,
-      })
-    );
+  handleKeyDown = (ev: SyntheticKeyboardEvent<HTMLInputElement>) => {
+    if (ev.key === "Enter") {
+      ev.preventDefault();
+      this.props.history.push(
+        searchUrl(ev.currentTarget.value, {
+          collectionId: this.props.collectionId,
+          ref: this.props.source,
+        })
+      );
+    }
+
+    if (this.props.onKeyDown) {
+      this.props.onKeyDown(ev);
+    }
   };
 
   handleFocus = () => {
@@ -59,7 +65,7 @@ class InputSearchPage extends React.Component<Props> {
   };
 
   render() {
-    const { t, value, onChange, onKeyDown } = this.props;
+    const { t, value, onChange } = this.props;
     const { theme, placeholder = `${t("Search")}…` } = this.props;
 
     return (
@@ -67,10 +73,9 @@ class InputSearchPage extends React.Component<Props> {
         ref={(ref) => (this.input = ref)}
         type="search"
         placeholder={placeholder}
-        onInput={this.handleSearchInput}
         value={value}
         onChange={onChange}
-        onKeyDown={onKeyDown}
+        onKeyDown={this.handleKeyDown}
         icon={
           <SearchIcon
             color={this.focused ? theme.inputBorderFocused : theme.inputBorder}