Upload Buttons; Generate Button

src/backend/api/routes/generate.ts

@@ -0,0 +1,38 @@
+import { Elysia } from "elysia";
+import { t } from "elysia";
+import { getAcademicYearId } from "../../controllers";
+
+const PYTHON_SERVER_URL = "http://localhost:5000";
+
+const app = new Elysia({ prefix: "/generateTT" })
+    .get(
+        "/department/:id",
+        async ({ params }) => {
+            const { id } = params;
+            const academicYearId = await getAcademicYearId("department", id);
+            return await fetch(`${PYTHON_SERVER_URL}/generate/department/${id}/${academicYearId}`);
+        },
+        {
+            detail: {
+                summary: "Generate division timetable",
+                tags: ["Generate Timetable"],
+            },
+            params: t.Object({
+                id: t.Numeric(),
+            }),
+        },
+    )
+    .get(
+        "/loading",
+        async ({ body }) => {
+            return await fetch(`${PYTHON_SERVER_URL}/loading`);
+        },
+        {
+            detail: {
+                summary: "Get loading status",
+                tags: ["Generate Timetable"],
+            },
+        },
+    );
+
+export default app;

src/backend/api/routes/index.ts

@@ -3,6 +3,7 @@ import available from "./available";
 import editing from "./editing";
 import validate from "./validate";
 import addCsv from "./addCsv";
+import generate from './generate';
 import Elysia from "elysia";
 import cors from "@elysiajs/cors";
 
@@ -20,6 +21,7 @@ const app = new Elysia()
     .use(editing)
     .use(validate)
     .use(addCsv)
