From 5be4833b8da535b8036714c51f37665832d5326a Mon Sep 17 00:00:00 2001
From: RyloRiz <91710711+RyloRiz@users.noreply.github.com>
Date: Wed, 24 Jan 2024 18:41:45 -0800
Subject: [PATCH] Created an 'x' button to clear search query

---
 src/components/form/SearchBar.tsx | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/src/components/form/SearchBar.tsx b/src/components/form/SearchBar.tsx
index 05e8257d..93b5dbf7 100644
--- a/src/components/form/SearchBar.tsx
+++ b/src/components/form/SearchBar.tsx
@@ -57,6 +57,15 @@ export const SearchBarInput = forwardRef<HTMLInputElement, SearchBarProps>(
             className="w-full flex-1 bg-transparent px-4 py-4 pl-12 text-search-text placeholder-search-placeholder focus:outline-none sm:py-4 sm:pr-2"
             placeholder={props.placeholder}
           />
+
+          <div
+            onClick={() => {
+              setSearch("");
+            }}
+            className="cursor-pointer absolute bottom-0 right-5 top-0 flex max-h-14 items-center text-search-icon"
+          >
+            <Icon icon={Icons.X} />
+          </div>
         </Flare.Child>
       </Flare.Base>
     );