From 4bbac9e26779a28616cfd486cc08b383898ffea5 Mon Sep 17 00:00:00 2001
From: KidCharles <sircharlyrivera@gmail.com>
Date: Sun, 17 Aug 2025 20:06:02 -0400
Subject: [PATCH 1/7] centered text and added' View Saved Sessions' button

---
 app/GradeCalculator/page.js | 32 ++++++++++++++++++--------------
 1 file changed, 18 insertions(+), 14 deletions(-)

diff --git a/app/GradeCalculator/page.js b/app/GradeCalculator/page.js
index 2157c34..01cb0bd 100644
--- a/app/GradeCalculator/page.js
+++ b/app/GradeCalculator/page.js
@@ -24,7 +24,8 @@ import {
 
 function GradeCalculator() {
   const router = useRouter();
-  // State for session title and the list of assignments
+
+  // States for session title and the list of assignments
   const [title, setTitle] = useState("");
   const [assignments, setAssignments] = useState([
     { assignment_type: "", assignment_name: "", grade: "", weight: "" },
@@ -35,11 +36,12 @@ function GradeCalculator() {
 
   // handle general changes to assignment fields
   const handleChange = (index, field, value) => {
-    // Ensure values between 0-100 for grade & weight
+    // Restrict values between 0-100 for grade & weight
     if (field === "grade" || field === "weight") {
       const num = Number(value);
       if (num < 0 || num > 100) return;
     }
+
     // Make a copy of the assignments, change the specific field in row, then update state
     const updated = [...assignments];
     updated[index][field] = value;
@@ -95,17 +97,19 @@ function GradeCalculator() {
     }
   };
 
+  // Save current session (total & calculated grade)
   const handleSaveSession = () => {
     // Check if title is empty or if there are no assignments defined
-    if (!title || assignments.length === 0) {
-      alert("Please provide a sesssion title and at least one assignment");
+    if (!title || !finalGrade) {
+      alert("Please calculate grade and provide a sesssion title before saving");
       return;
     }
 
     // Get previously saved sessions from local storage. Use empty array if no saved sessions exist (note: reason for local storage is to develop MVP for saved sessions page)
     const savedSessions =
       JSON.parse(localStorage.getItem("savedSessions")) || [];
-    // add session to the list
+
+    // add a new session to the list with a unique id
     savedSessions.push({ id: Date.now(), title, assignments });
     localStorage.setItem("savedSessions", JSON.stringify(savedSessions));
 
@@ -116,7 +120,7 @@ function GradeCalculator() {
   return (
     <div className="min-h-screen flex items-center justify-center bg-white">
       <Card className="w-full max-w-4xl p-6">
-        <CardHeader>
+        <CardHeader className="text-center">
           <CardTitle>Grade Calculator</CardTitle>
           <CardDescription>
             Enter grades and weights to calculate your grade.
@@ -132,7 +136,7 @@ function GradeCalculator() {
           />
 
           {/*Column headers */}
-          <div className="grid grid-cols-5 gap-4 font-bold">
+          <div className="grid grid-cols-5 gap-4 font-bold text-center">
             <span>Assignment Type</span>
             <span>Assignment Name</span>
             <span>Grade (%)</span>
@@ -212,22 +216,22 @@ function GradeCalculator() {
               </button>
             </div>
           ))}
+        </CardContent>
 
-          {/* Add another assignment button */}
+        {/* Footer with action buttons */}
+        <CardFooter className="flex gap-4 justify-start flex-1">
           <Button type="button" onClick={addAssignment}>
             Add Another
           </Button>
-        </CardContent>
-
-        <CardFooter className="flex flex-col items-start gap-2">
           <Button onClick={calculateGrade}>Calculate Grade</Button>
           <Button onClick={handleSaveSession}>Save Session</Button>
+          <Button onClick={() => router.push("/CalculatorSessions")}>View Saved Sessions</Button>
+        </CardFooter>
 
-          {/* Display calculated final grade */}
+          {/* Display calculated grade */}
           {finalGrade && (
-            <p className="text-lg font-bold">Final Grade: {finalGrade}</p>
+            <p className="text-lg font-bold text-center mt-4">Final Grade: {finalGrade}</p>
           )}
-        </CardFooter>
       </Card>
     </div>
   );

From a404bca5cb3a2d2c93da81b0f7657a7c88a71ace Mon Sep 17 00:00:00 2001
From: KidCharles <sircharlyrivera@gmail.com>
Date: Sun, 17 Aug 2025 20:30:46 -0400
Subject: [PATCH 2/7] Removed session card content. Added an edit button. Added
 a New Session button to redirect users to Grade Calculator page.

---
 app/CalculatorSessions/page.js | 35 ++++++++++++++++++----------------
 1 file changed, 19 insertions(+), 16 deletions(-)

diff --git a/app/CalculatorSessions/page.js b/app/CalculatorSessions/page.js
index dee60b1..6b5936a 100644
--- a/app/CalculatorSessions/page.js
+++ b/app/CalculatorSessions/page.js
@@ -10,8 +10,11 @@ import {
 } from "@/components/ui/card";
 import { Input } from "@/components/ui/input";
 import { Button } from "@/components/ui/button";
+import { useRouter } from "next/navigation";
 
 function SavedSessions() {
+  const router = useRouter();
+
   // State to store all saved sessions and user search text
   const [sessions, setSessions] = useState([]);
   const [search, setSearch] = useState("");
@@ -27,6 +30,7 @@ function SavedSessions() {
     // remove session from the session list
     const updated = sessions.filter((session) => session.id !== id);
     setSessions(updated);
+    localStorage.setItem("savedSessions", JSON.stringify(updated));
   };
 
   // Filter sessions based on user search text input (note: case-insensitive)
@@ -36,8 +40,11 @@ function SavedSessions() {
 
   return (
     <div className="min-h-screen flex flex-col items-center bg-white p-6">
-      {/* Page Title*/}
-      <h1 className="text-2xl font-bold mb-4">Saved Sessions</h1>
+      {/* Page Title and "Save Session" button aligned right*/}
+      <div className= "relative w-full max-w-4xl mb-4 h-10 flex items-center">
+        <h1 className="absolute left-1/2 -translate-x-1/2 text-2xl font-bold">Saved Sessions</h1>
+        <Button className="ml-auto" onClick={() => router.push("/GradeCalculator")}>New Session</Button>
+      </div>
 
       {/* Search Input */}
       <Input
@@ -59,22 +66,18 @@ function SavedSessions() {
               <CardHeader>
                 <CardTitle>{session.title}</CardTitle>
               </CardHeader>
-
-              {/* Assignments within session card */}
-              <CardContent>
-                {session.assignments.map((a, i) => (
-                  <div key={i} className="flex gap-4">
-                    <span>{a.assignment_type}</span>
-                    <span>{a.assignment_name}</span>
-                    <span>{a.grade} %</span>
-                    <span>{a.weight}%</span>
-                  </div>
-                ))}
-              </CardContent>
+              {/* Show calculated grade within session card*/}
+              {session.finalGrade && (
+                <p className="text-sm font-semibold">
+                  Final Grade: {session.finalGrade}
+                </p>
+              )}
             </div>
 
-            {/* Delete button and trash icon*/}
-            <CardFooter>
+            {/* Edit and Delete button via trash icon*/}
+            <CardFooter className="flex gap-3">
+              <Button variant="outline">Edit</Button>
+
               <button
                 type="button"
                 onClick={() => handleDelete(session.id)}

From 11f6a8d586e5db4bece4974b76436a933476b3c9 Mon Sep 17 00:00:00 2001
From: KidCharles <sircharlyrivera@gmail.com>
Date: Mon, 18 Aug 2025 12:14:17 -0400
Subject: [PATCH 3/7] axios.post call

---
 app/GradeCalculator/page.js | 31 ++++++++++++++++++++-----------
 1 file changed, 20 insertions(+), 11 deletions(-)

diff --git a/app/GradeCalculator/page.js b/app/GradeCalculator/page.js
index 01cb0bd..8d2584a 100644
--- a/app/GradeCalculator/page.js
+++ b/app/GradeCalculator/page.js
@@ -1,6 +1,7 @@
 "use client";
 
 import React, { useState, useEffect } from "react";
+import axios from "axios"
 import { useRouter } from "next/navigation";
 
 import {
@@ -98,23 +99,31 @@ function GradeCalculator() {
   };
 
   // Save current session (total & calculated grade)
-  const handleSaveSession = () => {
+  const handleSaveSession = async () => {
     // Check if title is empty or if there are no assignments defined
     if (!title || !finalGrade) {
       alert("Please calculate grade and provide a sesssion title before saving");
       return;
     }
 
-    // Get previously saved sessions from local storage. Use empty array if no saved sessions exist (note: reason for local storage is to develop MVP for saved sessions page)
-    const savedSessions =
-      JSON.parse(localStorage.getItem("savedSessions")) || [];
-
-    // add a new session to the list with a unique id
-    savedSessions.push({ id: Date.now(), title, assignments });
-    localStorage.setItem("savedSessions", JSON.stringify(savedSessions));
-
-    // redirect to saved sessions page
-    router.push("/CalculatorSessions");
+    try {
+      // POST axios call to new-grade-entry
+      for (let assignment of assignments) {
+        await axios.post("/api/Calculator/new-grade-entry", {
+          user_id: 1,
+          assignment_type: assignment.assignment_type,
+          assignment_name: assignment.assignment_name,
+          assignment_grade: assignment.grade,
+          assignment_weight: assignment.weight,
+        });
+       }
+
+       // After saving to db, redirect user to saved sessions page
+       router.push("/CalculatorSessions");
+      } catch(error) {
+        console.error("Error saving grade entry: ", error);
+        alert("Failed to save session. Please try again.");
+      }
   };
 
   return (

From d1975b307a9688c238ca36bb845c730377cc2ea2 Mon Sep 17 00:00:00 2001
From: KidCharles <sircharlyrivera@gmail.com>
Date: Mon, 18 Aug 2025 12:40:26 -0400
Subject: [PATCH 4/7] axios.get() to fetch all of user's saved sessions

---
 app/CalculatorSessions/page.js | 17 ++++++++++++++---
 1 file changed, 14 insertions(+), 3 deletions(-)

diff --git a/app/CalculatorSessions/page.js b/app/CalculatorSessions/page.js
index 6b5936a..3112336 100644
--- a/app/CalculatorSessions/page.js
+++ b/app/CalculatorSessions/page.js
@@ -1,6 +1,7 @@
 "use client";
 
 import React, { useState, useEffect } from "react";
+import axios from "axios";
 import {
   Card,
   CardHeader,
@@ -19,10 +20,20 @@ function SavedSessions() {
   const [sessions, setSessions] = useState([]);
   const [search, setSearch] = useState("");
 
-  // Utilize local storage to load saved sessions
+  // axios call to fetch user's saved sessions
   useEffect(() => {
-    const saved = JSON.parse(localStorage.getItem("savedSessions")) || [];
-    setSessions(saved);
+    const fetchSessions = async () => {
+      try {
+        const userId = 1;
+        const response = await axios.get(`/api/Calculator/grade-entries/${userId}`);
+        setSessions(response.data);
+      } catch (error) {
+        console.error("Error fetching saved sessions: ", error);
+        setSessions([]);
+      }
+    };
+
+    fetchSessions();
   }, []);
 
   // Function to delete a session via ID

From 7b8bc40284dde7334aa6f5b75ad1f3046d654918 Mon Sep 17 00:00:00 2001
From: KidCharles <sircharlyrivera@gmail.com>
Date: Mon, 18 Aug 2025 14:22:05 -0400
Subject: [PATCH 5/7] PUT axios call. Populating pre-existing assignment row
 values. Ability to update assignment rows

---
 app/CalculatorSessions/page.js | 20 ++++++++---
 app/GradeCalculator/page.js    | 61 ++++++++++++++++++++++++++++------
 2 files changed, 66 insertions(+), 15 deletions(-)

diff --git a/app/CalculatorSessions/page.js b/app/CalculatorSessions/page.js
index 3112336..decc3f7 100644
--- a/app/CalculatorSessions/page.js
+++ b/app/CalculatorSessions/page.js
@@ -36,13 +36,23 @@ function SavedSessions() {
     fetchSessions();
   }, []);
 
-  // Function to delete a session via ID
-  const handleDelete = (id) => {
+  // axios function to delete a session via ID
+  const handleDelete = async (id) => {
+  try {
+    await axios.delete(`/api/Calculator/grade-entry/${id}`);
     // remove session from the session list
     const updated = sessions.filter((session) => session.id !== id);
     setSessions(updated);
-    localStorage.setItem("savedSessions", JSON.stringify(updated));
-  };
+  } catch (error) {
+    console.error("Error deleting session: ", error);
+    alert("Failed to delete session. Please try again.");
+  }
+};
+
+// handle edit by redirecting user to Grade Calculator via entry ID 
+const handleEdit = (id) => {
+  router.push(`/GradeCalculator?editId=$[id]`);
+};
 
   // Filter sessions based on user search text input (note: case-insensitive)
   const filteredSessions = sessions.filter((session) =>
@@ -87,7 +97,7 @@ function SavedSessions() {
 
             {/* Edit and Delete button via trash icon*/}
             <CardFooter className="flex gap-3">
-              <Button variant="outline">Edit</Button>
+              <Button variant="outline" onClick={() => handleEdit(session.id)}>Edit</Button>
 
               <button
                 type="button"
diff --git a/app/GradeCalculator/page.js b/app/GradeCalculator/page.js
index 8d2584a..a7e330c 100644
--- a/app/GradeCalculator/page.js
+++ b/app/GradeCalculator/page.js
@@ -25,6 +25,8 @@ import {
 
 function GradeCalculator() {
   const router = useRouter();
+  const searchParams = useSearchParams();
+  const editTitle = searchParams.get("editTitle");
 
   // States for session title and the list of assignments
   const [title, setTitle] = useState("");
@@ -35,6 +37,38 @@ function GradeCalculator() {
   // state to hold calculated final grade
   const [finalGrade, setFinalGrade] = useState(null);
 
+  // fetch assignments for editing if editTitle is present
+  useEffect(() => {
+    if (editTitle) {
+      const fetchSessionAssignments = async () => {
+        try {
+          const userId = 1; // hardcoded for now
+          const response = await axios.get(`/api/Calculator/grade-entries/${userId}`);
+          // filter assignments matching this session title
+          const sessionAssignments = response.data.filter(
+            (a) => a.session_title === editTitle
+          );
+          if (sessionAssignments.length) {
+            setTitle(editTitle);
+            // map assignments and include `id` for PUT updates
+            setAssignments(
+              sessionAssignments.map((a) => ({
+                id: a.id,
+                assignment_type: a.assignment_type,
+                assignment_name: a.assignment_name,
+                grade: a.assignment_grade,
+                weight: a.assignment_weight,
+              }))
+            );
+          }
+        } catch (error) {
+          console.error("Error fetching session for edit:", error);
+        }
+      };
+      fetchSessionAssignments();
+    }
+  }, [editTitle]);
+
   // handle general changes to assignment fields
   const handleChange = (index, field, value) => {
     // Restrict values between 0-100 for grade & weight
@@ -107,16 +141,23 @@ function GradeCalculator() {
     }
 
     try {
-      // POST axios call to new-grade-entry
       for (let assignment of assignments) {
-        await axios.post("/api/Calculator/new-grade-entry", {
-          user_id: 1,
-          assignment_type: assignment.assignment_type,
-          assignment_name: assignment.assignment_name,
-          assignment_grade: assignment.grade,
-          assignment_weight: assignment.weight,
-        });
-       }
+        if (assignment.id) {
+          await axios.put(`/api/Calculator/grade-entry/${editId}`, {
+            assignment_grade: assignment.grade,
+            assignment_weight: assignment.weight,
+          });
+        } else {
+          // POST axios call to new-grade-entry. "If not editing, then create new session
+            await axios.post("/api/Calculator/new-grade-entry", {
+              user_id: 1,
+              assignment_type: assignment.assignment_type,
+              assignment_name: assignment.assignment_name,
+              assignment_grade: assignment.grade,
+              assignment_weight: assignment.weight,
+            });
+          }
+        }
 
        // After saving to db, redirect user to saved sessions page
        router.push("/CalculatorSessions");
@@ -124,7 +165,7 @@ function GradeCalculator() {
         console.error("Error saving grade entry: ", error);
         alert("Failed to save session. Please try again.");
       }
-  };
+    };
 
   return (
     <div className="min-h-screen flex items-center justify-center bg-white">

From 741d44106c6c032f17c5f555dde0149065eebce4 Mon Sep 17 00:00:00 2001
From: KidCharles <sircharlyrivera@gmail.com>
Date: Tue, 19 Aug 2025 16:27:04 -0400
Subject: [PATCH 6/7] frontend fixes

---
 app/CalculatorSessions/page.js | 153 ++++++++++++++++-----------------
 app/GradeCalculator/page.js    |  15 ++--
 2 files changed, 82 insertions(+), 86 deletions(-)

diff --git a/app/CalculatorSessions/page.js b/app/CalculatorSessions/page.js
index decc3f7..4359c27 100644
--- a/app/CalculatorSessions/page.js
+++ b/app/CalculatorSessions/page.js
@@ -18,41 +18,43 @@ function SavedSessions() {
 
   // State to store all saved sessions and user search text
   const [sessions, setSessions] = useState([]);
+  const [grades, setGrades] = useState([]);
   const [search, setSearch] = useState("");
 
-  // axios call to fetch user's saved sessions
+  const fetchGrades = async () => {
+    try {
+      const userId = 1;
+      const response = await axios.get(
+        `http://localhost:8080/api/grade-calculator/grade-entries/${userId}`
+      );
+      console.log(response.data);
+      setGrades(response.data);
+    } catch (error) {
+      console.error("Error fetching saved sessions: ", error);
+      // setSessions([]);
+    }
+  };
   useEffect(() => {
-    const fetchSessions = async () => {
-      try {
-        const userId = 1;
-        const response = await axios.get(`/api/Calculator/grade-entries/${userId}`);
-        setSessions(response.data);
-      } catch (error) {
-        console.error("Error fetching saved sessions: ", error);
-        setSessions([]);
-      }
-    };
-
-    fetchSessions();
+    fetchGrades();
   }, []);
 
   // axios function to delete a session via ID
   const handleDelete = async (id) => {
-  try {
-    await axios.delete(`/api/Calculator/grade-entry/${id}`);
-    // remove session from the session list
-    const updated = sessions.filter((session) => session.id !== id);
-    setSessions(updated);
-  } catch (error) {
-    console.error("Error deleting session: ", error);
-    alert("Failed to delete session. Please try again.");
-  }
-};
+    try {
+      await axios.delete(`http://localhost:8080/api/grade-calculator/grade-entry/${id}`);
+      // remove session from the session list
+      const updated = grades.filter((grade) => grade.id !== id);
+      setGrades(updated);
+    } catch (error) {
+      console.error("Error deleting session: ", error);
+      alert("Failed to delete session. Please try again.");
+    }
+  };
 
-// handle edit by redirecting user to Grade Calculator via entry ID 
-const handleEdit = (id) => {
-  router.push(`/GradeCalculator?editId=$[id]`);
-};
+  // handle edit by redirecting user to Grade Calculator via entry ID
+  const handleEdit = (id) => {
+    router.push(`/GradeCalculator?editId=$[id]`);
+  };
 
   // Filter sessions based on user search text input (note: case-insensitive)
   const filteredSessions = sessions.filter((session) =>
@@ -62,74 +64,63 @@ const handleEdit = (id) => {
   return (
     <div className="min-h-screen flex flex-col items-center bg-white p-6">
       {/* Page Title and "Save Session" button aligned right*/}
-      <div className= "relative w-full max-w-4xl mb-4 h-10 flex items-center">
-        <h1 className="absolute left-1/2 -translate-x-1/2 text-2xl font-bold">Saved Sessions</h1>
-        <Button className="ml-auto" onClick={() => router.push("/GradeCalculator")}>New Session</Button>
+      <div className="relative w-full max-w-4xl mb-4 h-10 flex items-center">
+        <h1 className="absolute left-1/2 -translate-x-1/2 text-2xl font-bold">
+          Saved Assignments
+        </h1>
+        <Button
+          className="ml-auto"
+          onClick={() => router.push("/GradeCalculator")}
+        >
+          New Session
+        </Button>
       </div>
 
       {/* Search Input */}
       <Input
         type="text"
-        placeholder="Search by session title"
+        placeholder="Search by assignment title"
         value={search}
         onChange={(e) => setSearch(e.target.value)}
         className="mb-4 w-full max-w-lg"
       />
 
       {/* List of filtered sessions */}
-      <div className="w-full max-w-4xl space-y-4">
-        {filteredSessions.map((session) => (
-          <Card
-            key={session.id}
-            className="p-4 flex justify-between items-center"
-          >
-            <div>
-              <CardHeader>
-                <CardTitle>{session.title}</CardTitle>
-              </CardHeader>
-              {/* Show calculated grade within session card*/}
-              {session.finalGrade && (
-                <p className="text-sm font-semibold">
-                  Final Grade: {session.finalGrade}
-                </p>
-              )}
-            </div>
-
-            {/* Edit and Delete button via trash icon*/}
-            <CardFooter className="flex gap-3">
-              <Button variant="outline" onClick={() => handleEdit(session.id)}>Edit</Button>
+      {/* List of assignments */}
+<div className="w-full max-w-4xl space-y-4">
+  {grades.map((grade) => (
+    <Card key={grade.id} className="p-4 shadow-md rounded-2xl hover:shadow-lg transition">
+      <CardHeader>
+        <CardTitle className="text-lg font-semibold text-gray-800">
+          {grade.assignment_name}
+        </CardTitle>
+      </CardHeader>
+      <CardContent className="text-sm text-gray-600 space-y-1">
+        <p><span className="font-medium">Grade:</span> {grade.assignment_grade ?? "N/A"}</p>
+        <p><span className="font-medium">Weight:</span> {grade.assignment_weight ?? "N/A"}%</p>
+      </CardContent>
+      <CardFooter className="flex justify-end gap-3">
+        <Button variant="outline" size="sm" onClick={() => handleEdit(grade.id)}>
+          Edit
+        </Button>
+        <Button
+          variant="destructive"
+          size="sm"
+          onClick={() => handleDelete(grade.id)}
+        >
+          Delete
+        </Button>
+      </CardFooter>
+    </Card>
+  ))}
 
-              <button
-                type="button"
-                onClick={() => handleDelete(session.id)}
-                className="text-red-500 hover:text-red-700"
-              >
-                <svg
-                  xmlns="http://www.w3.org/2000/svg"
-                  className="h-6 w-6"
-                  fill="none"
-                  viewBox="0 0 24 24"
-                  stroke="currentColor"
-                >
-                  <path
-                    strokeLinecap="round"
-                    strokeLinejoin="round"
-                    strokeWidth={2}
-                    d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5-4h4m-4 0a1 1 0 00-1 1v1h6V4a1 1 0 00-1-1m-4 0h4"
-                  />
-                </svg>
-              </button>
-            </CardFooter>
-          </Card>
-        ))}
+  {grades.length === 0 && (
+    <p className="text-center text-gray-500">No grades found.</p>
+  )}
+</div>
 
-        {/* Message to user when no sessions match their text search*/}
-        {filteredSessions.length === 0 && (
-          <p className="text-center text-gray-500">No sessions found.</p>
-        )}
-      </div>
     </div>
   );
 }
 
-export default SavedSessions;
\ No newline at end of file
+export default SavedSessions;
diff --git a/app/GradeCalculator/page.js b/app/GradeCalculator/page.js
index a7e330c..1a3c2ae 100644
--- a/app/GradeCalculator/page.js
+++ b/app/GradeCalculator/page.js
@@ -25,8 +25,13 @@ import {
 
 function GradeCalculator() {
   const router = useRouter();
-  const searchParams = useSearchParams();
-  const editTitle = searchParams.get("editTitle");
+  const [editTitle, setEditTitle] = useState(null);
+
+  useEffect(() => {
+    const params = new URLSearchParams(window.location.search);
+    const title = params.get("editTitle");
+    if (title) setEditTitle(title);
+  }, []);
 
   // States for session title and the list of assignments
   const [title, setTitle] = useState("");
@@ -43,7 +48,7 @@ function GradeCalculator() {
       const fetchSessionAssignments = async () => {
         try {
           const userId = 1; // hardcoded for now
-          const response = await axios.get(`/api/Calculator/grade-entries/${userId}`);
+          const response = await axios.get(`http://localhost:8080/api/grade-calculator/grade-entries/${userId}`);
           // filter assignments matching this session title
           const sessionAssignments = response.data.filter(
             (a) => a.session_title === editTitle
@@ -143,13 +148,13 @@ function GradeCalculator() {
     try {
       for (let assignment of assignments) {
         if (assignment.id) {
-          await axios.put(`/api/Calculator/grade-entry/${editId}`, {
+          await axios.put(`http://localhost:8080/api/Calculator/grade-entry`, {
             assignment_grade: assignment.grade,
             assignment_weight: assignment.weight,
           });
         } else {
           // POST axios call to new-grade-entry. "If not editing, then create new session
-            await axios.post("/api/Calculator/new-grade-entry", {
+            await axios.post(`http://localhost:8080/api/grade-calculator/new-grade-entry`, {
               user_id: 1,
               assignment_type: assignment.assignment_type,
               assignment_name: assignment.assignment_name,

From f82c9a0c8760d59982220388bb717b6379632664 Mon Sep 17 00:00:00 2001
From: KidCharles <sircharlyrivera@gmail.com>
Date: Tue, 19 Aug 2025 21:10:58 -0400
Subject: [PATCH 7/7] fixes axios calls and removed session functionality :(

---
 app/CalculatorSessions/page.js |  91 ++++++-----
 app/GradeCalculator/page.js    | 265 ++++++++++++++++++---------------
 components/NavBar.jsx          |   1 +
 3 files changed, 198 insertions(+), 159 deletions(-)

diff --git a/app/CalculatorSessions/page.js b/app/CalculatorSessions/page.js
index 4359c27..60cc14e 100644
--- a/app/CalculatorSessions/page.js
+++ b/app/CalculatorSessions/page.js
@@ -41,7 +41,9 @@ function SavedSessions() {
   // axios function to delete a session via ID
   const handleDelete = async (id) => {
     try {
-      await axios.delete(`http://localhost:8080/api/grade-calculator/grade-entry/${id}`);
+      await axios.delete(
+        `http://localhost:8080/api/grade-calculator/grade-entry/${id}`
+      );
       // remove session from the session list
       const updated = grades.filter((grade) => grade.id !== id);
       setGrades(updated);
@@ -56,9 +58,9 @@ function SavedSessions() {
     router.push(`/GradeCalculator?editId=$[id]`);
   };
 
-  // Filter sessions based on user search text input (note: case-insensitive)
-  const filteredSessions = sessions.filter((session) =>
-    session.title.toLowerCase().includes(search.toLowerCase())
+  // Filter assignments based on user search text input (note: case-insensitive)
+  const filteredGrades = grades.filter((grade) =>
+    grade.assignment_name.toLowerCase().includes(search.toLowerCase())
   );
 
   return (
@@ -72,7 +74,7 @@ function SavedSessions() {
           className="ml-auto"
           onClick={() => router.push("/GradeCalculator")}
         >
-          New Session
+          New Assignment
         </Button>
       </div>
 
@@ -85,40 +87,55 @@ function SavedSessions() {
         className="mb-4 w-full max-w-lg"
       />
 
-      {/* List of filtered sessions */}
       {/* List of assignments */}
-<div className="w-full max-w-4xl space-y-4">
-  {grades.map((grade) => (
-    <Card key={grade.id} className="p-4 shadow-md rounded-2xl hover:shadow-lg transition">
-      <CardHeader>
-        <CardTitle className="text-lg font-semibold text-gray-800">
-          {grade.assignment_name}
-        </CardTitle>
-      </CardHeader>
-      <CardContent className="text-sm text-gray-600 space-y-1">
-        <p><span className="font-medium">Grade:</span> {grade.assignment_grade ?? "N/A"}</p>
-        <p><span className="font-medium">Weight:</span> {grade.assignment_weight ?? "N/A"}%</p>
-      </CardContent>
-      <CardFooter className="flex justify-end gap-3">
-        <Button variant="outline" size="sm" onClick={() => handleEdit(grade.id)}>
-          Edit
-        </Button>
-        <Button
-          variant="destructive"
-          size="sm"
-          onClick={() => handleDelete(grade.id)}
-        >
-          Delete
-        </Button>
-      </CardFooter>
-    </Card>
-  ))}
-
-  {grades.length === 0 && (
-    <p className="text-center text-gray-500">No grades found.</p>
-  )}
-</div>
+      <div className="w-full max-w-4xl space-y-4">
+        {filteredGrades.map((grade) => (
+          <Card
+            key={grade.id}
+            className="p-4 shadow-md rounded-2xl hover:shadow-lg transition"
+          >
+            <CardHeader>
+              <CardTitle className="text-lg font-semibold text-gray-800 text-center">
+                {grade.assignment_name}
+              </CardTitle>
+            </CardHeader>
+            <CardContent className="text-sm text-gray-600 space-y-1 text-center">
+              <p>
+                <span className="font-medium">Assignment Type:</span>{" "}
+                {grade.assignment_type ?? "N/A"}
+              </p>
+              <p>
+                <span className="font-medium">Grade:</span>{" "}
+                {grade.assignment_grade ?? "N/A"}
+              </p>
+              <p>
+                <span className="font-medium">Weight:</span>{" "}
+                {grade.assignment_weight ?? "N/A"}%
+              </p>
+            </CardContent>
+            <CardFooter className="flex justify-end gap-3">
+              {/* <Button
+                variant="outline"
+                size="sm"
+                onClick={() => handleEdit(grade.id)}
+              >
+                Edit
+              </Button> */}
+              <Button
+                variant="destructive"
+                size="sm"
+                onClick={() => handleDelete(grade.id)}
+              >
+                Delete
+              </Button>
+            </CardFooter>
+          </Card>
+        ))}
 
+        {grades.length === 0 && (
+          <p className="text-center text-gray-500">No grades found.</p>
+        )}
+      </div>
     </div>
   );
 }
diff --git a/app/GradeCalculator/page.js b/app/GradeCalculator/page.js
index 1a3c2ae..69af2b2 100644
--- a/app/GradeCalculator/page.js
+++ b/app/GradeCalculator/page.js
@@ -1,27 +1,27 @@
 "use client";
 
-import React, { useState, useEffect } from "react";
-import axios from "axios"
+import axios from "axios";
 import { useRouter } from "next/navigation";
+import { useEffect, useState } from "react";
 
 import {
   Card,
-  CardHeader,
-  CardTitle,
-  CardDescription,
   CardContent,
+  CardDescription,
   CardFooter,
+  CardHeader,
+  CardTitle,
 } from "@/components/ui/card";
 
-import { Input } from "@/components/ui/input";
 import { Button } from "@/components/ui/button";
 import {
   CalculatorSelect,
-  CalculatorSelectTrigger,
   CalculatorSelectContent,
   CalculatorSelectItem,
+  CalculatorSelectTrigger,
   CalculatorSelectValue,
 } from "@/components/ui/calculator-select";
+import { Input } from "@/components/ui/input";
 
 function GradeCalculator() {
   const router = useRouter();
@@ -48,7 +48,9 @@ function GradeCalculator() {
       const fetchSessionAssignments = async () => {
         try {
           const userId = 1; // hardcoded for now
-          const response = await axios.get(`http://localhost:8080/api/grade-calculator/grade-entries/${userId}`);
+          const response = await axios.get(
+            `http://localhost:8080/api/grade-calculator/grade-entries/${userId}`
+          );
           // filter assignments matching this session title
           const sessionAssignments = response.data.filter(
             (a) => a.session_title === editTitle
@@ -141,7 +143,9 @@ function GradeCalculator() {
   const handleSaveSession = async () => {
     // Check if title is empty or if there are no assignments defined
     if (!title || !finalGrade) {
-      alert("Please calculate grade and provide a sesssion title before saving");
+      alert(
+        "Please calculate grade and provide a sesssion title before saving"
+      );
       return;
     }
 
@@ -154,141 +158,158 @@ function GradeCalculator() {
           });
         } else {
           // POST axios call to new-grade-entry. "If not editing, then create new session
-            await axios.post(`http://localhost:8080/api/grade-calculator/new-grade-entry`, {
+          await axios.post(
+            `http://localhost:8080/api/grade-calculator/new-grade-entry`,
+            {
               user_id: 1,
               assignment_type: assignment.assignment_type,
               assignment_name: assignment.assignment_name,
               assignment_grade: assignment.grade,
               assignment_weight: assignment.weight,
-            });
-          }
+            }
+          );
         }
-
-       // After saving to db, redirect user to saved sessions page
-       router.push("/CalculatorSessions");
-      } catch(error) {
-        console.error("Error saving grade entry: ", error);
-        alert("Failed to save session. Please try again.");
       }
-    };
+
+      // After saving to db, redirect user to saved assignments page
+      router.push("/CalculatorSessions");
+    } catch (error) {
+      console.error("Error saving grade entry: ", error);
+      alert("Failed to save assignment(s). Please try again.");
+    }
+  };
 
   return (
-    <div className="min-h-screen flex items-center justify-center bg-white">
-      <Card className="w-full max-w-4xl p-6">
-        <CardHeader className="text-center">
-          <CardTitle>Grade Calculator</CardTitle>
-          <CardDescription>
-            Enter grades and weights to calculate your grade.
-          </CardDescription>
-        </CardHeader>
+      <div className="min-h-screen flex items-center justify-center bg-white">
+        <Card className="w-full max-w-4xl p-6">
+          <CardHeader className="text-center">
+            <CardTitle>Grade Calculator</CardTitle>
+            <CardDescription>
+              Enter grades and weights to calculate your grade.
+            </CardDescription>
+          </CardHeader>
 
-        <CardContent className="space-y-4">
-          <Input
-            type="text"
-            placeholder="Session Title (e.g., Math 101)"
-            value={title}
-            onChange={(e) => setTitle(e.target.value)}
-          />
+          <CardContent className="space-y-4">
+            <Input
+              type="text"
+              placeholder="Course Title (e.g., Math 101)"
+              value={title}
+              onChange={(e) => setTitle(e.target.value)}
+            />
 
-          {/*Column headers */}
-          <div className="grid grid-cols-5 gap-4 font-bold text-center">
-            <span>Assignment Type</span>
-            <span>Assignment Name</span>
-            <span>Grade (%)</span>
-            <span>Weight (%)</span>
-            {/* trash icon column */}
-            <span></span>
-          </div>
+            {/*Column headers */}
+            <div className="grid grid-cols-5 gap-4 font-bold text-center">
+              <span>Assignment Type</span>
+              <span>Assignment Name</span>
+              <span>Grade (%)</span>
+              <span>Weight (%)</span>
+              {/* trash icon column */}
+              <span></span>
+            </div>
 
-          {/* Assignment rows */}
-          {assignments.map((assignments, index) => (
-            <div key={index} className="grid grid-cols-5 gap-4 items-center">
-              {/* Assignment type dropdown */}
-              <CalculatorSelect
-                value={assignments.assignment_type}
-                onValueChange={(value) =>
-                  handleChange(index, "assignment_type", value)
-                }
-              >
-                <CalculatorSelectTrigger>
-                  <CalculatorSelectValue placeholder="Select Type" />
-                </CalculatorSelectTrigger>
-                <CalculatorSelectContent>
-                  <CalculatorSelectItem value="Homework">Homework</CalculatorSelectItem>
-                  <CalculatorSelectItem value="Quiz">Quiz</CalculatorSelectItem>
-                  <CalculatorSelectItem value="Midterm">Midterm</CalculatorSelectItem>
-                  <CalculatorSelectItem value="Final Exam">Final Exam</CalculatorSelectItem>
-                </CalculatorSelectContent>
-              </CalculatorSelect>
+            {/* Assignment rows */}
+            {assignments.map((assignments, index) => (
+              <div key={index} className="grid grid-cols-5 gap-4 items-center">
+                {/* Assignment type dropdown */}
+                <CalculatorSelect
+                  value={assignments.assignment_type}
+                  onValueChange={(value) =>
+                    handleChange(index, "assignment_type", value)
+                  }
+                >
+                  <CalculatorSelectTrigger>
+                    <CalculatorSelectValue placeholder="Select Type" />
+                  </CalculatorSelectTrigger>
+                  <CalculatorSelectContent>
+                    <CalculatorSelectItem value="Homework">
+                      Homework
+                    </CalculatorSelectItem>
+                    <CalculatorSelectItem value="Quiz">
+                      Quiz
+                    </CalculatorSelectItem>
+                    <CalculatorSelectItem value="Midterm">
+                      Midterm
+                    </CalculatorSelectItem>
+                    <CalculatorSelectItem value="Final Exam">
+                      Final Exam
+                    </CalculatorSelectItem>
+                  </CalculatorSelectContent>
+                </CalculatorSelect>
 
-              {/* Assignment Name Input*/}
-              <Input
-                type="text"
-                placeholder="Assignment Name"
-                value={assignments.assignment_name}
-                onChange={(e) =>
-                  handleChange(index, "assignment_name", e.target.value)
-                }
-              />
+                {/* Assignment Name Input*/}
+                <Input
+                  type="text"
+                  placeholder="Assignment Name"
+                  value={assignments.assignment_name}
+                  onChange={(e) =>
+                    handleChange(index, "assignment_name", e.target.value)
+                  }
+                />
 
-              {/* Grade Input */}
-              <Input
-                type="number"
-                placeholder="Grade (%)"
-                value={assignments.grade}
-                onChange={(e) => handleChange(index, "grade", e.target.value)}
-              />
+                {/* Grade Input */}
+                <Input
+                  type="number"
+                  placeholder="Grade (%)"
+                  value={assignments.grade}
+                  onChange={(e) => handleChange(index, "grade", e.target.value)}
+                />
 
-              {/* Weight Input */}
-              <Input
-                type="number"
-                placeholder="Weight (%)"
-                value={assignments.weight}
-                onChange={(e) => handleChange(index, "weight", e.target.value)}
-              />
+                {/* Weight Input */}
+                <Input
+                  type="number"
+                  placeholder="Weight (%)"
+                  value={assignments.weight}
+                  onChange={(e) =>
+                    handleChange(index, "weight", e.target.value)
+                  }
+                />
 
-              {/* Delete assignment button */}
-              <button
-                type="button"
-                onClick={() => removeAssignment(index)}
-                className="text-red-500 hover:text-red-700"
-              >
-                {/* trash icon */}
-                <svg
-                  xmlns="http://www.w3.org/2000/svg"
-                  className="h-6 w-6"
-                  fill="none"
-                  viewBox="0 0 24 24"
-                  stroke="currentColor"
+                {/* Delete assignment button */}
+                <button
+                  type="button"
+                  onClick={() => removeAssignment(index)}
+                  className="text-red-500 hover:text-red-700"
                 >
-                  <path
-                    strokeLinecap="round"
-                    strokeLinejoin="round"
-                    strokeWidth={2}
-                    d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5-4h4m-4 0a1 1 0 00-1 1v1h6V4a1 1 0 00-1-1m-4 0h4"
-                  />
-                </svg>
-              </button>
-            </div>
-          ))}
-        </CardContent>
+                  {/* trash icon */}
+                  <svg
+                    xmlns="http://www.w3.org/2000/svg"
+                    className="h-6 w-6"
+                    fill="none"
+                    viewBox="0 0 24 24"
+                    stroke="currentColor"
+                  >
+                    <path
+                      strokeLinecap="round"
+                      strokeLinejoin="round"
+                      strokeWidth={2}
+                      d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5-4h4m-4 0a1 1 0 00-1 1v1h6V4a1 1 0 00-1-1m-4 0h4"
+                    />
+                  </svg>
+                </button>
+              </div>
+            ))}
+          </CardContent>
 
-        {/* Footer with action buttons */}
-        <CardFooter className="flex gap-4 justify-start flex-1">
-          <Button type="button" onClick={addAssignment}>
-            Add Another
-          </Button>
-          <Button onClick={calculateGrade}>Calculate Grade</Button>
-          <Button onClick={handleSaveSession}>Save Session</Button>
-          <Button onClick={() => router.push("/CalculatorSessions")}>View Saved Sessions</Button>
-        </CardFooter>
+          {/* Footer with action buttons */}
+          <CardFooter className="flex gap-4 justify-start flex-1">
+            <Button type="button" onClick={addAssignment}>
+              Add Another
+            </Button>
+            <Button onClick={calculateGrade}>Calculate Grade</Button>
+            <Button onClick={handleSaveSession}>Save Assignment(s)</Button>
+            <Button onClick={() => router.push("/CalculatorSessions")}>
+              View Saved Assignments
+            </Button>
+          </CardFooter>
 
           {/* Display calculated grade */}
           {finalGrade && (
-            <p className="text-lg font-bold text-center mt-4">Final Grade: {finalGrade}</p>
+            <p className="text-lg font-bold text-center mt-4">
+              Final Grade: {finalGrade}
+            </p>
           )}
-      </Card>
-    </div>
+        </Card>
+      </div>
   );
 }
 
diff --git a/components/NavBar.jsx b/components/NavBar.jsx
index 65ef63e..eac1cb8 100644
--- a/components/NavBar.jsx
+++ b/components/NavBar.jsx
@@ -18,6 +18,7 @@ const navigationLinks = [
   { href: "/LockInChat", label: "Study with AI", active: false },
   { href: "/StudySession", label: "Study Timer", active: false },
   { href: "/Tasks", label: "Tasks", active: false },
+  { href: "/GradeCalculator", label: "Grade Calculator", active: false },
 ];
 
 export default function NavBarComponent() {