+    .use(generate)
     .onError((ctx) => {
         const errorResponse = JSON.stringify({ message: ctx.error.toString(), ...ctx }, null, 2);
 

src/backend/controllers/getAcademicYearId.ts

@@ -1,7 +1,7 @@
 import { AcademicYear } from "../database";
 
 export default async function getAcademicYearId(
-    searchBy: "subdivision" | "teacher" | "classroom" | "division" | "slot",
+    searchBy: "subdivision" | "teacher" | "classroom" | "division" | "slot" | "department",
     searchId: number,
 ): Promise<AcademicYear["id"]> {
     let associationQuery = {};
@@ -66,6 +66,18 @@ export default async function getAcademicYearId(
                 required: true,
             };
             break;
+        case "department":
+            associationQuery = {
+                association: "Batch",
+                include: [
+                    {
+                        association: "Department",
+                        where: { id: searchId },
+                        required: true,
+                    },
+                ],
+            };
+            break;
         default:
             throw new Error(`Unhandled case in getAcademicYearId function: ${searchBy}`);
     }

src/frontend/App.tsx

@@ -10,7 +10,9 @@ import "@fontsource/roboto/700.css";
 import "./App.css";
 import TimetableNewPage from "./Pages/TimetableNewPage";
 import TimetableCombined from "./Pages/TimetableCombined";
-import { InputFileUpload } from "./Components/CSV/FileUpload";
+import BatchAndSubdiviionUpload from "./Components/CSV/BatchAndSubdivision";
+import ClassroomUpload from "./Components/CSV/Classrooms";
+import SubjectAndTeacherUpload from "./Components/CSV/SubjectAndTeacers";
 
 export default function App() {
     return (
@@ -35,7 +37,17 @@ export default function App() {
                     }
                 />
                 <Route path="/" element={<TimetableNewPage />} />
-                <Route path="/upload" element={<InputFileUpload />} />
+                <Route
+                    path="/upload"
+                    element={
+                        <>
+                            <BatchAndSubdiviionUpload /> <br />
+                            <ClassroomUpload />
+                            <br />
+                            <SubjectAndTeacherUpload /> <br />
+                        </>
+                    }
+                />
             </Routes>
         </Router>
     );

src/frontend/Components/Buttons/Generate.tsx

@@ -0,0 +1,32 @@
+import { Button } from "@mui/material";
+import { SelectedValuesContext } from "../../context/SelectedValuesContext";
+import React, { useContext } from "react";
+import api from "../..";
+import { TimetableDataContext } from "../../context/TimetableDataContext";
+import { TimetableResponse } from "../../../backend/api/routes/responseTypes";
+import { edenFetch } from "../fetchAndSet";
+
+export default function Generate() {
+    const { selectedValues } = useContext(SelectedValuesContext);
+    const { setTimetable, setAvailable } = useContext(TimetableDataContext);
+    const handleClick = () => {
+        const divisionId = selectedValues.division.value;
+        const departmentId = selectedValues.department.value;
+        if (!divisionId || !departmentId) return;
+        edenFetch(api.generateTT.department({ id: departmentId }).get()).then((data) => {
+            console.log(data);
+            api.divisions({ id: divisionId })
+            .timetable.get()
+            .then(({ data, error }) => {
+                if (error) return console.log(error);
+                setTimetable(data ?? ({} as TimetableResponse));
+                setAvailable(true);
+            });
+        })
+    };
+    return (
+        <Button variant="contained" sx={{ height: "3rem" }} onClick={handleClick}>
+            Generate New
+        </Button>
+    );
+}

src/frontend/Components/Buttons/index.ts

@@ -3,5 +3,6 @@ import Batch from "./Batch";
 import Department from "./Department";
 import Division from "./Division";
 import View from "./View";
+import Generate from "./Generate";
 
-export { AcademicYear, Batch, Department, Division, View};
+export { AcademicYear, Batch, Department, Division, View, Generate};

src/frontend/Components/CSV/BatchAndSubdivision.tsx

@@ -0,0 +1,43 @@
+import React from "react";
+import { styled } from "@mui/material/styles";
+import Button from "@mui/material/Button";
+import CloudUploadIcon from "@mui/icons-material/CloudUpload";
+
+const VisuallyHiddenInput = styled("input")({
+    clip: "rect(0 0 0 0)",
+    clipPath: "inset(50%)",
+    height: 1,
+    overflow: "hidden",
+    position: "absolute",
+    bottom: 0,
+    left: 0,
+    whiteSpace: "nowrap",
+    width: 1,
+});
+
+export default function InputFileUpload() {
+    const handleFileChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+        const file = event.target.files?.[0] ?? null;
+        if (file === null) return;
+        const formData = new FormData();
+        formData.append("file", file);
+        formData.append("academicYearId", "1");
+        fetch("http://localhost:3000/csv/batchAndSubdivisions", {
+            method: "POST",
+            body: formData,
+        });
+    };
+    return (
+        <Button
+            component="label"
+            role={undefined}
+            variant="contained"
+            tabIndex={-1}
+            startIcon={<CloudUploadIcon />}
+            sx={{margin: "0.5rem"}}
+        >
+            Batch And Subdivision Upload
+            <VisuallyHiddenInput type="file" accept=".csv" onChange={handleFileChange} />
+        </Button>
+    );
+}

src/frontend/Components/CSV/Classrooms.tsx

@@ -0,0 +1,44 @@
+import React from "react";
+import { styled } from "@mui/material/styles";
+import Button from "@mui/material/Button";
+import CloudUploadIcon from "@mui/icons-material/CloudUpload";
+
+const VisuallyHiddenInput = styled("input")({
+    clip: "rect(0 0 0 0)",
+    clipPath: "inset(50%)",
+    height: 1,
+    overflow: "hidden",
+    position: "absolute",
+    bottom: 0,
+    left: 0,
+    whiteSpace: "nowrap",
+    width: 1,
+});
+
+export default function InputFileUpload() {
+    const handleFileChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+        const file = event.target.files?.[0] ?? null;
+        if (file === null) return;
+        const formData = new FormData();
+        formData.append("file", file);
+        formData.append("academicYearId", "1");
+        fetch("http://localhost:3000/csv/classrooms", {
+            method: "POST",
+            body: formData,
+        });
+    };
+    return (
+        <Button
+            component="label"
+            role={undefined}
+            variant="contained"
+            tabIndex={-1}
+            startIcon={<CloudUploadIcon />}
+            sx={{margin: "0.5rem"}}
+
+        >
+            Classroom Upload
+            <VisuallyHiddenInput type="file" accept=".csv" onChange={handleFileChange} />
+        </Button>
+    );
+}

src/frontend/Components/CSV/FileUpload.tsx → src/frontend/Components/CSV/SubjectAndTeacers.tsx

@@ -15,7 +15,7 @@ const VisuallyHiddenInput = styled("input")({
     width: 1,
 });
 
-export function InputFileUpload() {
+export default function InputFileUpload() {
     const handleFileChange = (event: React.ChangeEvent<HTMLInputElement>) => {
         const file = event.target.files?.[0] ?? null;
         if (file === null) return;
@@ -25,7 +25,7 @@ export function InputFileUpload() {
         fetch("http://localhost:3000/csv/subjectAndTeachers", {
             method: "POST",
             body: formData,
-        });
+        }); 
     };
     return (
         <Button
@@ -34,8 +34,9 @@ export function InputFileUpload() {
             variant="contained"
             tabIndex={-1}
             startIcon={<CloudUploadIcon />}
+            sx={{margin: "0.5rem"}}
         >
-            Upload file
+            Subject And Teacher Upload
             <VisuallyHiddenInput type="file" accept=".csv" onChange={handleFileChange} />
         </Button>
     );