Initial commit: Kalendartool (Next.js, Prisma, Docker)

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
2026-10-08 14:38:04 +02:00
commit bc49c3074e
94 changed files with 12812 additions and 0 deletions
--- a/app/login/page.tsx
+++ b/app/login/page.tsx
@@ -0,0 +1,79 @@
+'use client';
+
+/**
+ * Anmeldeseite (plan.md Abschnitt 11).
+ */
+import { useState } from 'react';
+import { useRouter } from 'next/navigation';
+import Link from 'next/link';
+import { Button, Card, ErrorMessage, Input, Label } from '@/components/ui/ui';
+
+export default function LoginPage() {
+  const router = useRouter();
+  const [error, setError] = useState<string | null>(null);
+  const [busy, setBusy] = useState(false);
+
+  async function handleSubmit(event: React.FormEvent<HTMLFormElement>) {
+    event.preventDefault();
+    setBusy(true);
+    setError(null);
+
+    const formData = new FormData(event.currentTarget);
+    try {
+      const response = await fetch('/api/auth/login', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({
+          email: formData.get('email'),
+          password: formData.get('password'),
+        }),
+      });
+
+      if (!response.ok) {
+        const data = (await response.json()) as { error?: string };
+        setError(data.error ?? 'Anmeldung fehlgeschlagen.');
+        return;
+      }
+      router.push('/dashboard');
+      router.refresh();
+    } catch {
+      setError('Netzwerkfehler. Bitte erneut versuchen.');
+    } finally {
+      setBusy(false);
+    }
+  }
+
+  return (
+    <main className="mx-auto flex min-h-screen max-w-md flex-col justify-center px-4">
+      <h1 className="mb-6 text-center text-2xl font-bold">Anmelden</h1>
+      <Card>
+        <form onSubmit={handleSubmit} className="space-y-4">
+          <ErrorMessage message={error} />
+          <div>
+            <Label htmlFor="email">E-Mail</Label>
+            <Input id="email" name="email" type="email" required autoComplete="email" />
+          </div>
+          <div>
+            <Label htmlFor="password">Passwort</Label>
+            <Input
+              id="password"
+              name="password"
+              type="password"
+              required
+              autoComplete="current-password"
+            />
+          </div>
+          <Button disabled={busy}>{busy ? 'Anmelden …' : 'Anmelden'}</Button>
+        </form>
+        <div className="mt-4 flex justify-between text-sm">
+          <Link href="/register" className="text-slate-700 underline hover:text-slate-900 dark:text-slate-300 dark:hover:text-slate-100">
+            Konto erstellen
+          </Link>
+          <Link href="/forgot-password" className="text-slate-700 underline hover:text-slate-900 dark:text-slate-300 dark:hover:text-slate-100">
+            Passwort vergessen?
+          </Link>
+        </div>
+      </Card>
+    </main>
+  );
+}