diff --git a/firebase.json b/firebase.json index 4073e97..895c5cc 100644 --- a/firebase.json +++ b/firebase.json @@ -15,7 +15,7 @@ "rules": "database.rules.json" }, "hosting": { - "public": "frontend", + "public": "frontend/build", "ignore": [ "firebase.json", "**/.*", @@ -41,7 +41,7 @@ "port": 9000 }, "hosting": { - "port": 5000 + "port": 3000 }, "pubsub": { "port": 8085 diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index b579054..1c61745 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -1,21 +1,34 @@ -import React from "react"; -// import styles from "./App.module.css"; +import { useState } from "react"; +import { Navigate, Route, Routes } from 'react-router-dom'; -import { Route, Routes } from 'react-router-dom'; - -import Courses from './pages/Courses'; +import Login from "./pages/Login"; import Graduation from './pages/Graduation'; +import Courses from './pages/Courses'; import Majors from './pages/Majors'; +import { CGSC, CPSC, ECON, HIST } from "./commons/mock/MockProgram"; + function App() { + + const [auth] = useState(true); + + const programs = [CGSC, CPSC, ECON, HIST]; + const strPrograms = JSON.stringify(programs); + localStorage.setItem("programList", strPrograms); + + + return (
- - }/> - }/> - }/> - + + : }/> + : }/> + + : }/> + : }/> + : }/> +
); } diff --git a/frontend/src/Router.tsx b/frontend/src/Router.tsx index 216f85e..380cb3c 100644 --- a/frontend/src/Router.tsx +++ b/frontend/src/Router.tsx @@ -7,7 +7,7 @@ import Graduation from "./pages/Graduation"; const router = createBrowserRouter([ { - path: "", + path: "/graduation", element: , }, { diff --git a/frontend/src/commons/mock/MockStudent.ts b/frontend/src/commons/mock/MockStudent.ts index 2f64757..2710bdd 100644 --- a/frontend/src/commons/mock/MockStudent.ts +++ b/frontend/src/commons/mock/MockStudent.ts @@ -3,8 +3,20 @@ import { Course, StudentCourse } from "./../types/TypeCourse"; import { Student } from "./../types/TypeStudent"; -const DRST001: Course = { code: "DRST 001", title: "Directed Studies: Literature", seasons: ["FALL", "SPRING"], evaluation: { rating: 4.1, workload: 4.2, professor: 5}, distribution: ["Hu", "WR"] }; -const StudentDRST001: StudentCourse = { course: DRST001, enrollmentStatus: "COMPLETED", season: "FALL", year: "2022-2023" }; +const ENGL253: Course = { code: "ENGL 253", title: "Reading Ulysses: Modernist Classic and Postcolonial Epic", seasons: ["FALL"], evaluation: { rating: 0, workload: 0, professor: 5 }, distribution: ["Hu"] }; +const StudentENGL253: StudentCourse = { course: ENGL253, enrollmentStatus: "COMPLETED", season: "FALL", year: "2022-2023" }; + +const ENGL419: Course = { code: "ENGL 419", title: "Writing about Contemporary Figurative Art", seasons: ["FALL"], evaluation: { rating: 4.8, workload: 4.5, professor: 5 }, distribution: ["WR", "Hu"] }; +const StudentENGL419: StudentCourse = { course: ENGL419, enrollmentStatus: "COMPLETED", season: "FALL", year: "2022-2023" }; + +const GMAN233: Course = { code: "GMAN 233", title: "Karl Marx's Capital", seasons: ["FALL"], evaluation: { rating: 0, workload: 0, professor: 5 }, distribution: ["Hu"] }; +const StudentGMAN233: StudentCourse = { course: GMAN233, enrollmentStatus: "COMPLETED", season: "FALL", year: "2022-2023" }; + +const SDS238: Course = { code: "S&DS 238", title: "Probability and Bayesian Statistics", seasons: ["FALL"], evaluation: { rating: 3.8, workload: 4.0, professor: 5 }, distribution: ["QR"] }; +const StudentSDS238: StudentCourse = { course: SDS238, enrollmentStatus: "COMPLETED", season: "FALL", year: "2022-2023" }; + +const PLSC204: Course = { code: "PLSC 204", title: "Election Fundamentals and Forecasting", seasons: ["FALL"], evaluation: { rating: 0, workload: 0, professor: 5 }, distribution: ["So"] }; +const StudentPLSC204: StudentCourse = { course: PLSC204, enrollmentStatus: "COMPLETED", season: "FALL", year: "2022-2023" }; const DRST003: Course = { code: "DRST 003", title: "Directed Studies: Philosophy", seasons: ["FALL", "SPRING"], evaluation: { rating: 4.1, workload: 4.2, professor: 5}, distribution: ["Hu", "WR"] }; const StudentDRST003: StudentCourse = { course: DRST003, enrollmentStatus: "COMPLETED", season: "SPRING", year: "2022-2023" }; @@ -16,7 +28,7 @@ export const MockStudent: Student = { grade: "First-Year", calendarYear: "2022-2023", fall: { - courses: [StudentDRST001, StudentDRST001, StudentDRST001, StudentDRST001] + courses: [StudentENGL419] }, spring: { courses: [StudentDRST003, StudentDRST003, StudentDRST003, StudentDRST003, StudentDRST003] @@ -26,7 +38,7 @@ export const MockStudent: Student = { grade: "Sophomore", calendarYear: "2023-2024", fall: { - courses: [StudentDRST001, StudentDRST001, StudentDRST001, StudentDRST001, StudentDRST001] + courses: [StudentENGL419] }, spring: { courses: [StudentDRST003, StudentDRST003, StudentDRST003, StudentDRST003] @@ -37,7 +49,7 @@ export const MockStudent: Student = { grade: "Junior", calendarYear: "2024-2025", fall: { - courses: [StudentDRST001, StudentDRST001, StudentDRST001, StudentDRST001, StudentDRST001] + courses: [StudentENGL253, StudentENGL419, StudentGMAN233, StudentSDS238, StudentPLSC204] }, spring: { courses: [StudentDRST003, StudentDRST003, StudentDRST003, StudentDRST003, StudentDRST003] @@ -47,7 +59,7 @@ export const MockStudent: Student = { grade: "Senior", calendarYear: "2025-2026", fall: { - courses: [StudentDRST001, StudentDRST001, StudentDRST001] + courses: [StudentENGL419] }, spring: { courses: [StudentDRST003, StudentDRST003] diff --git a/frontend/src/commons/components/InfoButton.tsx b/frontend/src/navbar/InfoButton.tsx similarity index 100% rename from frontend/src/commons/components/InfoButton.tsx rename to frontend/src/navbar/InfoButton.tsx diff --git a/frontend/src/commons/components/navbar/NavBar.module.css b/frontend/src/navbar/NavBar.module.css similarity index 100% rename from frontend/src/commons/components/navbar/NavBar.module.css rename to frontend/src/navbar/NavBar.module.css diff --git a/frontend/src/navbar/PageLinks.tsx b/frontend/src/navbar/PageLinks.tsx new file mode 100644 index 0000000..1ed82df --- /dev/null +++ b/frontend/src/navbar/PageLinks.tsx @@ -0,0 +1,23 @@ + +import React from "react"; +import styles from "./NavBar.module.css"; + +import { NavLink } from "react-router-dom"; + +function PageLinks() { + return ( +
+ isActive ? styles.activeLink : styles.dormantLink }> + Graduation + + isActive ? styles.activeLink : styles.dormantLink }> + Courses + + isActive ? styles.activeLink : styles.dormantLink }> + Majors + +
+ ); +} + +export default PageLinks; diff --git a/frontend/src/pages/Courses/Courses.tsx b/frontend/src/pages/Courses/Courses.tsx index c874b57..6b6e421 100644 --- a/frontend/src/pages/Courses/Courses.tsx +++ b/frontend/src/pages/Courses/Courses.tsx @@ -7,9 +7,9 @@ import AddCourseMenu from "./components/add_course/AddCourse"; import { MockStudent } from "./../../commons/mock/MockStudent"; -import nav_styles from "./../../commons/components/navbar/NavBar.module.css"; +import nav_styles from "./../../navbar/NavBar.module.css"; import img_logo from "./../../commons/images/ma_logo.png"; -import { NavLink } from "react-router-dom"; +import PageLinks from "../../navbar/PageLinks"; function NavBar() { return ( @@ -18,18 +18,7 @@ function NavBar() { -
- isActive ? nav_styles.activeLink : nav_styles.dormantLink }> - Graduation - - isActive ? nav_styles.activeLink : nav_styles.dormantLink }> - Courses - - isActive ? nav_styles.activeLink : nav_styles.dormantLink }> - Majors - - {/* */} -
+ ); } @@ -95,7 +84,7 @@ function Courses() { return(
- +
); } diff --git a/frontend/src/pages/Graduation/components/DistributionTable.tsx b/frontend/src/pages/Graduation/components/DistributionTable.tsx index fe4b394..d1593fb 100644 --- a/frontend/src/pages/Graduation/components/DistributionTable.tsx +++ b/frontend/src/pages/Graduation/components/DistributionTable.tsx @@ -5,7 +5,7 @@ import styles from "./../Graduation.module.css"; import DistributionBox from "../../../commons/components/courses/DistributionBoxLarge"; import CourseBoxSmall from "../../../commons/components/courses/CourseBoxSmall"; -import InfoButton from "../../../commons/components/InfoButton"; +import InfoButton from "../../../navbar/InfoButton"; import { StudentCourse, ClassLists } from "../../../commons/types/TypeCourse"; import { MockStudentCourses } from "../../../commons/mock/MockCourses"; diff --git a/frontend/src/pages/Login/Login.tsx b/frontend/src/pages/Login/Login.tsx new file mode 100644 index 0000000..c4dce4d --- /dev/null +++ b/frontend/src/pages/Login/Login.tsx @@ -0,0 +1,27 @@ + +import React, { useState } from "react"; +import navStyles from "./../../navbar/NavBar.module.css"; +import logo from "./../../commons/images/ma_logo.png"; + +function NavBar() { + return( +
+
+ +
+
+ ); +} + + +function Login(){ + return( +
+ + +
+ ) +} + +export default Login; + diff --git a/frontend/src/pages/Login/index.tsx b/frontend/src/pages/Login/index.tsx new file mode 100644 index 0000000..d4e9b8e --- /dev/null +++ b/frontend/src/pages/Login/index.tsx @@ -0,0 +1,2 @@ +import Login from "./Login"; +export default Login; diff --git a/frontend/src/pages/Majors/Majors.tsx b/frontend/src/pages/Majors/Majors.tsx index ae9b11a..6efa1c6 100644 --- a/frontend/src/pages/Majors/Majors.tsx +++ b/frontend/src/pages/Majors/Majors.tsx @@ -5,12 +5,12 @@ import styles from "./Majors.module.css"; import ProgramRequirementsBox from "./components/ProgramRequirementsBox"; import ProgramMetadataBox from "./components/ProgramMetadataBox"; -import nav_styles from "./../../commons/components/navbar/NavBar.module.css"; +import nav_styles from "./../../navbar/NavBar.module.css"; import img_logo from "./../../commons/images/ma_logo.png"; -import { NavLink } from "react-router-dom"; -import { CGSC, CPSC, ECON, HIST } from "./../../commons/mock/MockProgram"; -const programs = [CGSC, CPSC, ECON, HIST]; +import PageLinks from '../../navbar/PageLinks'; + +import { Program } from "./../../commons/types/TypeProgram" function NavBar() { return ( @@ -18,55 +18,60 @@ function NavBar() {
- -
- isActive ? nav_styles.activeLink : nav_styles.dormantLink }> - Graduation - - isActive ? nav_styles.activeLink : nav_styles.dormantLink }> - Courses - - isActive ? nav_styles.activeLink : nav_styles.dormantLink }> - Majors - - {/* */} -
+
); } -export const Majors = () => { - // Which Program +function Majors() { const [currdex, setCurrdex] = useState(0); - const alterCurrdex = (dir: number) => { - setCurrdex((currdex + dir + programs.length) % programs.length); - setCurrDegree(0); + const [currDegree, setCurrDegree] = useState(0); + + const storedPrograms = localStorage.getItem("programList"); + let programs: Program[] | null = null; + + if (storedPrograms) { + programs = JSON.parse(storedPrograms) as Program[]; + } + + const alterCurrdex = (dir: number) => { + if (programs && programs.length > 0) { + setCurrdex((currdex + dir + programs.length) % programs.length); + setCurrDegree(0); + } }; - const seeProgram = (dir: number) => { - return programs[(currdex + dir + programs.length) % programs.length]; + + const seeProgram = (dir: number) => { + if (programs && programs.length > 0) { + return programs[(currdex + dir + programs.length) % programs.length]; + } + return null; }; - // Which Degree - const [currDegree, setCurrDegree] = useState(0); - const alterCurrDegree = (num: number) => { - setCurrDegree(num); + const alterCurrDegree = (num: number) => { + setCurrDegree(num); }; - - return( + + if (!programs || programs.length === 0) { + return
; + } + + return (
- - + alterCurrDegree={alterCurrDegree} + /> +
); -}; +} export default Majors; diff --git a/frontend/src/pages/Majors/components/ProgramRequirementsBox.tsx b/frontend/src/pages/Majors/components/ProgramRequirementsBox.tsx index caa0780..6dd8d67 100644 --- a/frontend/src/pages/Majors/components/ProgramRequirementsBox.tsx +++ b/frontend/src/pages/Majors/components/ProgramRequirementsBox.tsx @@ -2,7 +2,7 @@ import React from "react"; import styles from "./../Majors.module.css"; -import InfoButton from "../../../commons/components/InfoButton"; +import InfoButton from "../../../navbar/InfoButton"; import { Degree } from "../../../commons/types/TypeProgram"; import CourseBoxSmall from "../../../commons/components/courses/CourseBoxSmall";