From b008b6005256c4d4a2238f78d4ada99b190c8c5e Mon Sep 17 00:00:00 2001
From: ludavidca <davidjylu7@gmail.com>
Date: Tue, 1 Apr 2025 21:51:52 -0400
Subject: [PATCH 1/6] Finished PR, need Big Dawg's approval

---
 src/components/FileUpload.tsx     |   4 -
 src/components/InputForm.tsx      |   7 +-
 src/components/LessonPlanView.tsx | 147 ++++++++++++++++++++++++++----
 3 files changed, 136 insertions(+), 22 deletions(-)

diff --git a/src/components/FileUpload.tsx b/src/components/FileUpload.tsx
index e13b6b33..655e452b 100644
--- a/src/components/FileUpload.tsx
+++ b/src/components/FileUpload.tsx
@@ -65,10 +65,6 @@ export const FileUpload: React.FC<FileUploadProps> = ({
 
   return (
     <FormControl>
-      <FormLabel>
-        <Text textStyle="h4">{label}</Text>
-      </FormLabel>
-
       <Box
         as="label"
         htmlFor="file-upload"
diff --git a/src/components/InputForm.tsx b/src/components/InputForm.tsx
index 5bceb19a..94c3cecd 100644
--- a/src/components/InputForm.tsx
+++ b/src/components/InputForm.tsx
@@ -347,7 +347,12 @@ const InputForm: React.FC<InputFormProps> = ({
           <FormErrorMessage>{errors.reasonOfAbsence}</FormErrorMessage>
         </FormControl>
 
-        <FileUpload lessonPlan={lessonPlan} setLessonPlan={setLessonPlan} />
+        <FormControl>
+          <FormLabel>
+            <Text textStyle="h4">Lesson Plan</Text>
+          </FormLabel>
+          <FileUpload lessonPlan={lessonPlan} setLessonPlan={setLessonPlan} />
+        </FormControl>
 
         <FormControl>
           <FormLabel sx={{ display: 'flex' }}>
diff --git a/src/components/LessonPlanView.tsx b/src/components/LessonPlanView.tsx
index c399324f..08a6dc48 100644
--- a/src/components/LessonPlanView.tsx
+++ b/src/components/LessonPlanView.tsx
@@ -6,15 +6,22 @@ import {
   Link,
   Text,
   useTheme,
+  VStack,
+  Button,
+  HStack,
+  useToast,
 } from '@chakra-ui/react';
 import { FiFileText } from 'react-icons/fi';
 import { VscArrowSwap } from 'react-icons/vsc';
+import { FileUpload } from './FileUpload';
+import React, { useState, useEffect } from 'react';
 
 const LessonPlanDisplay = ({
   href,
   fileName,
   fileSize,
   isUserAbsentTeacher,
+  onSwapClick,
 }) => {
   const theme = useTheme();
 
@@ -55,6 +62,7 @@ const LessonPlanDisplay = ({
           }
           size="sm"
           variant="ghost"
+          onClick={onSwapClick}
         />
       )}
     </Flex>
@@ -98,39 +106,144 @@ const NoLessonPlanViewingDisplay = ({
   );
 };
 
-const NoLessonPlanDeclaredDisplay = () => {
+const NoLessonPlanDeclaredDisplay = ({ onLessonPlanUploaded }) => {
   const theme = useTheme();
+  const toast = useToast();
 
+  const [lessonPlan, setLessonPlan] = useState<File | null>(null);
+  const [isSubmitting, setIsSubmitting] = useState(false);
+
+  const uploadFile = async (file) => {
+    const formData = new FormData();
+    formData.append('file', file);
+    formData.append('fileName', file.name);
+
+    const res = await fetch('/api/uploadFile/', {
+      method: 'POST',
+      body: formData,
+    });
+
+    if (!res.ok) {
+      const data = await res.json();
+      throw new Error(data.message || 'Failed to upload file');
+    }
+
+    const data = await res.json();
+    return `https://drive.google.com/file/d/${data.fileId}/view`;
+  };
+
+  const handleUploadFile = async (e) => {
+    e.preventDefault();
+    setIsSubmitting(true);
+
+    try {
+      if (lessonPlan) {
+        const lessonPlanUrl = await uploadFile(lessonPlan);
+        console.log('File uploaded successfully:', lessonPlanUrl);
+        setLessonPlan(null);
+
+        if (onLessonPlanUploaded) {
+          onLessonPlanUploaded(lessonPlanUrl);
+        }
+        //TODO: Add the patch to the DB, and also make sure that this component knows which absence to edit / interact with
+        toast({
+          title: 'Success',
+          description: `You have successfully uploaded your lesson plan.`,
+          status: 'success',
+          duration: 5000,
+          isClosable: true,
+        });
+      }
+    } catch (error) {
+      console.error('Error uploading file:', error);
+    } finally {
+      setIsSubmitting(false);
+    }
+  };
+
+  const handleCancel = (e) => {
+    e.preventDefault();
+    setLessonPlan(null);
+  };
   return (
-    <Flex width="100%">
-      <Text
-        fontSize={theme.textStyles.body.fontSize}
-        color={theme.colors.neutralGray[500]}
-      >
-        Upload PDF component
-      </Text>
-    </Flex>
+    <VStack>
+      <FileUpload lessonPlan={lessonPlan} setLessonPlan={setLessonPlan} />
+
+      {lessonPlan && (
+        <HStack width={'full'}>
+          <Button
+            type="submit"
+            colorScheme="blue"
+            fontSize="12px"
+            isLoading={isSubmitting}
+            loadingText="Submitting"
+            width="full"
+            height="44px"
+            onClick={handleUploadFile}
+          >
+            Save Changes
+          </Button>
+          <Button
+            colorScheme="gray"
+            fontSize="12px"
+            width="full"
+            height="44px"
+            onClick={handleCancel}
+          >
+            Cancel
+          </Button>
+        </HStack>
+      )}
+    </VStack>
   );
 };
 
 const LessonPlanView = ({
-  lessonPlan,
+  lessonPlan: initialLessonPlan,
   absentTeacherFirstName,
   isUserAbsentTeacher,
   isUserSubstituteTeacher,
 }) => {
-  const getFileName = (url) => (url ? 'File name' : '');
-  const getFileSize = (url) => (url ? 'File size' : '');
+  const [currentLessonPlan, setCurrentLessonPlan] = useState(initialLessonPlan);
+  const [showUploadForm, setShowUploadForm] = useState(false);
+
+  useEffect(() => {
+    setCurrentLessonPlan(initialLessonPlan);
+  }, [initialLessonPlan]);
+
+  const handleLessonPlanUploaded = (newLessonPlanUrl) => {
+    setCurrentLessonPlan(newLessonPlanUrl);
+    setShowUploadForm(false);
+  };
 
-  return lessonPlan ? (
+  const handleSwapClick = () => {
+    setShowUploadForm(true);
+  };
+
+  const getFileName = (url) =>
+    url ? url.split('/').pop() || 'Lesson Plan' : '';
+  const getFileSize = (url) => (url ? 'PDF Document' : '');
+
+  if (showUploadForm && isUserAbsentTeacher) {
+    return (
+      <NoLessonPlanDeclaredDisplay
+        onLessonPlanUploaded={handleLessonPlanUploaded}
+      />
+    );
+  }
+
+  return currentLessonPlan ? (
     <LessonPlanDisplay
-      href={lessonPlan}
-      fileName={getFileName(lessonPlan)}
-      fileSize={getFileSize(lessonPlan)}
+      href={currentLessonPlan}
+      fileName={getFileName(currentLessonPlan)}
+      fileSize={getFileSize(currentLessonPlan)}
       isUserAbsentTeacher={isUserAbsentTeacher}
+      onSwapClick={handleSwapClick}
     />
   ) : isUserAbsentTeacher ? (
-    <NoLessonPlanDeclaredDisplay />
+    <NoLessonPlanDeclaredDisplay
+      onLessonPlanUploaded={handleLessonPlanUploaded}
+    />
   ) : (
     <NoLessonPlanViewingDisplay
       absentTeacherFirstName={absentTeacherFirstName}

From cad8362f178f7a1f10fc75fd4b3d9256cf230635 Mon Sep 17 00:00:00 2001
From: Chinemerem <chinemeremchigbo@Outlook.com>
Date: Fri, 11 Apr 2025 17:29:18 -0400
Subject: [PATCH 2/6] Squash

---
 .../{InputForm.tsx => DeclareAbsenceForm.tsx} | 260 ++++----------
 src/components/EditAbsenceForm.tsx            | 322 ++++++++++++++++++
 src/components/FileUpload.tsx                 |  23 +-
 src/components/LessonPlanView.tsx             | 243 ++++++-------
 4 files changed, 509 insertions(+), 339 deletions(-)
 rename src/components/{InputForm.tsx => DeclareAbsenceForm.tsx} (50%)
 create mode 100644 src/components/EditAbsenceForm.tsx

diff --git a/src/components/InputForm.tsx b/src/components/DeclareAbsenceForm.tsx
similarity index 50%
rename from src/components/InputForm.tsx
rename to src/components/DeclareAbsenceForm.tsx
index b19f2ec3..1dc1badc 100644
--- a/src/components/InputForm.tsx
+++ b/src/components/DeclareAbsenceForm.tsx
@@ -5,44 +5,39 @@ import {
   FormErrorMessage,
   FormLabel,
   Input,
-  Modal,
-  ModalBody,
-  ModalContent,
-  ModalFooter,
-  ModalHeader,
-  ModalOverlay,
   Text,
   Textarea,
   VStack,
   useDisclosure,
   useToast,
 } from '@chakra-ui/react';
+import { submitAbsence } from '@utils/submitAbsence';
+import { validateAbsenceForm } from '@utils/validateAbsenceForm';
 
 import { Absence, Prisma } from '@prisma/client';
 import { useState } from 'react';
+import { AdminTeacherFields } from './AdminTeacherFields';
+import { ConfirmAbsenceModal } from './ConfirmAbsenceModal';
 import { DateOfAbsence } from './DateOfAbsence';
 import { FileUpload } from './FileUpload';
 import { InputDropdown } from './InputDropdown';
-import { SearchDropdown } from './SearchDropdown';
 
-interface InputFormProps {
+interface DeclareAbsenceFormProps {
   onClose?: () => void;
-  onDeclareAbsence: (
-    absence: Prisma.AbsenceCreateManyInput
-  ) => Promise<Absence | null>;
   userId: number;
   onTabChange: (tab: 'explore' | 'declared') => void;
   initialDate: Date;
   isAdminMode: boolean;
+  fetchAbsences: () => Promise<void>;
 }
 
-const InputForm: React.FC<InputFormProps> = ({
+const DeclareAbsenceForm: React.FC<DeclareAbsenceFormProps> = ({
   onClose,
-  onDeclareAbsence,
   userId,
   onTabChange,
   initialDate,
   isAdminMode,
+  fetchAbsences,
 }) => {
   const toast = useToast();
   const { isOpen, onOpen, onClose: closeModal } = useDisclosure();
@@ -61,24 +56,7 @@ const InputForm: React.FC<InputFormProps> = ({
   const [errors, setErrors] = useState<Record<string, string>>({});
 
   const validateForm = () => {
-    const newErrors: Record<string, string> = {};
-
-    if (!formData.absentTeacherId) {
-      newErrors.absentTeacherId = 'Absent teacher ID is required';
-    }
-    if (!formData.locationId) {
-      newErrors.locationId = 'Location ID is required';
-    }
-    if (!formData.subjectId) {
-      newErrors.subjectId = 'Subject ID is required';
-    }
-    if (!formData.reasonOfAbsence) {
-      newErrors.reasonOfAbsence = 'Reason of absence is required';
-    }
-    if (!formData.lessonDate) {
-      newErrors.lessonDate = 'Date is required';
-    }
-
+    const newErrors = validateAbsenceForm(formData);
     setErrors(newErrors);
     return Object.keys(newErrors).length === 0;
   };
@@ -120,80 +98,34 @@ const InputForm: React.FC<InputFormProps> = ({
     setIsSubmitting(true);
 
     try {
-      const lessonDate = new Date(formData.lessonDate + 'T00:00:00');
-
-      let lessonPlanData: { url: string; name: string; size: number } | null =
-        null;
-      if (lessonPlan) {
-        const lessonPlanUrl = await uploadFile(lessonPlan);
-
-        if (lessonPlanUrl === null) {
-          toast({
-            title: 'Error',
-            description: 'Failed to upload the lesson plan file',
-            status: 'error',
-            duration: 5000,
-            isClosable: true,
-          });
-          return;
-        }
-
-        lessonPlanData = {
-          url: lessonPlanUrl,
-          name: lessonPlan.name,
-          size: lessonPlan.size,
-        };
-      }
-
-      const absenceData = {
-        lessonDate: lessonDate,
-        reasonOfAbsence: formData.reasonOfAbsence,
-        absentTeacherId: parseInt(formData.absentTeacherId, 10),
-        substituteTeacherId: formData.substituteTeacherId
-          ? parseInt(formData.substituteTeacherId, 10)
-          : null,
-        locationId: parseInt(formData.locationId, 10),
-        subjectId: parseInt(formData.subjectId, 10),
-        notes: formData.notes,
-        roomNumber: formData.roomNumber || null,
-        lessonPlanFile: lessonPlanData,
-      };
-
-      const response = await onDeclareAbsence(absenceData);
-
-      if (response) {
-        const options: Intl.DateTimeFormatOptions = {
-          weekday: 'long',
-          month: 'long',
-          day: 'numeric',
-        };
-        const formattedLessonDate = lessonDate.toLocaleDateString(
-          'en-US',
-          options
-        );
+      const result = await submitAbsence({
+        formData,
+        lessonPlan,
+        onDeclareAbsence: handleDeclareAbsence,
+      });
 
+      if (result.success) {
         toast({
           title: 'Success',
-          description: `You have successfully declared an absence on ${formattedLessonDate}.`,
+          description: `You have successfully declared an absence on ${result.message}.`,
           status: 'success',
           duration: 5000,
           isClosable: true,
         });
 
-        if (
+        const userIsInvolved =
           parseInt(formData.substituteTeacherId, 10) === userId ||
-          parseInt(formData.absentTeacherId, 10) === userId
-        ) {
+          parseInt(formData.absentTeacherId, 10) === userId;
+
+        if (userIsInvolved) {
           onTabChange('declared');
         }
 
-        if (onClose) {
-          onClose();
-        }
+        onClose?.();
       } else {
         toast({
           title: 'Error',
-          description: 'Failed to declare absence',
+          description: result.message,
           status: 'error',
           duration: 5000,
           isClosable: true,
@@ -213,23 +145,27 @@ const InputForm: React.FC<InputFormProps> = ({
     }
   };
 
-  const uploadFile = async (file: File): Promise<string | null> => {
-    const formData = new FormData();
-    formData.append('file', file);
-    formData.append('fileName', file.name);
+  const handleDeclareAbsence = async (
+    absence: Prisma.AbsenceCreateManyInput
+  ): Promise<Absence | null> => {
+    try {
+      const res = await fetch('/api/declareAbsence', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify(absence),
+      });
 
-    const res = await fetch('/api/uploadFile/', {
-      method: 'POST',
-      body: formData,
-    });
+      if (!res.ok) {
+        throw new Error(`Failed to add absence: ${res.statusText}`);
+      }
 
-    if (!res.ok) {
-      const data = await res.json();
-      throw new Error(data.message || 'Failed to upload file');
+      const addedAbsence = await res.json();
+      await fetchAbsences();
+      return addedAbsence;
+    } catch (error) {
+      console.error('Error adding absence:', error);
+      return null;
     }
-
-    const data = await res.json();
-    return `https://drive.google.com/file/d/${data.fileId}/view`;
   };
 
   const handleDateSelect = (date: Date) => {
@@ -249,58 +185,12 @@ const InputForm: React.FC<InputFormProps> = ({
     >
       <VStack sx={{ gap: '24px' }}>
         {isAdminMode && (
-          <>
-            <FormControl isRequired isInvalid={!!errors.absentTeacherId}>
-              <FormLabel sx={{ display: 'flex' }}>
-                <Text textStyle="h4">Teacher Absent</Text>
-              </FormLabel>
-              <SearchDropdown
-                label="Teacher"
-                type="user"
-                excludedId={formData.substituteTeacherId}
-                onChange={(value) => {
-                  // Handle selected subject
-                  setFormData((prev) => ({
-                    ...prev,
-                    absentTeacherId: value ? String(value.id) : '',
-                  }));
-                  // Clear error when user selects a value
-                  if (errors.absentTeacherId) {
-                    setErrors((prev) => ({
-                      ...prev,
-                      absentTeacherId: '',
-                    }));
-                  }
-                }}
-              />
-              <FormErrorMessage>{errors.absentTeacherId}</FormErrorMessage>
-            </FormControl>
-
-            <FormControl>
-              <FormLabel sx={{ display: 'flex' }}>
-                <Text textStyle="h4">Substitute Teacher</Text>
-              </FormLabel>
-              <SearchDropdown
-                label="Teacher"
-                type="user"
-                excludedId={formData.absentTeacherId}
-                onChange={(value) => {
-                  // Handle selected subject
-                  setFormData((prev) => ({
-                    ...prev,
-                    substituteTeacherId: value ? String(value.id) : '',
-                  }));
-                  // Clear error when user selects a value
-                  if (errors.substituteTeacherId) {
-                    setErrors((prev) => ({
-                      ...prev,
-                      substituteTeacherId: '',
-                    }));
-                  }
-                }}
-              />
-            </FormControl>
-          </>
+          <AdminTeacherFields
+            formData={formData}
+            errors={errors}
+            setFormData={setFormData}
+            setErrors={setErrors}
+          />
         )}
 
         <FormControl isRequired isInvalid={!!errors.subjectId}>
@@ -308,7 +198,7 @@ const InputForm: React.FC<InputFormProps> = ({
             <Text textStyle="h4">Subject</Text>
           </FormLabel>
           <InputDropdown
-            label="class type"
+            label="subject"
             type="subject"
             onChange={(value) => {
               setFormData((prev) => ({
@@ -331,7 +221,7 @@ const InputForm: React.FC<InputFormProps> = ({
             <Text textStyle="h4">Location</Text>
           </FormLabel>
           <InputDropdown
-            label="class location"
+            label="location"
             type="location"
             onChange={(value) => {
               setFormData((prev) => ({
@@ -349,10 +239,11 @@ const InputForm: React.FC<InputFormProps> = ({
           <FormErrorMessage>{errors.locationId}</FormErrorMessage>
         </FormControl>
         <FormControl>
-          <FormLabel sx={{ display: 'flex' }}>
+          <FormLabel htmlFor="roomNumber" sx={{ display: 'flex' }}>
             <Text textStyle="h4">Room Number</Text>
           </FormLabel>
           <Input
+            id="roomNumber"
             name="roomNumber"
             placeholder="e.g. 2131"
             value={formData.roomNumber}
@@ -366,10 +257,11 @@ const InputForm: React.FC<InputFormProps> = ({
         />
 
         <FormControl isRequired isInvalid={!!errors.reasonOfAbsence}>
-          <FormLabel sx={{ display: 'flex' }}>
+          <FormLabel htmlFor="reasonOfAbsence" sx={{ display: 'flex' }}>
             <Text textStyle="h4">Reason of Absence</Text>
           </FormLabel>
           <Textarea
+            id="reasonOfAbsence"
             name="reasonOfAbsence"
             placeholder="Only visible to admin"
             value={formData.reasonOfAbsence}
@@ -380,17 +272,18 @@ const InputForm: React.FC<InputFormProps> = ({
         </FormControl>
 
         <FormControl>
-          <FormLabel>
-            <Text textStyle="h4">Lesson Plan</Text>
-          </FormLabel>
+          <Text textStyle="h4" mb={2}>
+            Lesson Plan
+          </Text>
           <FileUpload lessonPlan={lessonPlan} setLessonPlan={setLessonPlan} />
         </FormControl>
 
         <FormControl>
-          <FormLabel sx={{ display: 'flex' }}>
+          <FormLabel htmlFor="notes" sx={{ display: 'flex' }}>
             <Text textStyle="h4">Notes</Text>
           </FormLabel>
           <Textarea
+            id="notes"
             name="notes"
             placeholder="Additional relevant info..."
             value={formData.notes}
@@ -410,38 +303,15 @@ const InputForm: React.FC<InputFormProps> = ({
         </Button>
       </VStack>
 
-      <Modal isOpen={isOpen} onClose={closeModal} isCentered>
-        <ModalOverlay />
-        <ModalContent>
-          <ModalHeader>Confirm Absence</ModalHeader>
-          <ModalBody>
-            <Text>
-              Please confirm your absence on{' '}
-              <strong>
-                {new Date(formData.lessonDate + 'T00:00:00').toLocaleDateString(
-                  'en-CA',
-                  {
-                    weekday: 'long',
-                    month: 'long',
-                    day: 'numeric',
-                  }
-                )}
-              </strong>
-              .
-            </Text>
-          </ModalBody>
-          <ModalFooter>
-            <Button onClick={closeModal} mr={3}>
-              Cancel
-            </Button>
-            <Button onClick={handleConfirmSubmit} isLoading={isSubmitting}>
-              Confirm
-            </Button>
-          </ModalFooter>
-        </ModalContent>
-      </Modal>
+      <ConfirmAbsenceModal
+        isOpen={isOpen}
+        onClose={closeModal}
+        onConfirm={handleConfirmSubmit}
+        isSubmitting={isSubmitting}
+        lessonDate={formData.lessonDate}
+      />
     </Box>
   );
 };
 
-export default InputForm;
+export default DeclareAbsenceForm;
diff --git a/src/components/EditAbsenceForm.tsx b/src/components/EditAbsenceForm.tsx
new file mode 100644
index 00000000..2db6a8e8
--- /dev/null
+++ b/src/components/EditAbsenceForm.tsx
@@ -0,0 +1,322 @@
+import {
+  Box,
+  Button,
+  FormControl,
+  FormErrorMessage,
+  FormLabel,
+  Input,
+  Text,
+  Textarea,
+  VStack,
+  useDisclosure,
+  useToast,
+} from '@chakra-ui/react';
+import { Absence } from '@prisma/client';
+
+import { submitAbsence } from '@utils/submitAbsence';
+import { EventDetails } from '@utils/types';
+import { validateAbsenceForm } from '@utils/validateAbsenceForm';
+import { useState } from 'react';
+import { AdminTeacherFields } from './AdminTeacherFields';
+import { ConfirmEditModal } from './ConfirmEditModal';
+import { DateOfAbsence } from './DateOfAbsence';
+import { FileUpload } from './FileUpload';
+import { InputDropdown } from './InputDropdown';
+
+interface EditAbsenceFormProps {
+  onClose?: () => void;
+  onFinishedEdit?: () => void;
+  initialData: EventDetails;
+  isAdminMode: boolean;
+  fetchAbsences: () => Promise<void>;
+}
+
+const EditAbsenceForm: React.FC<EditAbsenceFormProps> = ({
+  onClose,
+  onFinishedEdit,
+  initialData,
+  isAdminMode,
+  fetchAbsences,
+}) => {
+  const toast = useToast();
+  const { isOpen, onOpen, onClose: closeModal } = useDisclosure();
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const [formData, setFormData] = useState({
+    reasonOfAbsence: initialData.reasonOfAbsence,
+    absentTeacherId: String(initialData.absentTeacher.id),
+    substituteTeacherId: initialData.substituteTeacher
+      ? String(initialData.substituteTeacher.id)
+      : '',
+    locationId: String(initialData.locationId),
+    subjectId: String(initialData.subjectId),
+    roomNumber: initialData.roomNumber || '',
+    lessonDate: initialData.start.toLocaleDateString('en-CA'),
+    notes: initialData.notes || '',
+  });
+
+  const [lessonPlan, setLessonPlan] = useState<File | null>(null);
+  const existingLessonPlan = initialData.lessonPlan || null;
+
+  const [errors, setErrors] = useState<Record<string, string>>({});
+
+  const validateForm = () => {
+    const newErrors = validateAbsenceForm(formData);
+    setErrors(newErrors);
+    return Object.keys(newErrors).length === 0;
+  };
+
+  const handleChange = (
+    e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>
+  ) => {
+    const { name, value } = e.target;
+    setFormData((prev) => ({
+      ...prev,
+      [name]: value,
+    }));
+
+    if (errors[name]) {
+      setErrors((prev) => ({
+        ...prev,
+        [name]: '',
+      }));
+    }
+  };
+
+  const handleSubmit = (e: React.FormEvent) => {
+    e.preventDefault();
+
+    if (!validateForm()) {
+      toast({
+        title: 'Validation Error',
+        description: 'Please fill in all required fields correctly.',
+        status: 'error',
+        duration: 5000,
+        isClosable: true,
+      });
+      return;
+    }
+
+    onOpen();
+  };
+
+  const handleConfirmSubmit = async () => {
+    closeModal();
+    setIsSubmitting(true);
+
+    try {
+      const result = await submitAbsence({
+        formData: { ...formData, id: initialData.absenceId },
+        lessonPlan,
+        onEditAbsence: handleEditAbsence,
+      });
+
+      if (result.success) {
+        toast({
+          title: 'Success',
+          description: `Absence updated successfully.`,
+          status: 'success',
+          duration: 5000,
+          isClosable: true,
+        });
+
+        fetchAbsences();
+        onClose?.();
+        onFinishedEdit?.();
+      } else {
+        toast({
+          title: 'Error',
+          description: result.message,
+          status: 'error',
+          duration: 5000,
+          isClosable: true,
+        });
+      }
+    } catch (error) {
+      toast({
+        title: 'Error',
+        description:
+          error instanceof Error ? error.message : 'Failed to update absence',
+        status: 'error',
+        duration: 5000,
+        isClosable: true,
+      });
+    } finally {
+      setIsSubmitting(false);
+    }
+  };
+
+  const handleEditAbsence = async (
+    absence: Partial<Absence> & { id: number }
+  ): Promise<boolean> => {
+    try {
+      const res = await fetch('/api/editAbsence', {
+        method: 'PUT',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify(absence),
+      });
+
+      if (!res.ok) {
+        throw new Error(`Failed to update absence: ${res.statusText}`);
+      }
+
+      await fetchAbsences();
+      return true;
+    } catch (error) {
+      console.error('Error editing absence:', error);
+      return false;
+    }
+  };
+
+  const handleDateSelect = (date: Date) => {
+    setFormData((prev) => ({
+      ...prev,
+      lessonDate: date.toISOString().split('T')[0],
+    }));
+  };
+
+  return (
+    <Box
+      as="form"
+      onSubmit={handleSubmit}
+      sx={{
+        label: { fontSize: '14px', fontWeight: '400' },
+      }}
+    >
+      <VStack sx={{ gap: '24px' }}>
+        {isAdminMode && (
+          <AdminTeacherFields
+            formData={formData}
+            errors={errors}
+            setFormData={setFormData}
+            setErrors={setErrors}
+          />
+        )}
+
+        <FormControl isRequired isInvalid={!!errors.subjectId}>
+          <FormLabel sx={{ display: 'flex' }}>
+            <Text textStyle="h4">Subject</Text>
+          </FormLabel>
+          <InputDropdown
+            label="subject"
+            type="subject"
+            onChange={(value) => {
+              setFormData((prev) => ({
+                ...prev,
+                subjectId: value ? String(value.id) : '',
+              }));
+              if (errors.subjectId) {
+                setErrors((prev) => ({
+                  ...prev,
+                  subjectId: '',
+                }));
+              }
+            }}
+            defaultValueId={Number(formData.subjectId)}
+          />
+          <FormErrorMessage>{errors.subjectId}</FormErrorMessage>
+        </FormControl>
+
+        <FormControl isRequired isInvalid={!!errors.locationId}>
+          <FormLabel sx={{ display: 'flex' }}>
+            <Text textStyle="h4">Location</Text>
+          </FormLabel>
+          <InputDropdown
+            label="location"
+            type="location"
+            onChange={(value) => {
+              setFormData((prev) => ({
+                ...prev,
+                locationId: value ? String(value.id) : '',
+              }));
+              if (errors.locationId) {
+                setErrors((prev) => ({
+                  ...prev,
+                  locationId: '',
+                }));
+              }
+            }}
+            defaultValueId={Number(formData.locationId)}
+          />
+          <FormErrorMessage>{errors.locationId}</FormErrorMessage>
+        </FormControl>
+
+        <FormControl>
+          <FormLabel htmlFor="roomNumber" sx={{ display: 'flex' }}>
+            <Text textStyle="h4">Room Number</Text>
+          </FormLabel>
+          <Input
+            id="roomNumber"
+            name="roomNumber"
+            placeholder="e.g. 2131"
+            value={formData.roomNumber}
+            onChange={handleChange}
+          />
+        </FormControl>
+
+        <DateOfAbsence
+          dateValue={initialData.start}
+          onDateSelect={handleDateSelect}
+          error={errors.lessonDate}
+        />
+
+        <FormControl isRequired isInvalid={!!errors.reasonOfAbsence}>
+          <FormLabel htmlFor="reasonOfAbsence" sx={{ display: 'flex' }}>
+            <Text textStyle="h4">Reason of Absence</Text>
+          </FormLabel>
+          <Textarea
+            id="reasonOfAbsence"
+            name="reasonOfAbsence"
+            placeholder="Only visible to admin"
+            value={formData.reasonOfAbsence}
+            onChange={handleChange}
+            minH="88px"
+          />
+          <FormErrorMessage>{errors.reasonOfAbsence}</FormErrorMessage>
+        </FormControl>
+
+        <FormControl>
+          <Text textStyle="h4" mb={2}>
+            Lesson Plan
+          </Text>
+          <FileUpload
+            lessonPlan={lessonPlan}
+            setLessonPlan={setLessonPlan}
+            existingFile={existingLessonPlan}
+          />
+        </FormControl>
+
+        <FormControl>
+          <FormLabel htmlFor="notes" sx={{ display: 'flex' }}>
+            <Text textStyle="h4">Notes</Text>
+          </FormLabel>
+          <Textarea
+            id="notes"
+            name="notes"
+            placeholder="Additional relevant info..."
+            value={formData.notes}
+            onChange={handleChange}
+            minH="88px"
+          />
+        </FormControl>
+
+        <Button
+          type="submit"
+          isLoading={isSubmitting}
+          loadingText="Updating"
+          width="full"
+          height="44px"
+        >
+          Save Changes
+        </Button>
+      </VStack>
+      <ConfirmEditModal
+        isOpen={isOpen}
+        onClose={closeModal}
+        onConfirm={handleConfirmSubmit}
+        isSubmitting={isSubmitting}
+      />
+    </Box>
+  );
+};
+
+export default EditAbsenceForm;
diff --git a/src/components/FileUpload.tsx b/src/components/FileUpload.tsx
index 655e452b..398d8a00 100644
--- a/src/components/FileUpload.tsx
+++ b/src/components/FileUpload.tsx
@@ -1,24 +1,24 @@
 import {
   Box,
   FormControl,
-  FormLabel,
   Image,
   Input,
   Text,
   useToast,
 } from '@chakra-ui/react';
+import { LessonPlanFile } from '@utils/types';
 import { useRef, useState } from 'react';
 
 interface FileUploadProps {
   lessonPlan: File | null;
-  setLessonPlan: (lessonPlan: File | null) => void;
-  label?: string;
+  setLessonPlan: (file: File | null) => void;
+  existingFile?: LessonPlanFile | null;
 }
 
 export const FileUpload: React.FC<FileUploadProps> = ({
   lessonPlan,
   setLessonPlan,
-  label = 'Lesson Plan',
+  existingFile,
 }) => {
   const [isDragging, setIsDragging] = useState(false);
   const inputRef = useRef<HTMLInputElement>(null);
@@ -64,10 +64,10 @@ export const FileUpload: React.FC<FileUploadProps> = ({
   };
 
   return (
-    <FormControl>
+    <>
       <Box
         as="label"
-        htmlFor="file-upload"
+        htmlFor="fileUpload"
         border="1px dashed"
         borderColor={isDragging ? 'primaryBlue.300' : 'outline'}
         borderRadius="10px"
@@ -84,18 +84,23 @@ export const FileUpload: React.FC<FileUploadProps> = ({
       >
         <Image src="/images/upload.svg" alt="Upload" width={10} height={10} />
         <Text textStyle="subtitle">
-          {lessonPlan ? `Selected file: ${lessonPlan.name}` : 'Upload PDF'}
+          {lessonPlan
+            ? `Selected file: ${lessonPlan.name}`
+            : existingFile
+              ? `Selected file: ${existingFile.name}`
+              : 'Upload PDF'}
         </Text>
       </Box>
 
       <Input
-        id="file-upload"
+        id="fileUpload"
+        name="fileUpload"
         ref={inputRef}
         type="file"
         onChange={handleFileChange}
         accept="application/pdf"
         display="none"
       />
-    </FormControl>
+    </>
   );
 };
diff --git a/src/components/LessonPlanView.tsx b/src/components/LessonPlanView.tsx
index 3daedb6c..d459eb81 100644
--- a/src/components/LessonPlanView.tsx
+++ b/src/components/LessonPlanView.tsx
@@ -3,18 +3,17 @@ import {
   Flex,
   IconButton,
   Image,
+  Input,
   Link,
   Text,
   useTheme,
-  VStack,
-  Button,
-  HStack,
   useToast,
 } from '@chakra-ui/react';
+import { LessonPlanFile } from '@utils/types';
+import { uploadFile } from '@utils/uploadFile';
+import { useEffect, useRef, useState } from 'react';
 import { FiFileText } from 'react-icons/fi';
-import { VscArrowSwap } from 'react-icons/vsc';
 import { FileUpload } from './FileUpload';
-import React, { useState, useEffect } from 'react';
 
 const formatFileSize = (sizeInBytes: number) => {
   if (sizeInBytes === 0) return '0 B';
@@ -36,8 +35,9 @@ const LessonPlanDisplay = ({
   fileName,
   fileSize,
   isUserAbsentTeacher,
-  onSwapClick,
   isAdminMode,
+  onSwap,
+  isDisabled,
 }) => {
   const theme = useTheme();
 
@@ -68,6 +68,7 @@ const LessonPlanDisplay = ({
             )}
           </Box>
         </Flex>
+
         {isUserAbsentTeacher && !isAdminMode && (
           <IconButton
             aria-label="Swap Lesson Plan"
@@ -81,7 +82,8 @@ const LessonPlanDisplay = ({
             }
             size="sm"
             variant="ghost"
-            onClick={onSwapClick}
+            onClick={onSwap}
+            isDisabled={isDisabled}
           />
         )}
       </Flex>
@@ -126,155 +128,126 @@ const NoLessonPlanViewingDisplay = ({
   );
 };
 
-const NoLessonPlanDeclaredDisplay = ({ onLessonPlanUploaded }) => {
-  const theme = useTheme();
+const LessonPlanView = ({
+  lessonPlan,
+  absentTeacherFirstName,
+  isUserAbsentTeacher,
+  isUserSubstituteTeacher,
+  isAdminMode,
+  absenceId,
+  fetchAbsences,
+}) => {
+  const fileInputRef = useRef<HTMLInputElement | null>(null);
   const toast = useToast();
+  const [isUploading, setIsUploading] = useState(false);
+  const [localLessonPlan, setLocalLessonPlan] = useState<LessonPlanFile | null>(
+    lessonPlan
+  );
 
-  const [lessonPlan, setLessonPlan] = useState<File | null>(null);
-  const [isSubmitting, setIsSubmitting] = useState(false);
-
-  const uploadFile = async (file) => {
-    const formData = new FormData();
-    formData.append('file', file);
-    formData.append('fileName', file.name);
-
-    const res = await fetch('/api/uploadFile/', {
-      method: 'POST',
-      body: formData,
-    });
-
-    if (!res.ok) {
-      const data = await res.json();
-      throw new Error(data.message || 'Failed to upload file');
-    }
+  useEffect(() => {
+    setLocalLessonPlan(lessonPlan);
+  }, [lessonPlan]);
 
-    const data = await res.json();
-    return `https://drive.google.com/file/d/${data.fileId}/view`;
+  const handleSwap = (e: React.MouseEvent) => {
+    e.preventDefault();
+    e.stopPropagation();
+    fileInputRef.current?.click();
   };
 
-  const handleUploadFile = async (e) => {
-    e.preventDefault();
-    setIsSubmitting(true);
+  const handleFileUpload = async (file: File) => {
+    if (!file || file.type !== 'application/pdf') return;
 
-    try {
-      if (lessonPlan) {
-        const lessonPlanUrl = await uploadFile(lessonPlan);
-        console.log('File uploaded successfully:', lessonPlanUrl);
-        setLessonPlan(null);
+    setIsUploading(true);
 
-        if (onLessonPlanUploaded) {
-          onLessonPlanUploaded(lessonPlanUrl);
-        }
-        //TODO: Add the patch to the DB, and also make sure that this component knows which absence to edit / interact with
-        toast({
-          title: 'Success',
-          description: `You have successfully uploaded your lesson plan.`,
-          status: 'success',
-          duration: 5000,
-          isClosable: true,
-        });
-      }
-    } catch (error) {
-      console.error('Error uploading file:', error);
-    } finally {
-      setIsSubmitting(false);
+    const fileUrl = await uploadFile(file);
+    if (!fileUrl) {
+      toast({
+        title: 'Upload failed',
+        description: 'Could not upload the lesson plan file.',
+        status: 'error',
+        duration: 5000,
+        isClosable: true,
+      });
+      setIsUploading(false);
+      return;
     }
-  };
 
-  const handleCancel = (e) => {
-    e.preventDefault();
-    setLessonPlan(null);
-  };
-  return (
-    <VStack>
-      <FileUpload lessonPlan={lessonPlan} setLessonPlan={setLessonPlan} />
+    const res = await fetch('/api/editAbsence', {
+      method: 'PUT',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({
+        id: absenceId,
+        lessonPlanFile: {
+          name: file.name,
+          size: file.size,
+          url: fileUrl,
+        },
+      }),
+    });
 
-      {lessonPlan && (
-        <HStack width={'full'}>
-          <Button
-            type="submit"
-            colorScheme="blue"
-            fontSize="12px"
-            isLoading={isSubmitting}
-            loadingText="Submitting"
-            width="full"
-            height="44px"
-            onClick={handleUploadFile}
-          >
-            Save Changes
-          </Button>
-          <Button
-            colorScheme="gray"
-            fontSize="12px"
-            width="full"
-            height="44px"
-            onClick={handleCancel}
-          >
-            Cancel
-          </Button>
-        </HStack>
-      )}
-    </VStack>
-  );
-};
+    if (res.ok) {
+      const updatedPlan: LessonPlanFile = {
+        id: -1,
+        name: file.name,
+        size: file.size,
+        url: fileUrl,
+      };
 
-const LessonPlanView = ({
-  lessonPlan: initialLessonPlan,
-  absentTeacherFirstName,
-  isUserAbsentTeacher,
-  isUserSubstituteTeacher,
-  isAdminMode,
-}) => {
-  const [currentLessonPlan, setCurrentLessonPlan] = useState(initialLessonPlan);
-  const [showUploadForm, setShowUploadForm] = useState(false);
+      setLocalLessonPlan(updatedPlan);
 
-  useEffect(() => {
-    setCurrentLessonPlan(initialLessonPlan);
-  }, [initialLessonPlan]);
+      toast({
+        title: 'Lesson Plan Updated',
+        description: 'Your lesson plan was successfully swapped.',
+        status: 'success',
+        duration: 5000,
+        isClosable: true,
+      });
 
-  const handleLessonPlanUploaded = (newLessonPlanUrl) => {
-    setCurrentLessonPlan(newLessonPlanUrl);
-    setShowUploadForm(false);
-  };
+      await fetchAbsences?.();
+    } else {
+      toast({
+        title: 'Update failed',
+        description: 'There was a problem updating the lesson plan.',
+        status: 'error',
+        duration: 5000,
+        isClosable: true,
+      });
+    }
 
-  const handleSwapClick = () => {
-    setShowUploadForm(true);
+    setIsUploading(false);
   };
 
-  const getFileName = (url) =>
-    url ? url.split('/').pop() || 'Lesson Plan' : '';
-  const getFileSize = (url) => (url ? 'PDF Document' : '');
-
-  if (showUploadForm && isUserAbsentTeacher) {
-    return (
-      <NoLessonPlanDeclaredDisplay
-        onLessonPlanUploaded={handleLessonPlanUploaded}
-      />
-    );
-  }
-
-  if (currentLessonPlan) {
-    return (
+  return localLessonPlan ? (
+    <>
       <LessonPlanDisplay
-        href={currentLessonPlan.url}
-        fileName={currentLessonPlan.name}
-        fileSize={currentLessonPlan.size}
+        href={localLessonPlan.url}
+        fileName={localLessonPlan.name}
+        fileSize={localLessonPlan.size}
         isUserAbsentTeacher={isUserAbsentTeacher}
         isAdminMode={isAdminMode}
-        onSwapClick={handleSwapClick}
+        onSwap={handleSwap}
+        isDisabled={isUploading}
       />
-    );
-  }
-
-  if (isUserAbsentTeacher && !isAdminMode) {
-    return (
-      <NoLessonPlanDeclaredDisplay
-        onLessonPlanUploaded={handleLessonPlanUploaded}
+      <Input
+        type="file"
+        ref={fileInputRef}
+        display="none"
+        accept="application/pdf"
+        onChange={(e) => {
+          const file = e.target.files?.[0];
+          if (file) {
+            handleFileUpload(file);
+          }
+        }}
       />
-    );
-  }
-
-  return (
+    </>
+  ) : isUserAbsentTeacher && !isAdminMode ? (
+    <FileUpload
+      lessonPlan={null}
+      setLessonPlan={handleFileUpload}
+      existingFile={null}
+    />
+  ) : (
     <NoLessonPlanViewingDisplay
       absentTeacherFirstName={absentTeacherFirstName}
       isUserSubstituteTeacher={isUserSubstituteTeacher}

From 38d6091a62f7116e29a4a0ead818ee1526768718 Mon Sep 17 00:00:00 2001
From: Chinemerem <chinemeremchigbo@Outlook.com>
Date: Fri, 11 Apr 2025 17:31:11 -0400
Subject: [PATCH 3/6] Squash lesson plan

---
 src/components/DeclareAbsenceForm.tsx |  7 ++++++-
 src/components/EditAbsenceForm.tsx    | 15 ++++++++++-----
 src/components/FileUpload.tsx         |  9 ++-------
 3 files changed, 18 insertions(+), 13 deletions(-)

diff --git a/src/components/DeclareAbsenceForm.tsx b/src/components/DeclareAbsenceForm.tsx
index 7f160fef..1dc1badc 100644
--- a/src/components/DeclareAbsenceForm.tsx
+++ b/src/components/DeclareAbsenceForm.tsx
@@ -271,7 +271,12 @@ const DeclareAbsenceForm: React.FC<DeclareAbsenceFormProps> = ({
           <FormErrorMessage>{errors.reasonOfAbsence}</FormErrorMessage>
         </FormControl>
 
-        <FileUpload lessonPlan={lessonPlan} setLessonPlan={setLessonPlan} />
+        <FormControl>
+          <Text textStyle="h4" mb={2}>
+            Lesson Plan
+          </Text>
+          <FileUpload lessonPlan={lessonPlan} setLessonPlan={setLessonPlan} />
+        </FormControl>
 
         <FormControl>
           <FormLabel htmlFor="notes" sx={{ display: 'flex' }}>
diff --git a/src/components/EditAbsenceForm.tsx b/src/components/EditAbsenceForm.tsx
index 6a4b9d0a..2db6a8e8 100644
--- a/src/components/EditAbsenceForm.tsx
+++ b/src/components/EditAbsenceForm.tsx
@@ -274,11 +274,16 @@ const EditAbsenceForm: React.FC<EditAbsenceFormProps> = ({
           <FormErrorMessage>{errors.reasonOfAbsence}</FormErrorMessage>
         </FormControl>
 
-        <FileUpload
-          lessonPlan={lessonPlan}
-          setLessonPlan={setLessonPlan}
-          existingFile={existingLessonPlan}
-        />
+        <FormControl>
+          <Text textStyle="h4" mb={2}>
+            Lesson Plan
+          </Text>
+          <FileUpload
+            lessonPlan={lessonPlan}
+            setLessonPlan={setLessonPlan}
+            existingFile={existingLessonPlan}
+          />
+        </FormControl>
 
         <FormControl>
           <FormLabel htmlFor="notes" sx={{ display: 'flex' }}>
diff --git a/src/components/FileUpload.tsx b/src/components/FileUpload.tsx
index b2e6472f..398d8a00 100644
--- a/src/components/FileUpload.tsx
+++ b/src/components/FileUpload.tsx
@@ -13,14 +13,12 @@ interface FileUploadProps {
   lessonPlan: File | null;
   setLessonPlan: (file: File | null) => void;
   existingFile?: LessonPlanFile | null;
-  label?: string;
 }
 
 export const FileUpload: React.FC<FileUploadProps> = ({
   lessonPlan,
   setLessonPlan,
   existingFile,
-  label = 'Lesson Plan',
 }) => {
   const [isDragging, setIsDragging] = useState(false);
   const inputRef = useRef<HTMLInputElement>(null);
@@ -66,10 +64,7 @@ export const FileUpload: React.FC<FileUploadProps> = ({
   };
 
   return (
-    <FormControl>
-      <Text textStyle="h4" mb={2}>
-        {label}
-      </Text>
+    <>
       <Box
         as="label"
         htmlFor="fileUpload"
@@ -106,6 +101,6 @@ export const FileUpload: React.FC<FileUploadProps> = ({
         accept="application/pdf"
         display="none"
       />
-    </FormControl>
+    </>
   );
 };

From 8c28b4bf7cb63ce0c62ea49129d9efdf6753204a Mon Sep 17 00:00:00 2001
From: Chinemerem <chinemeremchigbo@Outlook.com>
Date: Fri, 11 Apr 2025 17:32:12 -0400
Subject: [PATCH 4/6] Update dataModel.json

---
 prisma/seed/.snaplet/dataModel.json | 248 +++++++++++++++++++++-------
 1 file changed, 187 insertions(+), 61 deletions(-)

diff --git a/prisma/seed/.snaplet/dataModel.json b/prisma/seed/.snaplet/dataModel.json
index 806dd11d..da384f54 100644
--- a/prisma/seed/.snaplet/dataModel.json
+++ b/prisma/seed/.snaplet/dataModel.json
@@ -24,10 +24,10 @@
           "maxLength": null
         },
         {
-          "id": "public.Absence.lessonDate",
-          "name": "lessonDate",
-          "columnName": "lessonDate",
-          "type": "timestamp",
+          "id": "public.Absence.absentTeacherId",
+          "name": "absentTeacherId",
+          "columnName": "absentTeacherId",
+          "type": "int4",
           "isRequired": true,
           "kind": "scalar",
           "isList": false,
@@ -38,10 +38,10 @@
           "maxLength": null
         },
         {
-          "id": "public.Absence.reasonOfAbsence",
-          "name": "reasonOfAbsence",
-          "columnName": "reasonOfAbsence",
-          "type": "text",
+          "id": "public.Absence.lessonDate",
+          "name": "lessonDate",
+          "columnName": "lessonDate",
+          "type": "timestamp",
           "isRequired": true,
           "kind": "scalar",
           "isList": false,
@@ -52,11 +52,11 @@
           "maxLength": null
         },
         {
-          "id": "public.Absence.notes",
-          "name": "notes",
-          "columnName": "notes",
+          "id": "public.Absence.reasonOfAbsence",
+          "name": "reasonOfAbsence",
+          "columnName": "reasonOfAbsence",
           "type": "text",
-          "isRequired": false,
+          "isRequired": true,
           "kind": "scalar",
           "isList": false,
           "isGenerated": false,
@@ -66,10 +66,10 @@
           "maxLength": null
         },
         {
-          "id": "public.Absence.roomNumber",
-          "name": "roomNumber",
-          "columnName": "roomNumber",
-          "type": "text",
+          "id": "public.Absence.substituteTeacherId",
+          "name": "substituteTeacherId",
+          "columnName": "substituteTeacherId",
+          "type": "int4",
           "isRequired": false,
           "kind": "scalar",
           "isList": false,
@@ -80,9 +80,9 @@
           "maxLength": null
         },
         {
-          "id": "public.Absence.absentTeacherId",
-          "name": "absentTeacherId",
-          "columnName": "absentTeacherId",
+          "id": "public.Absence.locationId",
+          "name": "locationId",
+          "columnName": "locationId",
           "type": "int4",
           "isRequired": true,
           "kind": "scalar",
@@ -94,11 +94,11 @@
           "maxLength": null
         },
         {
-          "id": "public.Absence.substituteTeacherId",
-          "name": "substituteTeacherId",
-          "columnName": "substituteTeacherId",
+          "id": "public.Absence.subjectId",
+          "name": "subjectId",
+          "columnName": "subjectId",
           "type": "int4",
-          "isRequired": false,
+          "isRequired": true,
           "kind": "scalar",
           "isList": false,
           "isGenerated": false,
@@ -108,11 +108,11 @@
           "maxLength": null
         },
         {
-          "id": "public.Absence.locationId",
-          "name": "locationId",
-          "columnName": "locationId",
-          "type": "int4",
-          "isRequired": true,
+          "id": "public.Absence.notes",
+          "name": "notes",
+          "columnName": "notes",
+          "type": "text",
+          "isRequired": false,
           "kind": "scalar",
           "isList": false,
           "isGenerated": false,
@@ -122,11 +122,11 @@
           "maxLength": null
         },
         {
-          "id": "public.Absence.subjectId",
-          "name": "subjectId",
-          "columnName": "subjectId",
-          "type": "int4",
-          "isRequired": true,
+          "id": "public.Absence.roomNumber",
+          "name": "roomNumber",
+          "columnName": "roomNumber",
+          "type": "text",
+          "isRequired": false,
           "kind": "scalar",
           "isList": false,
           "isGenerated": false,
@@ -535,9 +535,9 @@
       "tableName": "MailingList",
       "fields": [
         {
-          "id": "public.MailingList.userId",
-          "name": "userId",
-          "columnName": "userId",
+          "id": "public.MailingList.subjectId",
+          "name": "subjectId",
+          "columnName": "subjectId",
           "type": "int4",
           "isRequired": true,
           "kind": "scalar",
@@ -549,9 +549,9 @@
           "maxLength": null
         },
         {
-          "id": "public.MailingList.subjectId",
-          "name": "subjectId",
-          "columnName": "subjectId",
+          "id": "public.MailingList.userId",
+          "name": "userId",
+          "columnName": "userId",
           "type": "int4",
           "isRequired": true,
           "kind": "scalar",
@@ -651,30 +651,30 @@
           "maxLength": null
         },
         {
-          "id": "public.Subject.archived",
-          "name": "archived",
-          "columnName": "archived",
-          "type": "bool",
+          "id": "public.Subject.colorGroupId",
+          "name": "colorGroupId",
+          "columnName": "colorGroupId",
+          "type": "int4",
           "isRequired": true,
           "kind": "scalar",
           "isList": false,
           "isGenerated": false,
           "sequence": false,
-          "hasDefaultValue": true,
+          "hasDefaultValue": false,
           "isId": false,
           "maxLength": null
         },
         {
-          "id": "public.Subject.colorGroupId",
-          "name": "colorGroupId",
-          "columnName": "colorGroupId",
-          "type": "int4",
+          "id": "public.Subject.archived",
+          "name": "archived",
+          "columnName": "archived",
+          "type": "bool",
           "isRequired": true,
           "kind": "scalar",
           "isList": false,
           "isGenerated": false,
           "sequence": false,
-          "hasDefaultValue": false,
+          "hasDefaultValue": true,
           "isId": false,
           "maxLength": null
         },
@@ -823,30 +823,30 @@
           "maxLength": null
         },
         {
-          "id": "public.User.profilePicture",
-          "name": "profilePicture",
-          "columnName": "profilePicture",
-          "type": "text",
-          "isRequired": false,
+          "id": "public.User.role",
+          "name": "role",
+          "columnName": "role",
+          "type": "Role",
+          "isRequired": true,
           "kind": "scalar",
           "isList": false,
           "isGenerated": false,
           "sequence": false,
-          "hasDefaultValue": false,
+          "hasDefaultValue": true,
           "isId": false,
           "maxLength": null
         },
         {
-          "id": "public.User.role",
-          "name": "role",
-          "columnName": "role",
-          "type": "Role",
-          "isRequired": true,
+          "id": "public.User.profilePicture",
+          "name": "profilePicture",
+          "columnName": "profilePicture",
+          "type": "text",
+          "isRequired": false,
           "kind": "scalar",
           "isList": false,
           "isGenerated": false,
           "sequence": false,
-          "hasDefaultValue": true,
+          "hasDefaultValue": false,
           "isId": false,
           "maxLength": null
         },
@@ -994,6 +994,132 @@
           "nullNotDistinct": false
         }
       ]
+    },
+    "_prisma_migrations": {
+      "id": "public._prisma_migrations",
+      "schemaName": "public",
+      "tableName": "_prisma_migrations",
+      "fields": [
+        {
+          "id": "public._prisma_migrations.id",
+          "name": "id",
+          "columnName": "id",
+          "type": "varchar",
+          "isRequired": true,
+          "kind": "scalar",
+          "isList": false,
+          "isGenerated": false,
+          "sequence": false,
+          "hasDefaultValue": false,
+          "isId": true,
+          "maxLength": 36
+        },
+        {
+          "id": "public._prisma_migrations.checksum",
+          "name": "checksum",
+          "columnName": "checksum",
+          "type": "varchar",
+          "isRequired": true,
+          "kind": "scalar",
+          "isList": false,
+          "isGenerated": false,
+          "sequence": false,
+          "hasDefaultValue": false,
+          "isId": false,
+          "maxLength": 64
+        },
+        {
+          "id": "public._prisma_migrations.finished_at",
+          "name": "finished_at",
+          "columnName": "finished_at",
+          "type": "timestamptz",
+          "isRequired": false,
+          "kind": "scalar",
+          "isList": false,
+          "isGenerated": false,
+          "sequence": false,
+          "hasDefaultValue": false,
+          "isId": false,
+          "maxLength": null
+        },
+        {
+          "id": "public._prisma_migrations.migration_name",
+          "name": "migration_name",
+          "columnName": "migration_name",
+          "type": "varchar",
+          "isRequired": true,
+          "kind": "scalar",
+          "isList": false,
+          "isGenerated": false,
+          "sequence": false,
+          "hasDefaultValue": false,
+          "isId": false,
+          "maxLength": 255
+        },
+        {
+          "id": "public._prisma_migrations.logs",
+          "name": "logs",
+          "columnName": "logs",
+          "type": "text",
+          "isRequired": false,
+          "kind": "scalar",
+          "isList": false,
+          "isGenerated": false,
+          "sequence": false,
+          "hasDefaultValue": false,
+          "isId": false,
+          "maxLength": null
+        },
+        {
+          "id": "public._prisma_migrations.rolled_back_at",
+          "name": "rolled_back_at",
+          "columnName": "rolled_back_at",
+          "type": "timestamptz",
+          "isRequired": false,
+          "kind": "scalar",
+          "isList": false,
+          "isGenerated": false,
+          "sequence": false,
+          "hasDefaultValue": false,
+          "isId": false,
+          "maxLength": null
+        },
+        {
+          "id": "public._prisma_migrations.started_at",
+          "name": "started_at",
+          "columnName": "started_at",
+          "type": "timestamptz",
+          "isRequired": true,
+          "kind": "scalar",
+          "isList": false,
+          "isGenerated": false,
+          "sequence": false,
+          "hasDefaultValue": true,
+          "isId": false,
+          "maxLength": null
+        },
+        {
+          "id": "public._prisma_migrations.applied_steps_count",
+          "name": "applied_steps_count",
+          "columnName": "applied_steps_count",
+          "type": "int4",
+          "isRequired": true,
+          "kind": "scalar",
+          "isList": false,
+          "isGenerated": false,
+          "sequence": false,
+          "hasDefaultValue": true,
+          "isId": false,
+          "maxLength": null
+        }
+      ],
+      "uniqueConstraints": [
+        {
+          "name": "_prisma_migrations_pkey",
+          "fields": ["id"],
+          "nullNotDistinct": false
+        }
+      ]
     }
   },
   "enums": {

From d5f116cc7623ba18fe8b643f9a6465541d9655d4 Mon Sep 17 00:00:00 2001
From: Chinemerem <chinemeremchigbo@Outlook.com>
Date: Fri, 11 Apr 2025 17:45:46 -0400
Subject: [PATCH 5/6] Disable when uploading

---
 src/components/FileUpload.tsx     | 41 ++++++++++++++++++++-----------
 src/components/LessonPlanView.tsx | 33 +++++++++++--------------
 2 files changed, 40 insertions(+), 34 deletions(-)

diff --git a/src/components/FileUpload.tsx b/src/components/FileUpload.tsx
index 398d8a00..a75bf22d 100644
--- a/src/components/FileUpload.tsx
+++ b/src/components/FileUpload.tsx
@@ -1,11 +1,4 @@
-import {
-  Box,
-  FormControl,
-  Image,
-  Input,
-  Text,
-  useToast,
-} from '@chakra-ui/react';
+import { Box, Image, Input, Text, useToast } from '@chakra-ui/react';
 import { LessonPlanFile } from '@utils/types';
 import { useRef, useState } from 'react';
 
@@ -13,12 +6,14 @@ interface FileUploadProps {
   lessonPlan: File | null;
   setLessonPlan: (file: File | null) => void;
   existingFile?: LessonPlanFile | null;
+  isDisabled: boolean;
 }
 
 export const FileUpload: React.FC<FileUploadProps> = ({
   lessonPlan,
   setLessonPlan,
   existingFile,
+  isDisabled,
 }) => {
   const [isDragging, setIsDragging] = useState(false);
   const inputRef = useRef<HTMLInputElement>(null);
@@ -32,33 +27,39 @@ export const FileUpload: React.FC<FileUploadProps> = ({
         title: 'Invalid File Type',
         description: 'Please upload a valid PDF file.',
         status: 'error',
-        duration: 4000,
+        duration: 5000,
         isClosable: true,
       });
     }
   };
 
   const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    if (e.target.files && e.target.files.length > 0) {
-      const file = e.target.files[0];
+    if (isDisabled) return;
+
+    const file = e.target.files?.[0];
+    if (file) {
       validateAndSetFile(file);
     }
   };
 
   const handleDragOver = (e: React.DragEvent) => {
+    if (isDisabled) return;
     e.preventDefault();
     setIsDragging(true);
   };
 
   const handleDragLeave = () => {
+    if (isDisabled) return;
     setIsDragging(false);
   };
 
   const handleDrop = (e: React.DragEvent) => {
+    if (isDisabled) return;
     e.preventDefault();
     setIsDragging(false);
-    if (e.dataTransfer.files && e.dataTransfer.files.length > 0) {
-      const file = e.dataTransfer.files[0];
+
+    const file = e.dataTransfer.files?.[0];
+    if (file) {
       validateAndSetFile(file);
     }
   };
@@ -69,11 +70,20 @@ export const FileUpload: React.FC<FileUploadProps> = ({
         as="label"
         htmlFor="fileUpload"
         border="1px dashed"
-        borderColor={isDragging ? 'primaryBlue.300' : 'outline'}
+        borderColor={
+          isDisabled
+            ? 'neutralGray.300'
+            : isDragging
+              ? 'primaryBlue.300'
+              : 'outline'
+        }
+        bg={isDisabled ? 'neutralGray.50' : 'transparent'}
+        opacity={isDisabled ? 0.6 : 1}
+        pointerEvents={isDisabled ? 'none' : 'auto'}
         borderRadius="10px"
         p={5}
         textAlign="center"
-        cursor="pointer"
+        cursor={isDisabled ? 'not-allowed' : 'pointer'}
         display="flex"
         flexDirection="column"
         alignItems="center"
@@ -100,6 +110,7 @@ export const FileUpload: React.FC<FileUploadProps> = ({
         onChange={handleFileChange}
         accept="application/pdf"
         display="none"
+        disabled={isDisabled}
       />
     </>
   );
diff --git a/src/components/LessonPlanView.tsx b/src/components/LessonPlanView.tsx
index 8544137a..614492b9 100644
--- a/src/components/LessonPlanView.tsx
+++ b/src/components/LessonPlanView.tsx
@@ -13,6 +13,7 @@ import { LessonPlanFile } from '@utils/types';
 import { uploadFile } from '@utils/uploadFile';
 import { useEffect, useRef, useState } from 'react';
 import { FiFileText } from 'react-icons/fi';
+import { FileUpload } from './FileUpload';
 
 const formatFileSize = (sizeInBytes: number) => {
   if (sizeInBytes === 0) return '0 B';
@@ -127,21 +128,6 @@ const NoLessonPlanViewingDisplay = ({
   );
 };
 
-const NoLessonPlanDeclaredDisplay = () => {
-  const theme = useTheme();
-
-  return (
-    <Flex width="100%">
-      <Text
-        fontSize={theme.textStyles.body.fontSize}
-        color={theme.colors.neutralGray[500]}
-      >
-        Upload PDF component
-      </Text>
-    </Flex>
-  );
-};
-
 const LessonPlanView = ({
   lessonPlan,
   absentTeacherFirstName,
@@ -168,8 +154,7 @@ const LessonPlanView = ({
     fileInputRef.current?.click();
   };
 
-  const handleFileChange = async (e: React.ChangeEvent<HTMLInputElement>) => {
-    const file = e.target.files?.[0];
+  const handleFileUpload = async (file: File) => {
     if (!file || file.type !== 'application/pdf') return;
 
     setIsUploading(true);
@@ -248,11 +233,21 @@ const LessonPlanView = ({
         ref={fileInputRef}
         display="none"
         accept="application/pdf"
-        onChange={handleFileChange}
+        onChange={(e) => {
+          const file = e.target.files?.[0];
+          if (file) {
+            handleFileUpload(file);
+          }
+        }}
       />
     </>
   ) : isUserAbsentTeacher && !isAdminMode ? (
-    <NoLessonPlanDeclaredDisplay />
+    <FileUpload
+      lessonPlan={null}
+      setLessonPlan={handleFileUpload}
+      existingFile={null}
+      isDisabled={isUploading}
+    />
   ) : (
     <NoLessonPlanViewingDisplay
       absentTeacherFirstName={absentTeacherFirstName}

From 318de591cf32f49fcccbe0c6e7e01995c04f433c Mon Sep 17 00:00:00 2001
From: Chinemerem <chinemeremchigbo@Outlook.com>
Date: Fri, 11 Apr 2025 17:48:04 -0400
Subject: [PATCH 6/6] Update FileUpload.tsx

---
 src/components/FileUpload.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/FileUpload.tsx b/src/components/FileUpload.tsx
index a75bf22d..66fcea29 100644
--- a/src/components/FileUpload.tsx
+++ b/src/components/FileUpload.tsx
@@ -6,7 +6,7 @@ interface FileUploadProps {
   lessonPlan: File | null;
   setLessonPlan: (file: File | null) => void;
   existingFile?: LessonPlanFile | null;
-  isDisabled: boolean;
+  isDisabled?: boolean;
 }
 
 export const FileUpload: React.FC<FileUploadProps> = ({