diff --git a/frontend/src/App.js b/frontend/src/App.js
index 717c362..946d60a 100644
--- a/frontend/src/App.js
+++ b/frontend/src/App.js
@@ -23,7 +23,7 @@ function App() {
-
+
diff --git a/frontend/src/pages/ManageStudentsPage.jsx b/frontend/src/pages/ManageStudentsPage.jsx
index b118721..2da86f2 100644
--- a/frontend/src/pages/ManageStudentsPage.jsx
+++ b/frontend/src/pages/ManageStudentsPage.jsx
@@ -1,30 +1,89 @@
import { useEffect, useState } from "react";
-import { Container, Table } from "react-bootstrap";
+import { Container, Table, Button, Form } from "react-bootstrap";
import MyNavbar from "../components/MyNavbar";
import { makeRequest } from "../utils.ts";
-const ManageStutentsPage = ({cid}) => {
+const ManageStutentsPage = ({ cid }) => {
const [studentData, setStudentData] = useState([]);
+ const [showAddStudentForm, setShowAddStudentForm] = useState(false);
+ const submitStudentForm = async (username) => {
+ await makeRequest({
+ url: `http://localhost:5000/user/${username}/enroll/${cid}`,
+ method: "POST",
+ });
+ window.location.reload();
+ return false;
+ };
+
+ const AddStudentForm = () => {
+ const [username, setUsername] = useState("");
+
+ return (
+
+
+ Username
+ setUsername(e.target.value)}
+ />
+
+ Make sure that a user with the username exists and is not already
+ enrolled in this course
+
+
+
+ Submit
+
+
+
+ );
+ };
useEffect(() => {
- // makeRequest({
- // url: `http://localhost:5000/course/${cid}/students`,
- // method: "GET",
- // })
- // .then((req) => req.json())
- // .then((data) => {
- // setStudentData(data.courses);
- // })
- // .catch((err) => {
- // console.error(err);
- // });
+ makeRequest({
+ url: `http://localhost:5000/course/${cid}/students`,
+ method: "GET",
+ })
+ .then((req) => req.json())
+ .then(async (data) => {
+ setStudentData(data.students);
+ })
+ .catch((err) => {
+ console.error(err);
+ });
}, []);
+ const sendUnenrollRequest = (uid) => {
+ makeRequest({
+ url: `http://localhost:5000/user/${uid}/enroll/${cid}`,
+ method: "DELETE",
+ }).then((resp) => {
+ window.location.reload();
+ });
+ };
+
return (
Manage Students
+ {
+ setShowAddStudentForm(!showAddStudentForm);
+ }}
+ >
+ {(showAddStudentForm && "-") || "+"} Add student
+
+ {showAddStudentForm && }
@@ -41,6 +100,16 @@ const ManageStutentsPage = ({cid}) => {
{student.id}
{student.username}
{student.email}
+
+
+ sendUnenrollRequest(student.id)}
+ >
+ Unenroll
+
+
+
);
})}