From 7c03981bc5299356dd24ba56665a6a0700bc4711 Mon Sep 17 00:00:00 2001
From: Ivan <ivntsng@gmail.com>
Date: Thu, 7 Nov 2024 23:55:15 -0800
Subject: [PATCH 1/3] unify spinner component styling

---
 frontend/src/components/ui/Spinner.tsx | 5 +----
 1 file changed, 1 insertion(+), 4 deletions(-)

diff --git a/frontend/src/components/ui/Spinner.tsx b/frontend/src/components/ui/Spinner.tsx
index 6ce4100f..47beffde 100644
--- a/frontend/src/components/ui/Spinner.tsx
+++ b/frontend/src/components/ui/Spinner.tsx
@@ -1,10 +1,7 @@
-import { FaSpinner } from "react-icons/fa";
-
 const Spinner = (props: React.HTMLAttributes<HTMLDivElement>) => {
   return (
     <div role="status" {...props}>
-      <FaSpinner className="animate-spin" />
-      <span className="sr-only">Loading...</span>
+      <div className="animate-spin rounded-full h-6 w-6 border-b-2 border-gray-12"></div>
     </div>
   );
 };

From 868a9c112059e6eb80faf78f29fac899ef08d645 Mon Sep 17 00:00:00 2001
From: Ivan <ivntsng@gmail.com>
Date: Fri, 8 Nov 2024 00:02:31 -0800
Subject: [PATCH 2/3] Use shared Spinner component in Browse page

---
 frontend/src/components/pages/Browse.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/frontend/src/components/pages/Browse.tsx b/frontend/src/components/pages/Browse.tsx
index b5fbaf88..4b767b6d 100644
--- a/frontend/src/components/pages/Browse.tsx
+++ b/frontend/src/components/pages/Browse.tsx
@@ -16,6 +16,7 @@ import { components, paths } from "@/gen/api";
 import { useAlertQueue } from "@/hooks/useAlertQueue";
 import { useAuthentication } from "@/hooks/useAuth";
 import { useDebounce } from "@uidotdev/usehooks";
+import Spinner from "@/components/ui/Spinner";
 
 type SortOption = components["schemas"]["SortOption"];
 
@@ -179,7 +180,7 @@ const Browse = () => {
       <div ref={observerTarget} className="py-8 text-center">
         {isLoading && (
           <div className="flex items-center justify-center gap-2">
-            <div className="animate-spin rounded-full h-6 w-6 border-b-2 border-gray-12"></div>
+            <Spinner />
           </div>
         )}
       </div>

From 930a2d9bf1ff5adab82472951e51d3efe59a8757 Mon Sep 17 00:00:00 2001
From: Ivan <ivntsng@gmail.com>
Date: Fri, 8 Nov 2024 00:08:33 -0800
Subject: [PATCH 3/3] Linting

---
 frontend/src/components/pages/Browse.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/components/pages/Browse.tsx b/frontend/src/components/pages/Browse.tsx
index 4b767b6d..35320bdd 100644
--- a/frontend/src/components/pages/Browse.tsx
+++ b/frontend/src/components/pages/Browse.tsx
@@ -4,6 +4,7 @@ import { useNavigate, useSearchParams } from "react-router-dom";
 
 import ListingGrid from "@/components/listings/ListingGrid";
 import { Input } from "@/components/ui/Input/Input";
+import Spinner from "@/components/ui/Spinner";
 import { Button } from "@/components/ui/button";
 import {
   DropdownMenu,
@@ -16,7 +17,6 @@ import { components, paths } from "@/gen/api";
 import { useAlertQueue } from "@/hooks/useAlertQueue";
 import { useAuthentication } from "@/hooks/useAuth";
 import { useDebounce } from "@uidotdev/usehooks";
-import Spinner from "@/components/ui/Spinner";
 
 type SortOption = components["schemas"]["SortOption"];