From f6120a17d8e65db4114762c6d3244cf96d2e3c67 Mon Sep 17 00:00:00 2001
From: Chinemerem <chinemeremchigbo@Outlook.com>
Date: Fri, 11 Apr 2025 15:03:50 -0400
Subject: [PATCH 1/2] Swap lesson plan

---
 src/components/AbsenceDetails.tsx |   2 +
 src/components/LessonPlanView.tsx | 105 ++++++++++++++++++++++++++----
 2 files changed, 94 insertions(+), 13 deletions(-)

diff --git a/src/components/AbsenceDetails.tsx b/src/components/AbsenceDetails.tsx
index 568339c6..4b5f1f29 100644
--- a/src/components/AbsenceDetails.tsx
+++ b/src/components/AbsenceDetails.tsx
@@ -299,10 +299,12 @@ const AbsenceDetails: React.FC<AbsenceDetailsProps> = ({
                 </Text>
                 <LessonPlanView
                   lessonPlan={event.lessonPlan}
+                  absenceId={event.absenceId}
                   absentTeacherFirstName={event.absentTeacher.firstName}
                   isUserAbsentTeacher={isUserAbsentTeacher}
                   isUserSubstituteTeacher={isUserSubstituteTeacher}
                   isAdminMode={isAdminMode}
+                  fetchAbsences={fetchAbsences}
                 />
               </Box>
               {(isAdminMode || isUserAbsentTeacher) && (
diff --git a/src/components/LessonPlanView.tsx b/src/components/LessonPlanView.tsx
index b7d6c6e8..ebd53b3d 100644
--- a/src/components/LessonPlanView.tsx
+++ b/src/components/LessonPlanView.tsx
@@ -3,10 +3,14 @@ import {
   Flex,
   IconButton,
   Image,
+  Input,
   Link,
   Text,
   useTheme,
+  useToast,
 } from '@chakra-ui/react';
+import { uploadFile } from '@utils/uploadFile';
+import { useRef, useState } from 'react';
 import { FiFileText } from 'react-icons/fi';
 
 const formatFileSize = (sizeInBytes: number) => {
@@ -30,14 +34,11 @@ const LessonPlanDisplay = ({
   fileSize,
   isUserAbsentTeacher,
   isAdminMode,
+  onSwap,
+  isDisabled,
 }) => {
   const theme = useTheme();
 
-  const handleSwap = (e: React.MouseEvent) => {
-    e.stopPropagation();
-    e.preventDefault();
-  };
-
   return (
     <Link href={href} isExternal width="100%">
       <Flex
@@ -79,7 +80,8 @@ const LessonPlanDisplay = ({
             }
             size="sm"
             variant="ghost"
-            onClick={handleSwap}
+            onClick={onSwap}
+            isDisabled={isDisabled}
           />
         )}
       </Flex>
@@ -145,15 +147,92 @@ const LessonPlanView = ({
   isUserAbsentTeacher,
   isUserSubstituteTeacher,
   isAdminMode,
+  absenceId,
+  fetchAbsences,
 }) => {
+  const fileInputRef = useRef<HTMLInputElement | null>(null);
+  const toast = useToast();
+  const [isUploading, setIsUploading] = useState(false);
+
+  const handleSwap = (e: React.MouseEvent) => {
+    e.preventDefault();
+    e.stopPropagation();
+    fileInputRef.current?.click();
+  };
+
+  const handleFileChange = async (e: React.ChangeEvent<HTMLInputElement>) => {
+    const file = e.target.files?.[0];
+    if (!file || file.type !== 'application/pdf') return;
+
+    setIsUploading(true);
+
+    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 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,
+        },
+      }),
+    });
+
+    if (res.ok) {
+      toast({
+        title: 'Lesson Plan Updated',
+        description: 'Your lesson plan was successfully swapped.',
+        status: 'success',
+        duration: 5000,
+        isClosable: true,
+      });
+      await fetchAbsences?.();
+    } else {
+      toast({
+        title: 'Update failed',
+        description: 'There was a problem updating the lesson plan.',
+        status: 'error',
+        duration: 5000,
+        isClosable: true,
+      });
+    }
+
+    setIsUploading(false);
+  };
+
   return lessonPlan ? (
-    <LessonPlanDisplay
-      href={lessonPlan.url}
-      fileName={lessonPlan.name}
-      fileSize={lessonPlan.size}
-      isUserAbsentTeacher={isUserAbsentTeacher}
-      isAdminMode={isAdminMode}
-    />
+    <>
+      <LessonPlanDisplay
+        href={lessonPlan.url}
+        fileName={lessonPlan.name}
+        fileSize={lessonPlan.size}
+        isUserAbsentTeacher={isUserAbsentTeacher}
+        isAdminMode={isAdminMode}
+        onSwap={handleSwap}
+        isDisabled={isUploading}
+      />
+      <Input
+        type="file"
+        ref={fileInputRef}
+        display="none"
+        accept="application/pdf"
+        onChange={handleFileChange}
+      />
+    </>
   ) : isUserAbsentTeacher && !isAdminMode ? (
     <NoLessonPlanDeclaredDisplay />
   ) : (

From 2fff6f9f235cd6cd0c6d3b9a23c4aff5fb3eeae3 Mon Sep 17 00:00:00 2001
From: Chinemerem <chinemeremchigbo@Outlook.com>
Date: Fri, 11 Apr 2025 16:30:43 -0400
Subject: [PATCH 2/2] Update LessonPlanView.tsx

---
 src/components/LessonPlanView.tsx | 28 +++++++++++++++++++++++-----
 1 file changed, 23 insertions(+), 5 deletions(-)

diff --git a/src/components/LessonPlanView.tsx b/src/components/LessonPlanView.tsx
index ebd53b3d..8544137a 100644
--- a/src/components/LessonPlanView.tsx
+++ b/src/components/LessonPlanView.tsx
@@ -9,8 +9,9 @@ import {
   useTheme,
   useToast,
 } from '@chakra-ui/react';
+import { LessonPlanFile } from '@utils/types';
 import { uploadFile } from '@utils/uploadFile';
-import { useRef, useState } from 'react';
+import { useEffect, useRef, useState } from 'react';
 import { FiFileText } from 'react-icons/fi';
 
 const formatFileSize = (sizeInBytes: number) => {
@@ -153,6 +154,13 @@ const LessonPlanView = ({
   const fileInputRef = useRef<HTMLInputElement | null>(null);
   const toast = useToast();
   const [isUploading, setIsUploading] = useState(false);
+  const [localLessonPlan, setLocalLessonPlan] = useState<LessonPlanFile | null>(
+    lessonPlan
+  );
+
+  useEffect(() => {
+    setLocalLessonPlan(lessonPlan);
+  }, [lessonPlan]);
 
   const handleSwap = (e: React.MouseEvent) => {
     e.preventDefault();
@@ -193,6 +201,15 @@ const LessonPlanView = ({
     });
 
     if (res.ok) {
+      const updatedPlan: LessonPlanFile = {
+        id: -1,
+        name: file.name,
+        size: file.size,
+        url: fileUrl,
+      };
+
+      setLocalLessonPlan(updatedPlan);
+
       toast({
         title: 'Lesson Plan Updated',
         description: 'Your lesson plan was successfully swapped.',
@@ -200,6 +217,7 @@ const LessonPlanView = ({
         duration: 5000,
         isClosable: true,
       });
+
       await fetchAbsences?.();
     } else {
       toast({
@@ -214,12 +232,12 @@ const LessonPlanView = ({
     setIsUploading(false);
   };
 
-  return lessonPlan ? (
+  return localLessonPlan ? (
     <>
       <LessonPlanDisplay
-        href={lessonPlan.url}
-        fileName={lessonPlan.name}
-        fileSize={lessonPlan.size}
+        href={localLessonPlan.url}
+        fileName={localLessonPlan.name}
+        fileSize={localLessonPlan.size}
         isUserAbsentTeacher={isUserAbsentTeacher}
         isAdminMode={isAdminMode}
         onSwap={handleSwap}