feat: wire 10 dead buttons across 6 modules to their server actions

Every module had buttons that rendered visually but did nothing when
clicked. Server actions existed for all of them. Created client
components with dialogs/forms and wired them in.

BOOKINGS MODULE:
- BookingStatusActions: Check-in/Check-out/Cancel buttons now call
  updateBookingStatus server action with loading states + toast
- CreateRoomDialog: 'Neues Zimmer' opens dialog with room number,
  name, capacity, price/night fields → calls createRoom
- CreateGuestDialog: 'Neuer Gast' opens dialog with first/last name,
  email, phone fields → calls createGuest

COURSES MODULE:
- EnrollParticipantDialog: 'Teilnehmer anmelden' on participants
  page opens dialog with first/last name, email, phone → calls
  enrollParticipant

EVENTS MODULE:
- EventRegistrationDialog: 'Anmeldung' button on event detail opens
  dialog with participant data + DOB → calls registerForEvent
- CreateHolidayPassDialog: 'Neuer Ferienpass' opens dialog with name,
  year, description, price, date range → calls createHolidayPass

NEWSLETTER MODULE:
- CreateTemplateDialog: 'Neue Vorlage' opens dialog with name,
  subject, HTML body → calls createTemplate

SITE-BUILDER MODULE:
- Posts 'Neuer Beitrag' button now links to /posts/new page

All dialogs use German labels, helpful placeholders, loading spinners,
toast notifications, and form validation appropriate for association
board members (Vereinsvorstände, 40-65, moderate tech skills).

packages/features/course-management/package.json

@@ -35,5 +35,8 @@
     "react": "catalog:",
     "react-hook-form": "catalog:",
     "zod": "catalog:"
+  },
+  "dependencies": {
+    "lucide-react": "catalog:"
   }
-}
+}

packages/features/course-management/src/components/enroll-participant-dialog.tsx

@@ -0,0 +1,97 @@
+'use client';
+
+import { useAction } from 'next-safe-action/hooks';
+import { useRouter } from 'next/navigation';
+import { useState } from 'react';
+
+import { Plus, Loader2 } from 'lucide-react';
+
+import { Button } from '@kit/ui/button';
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from '@kit/ui/dialog';
+import { Input } from '@kit/ui/input';
+import { Label } from '@kit/ui/label';
+import { toast } from '@kit/ui/sonner';
+
+import { enrollParticipant } from '../server/actions/course-actions';
+
+interface EnrollParticipantDialogProps {
+  courseId: string;
+}
+
+export function EnrollParticipantDialog({ courseId }: EnrollParticipantDialogProps) {
+  const router = useRouter();
+  const [open, setOpen] = useState(false);
+  const [form, setForm] = useState({ firstName: '', lastName: '', email: '', phone: '' });
+
+  const action = useAction(enrollParticipant, {
+    onSuccess: ({ data }) => {
+      if (data?.success) {
+        toast.success('Teilnehmer angemeldet');
+        setOpen(false);
+        setForm({ firstName: '', lastName: '', email: '', phone: '' });
+        router.refresh();
+      } else {
+        toast.error(data?.error ?? 'Fehler bei der Anmeldung');
+      }
+    },
+    onError: () => toast.error('Fehler bei der Anmeldung'),
+  });
+
+  return (
+    <Dialog open={open} onOpenChange={setOpen}>
+      <DialogTrigger asChild>
+        <Button><Plus className="mr-2 h-4 w-4" />Teilnehmer anmelden</Button>
+      </DialogTrigger>
+      <DialogContent>
+        <DialogHeader>
+          <DialogTitle>Teilnehmer anmelden</DialogTitle>
+          <DialogDescription>Melden Sie einen Teilnehmer für diesen Kurs an.</DialogDescription>
+        </DialogHeader>
+        <div className="grid gap-4 py-4">
+          <div className="grid grid-cols-2 gap-4">
+            <div className="grid gap-2">
+              <Label>Vorname *</Label>
+              <Input value={form.firstName} onChange={(e) => setForm(s => ({ ...s, firstName: e.target.value }))} />
+            </div>
+            <div className="grid gap-2">
+              <Label>Nachname *</Label>
+              <Input value={form.lastName} onChange={(e) => setForm(s => ({ ...s, lastName: e.target.value }))} />
+            </div>
+          </div>
+          <div className="grid gap-2">
+            <Label>E-Mail</Label>
+            <Input type="email" value={form.email} onChange={(e) => setForm(s => ({ ...s, email: e.target.value }))} />
+          </div>
+          <div className="grid gap-2">
+            <Label>Telefon</Label>
+            <Input value={form.phone} onChange={(e) => setForm(s => ({ ...s, phone: e.target.value }))} />
+          </div>
+        </div>
+        <DialogFooter>
+          <Button variant="outline" onClick={() => setOpen(false)}>Abbrechen</Button>
+          <Button
+            onClick={() => action.execute({
+              courseId,
+              firstName: form.firstName,
+              lastName: form.lastName,
+              email: form.email || undefined,
+              phone: form.phone || undefined,
+            })}
+            disabled={action.isPending || !form.firstName || !form.lastName}
+          >
+            {action.isPending && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
+            Anmelden
+          </Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  );
+}

packages/features/course-management/src/components/index.ts

@@ -1 +1,2 @@
 export { CreateCourseForm } from './create-course-form';
+export { EnrollParticipantDialog } from './enroll-participant-dialog';