feat: session deletion, improved tasting deletion visibility, and PWA login loop fix

src/components/SessionList.tsx

@@ -2,8 +2,9 @@
 
 import React, { useState, useEffect } from 'react';
 import { createClientComponentClient } from '@supabase/auth-helpers-nextjs';
-import { Calendar, Plus, GlassWater, Loader2, ChevronRight, Users, Check } from 'lucide-react';
+import { Calendar, Plus, GlassWater, Loader2, ChevronRight, Users, Check, Trash2 } from 'lucide-react';
 import Link from 'next/link';
+import { deleteSession } from '@/services/delete-session';
 import { useI18n } from '@/i18n/I18nContext';
 import { useSession } from '@/context/SessionContext';
 
@@ -21,6 +22,7 @@ export default function SessionList() {
     const [sessions, setSessions] = useState<Session[]>([]);
     const [isLoading, setIsLoading] = useState(true);
     const [isCreating, setIsCreating] = useState(false);
+    const [isDeleting, setIsDeleting] = useState<string | null>(null);
     const [newName, setNewName] = useState('');
     const { activeSession, setActiveSession } = useSession();
 
@@ -92,6 +94,26 @@ export default function SessionList() {
         setIsCreating(false);
     };
 
+    const handleDeleteSession = async (e: React.MouseEvent, sessionId: string) => {
+        e.preventDefault();
+        e.stopPropagation();
+
+        if (!confirm('Möchtest du diese Session wirklich löschen? Alle Verknüpfungen gehen verloren.')) return;
+
+        setIsDeleting(sessionId);
+        const result = await deleteSession(sessionId);
+
+        if (result.success) {
+            setSessions(prev => prev.filter(s => s.id !== sessionId));
+            if (activeSession?.id === sessionId) {
+                setActiveSession(null);
+            }
+        } else {
+            alert(result.error);
+        }
+        setIsDeleting(null);
+    };
+
     return (
         <div className="bg-white dark:bg-zinc-900 rounded-3xl p-6 border border-zinc-200 dark:border-zinc-800 shadow-xl">
             <h3 className="text-xl font-bold mb-6 flex items-center gap-2 text-zinc-800 dark:text-zinc-100 italic">
@@ -172,6 +194,21 @@ export default function SessionList() {
                                     </div>
                                 )}
                                 <ChevronRight size={20} className={activeSession?.id === session.id ? 'text-white/50' : 'text-zinc-300'} />
+                                <button
+                                    onClick={(e) => handleDeleteSession(e, session.id)}
+                                    disabled={!!isDeleting}
+                                    className={`p-2 rounded-xl transition-all ${activeSession?.id === session.id
+                                        ? 'text-white/40 hover:text-white hover:bg-white/10'
+                                        : 'text-zinc-300 hover:text-red-500 hover:bg-red-50 dark:hover:bg-red-900/10'
+                                        }`}
+                                    title="Session löschen"
+                                >
+                                    {isDeleting === session.id ? (
+                                        <Loader2 size={18} className="animate-spin" />
+                                    ) : (
+                                        <Trash2 size={18} />
+                                    )}
+                                </button>
                             </div>
                         </div>
                     ))