From a6df21dcedb3dc35c5e7c915913a9155921b047d Mon Sep 17 00:00:00 2001
From: Bruno <bruno@coder.com>
Date: Fri, 1 Jul 2022 18:52:07 +0000
Subject: [PATCH 1/4] refactor: Downsize the search bar a bit

---
 .../components/SearchBarWithFilter/SearchBarWithFilter.tsx   | 5 ++++-
 site/src/theme/overrides.ts                                  | 5 +++++
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/site/src/components/SearchBarWithFilter/SearchBarWithFilter.tsx b/site/src/components/SearchBarWithFilter/SearchBarWithFilter.tsx
index 23612f08eb2c8..c788820c6fd92 100644
--- a/site/src/components/SearchBarWithFilter/SearchBarWithFilter.tsx
+++ b/site/src/components/SearchBarWithFilter/SearchBarWithFilter.tsx
@@ -112,7 +112,7 @@ export const SearchBarWithFilter: React.FC<SearchBarWithFilterProps> = ({
             className={styles.inputStyles}
             onChange={form.handleChange}
             startAdornment={
-              <InputAdornment position="start">
+              <InputAdornment position="start" className={styles.searchIcon}>
                 <SearchIcon fontSize="small" />
               </InputAdornment>
             }
@@ -184,4 +184,7 @@ const useStyles = makeStyles<Theme, StyleProps>((theme) => ({
       },
     },
   },
+  searchIcon: {
+    color: theme.palette.text.secondary,
+  },
 }))
diff --git a/site/src/theme/overrides.ts b/site/src/theme/overrides.ts
index aef07b0a95bde..b88d0857540bf 100644
--- a/site/src/theme/overrides.ts
+++ b/site/src/theme/overrides.ts
@@ -104,6 +104,11 @@ export const getOverrides = (palette: PaletteOptions) => {
           borderColor: (palette.primary as SimplePaletteColorOptions).light,
         },
       },
+
+      input: {
+        paddingTop: "inherit",
+        paddingBottom: "inherit",
+      },
     },
     MuiLink: {
       root: {

From b0e9e3e502de83dec502279ee03f503b61ffd45d Mon Sep 17 00:00:00 2001
From: Bruno <bruno@coder.com>
Date: Fri, 1 Jul 2022 19:17:49 +0000
Subject: [PATCH 2/4] Fix filter height

---
 site/src/theme/overrides.ts | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/site/src/theme/overrides.ts b/site/src/theme/overrides.ts
index b88d0857540bf..65b56d10747ec 100644
--- a/site/src/theme/overrides.ts
+++ b/site/src/theme/overrides.ts
@@ -108,6 +108,8 @@ export const getOverrides = (palette: PaletteOptions) => {
       input: {
         paddingTop: "inherit",
         paddingBottom: "inherit",
+        // The same as the button
+        minHeight: 42,
       },
     },
     MuiLink: {

From c35ab135394f2aadfeaf4286bbd16753b5450dcd Mon Sep 17 00:00:00 2001
From: Bruno <bruno@coder.com>
Date: Fri, 1 Jul 2022 19:57:16 +0000
Subject: [PATCH 3/4] Move logic to the search bar

---
 .../SearchBarWithFilter/SearchBarWithFilter.tsx           | 8 ++++++++
 site/src/theme/overrides.ts                               | 7 -------
 2 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/site/src/components/SearchBarWithFilter/SearchBarWithFilter.tsx b/site/src/components/SearchBarWithFilter/SearchBarWithFilter.tsx
index c788820c6fd92..db86e2f2792ce 100644
--- a/site/src/components/SearchBarWithFilter/SearchBarWithFilter.tsx
+++ b/site/src/components/SearchBarWithFilter/SearchBarWithFilter.tsx
@@ -110,6 +110,7 @@ export const SearchBarWithFilter: React.FC<SearchBarWithFilterProps> = ({
             value={form.values.query}
             error={!!error}
             className={styles.inputStyles}
+            classNames={{ OutlinedInput: styles.outlinedInput }}
             onChange={form.handleChange}
             startAdornment={
               <InputAdornment position="start" className={styles.searchIcon}>
@@ -183,6 +184,13 @@ const useStyles = makeStyles<Theme, StyleProps>((theme) => ({
         borderColor: (props) => props.error && theme.palette.error.contrastText,
       },
     },
+
+    "& .MuiInputBase-input": {
+      paddingTop: "inherit",
+      paddingBottom: "inherit",
+      // The same as the button
+      minHeight: 42,
+    },
   },
   searchIcon: {
     color: theme.palette.text.secondary,
diff --git a/site/src/theme/overrides.ts b/site/src/theme/overrides.ts
index 65b56d10747ec..aef07b0a95bde 100644
--- a/site/src/theme/overrides.ts
+++ b/site/src/theme/overrides.ts
@@ -104,13 +104,6 @@ export const getOverrides = (palette: PaletteOptions) => {
           borderColor: (palette.primary as SimplePaletteColorOptions).light,
         },
       },
-
-      input: {
-        paddingTop: "inherit",
-        paddingBottom: "inherit",
-        // The same as the button
-        minHeight: 42,
-      },
     },
     MuiLink: {
       root: {

From cb0c99cac660fbb554c82105bdeffcabd8c437fc Mon Sep 17 00:00:00 2001
From: Bruno <bruno@coder.com>
Date: Fri, 1 Jul 2022 20:01:31 +0000
Subject: [PATCH 4/4] Fix component

---
 site/src/components/SearchBarWithFilter/SearchBarWithFilter.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/site/src/components/SearchBarWithFilter/SearchBarWithFilter.tsx b/site/src/components/SearchBarWithFilter/SearchBarWithFilter.tsx
index db86e2f2792ce..11754467c99fd 100644
--- a/site/src/components/SearchBarWithFilter/SearchBarWithFilter.tsx
+++ b/site/src/components/SearchBarWithFilter/SearchBarWithFilter.tsx
@@ -110,7 +110,6 @@ export const SearchBarWithFilter: React.FC<SearchBarWithFilterProps> = ({
             value={form.values.query}
             error={!!error}
             className={styles.inputStyles}
-            classNames={{ OutlinedInput: styles.outlinedInput }}
             onChange={form.handleChange}
             startAdornment={
               <InputAdornment position="start" className={styles.searchIcon}>