Initial commit from template

2025-12-23 04:19:57 +01:00
commit b3d8fe8dfe
76 changed files with 10491 additions and 0 deletions
--- a/.claude/CLAUDE.md
+++ b/.claude/CLAUDE.md
@@ -0,0 +1,147 @@
+# Lumina Project - Claude Code Kontext
+
+## Projekt-Typ
+Full-Stack Web-Applikation erstellt mit dem Lumina AI Development Platform Template.
+
+## Tech Stack
+
+- **Framework:** Next.js 15 (App Router)
+- **Runtime:** Node.js 20+
+- **Sprache:** TypeScript (strict mode)
+- **Styling:** Tailwind CSS
+- **UI Components:** Spartan UI
+- **Backend/Database:** Supabase (PostgreSQL)
+- **Auth:** Supabase Auth
+- **Storage:** Supabase Storage
+- **Package Manager:** pnpm (bevorzugt) oder npm
+
+## Projekt-Struktur
+
+```
+/
+├── app/                    # Next.js App Router
+│   ├── api/               # API Routes
+│   ├── (auth)/            # Auth-geschützte Routen
+│   ├── layout.tsx         # Root Layout
+│   ├── page.tsx           # Homepage
+│   └── globals.css        # Globale Styles
+├── components/            # React Components
+│   ├── ui/               # Basis UI Components
+│   └── ...               # Feature Components
+├── lib/                   # Utilities & Services
+│   ├── supabase.ts       # Supabase Client
+│   └── utils.ts          # Helper Functions
+├── public/               # Static Assets
+├── helm/                 # Kubernetes Helm Charts
+└── .claude/              # Claude Code Konfiguration
+```
+
+## Coding Conventions
+
+### TypeScript
+- Strict mode aktiviert
+- Keine `any` Types - immer typisieren
+- Interfaces für Objekte, Types für Unions/Primitives
+- Barrel Exports aus index.ts vermeiden
+
+### React/Next.js
+- Server Components als Default
+- "use client" nur wenn nötig (interaktive Components)
+- App Router Patterns verwenden
+- Async Components für Data Fetching
+
+### Styling
+- Tailwind CSS für alle Styles
+- Keine inline styles
+- cn() Helper für conditional classes
+- Spartan UI Components wenn verfügbar
+
+### Supabase
+- Server-Side: Service Role Key für Admin-Operationen
+- Client-Side: Anon Key für User-Operationen
+- Row Level Security (RLS) immer aktivieren
+- Typen aus Database generieren
+
+## Wichtige Patterns
+
+### API Routes
+```typescript
+// app/api/example/route.ts
+import { NextRequest, NextResponse } from 'next/server';
+
+export async function GET(request: NextRequest) {
+  try {
+    // Logic here
+    return NextResponse.json({ data });
+  } catch (error) {
+    return NextResponse.json({ error: 'Internal Server Error' }, { status: 500 });
+  }
+}
+```
+
+### Supabase Server Client
+```typescript
+import { createClient } from '@supabase/supabase-js';
+
+// Server-side mit Service Role
+const supabaseAdmin = createClient(
+  process.env.SUPABASE_URL!,
+  process.env.SUPABASE_SERVICE_ROLE_KEY!
+);
+```
+
+### Supabase Client
+```typescript
+import { supabase } from '@/lib/supabase';
+
+// Client-side Query
+const { data, error } = await supabase
+  .from('table_name')
+  .select('*')
+  .eq('column', 'value');
+```
+
+## Environment Variables
+
+Erforderlich:
+- `NEXT_PUBLIC_SUPABASE_URL` - Supabase Project URL
+- `NEXT_PUBLIC_SUPABASE_ANON_KEY` - Supabase Anonymous Key
+- `SUPABASE_SERVICE_ROLE_KEY` - Supabase Service Role Key (Server-only)
+- `DATABASE_URL` - PostgreSQL Connection String
+
+Optional:
+- `REDIS_URL` - Redis Cache
+- `ANTHROPIC_API_KEY` - Claude API
+- `OPENAI_API_KEY` - OpenAI API
+
+## NPM Scripts
+
+- `pnpm dev` - Development Server (Port 3000)
+- `pnpm build` - Production Build
+- `pnpm start` - Production Server
+- `pnpm lint` - ESLint Check
+- `pnpm format` - Prettier Format
+
+## Deployment
+
+Das Projekt unterstützt:
+- **Docker:** Dockerfile vorhanden
+- **Kubernetes:** Helm Charts in `/helm`
+- **Harbor:** Image Registry Integration
+
+## Slash Commands
+
+Verfügbare Claude Code Commands:
+- `/supabase-db` - Datenbank-Operationen (CRUD, Migrations, Queries)
+- `/supabase-storage` - Storage-Operationen (Upload, Download, Buckets)
+- `/supabase-auth` - Authentication Setup & User Management
+- `/component` - Neue UI Component erstellen
+- `/api` - Neue API Route erstellen
+- `/deploy` - Deployment Anleitung
+
+## Hinweise
+
+1. **Sicherheit:** Niemals Service Role Key im Client-Code verwenden
+2. **RLS:** Immer Row Level Security Policies definieren
+3. **Typen:** Supabase Types mit `supabase gen types` generieren
+4. **Migrations:** SQL Migrations in Supabase Dashboard oder via CLI
--- a/.claude/commands/api.md
+++ b/.claude/commands/api.md
@@ -0,0 +1,286 @@
+# API Route Generator
+
+Du bist ein Experte für Next.js API Routes. Erstelle sichere, typisierte API Endpoints.
+
+## Deine Aufgaben
+
+Erstelle API Routes die:
+- Next.js App Router Patterns folgen
+- TypeScript mit korrekten Types verwenden
+- Error Handling implementieren
+- Input Validation durchführen
+- Supabase Integration nutzen
+
+## API Route Template
+
+```typescript
+// app/api/[resource]/route.ts
+import { NextRequest, NextResponse } from 'next/server';
+import { createClient } from '@supabase/supabase-js';
+
+const supabase = createClient(
+  process.env.SUPABASE_URL!,
+  process.env.SUPABASE_SERVICE_ROLE_KEY!
+);
+
+// GET - Liste oder einzelnes Item
+export async function GET(request: NextRequest) {
+  try {
+    const { searchParams } = new URL(request.url);
+    const id = searchParams.get('id');
+
+    if (id) {
+      // Single item
+      const { data, error } = await supabase
+        .from('table')
+        .select('*')
+        .eq('id', id)
+        .single();
+
+      if (error) throw error;
+      return NextResponse.json(data);
+    }
+
+    // List
+    const { data, error } = await supabase
+      .from('table')
+      .select('*')
+      .order('created_at', { ascending: false });
+
+    if (error) throw error;
+    return NextResponse.json(data);
+  } catch (error) {
+    console.error('GET error:', error);
+    return NextResponse.json(
+      { error: 'Failed to fetch data' },
+      { status: 500 }
+    );
+  }
+}
+
+// POST - Neues Item erstellen
+export async function POST(request: NextRequest) {
+  try {
+    const body = await request.json();
+
+    // Validation
+    if (!body.name) {
+      return NextResponse.json(
+        { error: 'Name is required' },
+        { status: 400 }
+      );
+    }
+
+    const { data, error } = await supabase
+      .from('table')
+      .insert(body)
+      .select()
+      .single();
+
+    if (error) throw error;
+    return NextResponse.json(data, { status: 201 });
+  } catch (error) {
+    console.error('POST error:', error);
+    return NextResponse.json(
+      { error: 'Failed to create item' },
+      { status: 500 }
+    );
+  }
+}
+
+// PUT - Item aktualisieren
+export async function PUT(request: NextRequest) {
+  try {
+    const body = await request.json();
+    const { id, ...updates } = body;
+
+    if (!id) {
+      return NextResponse.json(
+        { error: 'ID is required' },
+        { status: 400 }
+      );
+    }
+
+    const { data, error } = await supabase
+      .from('table')
+      .update(updates)
+      .eq('id', id)
+      .select()
+      .single();
+
+    if (error) throw error;
+    return NextResponse.json(data);
+  } catch (error) {
+    console.error('PUT error:', error);
+    return NextResponse.json(
+      { error: 'Failed to update item' },
+      { status: 500 }
+    );
+  }
+}
+
+// DELETE - Item löschen
+export async function DELETE(request: NextRequest) {
+  try {
+    const { searchParams } = new URL(request.url);
+    const id = searchParams.get('id');
+
+    if (!id) {
+      return NextResponse.json(
+        { error: 'ID is required' },
+        { status: 400 }
+      );
+    }
+
+    const { error } = await supabase
+      .from('table')
+      .delete()
+      .eq('id', id);
+
+    if (error) throw error;
+    return NextResponse.json({ success: true });
+  } catch (error) {
+    console.error('DELETE error:', error);
+    return NextResponse.json(
+      { error: 'Failed to delete item' },
+      { status: 500 }
+    );
+  }
+}
+```
+
+## Dynamic Route
+
+```typescript
+// app/api/users/[id]/route.ts
+import { NextRequest, NextResponse } from 'next/server';
+
+interface RouteParams {
+  params: Promise<{ id: string }>;
+}
+
+export async function GET(request: NextRequest, { params }: RouteParams) {
+  const { id } = await params;
+
+  const { data, error } = await supabase
+    .from('users')
+    .select('*')
+    .eq('id', id)
+    .single();
+
+  if (error || !data) {
+    return NextResponse.json({ error: 'User not found' }, { status: 404 });
+  }
+
+  return NextResponse.json(data);
+}
+```
+
+## Auth Protected Route
+
+```typescript
+// app/api/protected/route.ts
+import { NextRequest, NextResponse } from 'next/server';
+import { createServerClient } from '@supabase/ssr';
+import { cookies } from 'next/headers';
+
+export async function GET(request: NextRequest) {
+  const cookieStore = await cookies();
+
+  const supabase = createServerClient(
+    process.env.NEXT_PUBLIC_SUPABASE_URL!,
+    process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!,
+    {
+      cookies: {
+        get(name: string) {
+          return cookieStore.get(name)?.value;
+        },
+      },
+    }
+  );
+
+  const { data: { user }, error } = await supabase.auth.getUser();
+
+  if (error || !user) {
+    return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+  }
+
+  // User is authenticated
+  return NextResponse.json({ user });
+}
+```
+
+## Input Validation mit Zod
+
+```typescript
+import { z } from 'zod';
+
+const createUserSchema = z.object({
+  email: z.string().email(),
+  name: z.string().min(2).max(100),
+  role: z.enum(['user', 'admin']).optional().default('user'),
+});
+
+export async function POST(request: NextRequest) {
+  try {
+    const body = await request.json();
+
+    // Validate input
+    const result = createUserSchema.safeParse(body);
+    if (!result.success) {
+      return NextResponse.json(
+        { error: 'Validation failed', details: result.error.flatten() },
+        { status: 400 }
+      );
+    }
+
+    const validatedData = result.data;
+    // ... create user
+  } catch (error) {
+    return NextResponse.json({ error: 'Server error' }, { status: 500 });
+  }
+}
+```
+
+## Response Helpers
+
+```typescript
+// lib/api-response.ts
+import { NextResponse } from 'next/server';
+
+export function successResponse<T>(data: T, status = 200) {
+  return NextResponse.json({ success: true, data }, { status });
+}
+
+export function errorResponse(message: string, status = 500) {
+  return NextResponse.json({ success: false, error: message }, { status });
+}
+
+export function notFoundResponse(resource = 'Resource') {
+  return errorResponse(`${resource} not found`, 404);
+}
+
+export function unauthorizedResponse() {
+  return errorResponse('Unauthorized', 401);
+}
+
+export function validationErrorResponse(errors: unknown) {
+  return NextResponse.json(
+    { success: false, error: 'Validation failed', details: errors },
+    { status: 400 }
+  );
+}
+```
+
+## Best Practices
+
+1. **Error Handling** - Immer try/catch verwenden
+2. **Input Validation** - Alle Inputs validieren (Zod empfohlen)
+3. **Auth Check** - Geschützte Routen absichern
+4. **Status Codes** - Korrekte HTTP Status Codes
+5. **Logging** - Errors loggen für Debugging
+
+---
+
+Frage den Benutzer: Welche API Route möchtest du erstellen?
+Beschreibe die gewünschte Ressource und Operationen.
--- a/.claude/commands/component.md
+++ b/.claude/commands/component.md
@@ -0,0 +1,249 @@
+# UI Component Generator
+
+Du bist ein Experte für React/Next.js Components mit Tailwind CSS und Spartan UI. Erstelle moderne, wiederverwendbare UI Components.
+
+## Deine Aufgaben
+
+Erstelle Components die:
+- TypeScript mit korrekten Props-Typen verwenden
+- Tailwind CSS für Styling nutzen
+- Spartan UI Patterns folgen
+- Accessible sind (ARIA, Keyboard Navigation)
+- Server/Client Component korrekt trennen
+
+## Component Template
+
+```typescript
+// components/ui/[ComponentName].tsx
+import { cn } from '@/lib/utils';
+
+interface ComponentNameProps {
+  children?: React.ReactNode;
+  className?: string;
+  variant?: 'default' | 'primary' | 'secondary';
+  size?: 'sm' | 'md' | 'lg';
+}
+
+export function ComponentName({
+  children,
+  className,
+  variant = 'default',
+  size = 'md',
+}: ComponentNameProps) {
+  return (
+    <div
+      className={cn(
+        // Base styles
+        'rounded-lg border',
+        // Variants
+        {
+          'bg-background': variant === 'default',
+          'bg-primary text-primary-foreground': variant === 'primary',
+          'bg-secondary text-secondary-foreground': variant === 'secondary',
+        },
+        // Sizes
+        {
+          'p-2 text-sm': size === 'sm',
+          'p-4 text-base': size === 'md',
+          'p-6 text-lg': size === 'lg',
+        },
+        className
+      )}
+    >
+      {children}
+    </div>
+  );
+}
+```
+
+## Häufige Components
+
+### Button
+```typescript
+interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+  variant?: 'default' | 'primary' | 'outline' | 'ghost' | 'destructive';
+  size?: 'sm' | 'md' | 'lg' | 'icon';
+  loading?: boolean;
+}
+
+export function Button({
+  children,
+  className,
+  variant = 'default',
+  size = 'md',
+  loading = false,
+  disabled,
+  ...props
+}: ButtonProps) {
+  return (
+    <button
+      className={cn(
+        'inline-flex items-center justify-center rounded-md font-medium transition-colors',
+        'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2',
+        'disabled:pointer-events-none disabled:opacity-50',
+        {
+          'bg-primary text-primary-foreground hover:bg-primary/90': variant === 'primary',
+          'bg-secondary text-secondary-foreground hover:bg-secondary/80': variant === 'default',
+          'border border-input hover:bg-accent': variant === 'outline',
+          'hover:bg-accent': variant === 'ghost',
+          'bg-destructive text-destructive-foreground hover:bg-destructive/90': variant === 'destructive',
+        },
+        {
+          'h-8 px-3 text-sm': size === 'sm',
+          'h-10 px-4': size === 'md',
+          'h-12 px-6 text-lg': size === 'lg',
+          'h-10 w-10': size === 'icon',
+        },
+        className
+      )}
+      disabled={disabled || loading}
+      {...props}
+    >
+      {loading && <Spinner className="mr-2 h-4 w-4" />}
+      {children}
+    </button>
+  );
+}
+```
+
+### Card
+```typescript
+export function Card({ children, className }: { children: React.ReactNode; className?: string }) {
+  return (
+    <div className={cn('rounded-xl border bg-card p-6 shadow-sm', className)}>
+      {children}
+    </div>
+  );
+}
+
+export function CardHeader({ children, className }: { children: React.ReactNode; className?: string }) {
+  return <div className={cn('mb-4', className)}>{children}</div>;
+}
+
+export function CardTitle({ children, className }: { children: React.ReactNode; className?: string }) {
+  return <h3 className={cn('text-xl font-semibold', className)}>{children}</h3>;
+}
+
+export function CardContent({ children, className }: { children: React.ReactNode; className?: string }) {
+  return <div className={cn('', className)}>{children}</div>;
+}
+```
+
+### Input
+```typescript
+interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {
+  label?: string;
+  error?: string;
+}
+
+export function Input({ label, error, className, id, ...props }: InputProps) {
+  const inputId = id || label?.toLowerCase().replace(/\s/g, '-');
+
+  return (
+    <div className="space-y-1">
+      {label && (
+        <label htmlFor={inputId} className="text-sm font-medium">
+          {label}
+        </label>
+      )}
+      <input
+        id={inputId}
+        className={cn(
+          'flex h-10 w-full rounded-md border border-input bg-background px-3 py-2',
+          'text-sm placeholder:text-muted-foreground',
+          'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring',
+          'disabled:cursor-not-allowed disabled:opacity-50',
+          error && 'border-destructive',
+          className
+        )}
+        {...props}
+      />
+      {error && <p className="text-sm text-destructive">{error}</p>}
+    </div>
+  );
+}
+```
+
+### Modal/Dialog
+```typescript
+'use client';
+
+import { useEffect } from 'react';
+import { cn } from '@/lib/utils';
+
+interface ModalProps {
+  open: boolean;
+  onClose: () => void;
+  children: React.ReactNode;
+  className?: string;
+}
+
+export function Modal({ open, onClose, children, className }: ModalProps) {
+  useEffect(() => {
+    const handleEscape = (e: KeyboardEvent) => {
+      if (e.key === 'Escape') onClose();
+    };
+
+    if (open) {
+      document.addEventListener('keydown', handleEscape);
+      document.body.style.overflow = 'hidden';
+    }
+
+    return () => {
+      document.removeEventListener('keydown', handleEscape);
+      document.body.style.overflow = '';
+    };
+  }, [open, onClose]);
+
+  if (!open) return null;
+
+  return (
+    <div className="fixed inset-0 z-50 flex items-center justify-center">
+      <div className="fixed inset-0 bg-black/50" onClick={onClose} />
+      <div
+        className={cn(
+          'relative z-50 w-full max-w-lg rounded-lg bg-background p-6 shadow-lg',
+          className
+        )}
+      >
+        {children}
+      </div>
+    </div>
+  );
+}
+```
+
+## Client vs Server Components
+
+```typescript
+// Server Component (default) - keine Interaktivität
+// components/UserList.tsx
+export async function UserList() {
+  const users = await fetchUsers();
+  return <ul>{users.map(u => <li key={u.id}>{u.name}</li>)}</ul>;
+}
+
+// Client Component - mit Interaktivität
+// components/Counter.tsx
+'use client';
+
+import { useState } from 'react';
+
+export function Counter() {
+  const [count, setCount] = useState(0);
+  return <button onClick={() => setCount(c => c + 1)}>{count}</button>;
+}
+```
+
+## Best Practices
+
+1. **cn() Helper** - Für conditional classes
+2. **Forwardref** - Für DOM-Zugriff von außen
+3. **Composition** - Kleine, kombinierbare Components
+4. **Accessibility** - ARIA Labels, Keyboard Support
+5. **Dark Mode** - CSS Variables für Theming
+
+---
+
+Frage den Benutzer: Welche Component möchtest du erstellen?
+Beschreibe die gewünschte Funktionalität und das Design.
--- a/.claude/commands/db-connect.md
+++ b/.claude/commands/db-connect.md
@@ -0,0 +1,157 @@
+# PostgreSQL Datenbank Verbindung
+
+Du verbindest dich mit der PostgreSQL Datenbank des Projekts.
+
+## Automatischer Setup
+
+### 1. Betriebssystem erkennen
+
+Prüfe zuerst das Betriebssystem:
+
+```bash
+uname -s
+```
+
+### 2. PostgreSQL CLI installieren (falls nicht vorhanden)
+
+**macOS:**
+```bash
+# Prüfen ob psql installiert ist
+which psql || brew install postgresql
+```
+
+**Linux (Ubuntu/Debian):**
+```bash
+which psql || sudo apt-get update && sudo apt-get install -y postgresql-client
+```
+
+**Linux (Alpine):**
+```bash
+which psql || apk add postgresql-client
+```
+
+### 3. Environment Variable lesen
+
+Lese die `DATABASE_URL` aus `.env.local` oder `.env`:
+
+```bash
+# Aus .env.local
+grep DATABASE_URL .env.local 2>/dev/null || grep DATABASE_URL .env 2>/dev/null
+```
+
+Die URL hat das Format:
+```
+postgresql://USER:PASSWORD@HOST:PORT/DATABASE
+```
+
+### 4. Mit Datenbank verbinden
+
+```bash
+# Direkte Verbindung mit URL
+psql "$DATABASE_URL"
+
+# Oder mit Supabase
+psql "postgresql://postgres.[PROJECT-REF]:[PASSWORD]@aws-0-eu-central-1.pooler.supabase.com:6543/postgres"
+```
+
+## Häufige Befehle nach Verbindung
+
+```sql
+-- Alle Tabellen anzeigen
+\dt
+
+-- Tabellen mit Schema
+\dt public.*
+
+-- Tabellen-Details
+\d table_name
+
+-- Alle Schemas
+\dn
+
+-- Benutzer anzeigen
+\du
+
+-- Aktuelle Datenbank
+SELECT current_database();
+
+-- Tabellen-Größen
+SELECT
+  tablename,
+  pg_size_pretty(pg_total_relation_size(schemaname || '.' || tablename)) as size
+FROM pg_tables
+WHERE schemaname = 'public'
+ORDER BY pg_total_relation_size(schemaname || '.' || tablename) DESC;
+```
+
+## Supabase spezifische Queries
+
+```sql
+-- Auth Users (Supabase)
+SELECT id, email, created_at FROM auth.users LIMIT 10;
+
+-- Storage Buckets
+SELECT * FROM storage.buckets;
+
+-- RLS Policies
+SELECT * FROM pg_policies WHERE schemaname = 'public';
+
+-- Enabled Extensions
+SELECT * FROM pg_extension;
+```
+
+## SQL Datei ausführen
+
+```bash
+# SQL Datei ausführen
+psql "$DATABASE_URL" -f migrations/001_init.sql
+
+# Mit Output
+psql "$DATABASE_URL" -f migrations/001_init.sql -v ON_ERROR_STOP=1
+```
+
+## Backup & Restore
+
+```bash
+# Backup erstellen
+pg_dump "$DATABASE_URL" > backup.sql
+
+# Nur Schema
+pg_dump "$DATABASE_URL" --schema-only > schema.sql
+
+# Nur Daten
+pg_dump "$DATABASE_URL" --data-only > data.sql
+
+# Restore
+psql "$DATABASE_URL" < backup.sql
+```
+
+## Troubleshooting
+
+### Connection refused
+- Supabase Projekt ist pausiert → Dashboard öffnen
+- Firewall blockiert Port 5432/6543
+- IP nicht in Allowlist (Supabase: Database Settings > Connection Pooling)
+
+### SSL required
+```bash
+psql "$DATABASE_URL?sslmode=require"
+```
+
+### Password authentication failed
+- Passwort in URL URL-encoded? (`@` → `%40`, etc.)
+- Richtiges Passwort aus Supabase Dashboard
+
+---
+
+## Automatische Verbindung
+
+Führe diese Schritte aus:
+
+1. **OS prüfen:** `uname -s`
+2. **psql prüfen:** `which psql`
+3. **Falls nicht vorhanden:** Installiere je nach OS
+4. **DATABASE_URL laden:** Aus .env.local oder .env
+5. **Verbinden:** `psql "$DATABASE_URL"`
+
+Soll ich die Verbindung jetzt herstellen?
--- a/.claude/commands/deploy.md
+++ b/.claude/commands/deploy.md
@@ -0,0 +1,220 @@
+# Deployment Assistent
+
+Du bist ein Experte für das Deployment von Next.js Anwendungen mit Docker und Kubernetes.
+
+## Deployment Optionen
+
+### 1. Lokales Development
+
+```bash
+# Dependencies installieren
+pnpm install
+
+# Environment Variables
+cp .env.example .env.local
+# .env.local bearbeiten
+
+# Development Server starten
+pnpm dev
+```
+
+### 2. Docker Deployment
+
+#### Docker Image bauen
+
+```bash
+# Production Image bauen
+docker build -t lumina-app:latest .
+
+# Mit spezifischem Tag
+docker build -t lumina-app:v1.0.0 .
+
+# Lokaler Test
+docker run -p 3000:3000 --env-file .env.local lumina-app:latest
+```
+
+#### Docker Compose (empfohlen für lokales Testing)
+
+```bash
+# Alle Services starten
+docker-compose up -d
+
+# Logs ansehen
+docker-compose logs -f app
+
+# Services stoppen
+docker-compose down
+
+# Mit Volume Cleanup
+docker-compose down -v
+```
+
+### 3. Harbor Registry
+
+```bash
+# Bei Harbor einloggen
+docker login harbor.advisori.de
+
+# Image taggen
+docker tag lumina-app:latest harbor.advisori.de/lumina/PROJECT_ID:latest
+docker tag lumina-app:latest harbor.advisori.de/lumina/PROJECT_ID:v1.0.0
+
+# Pushen
+docker push harbor.advisori.de/lumina/PROJECT_ID:latest
+docker push harbor.advisori.de/lumina/PROJECT_ID:v1.0.0
+```
+
+### 4. Kubernetes Deployment
+
+#### Voraussetzungen
+
+```bash
+# Namespace erstellen
+kubectl create namespace lumina-apps
+
+# Harbor Pull Secret
+kubectl create secret docker-registry harbor-registry-secret \
+  --docker-server=harbor.advisori.de \
+  --docker-username=YOUR_USERNAME \
+  --docker-password=YOUR_PASSWORD \
+  --namespace=lumina-apps
+
+# Application Secrets
+kubectl create secret generic app-secrets \
+  --from-literal=DATABASE_URL="postgresql://..." \
+  --from-literal=SUPABASE_URL="https://..." \
+  --from-literal=SUPABASE_ANON_KEY="..." \
+  --from-literal=SUPABASE_SERVICE_ROLE_KEY="..." \
+  --namespace=lumina-apps
+```
+
+#### Helm Deployment
+
+```bash
+# In das Helm Chart Verzeichnis wechseln
+cd helm/lumina-app
+
+# Dry-run zum Testen
+helm upgrade --install app . \
+  --namespace lumina-apps \
+  --set image.repository=harbor.advisori.de/lumina/PROJECT_ID \
+  --set image.tag=latest \
+  --dry-run
+
+# Tatsächliches Deployment
+helm upgrade --install app . \
+  --namespace lumina-apps \
+  --set image.repository=harbor.advisori.de/lumina/PROJECT_ID \
+  --set image.tag=v1.0.0 \
+  --set ingress.hosts[0].host=app.advisori.de \
+  --set ingress.tls[0].hosts[0]=app.advisori.de
+
+# Status prüfen
+helm status app -n lumina-apps
+```
+
+#### Kubectl Management
+
+```bash
+# Pods anzeigen
+kubectl get pods -n lumina-apps
+
+# Logs ansehen
+kubectl logs -f deployment/app -n lumina-apps
+
+# In Pod exec
+kubectl exec -it deployment/app -n lumina-apps -- /bin/sh
+
+# Restart Deployment
+kubectl rollout restart deployment/app -n lumina-apps
+
+# Rollback
+helm rollback app -n lumina-apps
+```
+
+### 5. CI/CD Pipeline (Gitea Actions)
+
+```yaml
+# .gitea/workflows/deploy.yml
+name: Build and Deploy
+
+on:
+  push:
+    branches: [main]
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Login to Harbor
+        uses: docker/login-action@v3
+        with:
+          registry: harbor.advisori.de
+          username: ${{ secrets.HARBOR_USERNAME }}
+          password: ${{ secrets.HARBOR_PASSWORD }}
+
+      - name: Build and Push
+        uses: docker/build-push-action@v5
+        with:
+          push: true
+          tags: |
+            harbor.advisori.de/lumina/${{ github.event.repository.name }}:latest
+            harbor.advisori.de/lumina/${{ github.event.repository.name }}:${{ github.sha }}
+
+  deploy:
+    needs: build
+    runs-on: ubuntu-latest
+    steps:
+      - name: Deploy to K8s
+        uses: azure/k8s-deploy@v4
+        with:
+          namespace: lumina-apps
+          manifests: helm/lumina-app
+          images: harbor.advisori.de/lumina/${{ github.event.repository.name }}:${{ github.sha }}
+```
+
+## Troubleshooting
+
+### Container startet nicht
+```bash
+# Pod Status
+kubectl describe pod POD_NAME -n lumina-apps
+
+# Container Logs
+kubectl logs POD_NAME -n lumina-apps --previous
+```
+
+### Ingress funktioniert nicht
+```bash
+# Ingress Status
+kubectl get ingress -n lumina-apps
+
+# Ingress Details
+kubectl describe ingress app -n lumina-apps
+```
+
+### Health Check Fehler
+```bash
+# Health Endpoint testen
+kubectl port-forward svc/app 3000:80 -n lumina-apps
+curl http://localhost:3000/api/health
+```
+
+## Environment Variables Checkliste
+
+| Variable | Beschreibung | Erforderlich |
+|----------|--------------|--------------|
+| `NODE_ENV` | production | Ja |
+| `NEXT_PUBLIC_SUPABASE_URL` | Supabase URL | Ja |
+| `NEXT_PUBLIC_SUPABASE_ANON_KEY` | Anon Key | Ja |
+| `SUPABASE_SERVICE_ROLE_KEY` | Service Key | Ja |
+| `DATABASE_URL` | PostgreSQL URL | Optional |
+
+---
+
+Frage den Benutzer: Wie möchtest du deployen?
+- Lokal mit Docker Compose
+- Auf Kubernetes Cluster
+- CI/CD Pipeline einrichten
--- a/.claude/commands/setup.md
+++ b/.claude/commands/setup.md
@@ -0,0 +1,176 @@
+# Projekt Setup Assistent
+
+Du hilfst beim initialen Setup eines neuen Lumina-Projekts.
+
+## Setup Checkliste
+
+### 1. Dependencies installieren
+
+```bash
+# Mit pnpm (empfohlen)
+pnpm install
+
+# Oder mit npm
+npm install
+```
+
+### 2. Environment Variables konfigurieren
+
+```bash
+# Beispiel-Datei kopieren
+cp .env.example .env.local
+```
+
+Bearbeite `.env.local`:
+
+```env
+# Supabase (erforderlich)
+NEXT_PUBLIC_SUPABASE_URL=https://YOUR_PROJECT.supabase.co
+NEXT_PUBLIC_SUPABASE_ANON_KEY=your-anon-key
+SUPABASE_SERVICE_ROLE_KEY=your-service-role-key
+
+# Optional
+DATABASE_URL=postgresql://user:pass@host:5432/db
+REDIS_URL=redis://localhost:6379
+```
+
+### 3. Supabase Projekt erstellen
+
+1. Gehe zu [supabase.com](https://supabase.com)
+2. Erstelle ein neues Projekt
+3. Kopiere URL und Keys aus Project Settings > API
+4. Füge sie in `.env.local` ein
+
+### 4. Datenbank initialisieren
+
+Falls du SQL Migrationen hast:
+
+```bash
+# Via Supabase CLI
+npx supabase db push
+
+# Oder via Dashboard
+# - Gehe zu SQL Editor
+# - Führe deine Migrations aus
+```
+
+### 5. Development Server starten
+
+```bash
+pnpm dev
+```
+
+Öffne [http://localhost:3000](http://localhost:3000)
+
+## Projekt Struktur anlegen
+
+### Empfohlene Ordner
+
+```bash
+# UI Components
+mkdir -p components/ui
+mkdir -p components/forms
+mkdir -p components/layout
+
+# Features
+mkdir -p components/features
+
+# API Helpers
+mkdir -p lib/api
+mkdir -p lib/hooks
+
+# Types
+mkdir -p types
+```
+
+### Basis-Files erstellen
+
+```typescript
+// types/index.ts
+export interface User {
+  id: string;
+  email: string;
+  name?: string;
+  avatar_url?: string;
+  created_at: string;
+}
+
+// lib/hooks/useUser.ts
+'use client';
+import { useAuth } from '@/contexts/AuthContext';
+export function useUser() {
+  const { user, loading } = useAuth();
+  return { user, loading };
+}
+```
+
+## TypeScript Types aus Supabase generieren
+
+```bash
+# Supabase CLI installieren
+pnpm add -D supabase
+
+# Login
+npx supabase login
+
+# Types generieren
+npx supabase gen types typescript --project-id YOUR_PROJECT_ID > lib/database.types.ts
+```
+
+Verwendung:
+
+```typescript
+import { Database } from '@/lib/database.types';
+
+type User = Database['public']['Tables']['users']['Row'];
+type NewUser = Database['public']['Tables']['users']['Insert'];
+```
+
+## Git Setup
+
+```bash
+# Falls noch nicht initialisiert
+git init
+
+# Initial Commit
+git add .
+git commit -m "Initial setup"
+
+# Remote hinzufügen (Gitea)
+git remote add origin https://gitea.example.com/org/repo.git
+git push -u origin main
+```
+
+## Nächste Schritte
+
+Nach dem Setup kannst du:
+
+1. **Auth einrichten** - `/supabase-auth`
+2. **Datenbank Schema erstellen** - `/supabase-db`
+3. **UI Components bauen** - `/component`
+4. **API Routes erstellen** - `/api`
+
+## Häufige Probleme
+
+### "Module not found"
+```bash
+# Cache löschen
+rm -rf .next node_modules
+pnpm install
+```
+
+### Supabase Connection Error
+- URL und Keys prüfen
+- Supabase Projekt ist aktiv (nicht pausiert)
+- Anon Key hat Lese-Rechte
+
+### TypeScript Errors
+```bash
+# Type Check
+pnpm run lint
+npx tsc --noEmit
+```
+
+---
+
+Frage den Benutzer: Was möchtest du als nächstes einrichten?
--- a/.claude/commands/supabase-auth.md
+++ b/.claude/commands/supabase-auth.md
@@ -0,0 +1,287 @@
+# Supabase Authentication Assistent
+
+Du bist ein Experte für Supabase Authentication. Hilf dem Benutzer bei Auth-Setup, User Management und Session Handling.
+
+## Deine Aufgaben
+
+### 1. Auth Setup
+
+```typescript
+// lib/supabase-auth.ts
+import { createClient } from '@supabase/supabase-js';
+
+// Browser Client
+export const supabase = createClient(
+  process.env.NEXT_PUBLIC_SUPABASE_URL!,
+  process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!
+);
+
+// Server Client (für API Routes)
+export const supabaseAdmin = createClient(
+  process.env.SUPABASE_URL!,
+  process.env.SUPABASE_SERVICE_ROLE_KEY!,
+  {
+    auth: {
+      autoRefreshToken: false,
+      persistSession: false
+    }
+  }
+);
+```
+
+### 2. Sign Up / Sign In
+
+```typescript
+// Email/Password Sign Up
+const { data, error } = await supabase.auth.signUp({
+  email: 'user@example.com',
+  password: 'secure-password',
+  options: {
+    data: {
+      full_name: 'John Doe',
+    }
+  }
+});
+
+// Email/Password Sign In
+const { data, error } = await supabase.auth.signInWithPassword({
+  email: 'user@example.com',
+  password: 'password'
+});
+
+// Magic Link
+const { error } = await supabase.auth.signInWithOtp({
+  email: 'user@example.com',
+  options: {
+    emailRedirectTo: `${window.location.origin}/auth/callback`
+  }
+});
+
+// OAuth (Google, GitHub, etc.)
+const { error } = await supabase.auth.signInWithOAuth({
+  provider: 'google',
+  options: {
+    redirectTo: `${window.location.origin}/auth/callback`
+  }
+});
+```
+
+### 3. Session Management
+
+```typescript
+// Get current session
+const { data: { session } } = await supabase.auth.getSession();
+
+// Get current user
+const { data: { user } } = await supabase.auth.getUser();
+
+// Listen to auth changes
+supabase.auth.onAuthStateChange((event, session) => {
+  if (event === 'SIGNED_IN') {
+    console.log('User signed in:', session?.user);
+  } else if (event === 'SIGNED_OUT') {
+    console.log('User signed out');
+  }
+});
+
+// Sign out
+await supabase.auth.signOut();
+```
+
+### 4. Auth Context Provider
+
+```typescript
+// contexts/AuthContext.tsx
+'use client';
+
+import { createContext, useContext, useEffect, useState } from 'react';
+import { User, Session } from '@supabase/supabase-js';
+import { supabase } from '@/lib/supabase';
+
+interface AuthContextType {
+  user: User | null;
+  session: Session | null;
+  loading: boolean;
+  signOut: () => Promise<void>;
+}
+
+const AuthContext = createContext<AuthContextType | undefined>(undefined);
+
+export function AuthProvider({ children }: { children: React.ReactNode }) {
+  const [user, setUser] = useState<User | null>(null);
+  const [session, setSession] = useState<Session | null>(null);
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+    // Get initial session
+    supabase.auth.getSession().then(({ data: { session } }) => {
+      setSession(session);
+      setUser(session?.user ?? null);
+      setLoading(false);
+    });
+
+    // Listen for changes
+    const { data: { subscription } } = supabase.auth.onAuthStateChange(
+      (_event, session) => {
+        setSession(session);
+        setUser(session?.user ?? null);
+      }
+    );
+
+    return () => subscription.unsubscribe();
+  }, []);
+
+  const signOut = async () => {
+    await supabase.auth.signOut();
+  };
+
+  return (
+    <AuthContext.Provider value={{ user, session, loading, signOut }}>
+      {children}
+    </AuthContext.Provider>
+  );
+}
+
+export function useAuth() {
+  const context = useContext(AuthContext);
+  if (context === undefined) {
+    throw new Error('useAuth must be used within an AuthProvider');
+  }
+  return context;
+}
+```
+
+### 5. Protected Routes (Middleware)
+
+```typescript
+// middleware.ts
+import { createServerClient, type CookieOptions } from '@supabase/ssr';
+import { NextResponse, type NextRequest } from 'next/server';
+
+export async function middleware(request: NextRequest) {
+  let response = NextResponse.next({
+    request: {
+      headers: request.headers,
+    },
+  });
+
+  const supabase = createServerClient(
+    process.env.NEXT_PUBLIC_SUPABASE_URL!,
+    process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!,
+    {
+      cookies: {
+        get(name: string) {
+          return request.cookies.get(name)?.value;
+        },
+        set(name: string, value: string, options: CookieOptions) {
+          response.cookies.set({ name, value, ...options });
+        },
+        remove(name: string, options: CookieOptions) {
+          response.cookies.set({ name, value: '', ...options });
+        },
+      },
+    }
+  );
+
+  const { data: { session } } = await supabase.auth.getSession();
+
+  // Protect routes
+  if (!session && request.nextUrl.pathname.startsWith('/dashboard')) {
+    return NextResponse.redirect(new URL('/login', request.url));
+  }
+
+  return response;
+}
+
+export const config = {
+  matcher: ['/dashboard/:path*', '/api/protected/:path*']
+};
+```
+
+### 6. Password Reset
+
+```typescript
+// Request password reset
+const { error } = await supabase.auth.resetPasswordForEmail(email, {
+  redirectTo: `${window.location.origin}/auth/reset-password`
+});
+
+// Update password (after clicking reset link)
+const { error } = await supabase.auth.updateUser({
+  password: 'new-password'
+});
+```
+
+## Auth UI Components
+
+```typescript
+// components/auth/LoginForm.tsx
+'use client';
+
+import { useState } from 'react';
+import { supabase } from '@/lib/supabase';
+
+export function LoginForm() {
+  const [email, setEmail] = useState('');
+  const [password, setPassword] = useState('');
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+
+  const handleLogin = async (e: React.FormEvent) => {
+    e.preventDefault();
+    setLoading(true);
+    setError(null);
+
+    const { error } = await supabase.auth.signInWithPassword({
+      email,
+      password,
+    });
+
+    if (error) {
+      setError(error.message);
+    }
+
+    setLoading(false);
+  };
+
+  return (
+    <form onSubmit={handleLogin}>
+      <input
+        type="email"
+        value={email}
+        onChange={(e) => setEmail(e.target.value)}
+        placeholder="Email"
+        required
+      />
+      <input
+        type="password"
+        value={password}
+        onChange={(e) => setPassword(e.target.value)}
+        placeholder="Password"
+        required
+      />
+      {error && <p className="text-red-500">{error}</p>}
+      <button type="submit" disabled={loading}>
+        {loading ? 'Loading...' : 'Sign In'}
+      </button>
+    </form>
+  );
+}
+```
+
+## Best Practices
+
+1. **SSR Auth** - Nutze @supabase/ssr für Server-Side Auth
+2. **Middleware** - Schütze Routen serverseitig
+3. **Session Refresh** - Automatisch via Supabase Client
+4. **Error Handling** - User-freundliche Fehlermeldungen
+5. **Secure Cookies** - HttpOnly, Secure, SameSite
+
+---
+
+Frage den Benutzer: Was möchtest du mit Supabase Auth machen?
+- Auth Setup implementieren
+- Login/Signup Forms erstellen
+- OAuth Provider einrichten
+- Protected Routes konfigurieren
+- User Profile Management
--- a/.claude/commands/supabase-db.md
+++ b/.claude/commands/supabase-db.md
@@ -0,0 +1,136 @@
+# Supabase PostgreSQL Datenbank Assistent
+
+Du bist ein Experte für Supabase PostgreSQL Datenbank-Operationen. Hilf dem Benutzer bei:
+
+## Deine Aufgaben
+
+### 1. Tabellen erstellen
+Erstelle SQL Migrations mit:
+- Primärschlüssel (id als UUID mit gen_random_uuid())
+- created_at und updated_at Timestamps
+- Row Level Security (RLS) Policies
+- Indexes für häufig abgefragte Spalten
+
+### 2. CRUD Operationen
+Generiere TypeScript Code für:
+```typescript
+// SELECT
+const { data, error } = await supabase
+  .from('table')
+  .select('*')
+  .eq('column', value);
+
+// INSERT
+const { data, error } = await supabase
+  .from('table')
+  .insert({ column: value })
+  .select();
+
+// UPDATE
+const { data, error } = await supabase
+  .from('table')
+  .update({ column: value })
+  .eq('id', id)
+  .select();
+
+// DELETE
+const { error } = await supabase
+  .from('table')
+  .delete()
+  .eq('id', id);
+```
+
+### 3. Komplexe Queries
+- JOINs mit foreign key relationships
+- Aggregationen (count, sum, avg)
+- Filtering und Sorting
+- Pagination mit range()
+
+### 4. RLS Policies
+```sql
+-- Enable RLS
+ALTER TABLE table_name ENABLE ROW LEVEL SECURITY;
+
+-- Policy für authentifizierte User
+CREATE POLICY "Users can view own data"
+ON table_name FOR SELECT
+TO authenticated
+USING (auth.uid() = user_id);
+
+-- Policy für Insert
+CREATE POLICY "Users can insert own data"
+ON table_name FOR INSERT
+TO authenticated
+WITH CHECK (auth.uid() = user_id);
+```
+
+### 5. TypeScript Types generieren
+```bash
+# Supabase CLI installieren
+pnpm add -D supabase
+
+# Types generieren
+npx supabase gen types typescript --project-id YOUR_PROJECT_ID > lib/database.types.ts
+```
+
+## Best Practices
+
+1. **Immer RLS aktivieren** - Niemals Tabellen ohne RLS in Production
+2. **UUIDs als Primary Keys** - Besser für verteilte Systeme
+3. **Timestamps** - created_at/updated_at für Audit Trail
+4. **Soft Deletes** - deleted_at statt hartem DELETE
+5. **Indexes** - Für WHERE und ORDER BY Spalten
+
+## Beispiel Migration
+
+```sql
+-- Create users profile table
+CREATE TABLE profiles (
+  id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
+  user_id UUID REFERENCES auth.users(id) ON DELETE CASCADE NOT NULL,
+  username TEXT UNIQUE,
+  full_name TEXT,
+  avatar_url TEXT,
+  created_at TIMESTAMPTZ DEFAULT NOW(),
+  updated_at TIMESTAMPTZ DEFAULT NOW()
+);
+
+-- Enable RLS
+ALTER TABLE profiles ENABLE ROW LEVEL SECURITY;
+
+-- Policies
+CREATE POLICY "Public profiles are viewable by everyone"
+ON profiles FOR SELECT
+USING (true);
+
+CREATE POLICY "Users can update own profile"
+ON profiles FOR UPDATE
+TO authenticated
+USING (auth.uid() = user_id)
+WITH CHECK (auth.uid() = user_id);
+
+-- Index
+CREATE INDEX profiles_user_id_idx ON profiles(user_id);
+
+-- Updated_at trigger
+CREATE OR REPLACE FUNCTION update_updated_at()
+RETURNS TRIGGER AS $$
+BEGIN
+  NEW.updated_at = NOW();
+  RETURN NEW;
+END;
+$$ LANGUAGE plpgsql;
+
+CREATE TRIGGER profiles_updated_at
+BEFORE UPDATE ON profiles
+FOR EACH ROW EXECUTE FUNCTION update_updated_at();
+```
+
+---
+
+Frage den Benutzer: Was möchtest du mit der Datenbank machen?
+- Neue Tabelle erstellen
+- Query schreiben
+- RLS Policy einrichten
+- Types generieren
+- Migration erstellen
--- a/.claude/commands/supabase-storage.md
+++ b/.claude/commands/supabase-storage.md
@@ -0,0 +1,199 @@
+# Supabase Storage Assistent
+
+Du bist ein Experte für Supabase Storage. Hilf dem Benutzer bei File-Upload, Download und Bucket-Management.
+
+## Deine Aufgaben
+
+### 1. Bucket erstellen
+
+```sql
+-- Via SQL (Supabase Dashboard)
+INSERT INTO storage.buckets (id, name, public)
+VALUES ('avatars', 'avatars', true);
+
+-- Oder via CLI
+```
+
+```typescript
+// Via JavaScript (Admin/Service Role)
+const { data, error } = await supabaseAdmin.storage.createBucket('avatars', {
+  public: true,
+  fileSizeLimit: 1024 * 1024 * 2, // 2MB
+  allowedMimeTypes: ['image/png', 'image/jpeg', 'image/webp']
+});
+```
+
+### 2. File Upload
+
+```typescript
+// Client-side Upload
+async function uploadFile(file: File, bucket: string, path: string) {
+  const { data, error } = await supabase.storage
+    .from(bucket)
+    .upload(path, file, {
+      cacheControl: '3600',
+      upsert: false
+    });
+
+  if (error) throw error;
+  return data;
+}
+
+// Mit Progress
+async function uploadWithProgress(file: File, bucket: string, path: string) {
+  const { data, error } = await supabase.storage
+    .from(bucket)
+    .upload(path, file, {
+      onUploadProgress: (progress) => {
+        const percent = (progress.loaded / progress.total) * 100;
+        console.log(`Upload: ${percent.toFixed(0)}%`);
+      }
+    });
+  return { data, error };
+}
+```
+
+### 3. File Download
+
+```typescript
+// Download als Blob
+const { data, error } = await supabase.storage
+  .from('bucket')
+  .download('path/to/file.pdf');
+
+// Public URL (für öffentliche Buckets)
+const { data } = supabase.storage
+  .from('bucket')
+  .getPublicUrl('path/to/file.jpg');
+
+// Signed URL (für private Buckets)
+const { data, error } = await supabase.storage
+  .from('bucket')
+  .createSignedUrl('path/to/file.pdf', 3600); // 1 Stunde gültig
+```
+
+### 4. File Management
+
+```typescript
+// Liste Dateien
+const { data, error } = await supabase.storage
+  .from('bucket')
+  .list('folder/', {
+    limit: 100,
+    offset: 0,
+    sortBy: { column: 'name', order: 'asc' }
+  });
+
+// Datei löschen
+const { error } = await supabase.storage
+  .from('bucket')
+  .remove(['path/to/file1.jpg', 'path/to/file2.jpg']);
+
+// Datei verschieben/umbenennen
+const { error } = await supabase.storage
+  .from('bucket')
+  .move('old/path.jpg', 'new/path.jpg');
+
+// Datei kopieren
+const { error } = await supabase.storage
+  .from('bucket')
+  .copy('source/path.jpg', 'dest/path.jpg');
+```
+
+### 5. Storage Policies (RLS)
+
+```sql
+-- Öffentlicher Lesezugriff
+CREATE POLICY "Public read access"
+ON storage.objects FOR SELECT
+USING (bucket_id = 'public-bucket');
+
+-- Authentifizierte User können eigene Dateien hochladen
+CREATE POLICY "Users can upload own files"
+ON storage.objects FOR INSERT
+TO authenticated
+WITH CHECK (
+  bucket_id = 'user-files' AND
+  (storage.foldername(name))[1] = auth.uid()::text
+);
+
+-- User können nur eigene Dateien löschen
+CREATE POLICY "Users can delete own files"
+ON storage.objects FOR DELETE
+TO authenticated
+USING (
+  bucket_id = 'user-files' AND
+  (storage.foldername(name))[1] = auth.uid()::text
+);
+```
+
+## React Upload Component
+
+```typescript
+'use client';
+
+import { useState } from 'react';
+import { supabase } from '@/lib/supabase';
+
+interface FileUploadProps {
+  bucket: string;
+  onUpload: (url: string) => void;
+}
+
+export function FileUpload({ bucket, onUpload }: FileUploadProps) {
+  const [uploading, setUploading] = useState(false);
+  const [progress, setProgress] = useState(0);
+
+  const handleUpload = async (e: React.ChangeEvent<HTMLInputElement>) => {
+    const file = e.target.files?.[0];
+    if (!file) return;
+
+    setUploading(true);
+
+    const fileExt = file.name.split('.').pop();
+    const fileName = `${Date.now()}.${fileExt}`;
+    const filePath = `uploads/${fileName}`;
+
+    const { error } = await supabase.storage
+      .from(bucket)
+      .upload(filePath, file);
+
+    if (error) {
+      console.error('Upload error:', error);
+    } else {
+      const { data } = supabase.storage.from(bucket).getPublicUrl(filePath);
+      onUpload(data.publicUrl);
+    }
+
+    setUploading(false);
+  };
+
+  return (
+    <div>
+      <input
+        type="file"
+        onChange={handleUpload}
+        disabled={uploading}
+      />
+      {uploading && <span>Uploading...</span>}
+    </div>
+  );
+}
+```
+
+## Best Practices
+
+1. **Bucket-Struktur planen** - z.B. `{user_id}/{type}/{filename}`
+2. **File Size Limits setzen** - Verhindert Missbrauch
+3. **MIME Types einschränken** - Nur erlaubte Dateitypen
+4. **Signed URLs für private Dateien** - Zeitlich begrenzt
+5. **CDN nutzen** - Public URLs werden automatisch gecacht
+
+---
+
+Frage den Benutzer: Was möchtest du mit Supabase Storage machen?
+- Neuen Bucket erstellen
+- Upload Component bauen
+- Download implementieren
+- Storage Policies einrichten
+- Dateien verwalten
--- a/.claude/settings.json
+++ b/.claude/settings.json
@@ -0,0 +1,23 @@
+{
+  "permissions": {
+    "allow": [
+      "Bash(pnpm *)",
+      "Bash(npm *)",
+      "Bash(npx *)",
+      "Bash(docker *)",
+      "Bash(docker-compose *)",
+      "Bash(git *)",
+      "Bash(curl *)",
+      "Bash(ls *)",
+      "Bash(cat *)",
+      "Bash(mkdir *)",
+      "Bash(cp *)",
+      "Bash(mv *)",
+      "WebSearch"
+    ],
+    "deny": [
+      "Bash(rm -rf /)",
+      "Bash(sudo *)"
+    ]
+  }
+}
--- a/.claude/skills/dependency-scanner/SKILL.md
+++ b/.claude/skills/dependency-scanner/SKILL.md
@@ -0,0 +1,114 @@
+---
+name: dependency-scanner
+description: Scannt npm Dependencies auf bekannte Sicherheitsluecken und veraltete Pakete. Nutze diesen Skill nach npm install, bei neuen Dependencies, oder wenn der User nach "vulnerabilities", "outdated", "npm audit", "dependency check", "pakete pruefen", "sicherheitsluecken" fragt. Gibt Ergebnisse zurueck die im Chat angezeigt werden.
+---
+
+# Dependency Security Scanner
+
+Scannt npm/pnpm Dependencies auf Sicherheitsluecken und veraltete Pakete.
+
+## Automatische Ausfuehrung
+
+Fuehre diesen Scan aus:
+1. Nach `npm install` oder `pnpm install`
+2. Bei neuen Dependencies in package.json
+3. Regelmaessig als Security Check
+
+## Scripts
+
+### Vollstaendiger Scan
+```bash
+bash scan-deps.sh
+```
+
+### Nur Audit (Vulnerabilities)
+```bash
+bash audit.sh
+```
+
+### Veraltete Pakete pruefen
+```bash
+bash check-outdated.sh
+```
+
+### Automatisch fixen
+```bash
+bash fix-vulnerabilities.sh
+```
+
+## Scan Ablauf
+
+### 1. npm audit durchfuehren
+```bash
+# Mit pnpm
+pnpm audit --json
+
+# Mit npm
+npm audit --json
+```
+
+### 2. Veraltete Pakete pruefen
+```bash
+# Mit pnpm
+pnpm outdated --json
+
+# Mit npm
+npm outdated --json
+```
+
+### 3. License Check (optional)
+```bash
+npx license-checker --summary
+```
+
+## Report Format fuer Chat
+
+Gib das Ergebnis in diesem Format zurueck:
+
+```markdown
+## Dependency Security Report
+
+**Scan Datum**: [timestamp]
+**Pakete geprueft**: [count]
+
+### Vulnerabilities
+
+| Severity | Count |
+|----------|-------|
+| Critical | 0     |
+| High     | 2     |
+| Moderate | 5     |
+| Low      | 3     |
+
+### Kritische Issues
+
+1. **lodash** (4.17.15) - Prototype Pollution
+   - Fix: `pnpm update lodash`
+
+2. **axios** (0.21.0) - SSRF Vulnerability
+   - Fix: `pnpm update axios`
+
+### Veraltete Pakete
+
+| Paket | Aktuell | Neueste | Typ |
+|-------|---------|---------|-----|
+| react | 18.2.0  | 19.0.0  | major |
+| next  | 14.0.0  | 15.1.0  | major |
+
+### Empfehlungen
+
+1. **Sofort**: Kritische Vulnerabilities fixen
+2. **Diese Woche**: High Severity fixen
+3. **Geplant**: Major Updates evaluieren
+
+### Automatischer Fix
+
+Fuehre aus: `pnpm audit fix` oder `bash fix-vulnerabilities.sh`
+```
+
+## Wichtig
+
+- Zeige Ergebnisse IMMER im Chat an
+- Bei kritischen Vulnerabilities: Warnung hervorheben
+- Schlage konkrete Fix-Befehle vor
+- Bei Major Updates: Changelog verlinken
--- a/.claude/skills/dependency-scanner/audit.sh
+++ b/.claude/skills/dependency-scanner/audit.sh
@@ -0,0 +1,16 @@
+#!/bin/bash
+# Schneller Vulnerability Audit
+
+set -e
+
+# Package Manager erkennen
+if [ -f "pnpm-lock.yaml" ]; then
+    echo "Fuehre pnpm audit aus..."
+    pnpm audit
+elif [ -f "yarn.lock" ]; then
+    echo "Fuehre yarn audit aus..."
+    yarn audit
+else
+    echo "Fuehre npm audit aus..."
+    npm audit
+fi
--- a/.claude/skills/dependency-scanner/check-outdated.sh
+++ b/.claude/skills/dependency-scanner/check-outdated.sh
@@ -0,0 +1,22 @@
+#!/bin/bash
+# Prueft auf veraltete Pakete
+
+set -e
+
+echo "Pruefe veraltete Pakete..."
+echo ""
+
+# Package Manager erkennen
+if [ -f "pnpm-lock.yaml" ]; then
+    pnpm outdated || true
+elif [ -f "yarn.lock" ]; then
+    yarn outdated || true
+else
+    npm outdated || true
+fi
+
+echo ""
+echo "Zum Updaten:"
+echo "  Alle: pnpm update"
+echo "  Einzeln: pnpm update <paket>"
+echo "  Major: pnpm update <paket>@latest"
--- a/.claude/skills/dependency-scanner/fix-vulnerabilities.sh
+++ b/.claude/skills/dependency-scanner/fix-vulnerabilities.sh
@@ -0,0 +1,60 @@
+#!/bin/bash
+# Automatischer Fix fuer Vulnerabilities
+
+set -e
+
+# Farben
+RED='\033[0;31m'
+GREEN='\033[0;32m'
+YELLOW='\033[1;33m'
+NC='\033[0m'
+
+echo "Dependency Vulnerability Fix"
+echo "============================"
+echo ""
+
+# Package Manager erkennen
+if [ -f "pnpm-lock.yaml" ]; then
+    PKG_MANAGER="pnpm"
+elif [ -f "yarn.lock" ]; then
+    PKG_MANAGER="yarn"
+else
+    PKG_MANAGER="npm"
+fi
+
+# Vorher: Audit Status
+echo -e "${YELLOW}Status vor Fix:${NC}"
+$PKG_MANAGER audit 2>/dev/null | tail -5 || true
+echo ""
+
+# Fix durchfuehren
+echo -e "${YELLOW}Fuehre automatischen Fix durch...${NC}"
+echo ""
+
+case "$PKG_MANAGER" in
+    "pnpm")
+        # pnpm hat kein direktes audit fix
+        echo "pnpm: Update betroffene Pakete..."
+        pnpm update
+        ;;
+    "yarn")
+        yarn audit fix || yarn upgrade
+        ;;
+    "npm")
+        npm audit fix
+        ;;
+esac
+
+echo ""
+
+# Nachher: Audit Status
+echo -e "${YELLOW}Status nach Fix:${NC}"
+$PKG_MANAGER audit 2>/dev/null | tail -5 || true
+
+echo ""
+echo -e "${GREEN}Fix abgeschlossen!${NC}"
+echo ""
+echo "Naechste Schritte:"
+echo "  1. Teste die Anwendung: pnpm dev"
+echo "  2. Fuehre Tests aus: pnpm test"
+echo "  3. Bei Problemen: git checkout package.json pnpm-lock.yaml"
--- a/.claude/skills/dependency-scanner/scan-deps.sh
+++ b/.claude/skills/dependency-scanner/scan-deps.sh
@@ -0,0 +1,160 @@
+#!/bin/bash
+# Vollstaendiger Dependency Security Scan
+
+set -e
+
+# Farben
+RED='\033[0;31m'
+YELLOW='\033[1;33m'
+GREEN='\033[0;32m'
+BLUE='\033[0;34m'
+NC='\033[0m'
+
+echo -e "${BLUE}================================${NC}"
+echo -e "${BLUE}Dependency Security Scanner${NC}"
+echo -e "${BLUE}================================${NC}"
+echo ""
+
+# Package Manager erkennen
+if [ -f "pnpm-lock.yaml" ]; then
+    PKG_MANAGER="pnpm"
+elif [ -f "yarn.lock" ]; then
+    PKG_MANAGER="yarn"
+elif [ -f "package-lock.json" ]; then
+    PKG_MANAGER="npm"
+else
+    PKG_MANAGER="npm"
+fi
+
+echo "Package Manager: $PKG_MANAGER"
+echo ""
+
+# Temporaere Dateien
+AUDIT_FILE=$(mktemp)
+OUTDATED_FILE=$(mktemp)
+
+# ================================
+# 1. VULNERABILITY AUDIT
+# ================================
+echo -e "${YELLOW}[1/3] Pruefe Sicherheitsluecken...${NC}"
+
+case "$PKG_MANAGER" in
+    "pnpm")
+        pnpm audit --json > "$AUDIT_FILE" 2>/dev/null || true
+        ;;
+    "yarn")
+        yarn audit --json > "$AUDIT_FILE" 2>/dev/null || true
+        ;;
+    "npm")
+        npm audit --json > "$AUDIT_FILE" 2>/dev/null || true
+        ;;
+esac
+
+# Audit Ergebnisse parsen
+if [ -s "$AUDIT_FILE" ]; then
+    CRITICAL=$(jq '.metadata.vulnerabilities.critical // 0' "$AUDIT_FILE" 2>/dev/null || echo "0")
+    HIGH=$(jq '.metadata.vulnerabilities.high // 0' "$AUDIT_FILE" 2>/dev/null || echo "0")
+    MODERATE=$(jq '.metadata.vulnerabilities.moderate // 0' "$AUDIT_FILE" 2>/dev/null || echo "0")
+    LOW=$(jq '.metadata.vulnerabilities.low // 0' "$AUDIT_FILE" 2>/dev/null || echo "0")
+    TOTAL=$((CRITICAL + HIGH + MODERATE + LOW))
+else
+    CRITICAL=0
+    HIGH=0
+    MODERATE=0
+    LOW=0
+    TOTAL=0
+fi
+
+echo ""
+echo "Vulnerabilities gefunden:"
+echo -e "  ${RED}Critical: $CRITICAL${NC}"
+echo -e "  ${RED}High: $HIGH${NC}"
+echo -e "  ${YELLOW}Moderate: $MODERATE${NC}"
+echo -e "  Low: $LOW"
+echo ""
+
+# ================================
+# 2. OUTDATED CHECK
+# ================================
+echo -e "${YELLOW}[2/3] Pruefe veraltete Pakete...${NC}"
+
+case "$PKG_MANAGER" in
+    "pnpm")
+        pnpm outdated --json > "$OUTDATED_FILE" 2>/dev/null || true
+        ;;
+    "npm")
+        npm outdated --json > "$OUTDATED_FILE" 2>/dev/null || true
+        ;;
+    "yarn")
+        yarn outdated --json > "$OUTDATED_FILE" 2>/dev/null || true
+        ;;
+esac
+
+if [ -s "$OUTDATED_FILE" ]; then
+    OUTDATED_COUNT=$(jq 'length' "$OUTDATED_FILE" 2>/dev/null || echo "0")
+    echo "Veraltete Pakete: $OUTDATED_COUNT"
+
+    if [ "$OUTDATED_COUNT" -gt 0 ]; then
+        echo ""
+        echo "Top 10 veraltete Pakete:"
+        jq -r 'to_entries | .[:10][] | "  \(.key): \(.value.current // "?") -> \(.value.latest // "?")"' "$OUTDATED_FILE" 2>/dev/null || true
+    fi
+else
+    OUTDATED_COUNT=0
+    echo "Keine veralteten Pakete gefunden."
+fi
+
+echo ""
+
+# ================================
+# 3. SCORE BERECHNEN
+# ================================
+echo -e "${YELLOW}[3/3] Berechne Security Score...${NC}"
+
+SCORE=$((100 - (CRITICAL * 25) - (HIGH * 10) - (MODERATE * 3) - (LOW * 1)))
+if [ $SCORE -lt 0 ]; then SCORE=0; fi
+
+echo ""
+echo -e "${BLUE}================================${NC}"
+echo -e "${BLUE}ERGEBNIS${NC}"
+echo -e "${BLUE}================================${NC}"
+echo ""
+
+if [ $SCORE -ge 90 ]; then
+    echo -e "Security Score: ${GREEN}$SCORE/100${NC}"
+elif [ $SCORE -ge 70 ]; then
+    echo -e "Security Score: ${YELLOW}$SCORE/100${NC}"
+else
+    echo -e "Security Score: ${RED}$SCORE/100${NC}"
+fi
+
+echo ""
+echo "Zusammenfassung:"
+echo "  Vulnerabilities: $TOTAL"
+echo "  Veraltete Pakete: $OUTDATED_COUNT"
+
+# ================================
+# EMPFEHLUNGEN
+# ================================
+echo ""
+echo -e "${BLUE}Empfehlungen:${NC}"
+
+if [ "$CRITICAL" -gt 0 ] || [ "$HIGH" -gt 0 ]; then
+    echo -e "  ${RED}DRINGEND: Fuehre '$PKG_MANAGER audit fix' aus${NC}"
+fi
+
+if [ "$OUTDATED_COUNT" -gt 10 ]; then
+    echo -e "  ${YELLOW}Updates verfuegbar: '$PKG_MANAGER update'${NC}"
+fi
+
+if [ "$TOTAL" -eq 0 ] && [ "$OUTDATED_COUNT" -lt 5 ]; then
+    echo -e "  ${GREEN}Alles in Ordnung! Dependencies sind sicher.${NC}"
+fi
+
+# Cleanup
+rm -f "$AUDIT_FILE" "$OUTDATED_FILE"
+
+# Exit mit Fehler bei kritischen Issues
+if [ "$CRITICAL" -gt 0 ]; then
+    exit 1
+fi
--- a/.claude/skills/postgres-connect/SKILL.md
+++ b/.claude/skills/postgres-connect/SKILL.md
@@ -0,0 +1,55 @@
+---
+name: postgres-connect
+description: Verbindet mit der PostgreSQL Datenbank. Erkennt das Betriebssystem, installiert psql CLI falls noetig, liest DATABASE_URL aus .env und stellt Verbindung her. Nutze diesen Skill wenn der User "Datenbank verbinden", "DB Verbindung", "psql", "PostgreSQL connect" oder aehnliches erwaehnt.
+---
+
+# PostgreSQL Datenbank Verbindung
+
+Dieser Skill verbindet automatisch mit der PostgreSQL Datenbank des Projekts.
+
+## Automatischer Ablauf
+
+1. **OS erkennen** mit dem Script `detect-os.sh`
+2. **psql pruefen** - ist PostgreSQL CLI installiert?
+3. **Falls nicht installiert** - Installation je nach OS
+4. **DATABASE_URL laden** aus `.env.local` oder `.env`
+5. **Verbindung herstellen** mit psql
+
+## Scripts verwenden
+
+### OS-Erkennung
+```bash
+bash detect-os.sh
+```
+
+### psql Installation
+```bash
+bash install-psql.sh
+```
+
+### Verbindung herstellen
+```bash
+bash connect.sh
+```
+
+## Manuelle Befehle nach Verbindung
+
+```sql
+-- Alle Tabellen anzeigen
+\dt
+
+-- Tabellen-Schema
+\d table_name
+
+-- Supabase Auth Users
+SELECT id, email, created_at FROM auth.users LIMIT 10;
+
+-- RLS Policies pruefen
+SELECT * FROM pg_policies WHERE schemaname = 'public';
+```
+
+## Troubleshooting
+
+- **Connection refused**: Supabase Projekt evtl. pausiert
+- **SSL required**: `?sslmode=require` an URL anhaengen
+- **Auth failed**: Passwort URL-encoded? (@ -> %40)
--- a/.claude/skills/postgres-connect/check-connection.sh
+++ b/.claude/skills/postgres-connect/check-connection.sh
@@ -0,0 +1,36 @@
+#!/bin/bash
+# Testet die Datenbankverbindung ohne interaktive Shell
+
+set -e
+
+# DATABASE_URL laden
+if [ -f .env.local ]; then
+    DATABASE_URL=$(grep -E "^DATABASE_URL=" .env.local | cut -d '=' -f2- | tr -d '"' | tr -d "'")
+fi
+
+if [ -z "$DATABASE_URL" ] && [ -f .env ]; then
+    DATABASE_URL=$(grep -E "^DATABASE_URL=" .env | cut -d '=' -f2- | tr -d '"' | tr -d "'")
+fi
+
+if [ -z "$DATABASE_URL" ]; then
+    echo "DATABASE_URL nicht gefunden"
+    exit 1
+fi
+
+# Verbindung testen
+echo "Teste Verbindung..."
+if psql "$DATABASE_URL" -c "SELECT 1;" > /dev/null 2>&1; then
+    echo "Verbindung erfolgreich!"
+
+    # Zusaetzliche Infos
+    echo ""
+    echo "Datenbank-Info:"
+    psql "$DATABASE_URL" -c "SELECT current_database() as database, current_user as user, version();" 2>/dev/null
+
+    echo ""
+    echo "Tabellen:"
+    psql "$DATABASE_URL" -c "\dt" 2>/dev/null || echo "(keine Tabellen gefunden)"
+else
+    echo "Verbindung fehlgeschlagen!"
+    exit 1
+fi
--- a/.claude/skills/postgres-connect/connect.sh
+++ b/.claude/skills/postgres-connect/connect.sh
@@ -0,0 +1,27 @@
+#!/bin/bash
+# Verbindet mit der PostgreSQL Datenbank aus .env
+
+set -e
+
+# DATABASE_URL aus .env.local oder .env laden
+if [ -f .env.local ]; then
+    DATABASE_URL=$(grep -E "^DATABASE_URL=" .env.local | cut -d '=' -f2- | tr -d '"' | tr -d "'")
+fi
+
+if [ -z "$DATABASE_URL" ] && [ -f .env ]; then
+    DATABASE_URL=$(grep -E "^DATABASE_URL=" .env | cut -d '=' -f2- | tr -d '"' | tr -d "'")
+fi
+
+if [ -z "$DATABASE_URL" ]; then
+    echo "Fehler: DATABASE_URL nicht in .env.local oder .env gefunden."
+    echo ""
+    echo "Bitte fuege DATABASE_URL zu .env.local hinzu:"
+    echo 'DATABASE_URL="postgresql://user:password@host:port/database"'
+    exit 1
+fi
+
+echo "Verbinde mit Datenbank..."
+echo "URL: ${DATABASE_URL%%@*}@***" # URL ohne Passwort ausgeben
+
+# Verbindung herstellen
+psql "$DATABASE_URL"
--- a/.claude/skills/postgres-connect/detect-os.sh
+++ b/.claude/skills/postgres-connect/detect-os.sh
@@ -0,0 +1,28 @@
+#!/bin/bash
+# Erkennt das Betriebssystem und gibt es aus
+
+OS_TYPE=$(uname -s)
+
+case "$OS_TYPE" in
+    "Darwin")
+        echo "macos"
+        ;;
+    "Linux")
+        # Unterscheide zwischen verschiedenen Linux-Distributionen
+        if [ -f /etc/alpine-release ]; then
+            echo "alpine"
+        elif [ -f /etc/debian_version ]; then
+            echo "debian"
+        elif [ -f /etc/redhat-release ]; then
+            echo "redhat"
+        else
+            echo "linux"
+        fi
+        ;;
+    "MINGW"*|"MSYS"*|"CYGWIN"*)
+        echo "windows"
+        ;;
+    *)
+        echo "unknown"
+        ;;
+esac
--- a/.claude/skills/postgres-connect/install-psql.sh
+++ b/.claude/skills/postgres-connect/install-psql.sh
@@ -0,0 +1,72 @@
+#!/bin/bash
+# Installiert PostgreSQL CLI basierend auf dem Betriebssystem
+
+set -e
+
+# OS erkennen
+OS_TYPE=$(uname -s)
+
+# Pruefen ob psql bereits installiert ist
+if command -v psql &> /dev/null; then
+    echo "psql ist bereits installiert: $(psql --version)"
+    exit 0
+fi
+
+echo "psql nicht gefunden. Starte Installation..."
+
+case "$OS_TYPE" in
+    "Darwin")
+        # macOS - mit Homebrew
+        if ! command -v brew &> /dev/null; then
+            echo "Homebrew nicht gefunden. Bitte installiere Homebrew zuerst:"
+            echo '/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"'
+            exit 1
+        fi
+        echo "Installiere PostgreSQL via Homebrew..."
+        brew install postgresql
+        ;;
+
+    "Linux")
+        if [ -f /etc/alpine-release ]; then
+            # Alpine Linux
+            echo "Installiere PostgreSQL Client auf Alpine..."
+            apk add --no-cache postgresql-client
+
+        elif [ -f /etc/debian_version ]; then
+            # Debian/Ubuntu
+            echo "Installiere PostgreSQL Client auf Debian/Ubuntu..."
+            sudo apt-get update
+            sudo apt-get install -y postgresql-client
+
+        elif [ -f /etc/redhat-release ]; then
+            # RHEL/CentOS/Fedora
+            echo "Installiere PostgreSQL Client auf RHEL/CentOS..."
+            sudo yum install -y postgresql
+
+        else
+            echo "Unbekannte Linux-Distribution. Bitte installiere postgresql-client manuell."
+            exit 1
+        fi
+        ;;
+
+    "MINGW"*|"MSYS"*|"CYGWIN"*)
+        # Windows
+        echo "Windows erkannt."
+        echo "Bitte installiere PostgreSQL von: https://www.postgresql.org/download/windows/"
+        echo "Oder nutze: winget install PostgreSQL.PostgreSQL"
+        exit 1
+        ;;
+
+    *)
+        echo "Unbekanntes Betriebssystem: $OS_TYPE"
+        exit 1
+        ;;
+esac
+
+# Verifizieren
+if command -v psql &> /dev/null; then
+    echo "Installation erfolgreich: $(psql --version)"
+else
+    echo "Installation fehlgeschlagen."
+    exit 1
+fi
--- a/.claude/skills/semgrep-security/SKILL.md
+++ b/.claude/skills/semgrep-security/SKILL.md
@@ -0,0 +1,148 @@
+---
+name: semgrep-security
+description: Security Scanner mit Semgrep. WICHTIG - Dieser Skill wird automatisch bei JEDER Code-Implementierung aktiviert. Scannt neuen und geaenderten Code auf Sicherheitsluecken, Vulnerabilities und Best Practice Verstoesse. Aktiviert bei Begriffen wie "implementieren", "code schreiben", "feature erstellen", "komponente bauen", "funktion erstellen", "api route", "fertig", "done", "commit", "security", "scan", "vulnerabilities", "sicherheit".
+---
+
+# Semgrep Security Scanner
+
+Dieser Skill scannt automatisch Code auf Sicherheitsprobleme nach jeder Implementierung.
+
+## WICHTIG: Automatische Ausfuehrung
+
+Nach JEDER Code-Implementierung fuehre folgende Schritte aus:
+
+1. **Semgrep installieren** (falls nicht vorhanden)
+2. **Geaenderte Dateien scannen**
+3. **Probleme fixen oder reporten**
+
+## Scripts
+
+### Installation pruefen und durchfuehren
+```bash
+bash install-semgrep.sh
+```
+
+### Scan durchfuehren
+```bash
+# Alle Dateien scannen
+bash scan.sh
+
+# Nur bestimmte Dateien scannen
+bash scan.sh app/api/users/route.ts components/UserForm.tsx
+```
+
+### Autofix anwenden
+```bash
+bash autofix.sh
+```
+
+## Workflow nach Implementierung
+
+### 1. Installation sicherstellen
+```bash
+# Pruefen ob semgrep installiert ist
+which semgrep || bash install-semgrep.sh
+```
+
+### 2. Geaenderte Dateien ermitteln
+```bash
+# Untracked und modified files
+git status --porcelain | grep -E '^\?\?|^ M|^M' | cut -c4-
+```
+
+### 3. Security Scan ausfuehren
+```bash
+# Mit Auto-Config (empfohlen)
+semgrep --config=auto --json .
+
+# Fuer TypeScript/React spezifisch
+semgrep --config=p/typescript --config=p/react --json .
+
+# OWASP Top 10
+semgrep --config=p/owasp-top-ten --json .
+```
+
+### 4. Ergebnisse analysieren und fixen
+```bash
+# Mit Autofix
+semgrep --config=auto --autofix .
+
+# Nur Report ohne Fix
+semgrep --config=auto --sarif -o results.sarif .
+```
+
+## Haeufige Security Issues und Fixes
+
+### SQL Injection
+```typescript
+// SCHLECHT
+const query = `SELECT * FROM users WHERE id = ${userId}`;
+
+// GUT
+const { data } = await supabase.from('users').select('*').eq('id', userId);
+```
+
+### XSS (Cross-Site Scripting)
+```typescript
+// SCHLECHT
+<div dangerouslySetInnerHTML={{ __html: userInput }} />
+
+// GUT
+<div>{sanitize(userInput)}</div>
+```
+
+### Hardcoded Secrets
+```typescript
+// SCHLECHT
+const apiKey = "sk-1234567890";
+
+// GUT
+const apiKey = process.env.API_KEY;
+```
+
+### Insecure Direct Object Reference
+```typescript
+// SCHLECHT - Keine Auth-Pruefung
+const user = await getUser(req.query.id);
+
+// GUT - Mit RLS oder Auth-Check
+const { data: { user } } = await supabase.auth.getUser();
+const profile = await supabase.from('profiles').select().eq('user_id', user.id);
+```
+
+## Report Format
+
+Nach jedem Scan zeige:
+
+```markdown
+## Security Scan Ergebnisse
+
+**Score**: 85/100
+
+| Severity | Count |
+|----------|-------|
+| Critical | 0     |
+| High     | 1     |
+| Medium   | 3     |
+| Low      | 5     |
+
+### Gefundene Issues
+
+1. **[HIGH] Potential XSS** in `components/Comment.tsx:42`
+   - Problem: Unescaped user input
+   - Fix: Verwende DOMPurify oder sanitize-html
+
+### Automatisch gefixt
+- 2 Issues wurden automatisch behoben
+
+### Naechste Schritte
+- [ ] Issue #1 manuell pruefen
+```
+
+## Best Practices
+
+1. **Immer scannen** nach Code-Aenderungen
+2. **Autofix nutzen** fuer einfache Issues
+3. **Kritische Issues** sofort beheben
+4. **False Positives** in `.semgrepignore` ausschliessen
+5. **CI/CD Integration** fuer automatische Scans
--- a/.claude/skills/semgrep-security/autofix.sh
+++ b/.claude/skills/semgrep-security/autofix.sh
@@ -0,0 +1,54 @@
+#!/bin/bash
+# Fuehrt Semgrep Autofix durch
+
+set -e
+
+# Farben
+GREEN='\033[0;32m'
+YELLOW='\033[1;33m'
+NC='\033[0m'
+
+# Pruefen ob Semgrep installiert ist
+if ! command -v semgrep &> /dev/null; then
+    echo -e "${YELLOW}Semgrep nicht gefunden. Installiere...${NC}"
+    bash "$(dirname "$0")/install-semgrep.sh"
+fi
+
+# Argumente
+if [ $# -gt 0 ]; then
+    SCAN_TARGET="$@"
+else
+    SCAN_TARGET="."
+fi
+
+echo "Starte Semgrep Autofix..."
+echo "========================="
+echo ""
+
+# Autofix durchfuehren
+# Nur Rules mit Autofix-Support
+semgrep \
+    --config=auto \
+    --autofix \
+    --dryrun \
+    $SCAN_TARGET 2>&1 | head -50
+
+echo ""
+read -p "Fixes anwenden? (y/n) " -n 1 -r
+echo ""
+
+if [[ $REPLY =~ ^[Yy]$ ]]; then
+    echo "Wende Fixes an..."
+    semgrep \
+        --config=auto \
+        --autofix \
+        $SCAN_TARGET
+
+    echo ""
+    echo -e "${GREEN}Fixes angewendet!${NC}"
+    echo ""
+    echo "Bitte pruefen Sie die Aenderungen:"
+    echo "  git diff"
+else
+    echo "Autofix abgebrochen."
+fi
--- a/.claude/skills/semgrep-security/install-semgrep.sh
+++ b/.claude/skills/semgrep-security/install-semgrep.sh
@@ -0,0 +1,86 @@
+#!/bin/bash
+# Installiert Semgrep basierend auf dem Betriebssystem
+
+set -e
+
+echo "Pruefe Semgrep Installation..."
+
+# Pruefen ob bereits installiert
+if command -v semgrep &> /dev/null; then
+    echo "Semgrep ist bereits installiert: $(semgrep --version)"
+    exit 0
+fi
+
+echo "Semgrep nicht gefunden. Starte Installation..."
+
+# OS erkennen
+OS_TYPE=$(uname -s)
+
+case "$OS_TYPE" in
+    "Darwin")
+        # macOS
+        echo "macOS erkannt - nutze Homebrew"
+        if command -v brew &> /dev/null; then
+            brew install semgrep
+        else
+            echo "Homebrew nicht gefunden - nutze pip3"
+            pip3 install semgrep
+        fi
+        ;;
+
+    "Linux")
+        echo "Linux erkannt"
+
+        # Versuche verschiedene Paketmanager
+        if command -v apt-get &> /dev/null; then
+            echo "Nutze apt-get..."
+            # Semgrep via Python da apt Version oft veraltet
+            pip3 install semgrep
+
+        elif command -v apk &> /dev/null; then
+            echo "Alpine erkannt - nutze pip3"
+            apk add --no-cache python3 py3-pip
+            pip3 install semgrep
+
+        elif command -v yum &> /dev/null; then
+            echo "RHEL/CentOS erkannt - nutze pip3"
+            pip3 install semgrep
+
+        else
+            echo "Nutze pip3 als Fallback"
+            pip3 install semgrep
+        fi
+        ;;
+
+    "MINGW"*|"MSYS"*|"CYGWIN"*)
+        # Windows
+        echo "Windows erkannt"
+        if command -v choco &> /dev/null; then
+            choco install semgrep -y
+        elif command -v pip3 &> /dev/null; then
+            pip3 install semgrep
+        elif command -v pip &> /dev/null; then
+            pip install semgrep
+        else
+            echo "Bitte installiere Python und pip: https://www.python.org/downloads/"
+            exit 1
+        fi
+        ;;
+
+    *)
+        echo "Unbekanntes OS: $OS_TYPE - nutze pip3"
+        pip3 install semgrep
+        ;;
+esac
+
+# Verifizieren
+if command -v semgrep &> /dev/null; then
+    echo ""
+    echo "Installation erfolgreich!"
+    semgrep --version
+else
+    echo ""
+    echo "Installation fehlgeschlagen."
+    echo "Bitte manuell installieren: https://semgrep.dev/docs/getting-started/"
+    exit 1
+fi
--- a/.claude/skills/semgrep-security/rules/next-security.yaml
+++ b/.claude/skills/semgrep-security/rules/next-security.yaml
@@ -0,0 +1,91 @@
+# Custom Semgrep Rules fuer Next.js Security
+
+rules:
+  # Verhindere dangerouslySetInnerHTML ohne Sanitization
+  - id: next-xss-dangerous-html
+    patterns:
+      - pattern: dangerouslySetInnerHTML={{ __html: $VAR }}
+      - pattern-not: dangerouslySetInnerHTML={{ __html: DOMPurify.sanitize($VAR) }}
+      - pattern-not: dangerouslySetInnerHTML={{ __html: sanitize($VAR) }}
+    message: "XSS Risiko: Verwende DOMPurify.sanitize() bevor du dangerouslySetInnerHTML nutzt"
+    severity: ERROR
+    languages: [typescript, javascript]
+
+  # Verhindere hardcoded API Keys
+  - id: next-hardcoded-api-key
+    patterns:
+      - pattern-either:
+          - pattern: |
+              $KEY = "sk-..."
+          - pattern: |
+              $KEY = "pk_..."
+          - pattern: |
+              apiKey: "..."
+          - pattern: |
+              api_key = "..."
+    message: "Hardcoded API Key gefunden. Verwende Environment Variables."
+    severity: ERROR
+    languages: [typescript, javascript]
+
+  # Verhindere ungeschuetzte API Routes
+  - id: next-unprotected-api-route
+    patterns:
+      - pattern: |
+          export async function $METHOD(request: NextRequest) {
+            ...
+            $DB.$OPERATION(...)
+            ...
+          }
+      - pattern-not: |
+          export async function $METHOD(request: NextRequest) {
+            ...
+            auth.getUser()
+            ...
+          }
+      - pattern-not: |
+          export async function $METHOD(request: NextRequest) {
+            ...
+            getSession()
+            ...
+          }
+    message: "API Route ohne Authentication. Fuege Auth-Check hinzu."
+    severity: WARNING
+    languages: [typescript]
+    paths:
+      include:
+        - "app/api/**"
+
+  # Verhindere Secrets in Client Components
+  - id: next-secret-in-client
+    patterns:
+      - pattern-inside: |
+          "use client"
+          ...
+      - pattern-either:
+          - pattern: process.env.SUPABASE_SERVICE_ROLE_KEY
+          - pattern: process.env.DATABASE_URL
+          - pattern: process.env.$SECRET_KEY
+    message: "Server-only Secret in Client Component. Verschiebe in Server Component oder API Route."
+    severity: ERROR
+    languages: [typescript, javascript]
+
+  # Verhindere eval und new Function
+  - id: next-no-eval
+    patterns:
+      - pattern-either:
+          - pattern: eval(...)
+          - pattern: new Function(...)
+    message: "eval() und new Function() sind Sicherheitsrisiken. Finde eine Alternative."
+    severity: ERROR
+    languages: [typescript, javascript]
+
+  # Supabase RLS Check
+  - id: supabase-rls-bypass
+    patterns:
+      - pattern: supabaseAdmin.from($TABLE)
+      - pattern-not-inside: |
+          // RLS bypassed intentionally
+          ...
+    message: "supabaseAdmin umgeht RLS. Stelle sicher dass dies beabsichtigt ist."
+    severity: WARNING
+    languages: [typescript, javascript]
--- a/.claude/skills/semgrep-security/scan-changed.sh
+++ b/.claude/skills/semgrep-security/scan-changed.sh
@@ -0,0 +1,29 @@
+#!/bin/bash
+# Scannt nur geaenderte Dateien (staged + unstaged)
+
+set -e
+
+# Farben
+GREEN='\033[0;32m'
+YELLOW='\033[1;33m'
+NC='\033[0m'
+
+echo "Ermittle geaenderte Dateien..."
+
+# Geaenderte Dateien ermitteln (TypeScript/JavaScript)
+CHANGED_FILES=$(git status --porcelain 2>/dev/null | \
+    grep -E '\.(ts|tsx|js|jsx)$' | \
+    sed 's/^...//' | \
+    tr '\n' ' ')
+
+if [ -z "$CHANGED_FILES" ]; then
+    echo -e "${GREEN}Keine geaenderten TypeScript/JavaScript Dateien gefunden.${NC}"
+    exit 0
+fi
+
+echo "Geaenderte Dateien:"
+echo "$CHANGED_FILES" | tr ' ' '\n' | grep -v '^$'
+echo ""
+
+# Scan durchfuehren
+bash "$(dirname "$0")/scan.sh" $CHANGED_FILES
--- a/.claude/skills/semgrep-security/scan.sh
+++ b/.claude/skills/semgrep-security/scan.sh
@@ -0,0 +1,89 @@
+#!/bin/bash
+# Fuehrt Semgrep Security Scan durch
+
+set -e
+
+# Farben fuer Output
+RED='\033[0;31m'
+YELLOW='\033[1;33m'
+GREEN='\033[0;32m'
+NC='\033[0m' # No Color
+
+# Pruefen ob Semgrep installiert ist
+if ! command -v semgrep &> /dev/null; then
+    echo -e "${YELLOW}Semgrep nicht gefunden. Installiere...${NC}"
+    bash "$(dirname "$0")/install-semgrep.sh"
+fi
+
+# Argumente: spezifische Dateien oder alles scannen
+if [ $# -gt 0 ]; then
+    SCAN_TARGET="$@"
+    echo "Scanne spezifische Dateien: $SCAN_TARGET"
+else
+    SCAN_TARGET="."
+    echo "Scanne gesamtes Projekt..."
+fi
+
+# Temporaere Datei fuer JSON Output
+RESULT_FILE=$(mktemp)
+
+# Scan durchfuehren
+echo ""
+echo "Starte Security Scan..."
+echo "========================"
+
+semgrep \
+    --config=auto \
+    --config=p/security-audit \
+    --config=p/typescript \
+    --json \
+    --output="$RESULT_FILE" \
+    $SCAN_TARGET 2>/dev/null || true
+
+# Ergebnisse parsen
+if [ -f "$RESULT_FILE" ]; then
+    # Anzahl der Findings zaehlen
+    TOTAL=$(jq '.results | length' "$RESULT_FILE" 2>/dev/null || echo "0")
+    ERRORS=$(jq '[.results[] | select(.extra.severity == "ERROR")] | length' "$RESULT_FILE" 2>/dev/null || echo "0")
+    WARNINGS=$(jq '[.results[] | select(.extra.severity == "WARNING")] | length' "$RESULT_FILE" 2>/dev/null || echo "0")
+    INFO=$(jq '[.results[] | select(.extra.severity == "INFO")] | length' "$RESULT_FILE" 2>/dev/null || echo "0")
+
+    echo ""
+    echo "========================"
+    echo "Scan Ergebnisse"
+    echo "========================"
+    echo ""
+
+    if [ "$TOTAL" -eq 0 ]; then
+        echo -e "${GREEN}Keine Sicherheitsprobleme gefunden!${NC}"
+    else
+        echo -e "Gefunden: ${RED}$ERRORS Critical/High${NC}, ${YELLOW}$WARNINGS Medium${NC}, $INFO Low"
+        echo ""
+
+        # Details ausgeben
+        echo "Details:"
+        echo "--------"
+        jq -r '.results[] | "[\(.extra.severity)] \(.check_id)\n  File: \(.path):\(.start.line)\n  Message: \(.extra.message)\n"' "$RESULT_FILE" 2>/dev/null || true
+    fi
+
+    # Score berechnen
+    SCORE=$((100 - (ERRORS * 10) - (WARNINGS * 3) - (INFO * 1)))
+    if [ $SCORE -lt 0 ]; then SCORE=0; fi
+
+    echo ""
+    echo "========================"
+    echo -e "Security Score: ${GREEN}$SCORE/100${NC}"
+    echo "========================"
+
+    # Cleanup
+    rm -f "$RESULT_FILE"
+
+    # Exit mit Fehler wenn kritische Issues
+    if [ "$ERRORS" -gt 0 ]; then
+        echo ""
+        echo -e "${RED}WARNUNG: Es wurden kritische Sicherheitsprobleme gefunden!${NC}"
+        exit 1
+    fi
+else
+    echo -e "${GREEN}Scan abgeschlossen - keine Ergebnisdatei erstellt${NC}"
+fi
--- a/.claude/skills/supabase-auth/SKILL.md
+++ b/.claude/skills/supabase-auth/SKILL.md
@@ -0,0 +1,152 @@
+---
+name: supabase-auth
+description: Supabase Authentication Setup und User Management. Nutze diesen Skill fuer Login, Signup, OAuth, Sessions, Password Reset und geschuetzte Routen. Aktiviert bei Begriffen wie "Login", "Anmeldung", "Registrierung", "Signup", "Auth", "Authentication", "User", "Benutzer", "Session", "Passwort", "OAuth", "Google Login", "geschuetzt", "protected route".
+---
+
+# Supabase Authentication Skill
+
+Dieser Skill hilft bei Authentication mit Supabase.
+
+## Auth Client Setup
+
+```typescript
+// lib/supabase.ts - Browser Client
+import { createClient } from '@supabase/supabase-js';
+
+export const supabase = createClient(
+  process.env.NEXT_PUBLIC_SUPABASE_URL!,
+  process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!
+);
+
+// lib/supabase-admin.ts - Server Client
+export const supabaseAdmin = createClient(
+  process.env.SUPABASE_URL!,
+  process.env.SUPABASE_SERVICE_ROLE_KEY!,
+  {
+    auth: {
+      autoRefreshToken: false,
+      persistSession: false
+    }
+  }
+);
+```
+
+## Sign Up / Sign In
+
+```typescript
+// Email/Password Signup
+const { data, error } = await supabase.auth.signUp({
+  email: 'user@example.com',
+  password: 'secure-password',
+  options: {
+    data: { full_name: 'Max Mustermann' }
+  }
+});
+
+// Email/Password Login
+const { data, error } = await supabase.auth.signInWithPassword({
+  email: 'user@example.com',
+  password: 'password'
+});
+
+// Magic Link
+const { error } = await supabase.auth.signInWithOtp({
+  email: 'user@example.com',
+  options: {
+    emailRedirectTo: `${window.location.origin}/auth/callback`
+  }
+});
+
+// OAuth (Google, GitHub, etc.)
+const { error } = await supabase.auth.signInWithOAuth({
+  provider: 'google',
+  options: {
+    redirectTo: `${window.location.origin}/auth/callback`
+  }
+});
+```
+
+## Session Management
+
+```typescript
+// Aktuelle Session
+const { data: { session } } = await supabase.auth.getSession();
+
+// Aktueller User
+const { data: { user } } = await supabase.auth.getUser();
+
+// Auth State Listener
+supabase.auth.onAuthStateChange((event, session) => {
+  console.log(event, session);
+});
+
+// Logout
+await supabase.auth.signOut();
+```
+
+## Password Reset
+
+```typescript
+// Reset anfordern
+const { error } = await supabase.auth.resetPasswordForEmail(email, {
+  redirectTo: `${window.location.origin}/auth/reset-password`
+});
+
+// Neues Passwort setzen
+const { error } = await supabase.auth.updateUser({
+  password: 'new-password'
+});
+```
+
+## Middleware (Protected Routes)
+
+```typescript
+// middleware.ts
+import { createServerClient } from '@supabase/ssr';
+import { NextResponse, type NextRequest } from 'next/server';
+
+export async function middleware(request: NextRequest) {
+  let response = NextResponse.next({ request });
+
+  const supabase = createServerClient(
+    process.env.NEXT_PUBLIC_SUPABASE_URL!,
+    process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!,
+    {
+      cookies: {
+        get: (name) => request.cookies.get(name)?.value,
+        set: (name, value, options) => {
+          response.cookies.set({ name, value, ...options });
+        },
+        remove: (name, options) => {
+          response.cookies.set({ name, value: '', ...options });
+        },
+      },
+    }
+  );
+
+  const { data: { session } } = await supabase.auth.getSession();
+
+  // Redirect wenn nicht eingeloggt
+  if (!session && request.nextUrl.pathname.startsWith('/dashboard')) {
+    return NextResponse.redirect(new URL('/login', request.url));
+  }
+
+  return response;
+}
+
+export const config = {
+  matcher: ['/dashboard/:path*', '/api/protected/:path*']
+};
+```
+
+## Auth Context
+
+Siehe `templates/AuthContext.tsx` fuer einen kompletten Auth Provider.
+
+## Best Practices
+
+1. SSR Auth mit @supabase/ssr
+2. Middleware fuer Route Protection
+3. Service Role Key nur serverseitig
+4. User-freundliche Fehlermeldungen
+5. Email Verification aktivieren
--- a/.claude/skills/supabase-auth/templates/AuthContext.tsx
+++ b/.claude/skills/supabase-auth/templates/AuthContext.tsx
@@ -0,0 +1,108 @@
+'use client';
+
+import { createContext, useContext, useEffect, useState, useCallback } from 'react';
+import { User, Session, AuthError } from '@supabase/supabase-js';
+import { supabase } from '@/lib/supabase';
+
+interface AuthContextType {
+  user: User | null;
+  session: Session | null;
+  loading: boolean;
+  signUp: (email: string, password: string, metadata?: Record<string, unknown>) => Promise<{ error: AuthError | null }>;
+  signIn: (email: string, password: string) => Promise<{ error: AuthError | null }>;
+  signInWithOAuth: (provider: 'google' | 'github' | 'azure') => Promise<void>;
+  signOut: () => Promise<void>;
+  resetPassword: (email: string) => Promise<{ error: AuthError | null }>;
+}
+
+const AuthContext = createContext<AuthContextType | undefined>(undefined);
+
+export function AuthProvider({ children }: { children: React.ReactNode }) {
+  const [user, setUser] = useState<User | null>(null);
+  const [session, setSession] = useState<Session | null>(null);
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+    // Initiale Session holen
+    supabase.auth.getSession().then(({ data: { session } }) => {
+      setSession(session);
+      setUser(session?.user ?? null);
+      setLoading(false);
+    });
+
+    // Auth State Listener
+    const { data: { subscription } } = supabase.auth.onAuthStateChange(
+      (_event, session) => {
+        setSession(session);
+        setUser(session?.user ?? null);
+      }
+    );
+
+    return () => subscription.unsubscribe();
+  }, []);
+
+  const signUp = useCallback(
+    async (email: string, password: string, metadata?: Record<string, unknown>) => {
+      const { error } = await supabase.auth.signUp({
+        email,
+        password,
+        options: { data: metadata },
+      });
+      return { error };
+    },
+    []
+  );
+
+  const signIn = useCallback(async (email: string, password: string) => {
+    const { error } = await supabase.auth.signInWithPassword({
+      email,
+      password,
+    });
+    return { error };
+  }, []);
+
+  const signInWithOAuth = useCallback(async (provider: 'google' | 'github' | 'azure') => {
+    await supabase.auth.signInWithOAuth({
+      provider,
+      options: {
+        redirectTo: `${window.location.origin}/auth/callback`,
+      },
+    });
+  }, []);
+
+  const signOut = useCallback(async () => {
+    await supabase.auth.signOut();
+  }, []);
+
+  const resetPassword = useCallback(async (email: string) => {
+    const { error } = await supabase.auth.resetPasswordForEmail(email, {
+      redirectTo: `${window.location.origin}/auth/reset-password`,
+    });
+    return { error };
+  }, []);
+
+  return (
+    <AuthContext.Provider
+      value={{
+        user,
+        session,
+        loading,
+        signUp,
+        signIn,
+        signInWithOAuth,
+        signOut,
+        resetPassword,
+      }}
+    >
+      {children}
+    </AuthContext.Provider>
+  );
+}
+
+export function useAuth() {
+  const context = useContext(AuthContext);
+  if (context === undefined) {
+    throw new Error('useAuth must be used within an AuthProvider');
+  }
+  return context;
+}
--- a/.claude/skills/supabase-auth/templates/LoginForm.tsx
+++ b/.claude/skills/supabase-auth/templates/LoginForm.tsx
@@ -0,0 +1,123 @@
+'use client';
+
+import { useState } from 'react';
+import { useAuth } from '@/contexts/AuthContext';
+
+interface LoginFormProps {
+  onSuccess?: () => void;
+  redirectTo?: string;
+}
+
+export function LoginForm({ onSuccess, redirectTo = '/dashboard' }: LoginFormProps) {
+  const { signIn, signInWithOAuth } = useAuth();
+  const [email, setEmail] = useState('');
+  const [password, setPassword] = useState('');
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    setLoading(true);
+    setError(null);
+
+    const { error } = await signIn(email, password);
+
+    if (error) {
+      setError(getErrorMessage(error.message));
+      setLoading(false);
+    } else {
+      onSuccess?.();
+      window.location.href = redirectTo;
+    }
+  };
+
+  const handleOAuth = async (provider: 'google' | 'github') => {
+    setLoading(true);
+    await signInWithOAuth(provider);
+  };
+
+  return (
+    <div className="space-y-6 w-full max-w-sm">
+      <form onSubmit={handleSubmit} className="space-y-4">
+        <div>
+          <label htmlFor="email" className="block text-sm font-medium mb-1">
+            Email
+          </label>
+          <input
+            id="email"
+            type="email"
+            value={email}
+            onChange={(e) => setEmail(e.target.value)}
+            className="w-full px-3 py-2 border rounded-md"
+            required
+          />
+        </div>
+
+        <div>
+          <label htmlFor="password" className="block text-sm font-medium mb-1">
+            Passwort
+          </label>
+          <input
+            id="password"
+            type="password"
+            value={password}
+            onChange={(e) => setPassword(e.target.value)}
+            className="w-full px-3 py-2 border rounded-md"
+            required
+          />
+        </div>
+
+        {error && (
+          <p className="text-sm text-red-500">{error}</p>
+        )}
+
+        <button
+          type="submit"
+          disabled={loading}
+          className="w-full py-2 px-4 bg-primary text-primary-foreground rounded-md hover:bg-primary/90 disabled:opacity-50"
+        >
+          {loading ? 'Wird geladen...' : 'Anmelden'}
+        </button>
+      </form>
+
+      <div className="relative">
+        <div className="absolute inset-0 flex items-center">
+          <span className="w-full border-t" />
+        </div>
+        <div className="relative flex justify-center text-xs uppercase">
+          <span className="bg-background px-2 text-muted-foreground">
+            Oder weiter mit
+          </span>
+        </div>
+      </div>
+
+      <div className="grid grid-cols-2 gap-4">
+        <button
+          type="button"
+          onClick={() => handleOAuth('google')}
+          disabled={loading}
+          className="py-2 px-4 border rounded-md hover:bg-muted disabled:opacity-50"
+        >
+          Google
+        </button>
+        <button
+          type="button"
+          onClick={() => handleOAuth('github')}
+          disabled={loading}
+          className="py-2 px-4 border rounded-md hover:bg-muted disabled:opacity-50"
+        >
+          GitHub
+        </button>
+      </div>
+    </div>
+  );
+}
+
+function getErrorMessage(message: string): string {
+  const errorMap: Record<string, string> = {
+    'Invalid login credentials': 'Ungueltige Anmeldedaten',
+    'Email not confirmed': 'Bitte bestaetigen Sie zuerst Ihre Email',
+    'Too many requests': 'Zu viele Versuche. Bitte warten Sie einen Moment.',
+  };
+  return errorMap[message] || 'Ein Fehler ist aufgetreten';
+}
--- a/.claude/skills/supabase-db/SKILL.md
+++ b/.claude/skills/supabase-db/SKILL.md
@@ -0,0 +1,110 @@
+---
+name: supabase-db
+description: Supabase PostgreSQL Datenbank Operationen. Nutze diesen Skill fuer CRUD Operationen, SQL Migrations, Tabellen erstellen, RLS Policies, Queries und TypeScript Types generieren. Aktiviert bei Begriffen wie "Datenbank", "Tabelle erstellen", "SQL", "Query", "Migration", "RLS", "Row Level Security", "select", "insert", "update", "delete".
+---
+
+# Supabase PostgreSQL Datenbank Skill
+
+Dieser Skill hilft bei allen Datenbank-Operationen mit Supabase.
+
+## Tabellen erstellen
+
+Verwende immer dieses Pattern:
+
+```sql
+CREATE TABLE table_name (
+  id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
+  -- deine Spalten hier
+  created_at TIMESTAMPTZ DEFAULT NOW(),
+  updated_at TIMESTAMPTZ DEFAULT NOW()
+);
+
+-- RLS aktivieren
+ALTER TABLE table_name ENABLE ROW LEVEL SECURITY;
+
+-- Updated_at Trigger
+CREATE TRIGGER table_name_updated_at
+BEFORE UPDATE ON table_name
+FOR EACH ROW EXECUTE FUNCTION update_updated_at();
+```
+
+## CRUD Operationen
+
+### Select
+```typescript
+const { data, error } = await supabase
+  .from('table')
+  .select('*')
+  .eq('column', value)
+  .order('created_at', { ascending: false });
+```
+
+### Insert
+```typescript
+const { data, error } = await supabase
+  .from('table')
+  .insert({ column: value })
+  .select()
+  .single();
+```
+
+### Update
+```typescript
+const { data, error } = await supabase
+  .from('table')
+  .update({ column: newValue })
+  .eq('id', id)
+  .select()
+  .single();
+```
+
+### Delete
+```typescript
+const { error } = await supabase
+  .from('table')
+  .delete()
+  .eq('id', id);
+```
+
+## RLS Policies
+
+```sql
+-- Lesen: Jeder authentifizierte User
+CREATE POLICY "Users can read own data"
+ON table_name FOR SELECT
+TO authenticated
+USING (auth.uid() = user_id);
+
+-- Schreiben: Nur eigene Daten
+CREATE POLICY "Users can insert own data"
+ON table_name FOR INSERT
+TO authenticated
+WITH CHECK (auth.uid() = user_id);
+
+-- Update: Nur eigene Daten
+CREATE POLICY "Users can update own data"
+ON table_name FOR UPDATE
+TO authenticated
+USING (auth.uid() = user_id)
+WITH CHECK (auth.uid() = user_id);
+
+-- Delete: Nur eigene Daten
+CREATE POLICY "Users can delete own data"
+ON table_name FOR DELETE
+TO authenticated
+USING (auth.uid() = user_id);
+```
+
+## TypeScript Types generieren
+
+```bash
+npx supabase gen types typescript --project-id PROJECT_ID > lib/database.types.ts
+```
+
+## Best Practices
+
+1. Immer UUIDs als Primary Key
+2. Immer created_at/updated_at
+3. Immer RLS aktivieren
+4. Soft Deletes mit deleted_at
+5. Indexes fuer WHERE/ORDER BY Spalten
--- a/.claude/skills/supabase-db/templates/migration.sql
+++ b/.claude/skills/supabase-db/templates/migration.sql
@@ -0,0 +1,84 @@
+-- Migration: {{MIGRATION_NAME}}
+-- Created: {{DATE}}
+
+-- ===========================================
+-- Tabelle erstellen
+-- ===========================================
+
+CREATE TABLE IF NOT EXISTS {{TABLE_NAME}} (
+  id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
+
+  -- Deine Spalten hier
+  name TEXT NOT NULL,
+  description TEXT,
+
+  -- Foreign Keys (optional)
+  user_id UUID REFERENCES auth.users(id) ON DELETE CASCADE,
+
+  -- Timestamps
+  created_at TIMESTAMPTZ DEFAULT NOW() NOT NULL,
+  updated_at TIMESTAMPTZ DEFAULT NOW() NOT NULL
+);
+
+-- ===========================================
+-- Row Level Security
+-- ===========================================
+
+ALTER TABLE {{TABLE_NAME}} ENABLE ROW LEVEL SECURITY;
+
+-- Select Policy
+CREATE POLICY "{{TABLE_NAME}}_select_policy"
+ON {{TABLE_NAME}} FOR SELECT
+TO authenticated
+USING (auth.uid() = user_id);
+
+-- Insert Policy
+CREATE POLICY "{{TABLE_NAME}}_insert_policy"
+ON {{TABLE_NAME}} FOR INSERT
+TO authenticated
+WITH CHECK (auth.uid() = user_id);
+
+-- Update Policy
+CREATE POLICY "{{TABLE_NAME}}_update_policy"
+ON {{TABLE_NAME}} FOR UPDATE
+TO authenticated
+USING (auth.uid() = user_id)
+WITH CHECK (auth.uid() = user_id);
+
+-- Delete Policy
+CREATE POLICY "{{TABLE_NAME}}_delete_policy"
+ON {{TABLE_NAME}} FOR DELETE
+TO authenticated
+USING (auth.uid() = user_id);
+
+-- ===========================================
+-- Indexes
+-- ===========================================
+
+CREATE INDEX IF NOT EXISTS {{TABLE_NAME}}_user_id_idx ON {{TABLE_NAME}}(user_id);
+CREATE INDEX IF NOT EXISTS {{TABLE_NAME}}_created_at_idx ON {{TABLE_NAME}}(created_at DESC);
+
+-- ===========================================
+-- Updated_at Trigger
+-- ===========================================
+
+-- Funktion (nur einmal pro DB noetig)
+CREATE OR REPLACE FUNCTION update_updated_at()
+RETURNS TRIGGER AS $$
+BEGIN
+  NEW.updated_at = NOW();
+  RETURN NEW;
+END;
+$$ LANGUAGE plpgsql;
+
+-- Trigger
+CREATE TRIGGER {{TABLE_NAME}}_updated_at
+BEFORE UPDATE ON {{TABLE_NAME}}
+FOR EACH ROW EXECUTE FUNCTION update_updated_at();
+
+-- ===========================================
+-- Grants (optional)
+-- ===========================================
+
+-- GRANT SELECT, INSERT, UPDATE, DELETE ON {{TABLE_NAME}} TO authenticated;
+-- GRANT SELECT ON {{TABLE_NAME}} TO anon;
--- a/.claude/skills/supabase-storage/SKILL.md
+++ b/.claude/skills/supabase-storage/SKILL.md
@@ -0,0 +1,142 @@
+---
+name: supabase-storage
+description: Supabase Storage fuer Datei-Upload und Download. Nutze diesen Skill fuer Bucket-Erstellung, File Upload, Download, Signed URLs und Storage Policies. Aktiviert bei Begriffen wie "Upload", "Download", "Datei", "File", "Bild hochladen", "Storage", "Bucket", "S3", "Bilder", "Avatar", "Dokumente".
+---
+
+# Supabase Storage Skill
+
+Dieser Skill hilft bei allen Storage-Operationen mit Supabase.
+
+## Bucket erstellen
+
+```typescript
+// Server-side mit Admin Client
+const { data, error } = await supabaseAdmin.storage.createBucket('avatars', {
+  public: true,
+  fileSizeLimit: 1024 * 1024 * 2, // 2MB
+  allowedMimeTypes: ['image/png', 'image/jpeg', 'image/webp']
+});
+```
+
+Oder via SQL:
+```sql
+INSERT INTO storage.buckets (id, name, public, file_size_limit, allowed_mime_types)
+VALUES (
+  'avatars',
+  'avatars',
+  true,
+  2097152,
+  ARRAY['image/png', 'image/jpeg', 'image/webp']
+);
+```
+
+## File Upload
+
+```typescript
+async function uploadFile(file: File, bucket: string, path: string) {
+  const { data, error } = await supabase.storage
+    .from(bucket)
+    .upload(path, file, {
+      cacheControl: '3600',
+      upsert: false // true = ueberschreiben erlaubt
+    });
+
+  if (error) throw error;
+
+  // Public URL holen
+  const { data: urlData } = supabase.storage
+    .from(bucket)
+    .getPublicUrl(path);
+
+  return urlData.publicUrl;
+}
+```
+
+## File Download
+
+```typescript
+// Als Blob
+const { data, error } = await supabase.storage
+  .from('documents')
+  .download('path/to/file.pdf');
+
+// Public URL (oeffentliche Buckets)
+const { data } = supabase.storage
+  .from('avatars')
+  .getPublicUrl('user123/avatar.jpg');
+
+// Signed URL (private Buckets, zeitlich begrenzt)
+const { data, error } = await supabase.storage
+  .from('private-docs')
+  .createSignedUrl('secret.pdf', 3600); // 1 Stunde
+```
+
+## File Management
+
+```typescript
+// Liste Dateien
+const { data, error } = await supabase.storage
+  .from('bucket')
+  .list('folder/', {
+    limit: 100,
+    sortBy: { column: 'created_at', order: 'desc' }
+  });
+
+// Loeschen
+const { error } = await supabase.storage
+  .from('bucket')
+  .remove(['path/file1.jpg', 'path/file2.jpg']);
+
+// Verschieben
+const { error } = await supabase.storage
+  .from('bucket')
+  .move('old/path.jpg', 'new/path.jpg');
+```
+
+## Storage Policies (RLS)
+
+```sql
+-- User koennen eigene Dateien hochladen
+CREATE POLICY "Users upload own files"
+ON storage.objects FOR INSERT
+TO authenticated
+WITH CHECK (
+  bucket_id = 'user-files' AND
+  (storage.foldername(name))[1] = auth.uid()::text
+);
+
+-- User koennen eigene Dateien lesen
+CREATE POLICY "Users read own files"
+ON storage.objects FOR SELECT
+TO authenticated
+USING (
+  bucket_id = 'user-files' AND
+  (storage.foldername(name))[1] = auth.uid()::text
+);
+
+-- User koennen eigene Dateien loeschen
+CREATE POLICY "Users delete own files"
+ON storage.objects FOR DELETE
+TO authenticated
+USING (
+  bucket_id = 'user-files' AND
+  (storage.foldername(name))[1] = auth.uid()::text
+);
+
+-- Oeffentlicher Lesezugriff
+CREATE POLICY "Public read"
+ON storage.objects FOR SELECT
+USING (bucket_id = 'public-assets');
+```
+
+## React Upload Component
+
+Siehe `templates/FileUpload.tsx` fuer eine fertige Component.
+
+## Best Practices
+
+1. Ordnerstruktur: `{user_id}/{type}/{filename}`
+2. File Size Limits setzen
+3. MIME Types einschraenken
+4. Signed URLs fuer private Dateien
+5. Unique Filenames (z.B. mit Timestamp)
--- a/.claude/skills/supabase-storage/templates/FileUpload.tsx
+++ b/.claude/skills/supabase-storage/templates/FileUpload.tsx
@@ -0,0 +1,126 @@
+'use client';
+
+import { useState, useCallback } from 'react';
+import { supabase } from '@/lib/supabase';
+
+interface FileUploadProps {
+  bucket: string;
+  folder?: string;
+  accept?: string;
+  maxSize?: number; // in bytes
+  onUpload: (url: string, path: string) => void;
+  onError?: (error: Error) => void;
+}
+
+export function FileUpload({
+  bucket,
+  folder = 'uploads',
+  accept = 'image/*',
+  maxSize = 5 * 1024 * 1024, // 5MB default
+  onUpload,
+  onError,
+}: FileUploadProps) {
+  const [uploading, setUploading] = useState(false);
+  const [progress, setProgress] = useState(0);
+  const [dragOver, setDragOver] = useState(false);
+
+  const uploadFile = useCallback(
+    async (file: File) => {
+      // Validierung
+      if (file.size > maxSize) {
+        onError?.(new Error(`Datei zu gross. Maximum: ${maxSize / 1024 / 1024}MB`));
+        return;
+      }
+
+      setUploading(true);
+      setProgress(0);
+
+      try {
+        // Unique filename generieren
+        const fileExt = file.name.split('.').pop();
+        const fileName = `${Date.now()}-${Math.random().toString(36).substring(2)}.${fileExt}`;
+        const filePath = `${folder}/${fileName}`;
+
+        // Upload
+        const { error: uploadError } = await supabase.storage
+          .from(bucket)
+          .upload(filePath, file, {
+            cacheControl: '3600',
+            upsert: false,
+          });
+
+        if (uploadError) throw uploadError;
+
+        // URL holen
+        const { data } = supabase.storage.from(bucket).getPublicUrl(filePath);
+
+        onUpload(data.publicUrl, filePath);
+        setProgress(100);
+      } catch (error) {
+        console.error('Upload error:', error);
+        onError?.(error instanceof Error ? error : new Error('Upload fehlgeschlagen'));
+      } finally {
+        setUploading(false);
+      }
+    },
+    [bucket, folder, maxSize, onUpload, onError]
+  );
+
+  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    const file = e.target.files?.[0];
+    if (file) uploadFile(file);
+  };
+
+  const handleDrop = (e: React.DragEvent) => {
+    e.preventDefault();
+    setDragOver(false);
+    const file = e.dataTransfer.files?.[0];
+    if (file) uploadFile(file);
+  };
+
+  return (
+    <div
+      className={`
+        relative border-2 border-dashed rounded-lg p-6 text-center
+        transition-colors cursor-pointer
+        ${dragOver ? 'border-primary bg-primary/5' : 'border-muted-foreground/25'}
+        ${uploading ? 'pointer-events-none opacity-50' : 'hover:border-primary'}
+      `}
+      onDragOver={(e) => {
+        e.preventDefault();
+        setDragOver(true);
+      }}
+      onDragLeave={() => setDragOver(false)}
+      onDrop={handleDrop}
+    >
+      <input
+        type="file"
+        accept={accept}
+        onChange={handleChange}
+        disabled={uploading}
+        className="absolute inset-0 w-full h-full opacity-0 cursor-pointer"
+      />
+
+      {uploading ? (
+        <div className="space-y-2">
+          <div className="w-full bg-muted rounded-full h-2">
+            <div
+              className="bg-primary h-2 rounded-full transition-all"
+              style={{ width: `${progress}%` }}
+            />
+          </div>
+          <p className="text-sm text-muted-foreground">Uploading...</p>
+        </div>
+      ) : (
+        <div className="space-y-2">
+          <p className="text-sm font-medium">
+            Datei hierher ziehen oder klicken zum Auswaehlen
+          </p>
+          <p className="text-xs text-muted-foreground">
+            Max. {maxSize / 1024 / 1024}MB
+          </p>
+        </div>
+      )}
+    </div>
+  );
+}