diff --git a/.env b/.env index 827b820..d44cade 100644 --- a/.env +++ b/.env @@ -1,2 +1,2 @@ VITE_AUTH_URL="https://byte-camp-auth-service.fly.dev" -VITE_ASSIGNMENT_URL="https://assignment-service.internal" \ No newline at end of file +VITE_ASSIGNMENT_URL="http://assignment-service.internal" \ No newline at end of file diff --git a/src/pages/AssignmentPage.jsx b/src/pages/AssignmentPage.jsx index ba560b7..4601c70 100644 --- a/src/pages/AssignmentPage.jsx +++ b/src/pages/AssignmentPage.jsx @@ -2,6 +2,7 @@ import React, { useState, useEffect } from "react"; import "../scss/components/_assignment.scss"; const AssignmentPage = () => { + const [assignmentId, setAssignmentId] = useState(""); const [studentName, setStudentName] = useState(""); const [campID, setCampID] = useState(""); const [programID, setProgramID] = useState(""); @@ -10,27 +11,97 @@ const AssignmentPage = () => { const [password, setPassword] = useState(""); const [description, setDescription] = useState(""); const [file, setFile] = useState(null); - + const [projects, setProjects] = useState([]); const [showModal, setShowModal] = useState(false); const [editingIndex, setEditingIndex] = useState(null); + const [user, setUser] = useState([]); + const VITE_ASSIGNMENT_URL = import.meta.env.VITE_ASSIGNMENT_URL; + const authUrl = import.meta.env.VITE_AUTH_URL; useEffect(() => { document.title = "Assignment"; + getCurrentUser(); fetchAssignments(); }, []); + useEffect(() => { + if (!appName) return; // Don't alert for empty name + const timer = setTimeout(() => { + fetch(`${VITE_ASSIGNMENT_URL}/instructor/checkAssignmentByAppName/${appName}`) + .then((response) => { + if (!response.ok) { + throw new Error("Failed to fetch assignment by app name"); + } + return response.json(); + }) + .then((data) => { + if (data.exists) { + alert("This app name already exists. Please choose a different one."); + } + }) + .catch((error) => { + console.error("Error fetching assignment by app name:", error); + }); + }, 1000); // 1 second delay + + return () => clearTimeout(timer); // Clear timeout on name change + }, [appName]); + + useEffect(() => { + if (!qrCodeNumber) return; // Don't alert for empty QR code number + console.log("Checking QR code number:", qrCodeNumber); // Added console log + const timer = setTimeout(() => { + fetch(`${VITE_ASSIGNMENT_URL}/instructor/checkAssignmentByQRCode/${qrCodeNumber}`) + .then((response) => { + if (!response.ok) { + throw new Error("Failed to fetch assignment by QR code number"); + } + return response.json(); + }) + .then((data) => { + console.log("QR code fetch result:", data); // Added console log + if (data.exists) { + alert("This QR code number already exists. Please choose a different one."); + } + }) + .catch((error) => { + console.error("Error fetching assignment by QR code number:", error); + }); + }, 1000); // 1 second delay + + return () => clearTimeout(timer); // Clear timeout on QR code number change + }, [qrCodeNumber]); + + const getCurrentUser = async () => { + try { + const authResponse = await fetch(`${authUrl}/auth/current_user`, { + credentials: "include", + }); + + const user = await authResponse.json(); + setUser(user); + } catch (error) { + console.error("Error fetching current user:", error); + } + }; + const fetchAssignments = async () => { try { + // if (user) { + // console.log("Current user:", user, `${VITE_ASSIGNMENT_URL}/instructor/list/${user.userId}`); + // const res = await fetch(`${VITE_ASSIGNMENT_URL}/instructor/list/${user.userId}`, { + // // credentials: "include", + // }); + //replace this with commented code above to get the instructor id from the auth service const res = await fetch(`${VITE_ASSIGNMENT_URL}/instructor/list/9`, { // credentials: "include", }); - if (!res.ok) throw new Error("Failed to fetch"); + if (!res.ok) throw new Error("Failed to fetch"); const data = await res.json(); - // Optional: Remove duplicate assignment IDs if needed const unique = Array.from( @@ -38,6 +109,7 @@ const AssignmentPage = () => { ); setProjects(unique); + // } } catch (error) { console.error("Error fetching assignments:", error); } @@ -53,69 +125,87 @@ const AssignmentPage = () => { setEditingIndex(null); }; - const handleSubmit = (e) => { + const handleSubmit = async (e) => { e.preventDefault(); - const newProject = { - studentname: studentName, - campid: campID, - appname: appName, - qrcodenumber: qrCodeNumber, - passwordhash: password, - programid: programID, - description, - file: file, - intructorid: 9, - }; + if (!user.userId) return alert("Please login to submit an assignment."); - //callt the api to upload a new assignment + //Create the form data needed for both create and edit const formData = new FormData(); formData.append("studentname", studentName); formData.append("campid", campID); formData.append("programid", programID); - formData.append("appname", appName); formData.append("qrcodenumber", qrCodeNumber); formData.append("password", password); formData.append("description", description); - formData.append("instructorid", 9); - if (file) { - formData.append("file", file, file.name); - } - - fetch(`${VITE_ASSIGNMENT_URL}/instructor/create`, { - method: "POST", - body: formData, - }) - .then((response) => { - if (!response.ok) { - throw new Error("Failed to submit assignment"); - } - return response.json(); - }) - .then((data) => { - console.log("Assignment submitted successfully:", data); - fetchAssignments(); // Refresh the assignments list - }) - .catch((error) => { - console.error("Error submitting assignment:", error); - alert("Failed to submit assignment. Please try again."); - }); if (editingIndex !== null) { - const updatedProjects = [...projects]; - updatedProjects[editingIndex] = newProject; - setProjects(updatedProjects); + //edit mode + await fetch(`${VITE_ASSIGNMENT_URL}/instructor/update/${assignmentId}`, { + method: "PUT", + body: formData, + }) + .then((response) => { + + if (!response.ok) { + console.error("Failed to edit assignment:", response.statusText); + throw new Error("Failed to edit assignment"); + } + return response.json(); + }) + .then((data) => { + console.log("Assignment edited successfully:", data); + }) + .catch((error) => { + console.error("Error submitting assignment:", error); + alert(`Failed to submit assignment. ${error.message}`); + }); } else { - setProjects([...projects, newProject]); + //create mode + formData.append("instructorid", 9); + formData.append("appname", appName); + + if (file) { + formData.append("file", file, file.name); + } else { + throw new Error("Failed to submit assignment: file not found."); + } + + await fetch(`${VITE_ASSIGNMENT_URL}/instructor/create`, { + method: "POST", + body: formData, + }) + .then((response) => { + if (!response.ok) { + console.error("Failed to submit assignment:", response.statusText); + throw new Error("Failed to submit assignment"); + } + return response.json(); + }) + .then((data) => { + console.log("Assignment submitted successfully:", data); + }) + .catch((error) => { + console.error("Error submitting assignment:", error); + alert(`Failed to submit assignment. ${error.message}`); + }); } - alert(editingIndex !== null ? "Assignment updated!" : "Assignment submitted!"); + alert( + editingIndex !== null ? "Assignment updated!" : "Assignment submitted!" + ); + + fetchAssignments(); // Refresh the assignments list resetForm(); setShowModal(false); }; const handleEdit = (index) => { const project = projects[index]; + setAssignmentId(project.assignmentid || project.assignmentId || ""); + setAppName(project.appname || project.appName || ""); + setQrCodeNumber(project.qrcodenumber || project.qrCodeNumber || ""); + setPassword(project.passwordhash || project.password || ""); setStudentName(project.studentname || project.studentName || ""); setCampID(project.campid || project.campID || ""); setProgramID(project.programid || project.programID || ""); @@ -126,66 +216,145 @@ const AssignmentPage = () => { }; const handleDelete = (index) => { - const updated = projects.filter((_, i) => i !== index); - setProjects(updated); + const project = projects[index]; + if (window.confirm("Are you sure you want to delete this assignment?")) { + fetch(`${VITE_ASSIGNMENT_URL}/instructor/delete/${project.assignmentid}`, { + method: "DELETE", + }) + .then((response) => { + if (!response.ok) { + console.error("Failed to delete assignment:", response.statusText); + throw new Error("Failed to delete assignment"); + } + return response.json(); + }) + .then((data) => { + console.log("Assignment deleted successfully:", data); + alert("Assignment deleted successfully!"); + fetchAssignments(); // Refresh the assignments list + }) + .catch((error) => { + console.error("Error deleting assignment:", error); + alert(`Failed to delete assignment. ${error.message}`); + }); + } }; return (

Assignments

- +
{showModal && (
-

{editingIndex !== null ? "Edit Assignment" : "New Assignment"}

+

+ {editingIndex !== null ? "Edit Assignment" : "New Assignment"} +

- setStudentName(e.target.value)} required /> + setStudentName(e.target.value)} + required + />
- setCampID(e.target.value)} required /> + setCampID(e.target.value)} + required + />
- setProgramID(e.target.value)} required /> + setProgramID(e.target.value)} + required + />
- setAppName(e.target.value)} required /> + setAppName(e.target.value)} + required + disabled={editingIndex !== null} + s + />
-
- setQrCodeNumber(e.target.value)} required /> + setQrCodeNumber(e.target.value)} + required + />
- setPassword(e.target.value)} required /> + setPassword(e.target.value)} + required + />
- +
-
- - setFile(e.target.files[0])} /> -
+ {editingIndex === null && ( +
+ + setFile(e.target.files[0])} + /> +
+ )}
- - + +
@@ -197,31 +366,58 @@ const AssignmentPage = () => { {projects.map((project, index) => (
- Student Name: {project.studentname || project.studentName} |{" "} + Student Name:{" "} + {project.studentname || project.studentName} |{" "} CampID: {project.campid || project.campID} |{" "} - ProgramID: {project.programid || project.programID} + ProgramID:{" "} + {project.programid || project.programID}
{project.title &&

{project.title}

} {project.description &&

{project.description}

} - {project.fileName &&

Uploaded File: {project.fileName}

} + {project.fileName && ( +

+ Uploaded File: {project.fileName} +

+ )} {project.assignmenturl && (

- View Assignment + + View Assignment +

)} {project.originalfile && (

- Original File |{" "} - Editable File + + Original File + {" "} + |{" "} + + Editable File +

)}
- +
))}