From ba80941cadc52061de9a8144ee45aa0a24023ecf Mon Sep 17 00:00:00 2001
From: Shubhit Dhiman <shubhit.dhiman@gmail.com>
Date: Mon, 15 May 2023 14:54:44 +0530
Subject: [PATCH] Allow the search filters to be cleared

Fixes #1216
---
 src/ContainerHeader.jsx | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/ContainerHeader.jsx b/src/ContainerHeader.jsx
index d8cde969d..51103912a 100644
--- a/src/ContainerHeader.jsx
+++ b/src/ContainerHeader.jsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import cockpit from 'cockpit';
 import { FormSelect, FormSelectOption } from "@patternfly/react-core/dist/esm/components/FormSelect";
-import { TextInput } from "@patternfly/react-core/dist/esm/components/TextInput";
+import { SearchInput } from "@patternfly/react-core/dist/esm/components/SearchInput";
 import { Toolbar, ToolbarContent, ToolbarItem } from "@patternfly/react-core/dist/esm/components/Toolbar";
 const _ = cockpit.gettext;
 
@@ -24,10 +24,11 @@ const ContainerHeader = ({ user, twoOwners, ownerFilter, handleOwnerChanged, tex
                     </>
                 }
                 <ToolbarItem>
-                    <TextInput id="containers-filter"
+                    <SearchInput id="containers-filter"
                                    placeholder={_("Type to filter…")}
                                    value={textFilter}
-                                   onChange={handleFilterChanged} />
+                                   onChange={(_event, value) => handleFilterChanged(value)}
+                                   onClear={() => handleFilterChanged('')} />
                 </ToolbarItem>
             </ToolbarContent>
         </Toolbar>