added chron to hub server, removed starterEvent

2025-02-28 07:21:07 +01:00
parent bbcde2eb4a
commit a477b65c2f
20 changed files with 584 additions and 281 deletions
--- a/apps/hub/app/(app)/admin/event/_components/Form.tsx
+++ b/apps/hub/app/(app)/admin/event/_components/Form.tsx
@@ -8,7 +8,7 @@ import {
 	ParticipantOptionalDefaultsSchema,
 } from "@repo/db/zod";
 import { set, useForm } from "react-hook-form";
-import { BADGES, Event, EventAppointment, User } from "@repo/db";
+import { BADGES, Event, EVENT_TYPE, PERMISSION } from "@repo/db";
 import { Bot, Calendar, FileText, UserIcon } from "lucide-react";
 import { Input } from "../../../../_components/ui/Input";
 import { useRef, useState } from "react";
@@ -60,7 +60,6 @@ export const Form = ({ event }: { event?: Event }) => {
 								eventId: event?.id,
 								presenterId: values.presenterId,
 							});
-							console.log(createdAppointment);
 							addParticipantModal.current?.close();
 							appointmentsTableRef.current?.refresh();
 						})}
@@ -83,6 +82,7 @@ export const Form = ({ event }: { event?: Event }) => {
 			<form
 				onSubmit={form.handleSubmit(async (values) => {
 					setLoading(true);
+
 					const createdEvent = await upsertEvent(values, event?.id);
 					setLoading(false);
 					if (!event) redirect(`/admin/event`);
@@ -105,6 +105,15 @@ export const Form = ({ event }: { event?: Event }) => {
 							})}
 						/>
 						<Switch form={form} name="hidden" label="Versteckt" />
+						<Select
+							form={form}
+							name="type"
+							label="Typ"
+							options={Object.entries(EVENT_TYPE).map(([key, value]) => ({
+								label: key,
+								value: value,
+							}))}
+						/>
 					</div>
 				</div>
 				<div className="card bg-base-200 shadow-xl col-span-3  max-xl:col-span-6">
@@ -112,12 +121,6 @@ export const Form = ({ event }: { event?: Event }) => {
 						<h2 className="card-title">
 							<Bot className="w-5 h-5" /> Automation
 						</h2>
-						<Input
-							form={form}
-							name="starterMoodleCourseId"
-							label="Moodle Anmelde Kurs ID"
-							className="input-sm"
-						/>
 						<Input
 							name="finisherMoodleCourseId"
 							form={form}
@@ -144,6 +147,16 @@ export const Form = ({ event }: { event?: Event }) => {
 								value: key,
 							}))}
 						/>
+						<Select
+							isMulti
+							form={form}
+							name="finishedPermissions"
+							label="Berechtigungen bei Abschluss"
+							options={Object.entries(PERMISSION).map(([key, value]) => ({
+								label: value,
+								value: key,
+							}))}
+						/>
 						<Switch
 							form={form}
 							name="hasPresenceEvents"
--- a/apps/hub/app/(app)/events/_components/item.tsx
+++ b/apps/hub/app/(app)/events/_components/item.tsx
@@ -1,10 +1,19 @@
 "use client";
 import { DrawingPinFilledIcon, EnterIcon } from "@radix-ui/react-icons";
-import { Event, User } from "@repo/db";
+import { Event, Participant, EventAppointment, User } from "@repo/db";
 import ModalBtn from "./modalBtn";
 import MDEditor from "@uiw/react-md-editor";

