Prettified /upload

MatricalDefunkt · May 8, 2024 · 267ba9c · 267ba9c
1 parent 0aadd24
commit 267ba9c
Show file tree

Hide file tree

Showing 9 changed files with 80 additions and 165 deletions.
diff --git a/src/frontend/App.tsx b/src/frontend/App.tsx
@@ -10,10 +10,8 @@ import "@fontsource/roboto/700.css";
 import "./App.css";
 import TimetableNewPage from "./Pages/TimetableNewPage";
 import TimetableCombined from "./Pages/TimetableCombined";
-import BatchAndSubdiviionUpload from "./Components/CSV/BatchAndSubdivision";
-import ClassroomUpload from "./Components/CSV/Classrooms";
-import SubjectAndTeacherUpload from "./Components/CSV/SubjectAndTeacers";
 import LandingPage from "./Pages/LandingPage";
+import DataUpload from "./Pages/DataUpload";
 
 export default function App() {
     return (
@@ -50,14 +48,20 @@ export default function App() {
                     path="/upload"
                     element={
                         <>
-                            <BatchAndSubdiviionUpload /> <br />
-                            <ClassroomUpload />
-                            <br />
-                            <SubjectAndTeacherUpload /> <br />
+                            <div
+                                style={{
+                                    minHeight: "100vh",
+                                    display: "flex",
+                                    alignItems: "center",
+                                    justifyContent: "center",
+                                }}
+                            >
+                                <DataUpload />
+                            </div>
                         </>
                     }
                 />
             </Routes>
         </Router>
     );
-}
+}
diff --git a/src/frontend/Components/CSV/AddCSV.tsx b/src/frontend/Components/CSV/AddCSV.tsx
diff --git a/...nd/Components/CSV/BatchAndSubdivision.tsx → ...ponents/CSV/BatchAndSubdivisionUpload.tsx b/...nd/Components/CSV/BatchAndSubdivision.tsx → ...ponents/CSV/BatchAndSubdivisionUpload.tsx
@@ -15,7 +15,7 @@ const VisuallyHiddenInput = styled("input")({
     width: 1,
 });
 
-export default function InputFileUpload() {
+export default function BatchAndSubdivisionUpload() {
     const handleFileChange = (event: React.ChangeEvent<HTMLInputElement>) => {
         const file = event.target.files?.[0] ?? null;
         if (file === null) return;

diff --git a/src/frontend/Components/CSV/Classrooms.tsx → ...ontend/Components/CSV/ClassroomUpload.tsx b/src/frontend/Components/CSV/Classrooms.tsx → ...ontend/Components/CSV/ClassroomUpload.tsx
@@ -15,7 +15,7 @@ const VisuallyHiddenInput = styled("input")({
     width: 1,
 });
 
-export default function InputFileUpload() {
+export default function ClassroomUpload() {
     const handleFileChange = (event: React.ChangeEvent<HTMLInputElement>) => {
         const file = event.target.files?.[0] ?? null;
         if (file === null) return;

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

diff --git a/src/frontend/Components/CSV/Upload.tsx b/src/frontend/Components/CSV/Upload.tsx
diff --git a/src/frontend/Components/CSV/UploadCSV.css b/src/frontend/Components/CSV/UploadCSV.css
diff --git a/src/frontend/Components/CSV/index.ts b/src/frontend/Components/CSV/index.ts
@@ -0,0 +1,5 @@
+import BatchAndSubdivisionUpload from "./BatchAndSubdivisionUpload";
+import ClassroomUpload from "./ClassroomUpload";
+import SubjectAndTeacherUpload from "./SubjectAndTeacherUpload";
+
+export { BatchAndSubdivisionUpload, ClassroomUpload, SubjectAndTeacherUpload };
diff --git a/src/frontend/Pages/DataUpload.tsx b/src/frontend/Pages/DataUpload.tsx
@@ -0,0 +1,58 @@
+import React from "react";
+import {
+    ButtonGroup,
+    Card,
+    CardActionArea,
+    CardContent,
+    CardHeader,
+    List,
+    ListItem,
+    Paper,
+    Typography,
+} from "@mui/material";
+import {
+    BatchAndSubdivisionUpload,
+    ClassroomUpload,
+    SubjectAndTeacherUpload,
+} from "../Components/CSV";
+
+export default function DataUpload() {
+    return (
+        <Card
+            sx={{
+                display: "flex",
+                flexDirection: "column",
+                alignItems: "center",
+                maxWidth: "35rem",
+            }}
+            variant="outlined"
+        >
+            <CardHeader title={"DATA UPLOAD"} />
+            <CardContent>
+                <Typography>
+                    Use this page to upload the required data for the timetable generation. The data
+                    required is as follows:{" "}
+                    <List>
+                        <ListItem>1. Batch and Subdivision Data </ListItem>
+                        <ListItem>2. Classroom Data</ListItem>
+                        <ListItem>3. Subject and Teacher Data</ListItem>
+                    </List>
+                </Typography>
+            </CardContent>
+            <Paper
+                sx={{
+                    display: "flex",
+                    flexDirection: "column",
+                    maxWidth: "25rem",
+                    margin: "1rem",
+                    padding: "1rem",
+                }}
+                variant="outlined"
+            >
+                <BatchAndSubdivisionUpload />
+                <ClassroomUpload />
+                <SubjectAndTeacherUpload />
+            </Paper>
+        </Card>
+    );
+}