fix: Fix memory leak in Navbar component by updating useSpring animation (accordproject#150)

* This is my commit message

Signed-off-by: sancheet230 <sancheet.p24@medhaviskillsuniversity.edu.in>

* Removing unwanted comments
Signed-off-by: sancheet230 <sancheet.p24@medhaviskillsuniversity.edu.in>

---------

Signed-off-by: sancheet230 <sancheet.p24@medhaviskillsuniversity.edu.in>
Signed-off-by: ansh7432 <anshsoni743@gmail.com>

Author: sancheet230

src/components/Navbar.tsx

@@ -22,21 +22,12 @@ function Navbar({ scrollToFooter }: { scrollToFooter: any }) {
   const location = useLocation();
 
   const props = useSpring({
-    to: async (next) => {
-      while (true) {
-        await next({
-          opacity: 1,
-          boxShadow: "0px 0px 5px rgba(255, 255, 255, 1)",
-        });
-        await new Promise((resolve) => setTimeout(resolve, 1000));
-        await next({
-          opacity: 0.9,
-          boxShadow: "0px 0px 0px rgba(255, 255, 255, 0)",
-        });
-        await new Promise((resolve) => setTimeout(resolve, 4000));
-      }
-    },
+    loop: true,
     from: { opacity: 0.5, boxShadow: "0px 0px 0px rgba(255, 255, 255, 0)" },
+    to: [
+      { opacity: 1, boxShadow: "0px 0px 5px rgba(255, 255, 255, 1)" },
+      { opacity: 0.9, boxShadow: "0px 0px 0px rgba(255, 255, 255, 0)" },
+    ],
     config: { duration: 1000 },
   });