-export const KursItem = ({ user, event }: { user: User; event: Event }) => {
+export const KursItem = ({
+	user,
+	event,
+}: {
+	user: User;
+	event: Event & {
+		appointments: EventAppointment[];
+		participants: Participant[];
+	};
+}) => {
 	return (
 		<div className="col-span-full">
 			<div className="card bg-base-200 shadow-xl mb-4">
@@ -56,8 +65,10 @@ export const KursItem = ({ user, event }: { user: User; event: Event }) => {
 							)}
 						</div>
 						<ModalBtn
+							user={user}
+							event={event}
 							title={event.name}
-							dates={["Dienstag, 25 Februar 2025", "Mittwoch, 26 Februar 2025"]}
+							dates={event.appointments}
 							modalId={`${event.name}_modal.${event.id}`}
 						/>
 					</div>
@@ -67,7 +78,13 @@ export const KursItem = ({ user, event }: { user: User; event: Event }) => {
 	);
 };

-export const PilotKurs = ({ user }: { user: User }) => {
+export const ObligatedEvent = ({
+	event,
+	user,
+}: {
+	event: Event;
+	user: User;
+}) => {
 	{
 		/* STATISCH, DA FÜR ALLE NEUEN MITGLIEDER MANDATORY, WIRD AUSGEBLENDET WENN ABSOLVIERT */
 	}
@@ -96,9 +113,14 @@ export const PilotKurs = ({ user }: { user: User }) => {
 						<p className="text-gray-600 text-left flex items-center gap-2">
 							<DrawingPinFilledIcon /> <b>Teilnahmevoraussetzungen:</b> Keine
 						</p>
-						<button className="btn btn-outline btn-secondary btn-wide">
-							<EnterIcon /> Zum Moodle Kurs
-						</button>
+						<ModalBtn
+							user={user}
+							event={event}
+							title={event.name}
+							dates={(event as any).appointments}
+							participant={(event as any).participants[0]}
+							modalId={`${event.name}_modal.${event.id}`}
+						/>
 					</div>
 				</div>
 			</div>
--- a/apps/hub/app/(app)/events/_components/modalBtn.tsx
+++ b/apps/hub/app/(app)/events/_components/modalBtn.tsx
@@ -1,87 +1,156 @@
 "use client";
 import { useEffect } from "react";
 import {
-  CheckCircledIcon,
-  CalendarIcon,
-  EnterIcon,
+	CheckCircledIcon,
+	CalendarIcon,
+	EnterIcon,
 } from "@radix-ui/react-icons";
+import { Event, EventAppointment, Participant, User } from "@repo/db";
+import { cn } from "../../../../helper/cn";
+import { addParticipant, inscribeToMoodleCourse } from "../actions";
+import { useSession } from "next-auth/react";

 interface ModalBtnProps {
-  title: string;
-  dates: string[];
-  modalId: string;
+	title: string;
+	event: Event;
+	dates: EventAppointment[];
+	participant?: Participant;
+	user: User;
+	modalId: string;
 }

-const ModalBtn = ({ title, dates, modalId }: ModalBtnProps) => {
-  useEffect(() => {
-    const modal = document.getElementById(modalId) as HTMLDialogElement;
-    const handleOpen = () => {
-      document.body.classList.add("modal-open");
-    };
-    const handleClose = () => {
-      document.body.classList.remove("modal-open");
-    };
-    modal?.addEventListener("show", handleOpen);
-    modal?.addEventListener("close", handleClose);
-    return () => {
-      modal?.removeEventListener("show", handleOpen);
-      modal?.removeEventListener("close", handleClose);
-    };
-  }, [modalId]);
+const ModalBtn = ({
+	title,
+	dates,
+	modalId,
+	participant,
+	event,
+	user,
+}: ModalBtnProps) => {
+	useEffect(() => {
+		const modal = document.getElementById(modalId) as HTMLDialogElement;
+		const handleOpen = () => {
+			document.body.classList.add("modal-open");
+		};
+		const handleClose = () => {
+			document.body.classList.remove("modal-open");
+		};
+		modal?.addEventListener("show", handleOpen);
+		modal?.addEventListener("close", handleClose);
+		return () => {
+			modal?.removeEventListener("show", handleOpen);
+			modal?.removeEventListener("close", handleClose);
+		};
+	}, [modalId]);

-  const openModal = () => {
-    const modal = document.getElementById(modalId) as HTMLDialogElement;
-    document.body.classList.add("modal-open");
-    modal?.showModal();
-  };
+	const openModal = () => {
+		const modal = document.getElementById(modalId) as HTMLDialogElement;
+		document.body.classList.add("modal-open");
+		modal?.showModal();
+	};

-  const closeModal = () => {
-    const modal = document.getElementById(modalId) as HTMLDialogElement;
-    document.body.classList.remove("modal-open");
-    modal?.close();
-  };
+	const closeModal = () => {
+		const modal = document.getElementById(modalId) as HTMLDialogElement;
+		document.body.classList.remove("modal-open");
+		modal?.close();
+	};

-  return (
-    <>
-      <button className="btn btn-outline btn-info btn-wide" onClick={openModal}>
-        <EnterIcon /> Anmelden
-      </button>
-      <dialog id={modalId} className="modal">
-        <div className="modal-box">
-          <h3 className="font-bold text-lg">{title}</h3>
-          <p className="py-4 flex items-center gap-2 justify-center">
-            <CheckCircledIcon className="text-success" />
-            Moodle Kurs abgeschlossen
-          </p>
-          <div>
-            <div className="flex items-center gap-2 justify-center">
-              <CalendarIcon />
-              <select className="select w-full max-w-xs" defaultValue={0}>
-                <option disabled>Bitte wähle einen Termin aus</option>
-                {dates.map((date, index) => (
-                  <option key={index}>{date}</option>
-                ))}
-              </select>
-            </div>
-            <p className="mt-3 text-center">
-              Bitte finde dich an diesem Termin in unserem Discord ein.
-            </p>
-          </div>
-          <div className="modal-action flex justify-between">
-            <button className="btn" onClick={closeModal}>
-              Abbrechen
-            </button>
-            <button className="btn btn-info btn-outline btn-wide">
-              <EnterIcon /> Anmelden
-            </button>
-          </div>
-        </div>
-        <button className="modal-backdrop" onClick={closeModal}>
-          Abbrechen
-        </button>
-      </dialog>
-    </>
-  );
+	return (
+		<>
+			<button
+				className={cn(
+					"btn btn-outline btn-info btn-wide",
+					event.type === "OBLIGATED_COURSE" && "btn-secondary",
+				)}
+				onClick={openModal}
+			>
+				<EnterIcon /> Anmelden
+			</button>
+			<dialog id={modalId} className="modal">
+				<div className="modal-box">
+					<h3 className="font-bold text-lg">{title}</h3>
+					{event.hasPresenceEvents && (
+						<div>
+							<div className="flex items-center gap-2 justify-center">
+								<CalendarIcon />
+								<select className="select w-full max-w-xs" defaultValue={0}>
+									<option disabled>Bitte wähle einen Termin aus</option>
+									{dates.map((date, index) => (
+										<option key={index}>
+											{date.appointmentDate.toLocaleString()}
+										</option>
+									))}
+								</select>
+							</div>
+							<p className="mt-3 text-center">
+								Bitte finde dich an diesem Termin in unserem Discord ein.
+							</p>
+						</div>
+					)}
+					{event.finisherMoodleCourseId && (
+						<MoodleCourseIndicator
+							user={user}
+							moodleCourseId={event.finisherMoodleCourseId}
+							completed={participant?.finisherMoodleCurseCompleted}
+							eventId={event.id}
+						/>
+					)}
+					<div className="modal-action flex justify-between">
+						<button className="btn" onClick={closeModal}>
+							Abbrechen
+						</button>
+						{event.hasPresenceEvents && (
+							<button className="btn btn-info btn-outline btn-wide">
+								<EnterIcon /> Anmelden
+							</button>
+						)}
+					</div>
+				</div>
+				<button className="modal-backdrop" onClick={closeModal}>
+					Abbrechen
+				</button>
+			</dialog>
+		</>
+	);
 };

 export default ModalBtn;
+
+const MoodleCourseIndicator = ({
+	completed,
+	moodleCourseId,
+	eventId,
+	user,
+}: {
+	completed?: boolean;
+	moodleCourseId: string;
+	eventId: number;
+	user: User;
+}) => {
+	const courseUrl = `${process.env.NEXT_PUBLIC_MOODLE_URL}/course/view.php?id=${moodleCourseId}`;
+	if (completed)
+		return (
+			<p className="py-4 flex items-center gap-2 justify-center">
+				<CheckCircledIcon className="text-success" />
+				Moodle Kurs abgeschlossen
+			</p>
+		);
+	return (
+		<p className="py-4 flex items-center gap-2 justify-center">
+			Moodle-Kurs Benötigt
+			<button
+				className="btn btn-xs btn-info ml-2"
+				onClick={async () => {
+					await addParticipant(eventId, user.id);
+
+					if (user.moodleId) {
+						await inscribeToMoodleCourse(moodleCourseId, user.moodleId);
+					}
+					window.open(courseUrl, "_blank");
+				}}
+			>
+				Zum Moodle Kurs
+			</button>
+		</p>
+	);
+};
--- a/apps/hub/app/(app)/events/actions.ts
+++ b/apps/hub/app/(app)/events/actions.ts
@@ -0,0 +1,26 @@
+"use server";
+import { enrollUserInCourse } from "../../../helper/moodle";
+import { prisma } from "@repo/db";
+
+export const inscribeToMoodleCourse = async (
+	moodleCourseId: string | number,
+	userMoodleId: string | number,
+) => {
+	await enrollUserInCourse(moodleCourseId, userMoodleId);
+};
+
+export const addParticipant = async (eventId: number, userId: string) => {
+	const participant = await prisma.participant.findFirst({
+		where: {
+			userId: userId,
+		},
+	});
+	if (!participant) {
+		await prisma.participant.create({
+			data: {
+				userId: userId,
+				eventId,
+			},
+		});
+	}
+};
--- a/apps/hub/app/(app)/events/page.tsx
+++ b/apps/hub/app/(app)/events/page.tsx
@@ -1,27 +1,44 @@
-import { getServerSession } from '../../api/auth/[...nextauth]/auth';
-import { PrismaClient } from '@repo/db';
-import { PilotKurs, KursItem } from './_components/item';
-import { RocketIcon } from '@radix-ui/react-icons';
+import { getServerSession } from "../../api/auth/[...nextauth]/auth";
+import { PrismaClient } from "@repo/db";
+import { ObligatedEvent, KursItem } from "./_components/item";
+import { RocketIcon } from "@radix-ui/react-icons";

 export default async () => {
-  const prisma = new PrismaClient();
-  const session = await getServerSession();
-  if (!session) return null;
-  const user = session.user;
-  const events = await prisma.event.findMany();
-  if (!user) return null;
+	const prisma = new PrismaClient();
+	const session = await getServerSession();
+	if (!session) return null;
+	const user = await prisma.user.findUnique({
+		where: {
+			id: session.user.id,
+		},
+	});
+	if (!user) return null;

-  return (
-    <div className="grid grid-cols-6 gap-4">
-      <div className="col-span-full">
-        <p className="text-2xl font-semibold text-left flex items-center gap-2">
-          <RocketIcon className="w-5 h-5" /> Events & Kurse
-        </p>
-      </div>
-      <PilotKurs user={user} />
-      {events.map((event) => (
-        <KursItem user={user} event={event} key={event.id} />
-      ))}
-    </div>
-  );
+	const events = await prisma.event.findMany({
+		include: {
+			appointments: true,
+			participants: {
+				where: {
+					userId: user.id,
+				},
+			},
+		},
+	});
+
+	return (
+		<div className="grid grid-cols-6 gap-4">
+			<div className="col-span-full">
+				<p className="text-2xl font-semibold text-left flex items-center gap-2">
+					<RocketIcon className="w-5 h-5" /> Events & Kurse
+				</p>
+			</div>
+
+			{events.map((event) => {
+				if (event.type === "OBLIGATED_COURSE")
+					return <ObligatedEvent user={user} event={event} key={event.id} />;
+				if (event.type === "COURSE")
+					return <KursItem user={user} event={event} key={event.id} />;
+			})}
+		</div>
+	);
 };