Merge branch 'GroupE-development' into GroupE-frontend

Author: Nanvithaa

client/src/App.js

@@ -8,4 +8,4 @@ function App() {
   return <RouterProvider router={router} />;
 }
 
-export default App;
+export default App;

client/src/pages/SupervisorDashboard.js

@@ -3,61 +3,67 @@ import axios from "axios";
 import "../styles/SupervisorDashboard.css";
 import ViewFormModal from "./ViewFormModal";
 
-
 const SupervisorDashboard = () => {
   const [requests, setRequests] = useState([]);
   const [selectedForm, setSelectedForm] = useState(null);
   const [loading, setLoading] = useState(true);
   const [message, setMessage] = useState("");
 
-  const handleFormActionComplete = () => {
-    fetchRequests(); // ✅ Refresh from DB
-    setSelectedForm(null);
-  };
-  
+  const token = localStorage.getItem("token") || "";
 
   const fetchRequests = async () => {
     try {
-      const res = await axios.get(`${process.env.REACT_APP_API_URL}/api/form/a1forms`);
-      setRequests(res.data);
+      const res = await axios.get(`${process.env.REACT_APP_API_URL}/api/supervisor/forms`, {
+        headers: {
+          Authorization: `Bearer ${token}`,
+        },
+      });
+
+      const formatted = res.data.map((item) => ({
+        _id: item._id,
+        name: item.student?.userName || item.student?.name || "N/A",
+        student_id: item.student?._id || item._id,
+        form_type: item.form_type || "A.1",
+        createdAt: item.createdAt,
+        supervisor_status: item.supervisor_status || "pending",
+        fullForm: item,
+      }));
+
+      setRequests(formatted);
       setLoading(false);
     } catch (err) {
-      console.error("Error fetching requests:", err);
-      setMessage("Error fetching requests.");
+      console.error("Error fetching Internship A1 forms:", err);
+      setMessage("Error fetching Internship A1 forms.");
       setLoading(false);
     }
   };
-  
 
   useEffect(() => {
-    const fetchRequests = async () => {
-      try {
-        const res = await axios.get(`${process.env.REACT_APP_API_URL}/api/form/a1forms`);
-
-
-        setRequests(res.data);
-        setLoading(false);
-      } catch (err) {
-        console.error("Error fetching requests:", err);
-        setMessage("Error fetching requests.");
-        setLoading(false);
-      }
-    };
     fetchRequests();
-    
   }, []);
 
+  const handleFormActionComplete = () => {
+    fetchRequests(); // Refresh table after Approve/Reject
+    setSelectedForm(null);
+  };
 
-
-  const handleAction = async (id, action, comment) => {
+  const handleAction = async (id, form_type, action, comment) => {
     const confirmed = window.confirm(`Are you sure you want to ${action} this request?`);
     if (!confirmed) return;
 
     try {
-      const res =  await axios.post(`${process.env.REACT_APP_API_URL}/api/submissions/${id}/${action}`, { comment });
+      const res = await axios.post(
+        `${process.env.REACT_APP_API_URL}/api/supervisor/form/${form_type}/${id}/${action}`,
+        { comment },
+        {
+          headers: {
+            Authorization: `Bearer ${token}`,
+          },
+        }
+      );
 
       setMessage(res.data.message || `${action} successful`);
-      setRequests(prev => prev.filter(req => req._id !== id));
+      setRequests((prev) => prev.filter((req) => req._id !== id));
       setSelectedForm(null);
     } catch (err) {
       console.error(`Failed to ${action} request:`, err);
@@ -68,26 +74,19 @@ const SupervisorDashboard = () => {
   const openFormView = (form) => setSelectedForm(form);
   const closeFormView = () => setSelectedForm(null);
 
-  const formatDate = (dateStr) => new Date(dateStr).toLocaleDateString();
-
-  const sortedRequests = [...requests]
-  .filter((req) => req.status.toLowerCase() === "submitted")
-  .sort((a, b) => new Date(a.createdAt) - new Date(b.createdAt));
-
+  const formatDate = (date) => new Date(date).toLocaleDateString();
 
   let content;
 
   if (loading) {
     content = <p>Loading...</p>;
-  }
-  else if (sortedRequests.length === 0) {
+  } else if (requests.length === 0) {
     content = (
       <div className="empty-message-container">
         <div className="empty-message">No pending approvals.</div>
       </div>
     );
-  }
-  else {
+  } else {
     content = (
       <table className="dashboard-table">
         <thead>
@@ -100,21 +99,19 @@ const SupervisorDashboard = () => {
           </tr>
         </thead>
         <tbody>
-        {sortedRequests.map((req) => (
-  <tr key={req._id} className="clickable-row" onClick={() => openFormView(req)}>
-  <td>{req.studentName}</td>
-  <td>{req.soonerId}</td>
-  <td>A.1</td>
-  <td>{formatDate(req.createdAt)}</td>
-  <td>
-    <span className={`status-badge ${req.status}`}>
-      {req.status}
-    </span>
-  </td>
-</tr>
-
-))}
-
+          {requests.map((req) => (
+            <tr key={req._id} className="clickable-row" onClick={() => openFormView(req.fullForm)}>
+              <td>{req.name}</td>
+              <td>{req.student_id}</td>
+              <td>{req.form_type}</td>
+              <td>{formatDate(req.createdAt)}</td>
+              <td>
+                <span className={`status-badge ${req.supervisor_status}`}>
+                  {req.supervisor_status}
+                </span>
+              </td>
+            </tr>
+          ))}
         </tbody>
       </table>
     );
@@ -137,4 +134,4 @@ const SupervisorDashboard = () => {
   );
 };
 
-export default SupervisorDashboard;
+export default SupervisorDashboard;