fix: key to cirle_list; proper response handling in Electives.tsx;

metakgp · Jul 14, 2024 · 7938d1e · 7938d1e
1 parent c1aaf28
commit 7938d1e
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 24 deletions.
diff --git a/frontend/src/components/Circles.tsx b/frontend/src/components/Circles.tsx
@@ -23,17 +23,16 @@ let circles_list = [
 const Circles: React.FC = () => {
     return (
         <div className="circle-container">
-            {circles_list.map((x) => (
-                <>
-                    <div
-                        className="circle"
-                        style={{
-                            top: `${x.position[0]}%`,
-                            left: `${x.position[1]}%`,
-                            boxShadow: x.color,
-                        }}
-                    />
-                </>
+            {circles_list.map((x, i) => (
+                <div
+                    key={i}
+                    className="circle"
+                    style={{
+                        top: `${x.position[0]}%`,
+                        left: `${x.position[1]}%`,
+                        boxShadow: x.color,
+                    }}
+                />
             ))}
         </div>
     );

diff --git a/frontend/src/components/Electives.tsx b/frontend/src/components/Electives.tsx
@@ -8,14 +8,14 @@ const Electives: React.FC = () => {
     const { user, logout } = useAppContext();
     const [isBreadthDownloading, setIsBreadthDownloading] = useState(false);
     const [isDepthDownloading, setIsDepthDownloading] = useState(false);
+
     const getElective = async (elective: string) => {
         const formData = new URLSearchParams();
         formData.append("roll_number", user.rollNo);
-        {
-            elective == "breadth"
-                ? setIsBreadthDownloading(true)
-                : setIsDepthDownloading(true);
-        }
+
+        elective == "breadth"
+            ? setIsBreadthDownloading(true)
+            : setIsDepthDownloading(true);
 
         try {
             const res = await fetch(`${BACKEND_URL}/elective/${elective}`, {
@@ -27,12 +27,14 @@ const Electives: React.FC = () => {
                 body: formData.toString(),
             });
 
-            const resData = await res.json();
-
             if (!res.ok) {
+                const resData = await res.json();
                 toast.error(resData.message);
                 if (res.status == 401)
-                    if (resData.message == "Session isn't alive. PLease login again.")
+                    if (
+                        resData.message ==
+                        "Session isn't alive. PLease login again."
+                    )
                         logout();
                 return;
             }
@@ -51,11 +53,9 @@ const Electives: React.FC = () => {
             toast.error(`Error fetching ${elective} electives!`);
             console.error("Error fetching breadth electives:", error);
         } finally {
-            {
-                elective == "breadth"
-                    ? setIsBreadthDownloading(false)
-                    : setIsDepthDownloading(false);
-            }
+            elective == "breadth"
+                ? setIsBreadthDownloading(false)
+                : setIsDepthDownloading(false);
         }
     };