Files
var-monorepo/apps/hub/app/(app)/events/_components/item.tsx
2025-02-28 07:21:07 +01:00

130 lines
3.8 KiB
TypeScript

"use client";
import { DrawingPinFilledIcon, EnterIcon } from "@radix-ui/react-icons";
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 & {
appointments: EventAppointment[];
participants: Participant[];
};
}) => {
return (
<div className="col-span-full">
<div className="card bg-base-200 shadow-xl mb-4">
<div className="card-body">
<h2 className="card-title">{event.name}</h2>
<div className="absolute top-0 right-0 m-4">
<span className="badge badge-info badge-outline">
Zusatzqualifikation
</span>
</div>
<div className="grid grid-cols-6 gap-4">
<div className="col-span-4">
<div className="text-left text-balance">
<MDEditor.Markdown
source={event.description}
className="whitespace-pre-wrap"
style={{
backgroundColor: "transparent",
}}
/>
</div>
</div>
<div className="col-span-2">{event.finishedBadges}</div>
</div>
<div className="card-actions flex justify-between items-center mt-5">
<div>
<p className="text-gray-600 text-left flex items-center gap-2">
<DrawingPinFilledIcon /> <b>Teilnahmevoraussetzungen: </b>
{(!event.starterMoodleCourseId ||
!event.requiredBadges.length) &&
"Keine"}
{event.starterMoodleCourseId && (
<a className="link link-info" href="">
Moodle Kurs {event.starterMoodleCourseId}
</a>
)}
</p>
{!!event.requiredBadges.length && (
<div className="flex ml-6">
<b className="text-gray-600 text-left">Abzeichen:</b>
<div className="flex gap-2">
{event.requiredBadges.map((badge) => (
<div className="badge badge-secondary badge-outline">
{badge}
</div>
))}
</div>
</div>
)}
</div>
<ModalBtn
user={user}
event={event}
title={event.name}
dates={event.appointments}
modalId={`${event.name}_modal.${event.id}`}
/>
</div>
</div>
</div>
</div>
);
};
export const ObligatedEvent = ({
event,
user,
}: {
event: Event;
user: User;
}) => {
{
/* STATISCH, DA FÜR ALLE NEUEN MITGLIEDER MANDATORY, WIRD AUSGEBLENDET WENN ABSOLVIERT */
}
return (
<div className="col-span-full">
<div className="card card-bordered border-secondary bg-base-200 shadow-xl mb-4">
<div className="card-body">
<h2 className="card-title">Einsteigerkurs für Piloten</h2>
<div className="absolute top-0 right-0 m-4">
<span className="badge badge-secondary badge-outline">
Verpflichtend
</span>
</div>
<div className="grid grid-cols-6 gap-4">
<div className="col-span-4">
<p className="text-left text-balance">
In diesem Kurs lernen Piloten die Grundlagen der Luftrettung,
Einsatzverfahren, den Umgang mit dem BOS-Funk und einige
medizinische Basics. Der Kurs bietet eine ideale Vorbereitung
für alle Standard Operations bei Virtual Air Rescue.
</p>
</div>
<div className="col-span-2">Badge</div>
</div>
<div className="card-actions flex justify-between items-center mt-5">
<p className="text-gray-600 text-left flex items-center gap-2">
<DrawingPinFilledIcon /> <b>Teilnahmevoraussetzungen:</b> Keine
</p>
<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>
</div>
);
};