From 9c716978b3b939f12626e894c968cdaddd6fa169 Mon Sep 17 00:00:00 2001
From: rishav_dml <rishav.jaiswal@digimantra.com>
Date: Wed, 8 Jan 2025 11:27:02 +0530
Subject: [PATCH] Fixed consoles and added custom spinner

---
 src/hooks/useFetch.jsx |  1 -
 src/pages/HomePage.jsx | 11 ++++++++---
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/hooks/useFetch.jsx b/src/hooks/useFetch.jsx
index c132583..abe64ef 100644
--- a/src/hooks/useFetch.jsx
+++ b/src/hooks/useFetch.jsx
@@ -6,7 +6,6 @@ const useFetch = (url) => {
     const [loading, setLoading] = useState(false)
     const [error, setError] = useState({})
     useEffect(() => {
-        // console.log("Inside fetch")
         const fetch = async () => {
             let response;
             try {
diff --git a/src/pages/HomePage.jsx b/src/pages/HomePage.jsx
index 55981c6..36c5432 100644
--- a/src/pages/HomePage.jsx
+++ b/src/pages/HomePage.jsx
@@ -16,8 +16,6 @@ const HomePage = () => {
         url + "&s=" + searchValue + "&page=" + page
     );
 
-    console.log(page);
-
     const handlePageChange = (e) => {
         setPage(e?.target?.textContent);
     };
@@ -50,7 +48,14 @@ const HomePage = () => {
             </div>
             {data?.Search?.length > 0 && (
                 <div className="flex flex-col items-center m-10">
-                    <ClipLoader color="#fff" loading={loading} size={100} />
+                    {/* <ClipLoader color="#fff" loading={loading} size={100} /> */}
+                    {loading && (
+                        <svg
+                            className="animate-spin h-12 w-12 border-4 border-[#fff] mb-6"
+                            viewBox="0 0 24 24"
+                            fill="#fff"
+                        ></svg>
+                    )}
                     <div className="flex flex-wrap gap-4 mb-6 justify-center">
                         {data?.Search?.map((movie) => (
                             <Card key={movie?.imdbID} movie={movie} />