From dd0b476df9740ed973055b6eafc2c068769b7780 Mon Sep 17 00:00:00 2001
From: Aman Singh <151001715+Amansingh0807@users.noreply.github.com>
Date: Mon, 18 Nov 2024 23:51:47 +0530
Subject: [PATCH] Update Header.jsx

I removed the useEffect that had auth as a dependency, leaving only the one that runs on the initial mount to load userInfo from localStorage. This ensures userInfo is only loaded once at the start, preventing unnecessary updates. As mentioned in issue number #8
---
 client/src/components/Header.jsx | 23 ++++-------------------
 1 file changed, 4 insertions(+), 19 deletions(-)

diff --git a/client/src/components/Header.jsx b/client/src/components/Header.jsx
index d1b6e2d..6bd8de3 100644
--- a/client/src/components/Header.jsx
+++ b/client/src/components/Header.jsx
@@ -8,24 +8,7 @@ export function Header() {
   const dispatch = useDispatch();
   const auth = useSelector((state) => state.auth);
 
-  useEffect(
-    function () {
-      let userObj = localStorage.getItem("userInfo");
-      if (userObj) {
-        let userJson = JSON.parse(userObj);
-        dispatch(
-          setUserInfo({
-            username: userJson.username,
-            email: userJson.email,
-            isLoggedIn: true,
-          })
-        );
-      }
-    },
-    [auth]
-  );
-
-  useEffect(function () {
+  useEffect(() => {
     let userObj = localStorage.getItem("userInfo");
     if (userObj) {
       let userJson = JSON.parse(userObj);
@@ -37,7 +20,7 @@ export function Header() {
         })
       );
     }
-  }, []);
+  }, []); // only on component mount
 
   async function handleLogout() {
     let res = await fetch("http://localhost:3000/api/logout", {
@@ -109,3 +92,5 @@ export function Header() {
     </header>
   );
 }
+
+