Calendar functionality

app/api/auth/[...nextauth]/route.ts

@@ -1,2 +1,2 @@
-import { handlers } from 'auth';
+import { handlers } from '../../../../auth';
 export const { GET, POST } = handlers;

docker-compose.yml

@@ -30,4 +30,4 @@ services:
       - ./db-init:/docker-entrypoint-initdb.d
 
 volumes:
-  postgres_data:
+  postgres_data:

package.json

@@ -15,14 +15,16 @@
     "@chakra-ui/icons": "^2.0.2",
     "@chakra-ui/react": "^2.2.1",
     "@chakra-ui/theme-tools": "^2.0.2",
-    "@emotion/react": "^11.9.0",
-    "@emotion/styled": "^11.9.0",
-    "@prisma/client": "^5.15.0",
+    "@emotion/react": "^11.11.4",
+    "@emotion/styled": "^11.11.5",
+    "@mui/material": "^5.15.20",
+    "@mui/system": "^5.15.20",
+    "@prisma/client": "^5.16.0",
     "framer-motion": "^6.3.0",
     "next": "^14.2.3",
     "next-auth": "^5.0.0-beta.19",
     "pnpm": "^9.4.0",
-    "prisma": "^5.15.0",
+    "prisma": "^5.16.0",
     "react": "^18.2.0",
     "react-calendar": "^5.0.0",
     "react-dom": "^18.2.0"

src/components/InputForm.tsx

@@ -0,0 +1,144 @@
+import { useState } from 'react';
+import {
+  Box,
+  Button,
+  Input,
+  FormControl,
+  FormLabel,
+  Text,
+} from '@chakra-ui/react';
+
+interface Absence {
+  id?: number;
+  lessonDate: Date;
+  lessonPlan: string | null;
+  reasonOfAbsence: string;
+  absentTeacherId: number;
+  substituteTeacherId: number | null;
+  locationId: number;
+  subjectId: number;
+}
+
+interface InputFormProps {
+  initialDate: Date;
+  onClose: () => void;
+  onAddAbsence: (newAbsence: Absence) => Promise<boolean>;
+}
+
+const InputForm: React.FC<InputFormProps> = ({
+  initialDate,
+  onClose,
+  onAddAbsence,
+}) => {
+  const [lessonPlan, setLessonPlan] = useState('');
+  const [reasonOfAbsence, setReasonOfAbsence] = useState('');
+  const [absentTeacherId, setAbsentTeacherId] = useState('');
+  const [substituteTeacherId, setSubstituteTeacherId] = useState('');
+  const [locationId, setLocationId] = useState('');
+  const [subjectId, setSubjectId] = useState('');
+  const [error, setError] = useState('');
+
+  const handleAddAbsence = async (e: React.FormEvent) => {
+    e.preventDefault();
+    const newAbsence: Absence = {
+      lessonDate: initialDate,
+      lessonPlan: lessonPlan || null,
+      reasonOfAbsence,
+      absentTeacherId: parseInt(absentTeacherId, 10),
+      substituteTeacherId: substituteTeacherId
+        ? parseInt(substituteTeacherId, 10)
+        : null,
+      locationId: parseInt(locationId, 10),
+      subjectId: parseInt(subjectId, 10),
+    };
+    const success = await onAddAbsence(newAbsence);
+    if (success) {
+      setLessonPlan('');
+      setReasonOfAbsence('');
+      setAbsentTeacherId('');
+      setSubstituteTeacherId('');
+      setLocationId('');
+      setSubjectId('');
+      onClose();
+    } else {
+      setError('Invalid input. Please enter correct details.');
+    }
+  };
+
+  return (
+    <Box as="form" onSubmit={handleAddAbsence} p={4}>
+      <FormControl mb={3}>
+        <FormLabel>Lesson Plan</FormLabel>
+        <Input
+          type="text"
+          placeholder="Enter lesson plan"
+          value={lessonPlan}
+          onChange={(e) => setLessonPlan(e.target.value)}
+          color="black"
+        />
+      </FormControl>
+      <FormControl mb={3}>
+        <FormLabel>Reason of Absence</FormLabel>
+        <Input
+          type="text"
+          placeholder="Enter reason of absence"
+          value={reasonOfAbsence}
+          onChange={(e) => setReasonOfAbsence(e.target.value)}
+          required
+          color="black"
+        />
+      </FormControl>
+      <FormControl mb={3}>
+        <FormLabel>Absent Teacher ID</FormLabel>
+        <Input
+          type="number"
+          placeholder="Enter absent teacher ID"
+          value={absentTeacherId}
+          onChange={(e) => setAbsentTeacherId(e.target.value)}
+          required
+          color="black"
+        />
+      </FormControl>
+      <FormControl mb={3}>
+        <FormLabel>Substitute Teacher ID</FormLabel>
+        <Input
+          type="number"
+          placeholder="Enter substitute teacher ID"
+          value={substituteTeacherId}
+          onChange={(e) => setSubstituteTeacherId(e.target.value)}
+          color="black"
+        />
+      </FormControl>
+      <FormControl mb={3}>
+        <FormLabel>Location ID</FormLabel>
+        <Input
+          type="number"
+          placeholder="Enter location ID"
+          value={locationId}
+          onChange={(e) => setLocationId(e.target.value)}
+          required
+          color="black"
+        />
+      </FormControl>
+      <FormControl mb={3}>
+        <FormLabel>Subject ID</FormLabel>
+        <Input
+          type="number"
+          placeholder="Enter subject ID"
+          value={subjectId}
+          onChange={(e) => setSubjectId(e.target.value)}
+          required
+          color="black"
+        />
+      </FormControl>
+      {error && (
+        <Text color="red.500" mt={2}>
+          {error}
+        </Text>
+      )}
+      <Button type="submit">Add Absence</Button>
+    </Box>
+  );
+};
+
+export default InputForm;

src/pages/api/absence.ts

@@ -0,0 +1,63 @@
+import { PrismaClient } from '@prisma/client';
+import type { NextApiRequest, NextApiResponse } from 'next';
+
+const prisma = new PrismaClient();
+
+export default async function handler(
+  req: NextApiRequest,
+  res: NextApiResponse
+) {
+  if (req.method === 'GET') {
+    try {
+      const absences = await prisma.absence.findMany();
+
+      res.status(200).json({ absences });
+    } catch (error) {
+      res
+        .status(500)
+        .json({ error: 'Failed to fetch absences', message: error.message });
+    }
+  } else if (req.method === 'POST') {
+    const {
+      lessonDate,
+      lessonPlan,
+      reasonOfAbsence,
+      absentTeacherId,
+      substituteTeacherId,
+      locationId,
+      subjectId,
+    } = req.body;
+    try {
+      const newAbsence = await prisma.absence.create({
+        data: {
+          lessonDate,
+          lessonPlan,
+          reasonOfAbsence,
+          absentTeacherId,
+          substituteTeacherId,
+          locationId,
+          subjectId,
+        },
+      });
+
+      res.status(200).json({ newAbsence });
+    } catch (error) {
+      res
+        .status(500)
+        .json({ error: 'Failed to add absence', message: error.message });
+    }
+  } else if (req.method === 'DELETE') {
+    const { id } = req.body;
+    try {
+      await prisma.absence.delete({
+        where: { id },
+      });
+      res.status(200).json({ message: 'Absence deleted' });
+    } catch (error) {
+      res.status(500).json({ error: 'Failed to delete absence' });
+    }
+  } else {
+    res.setHeader('Allow', ['GET', 'POST', 'DELETE']);
+    res.status(405).end(`Method ${req.method} Not Allowed`);
+  }
+}