From dd9df474413f068b7579288f155a9dc51d9baf0e Mon Sep 17 00:00:00 2001
From: Case Delst <casedelst@gmail.com>
Date: Fri, 13 Sep 2024 15:55:04 -0700
Subject: [PATCH] fix: LaunchDevly: Search clear not clearing filter (#424)

* Fix search clear not clearing filter

* Remove logs
---
 internal/dev_server/ui/src/EnvironmentSelector.tsx | 3 ++-
 internal/dev_server/ui/src/Flags.tsx               | 4 +++-
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/internal/dev_server/ui/src/EnvironmentSelector.tsx b/internal/dev_server/ui/src/EnvironmentSelector.tsx
index 15c3b70d..f0959c4c 100644
--- a/internal/dev_server/ui/src/EnvironmentSelector.tsx
+++ b/internal/dev_server/ui/src/EnvironmentSelector.tsx
@@ -77,8 +77,9 @@ export function EnvironmentSelector({
           <Input
             id="environmentSearch"
             value={searchQuery}
-            onChange={(e) => setSearchQuery(e.target.value)}
+            onChange={(e) => setSearchQuery(e.target.value || '')}
             placeholder="Search environments..."
+            aria-label="Search environments"
           />
         </div>
         <span
diff --git a/internal/dev_server/ui/src/Flags.tsx b/internal/dev_server/ui/src/Flags.tsx
index 861af7a8..b87ae59f 100644
--- a/internal/dev_server/ui/src/Flags.tsx
+++ b/internal/dev_server/ui/src/Flags.tsx
@@ -222,7 +222,7 @@ function Flags({
       </Box>
       <Stack gap="4">
         <Inline gap="4">
-          <SearchField>
+          <SearchField aria-label="Search flags">
             <Group>
               <Icon name="search" size="small" />
               <Input
@@ -231,12 +231,14 @@ function Flags({
                   setSearchTerm(e.target.value);
                   setCurrentPage(0); // Reset pagination
                 }}
+                aria-label="Search flags input"
               />
               <IconButton
                 aria-label="clear"
                 icon="cancel-circle-outline"
                 size="small"
                 variant="minimal"
+                onPress={() => setSearchTerm('')}
               />
             </Group>
           </SearchField>