neuer demo tenant switcher + demo tenants mit eigenem artisan command. Event Admin überarbeitet, aber das ist nur ein Zwischenstand.

resources/js/admin/pages/EventDetailPage.tsx

@@ -1,6 +1,6 @@
 // @ts-nocheck
 import React from 'react';
-import { useNavigate, useParams, useSearchParams } from 'react-router-dom';
+import { useNavigate, useParams, useSearchParams, useLocation } from 'react-router-dom';
 import { useTranslation } from 'react-i18next';
 import {
   AlertTriangle,
@@ -94,6 +94,7 @@ export default function EventDetailPage({ mode = 'detail' }: EventDetailPageProp
   const { slug: slugParam } = useParams<{ slug?: string }>();
   const [searchParams] = useSearchParams();
   const navigate = useNavigate();
+  const location = useLocation();
   const { t } = useTranslation('management');
   const { t: tCommon } = useTranslation('common');
 
@@ -217,19 +218,53 @@ export default function EventDetailPage({ mode = 'detail' }: EventDetailPageProp
     ? t('events.workspace.toolkitSubtitle', 'Moderation, Aufgaben und Einladungen für deinen Eventtag bündeln.')
     : t('events.workspace.detailSubtitle', 'Behalte Status, Aufgaben und Einladungen deines Events im Blick.');
 
-  const tabLabels = React.useMemo(
-    () => ({
-      overview: t('events.workspace.tabs.overview', 'Überblick'),
-      live: t('events.workspace.tabs.live', 'Live'),
-      setup: t('events.workspace.tabs.setup', 'Vorbereitung'),
-      recap: t('events.workspace.tabs.recap', 'Nachbereitung'),
-    }),
-    [t],
-  );
   const limitWarnings = React.useMemo(
     () => (event?.limits ? buildLimitWarnings(event.limits, (key, options) => tCommon(`limits.${key}`, options)) : []),
     [event?.limits, tCommon],
   );
+  const [dismissedWarnings, setDismissedWarnings] = React.useState<Set<string>>(new Set());
+
+  React.useEffect(() => {
+    const slug = event?.slug;
+    if (!slug || typeof window === 'undefined') {
+      setDismissedWarnings(new Set());
+      return;
+    }
+    try {
+      const raw = window.localStorage.getItem(`tenant-admin:dismissed-limit-warnings:${slug}`);
+      if (!raw) {
+        setDismissedWarnings(new Set());
+        return;
+      }
+      const parsed = JSON.parse(raw) as string[];
+      setDismissedWarnings(new Set(parsed));
+    } catch {
+      setDismissedWarnings(new Set());
+    }
+  }, [event?.slug]);
+
+  const visibleWarnings = React.useMemo(
+    () => limitWarnings.filter((warning) => !dismissedWarnings.has(warning.id)),
+    [limitWarnings, dismissedWarnings],
+  );
+
+  const dismissWarning = React.useCallback(
+    (id: string) => {
+      const slug = event?.slug;
+      setDismissedWarnings((prev) => {
+        const next = new Set(prev);
+        next.add(id);
+        if (slug && typeof window !== 'undefined') {
+          window.localStorage.setItem(
+            `tenant-admin:dismissed-limit-warnings:${slug}`,
+            JSON.stringify(Array.from(next)),
+          );
+        }
+        return next;
+      });
+    },
+    [event?.slug],
+  );
 
   const eventTabs = React.useMemo(() => {
     if (!event) {
@@ -243,6 +278,11 @@ export default function EventDetailPage({ mode = 'detail' }: EventDetailPageProp
     });
   }, [event, toolkitData?.photos?.pending?.length, toolkitData?.tasks?.summary.total, toolkitData?.invites?.summary.active, t]);
 
+  const isRecapRoute = React.useMemo(
+    () => location.pathname.endsWith('/recap'),
+    [location.pathname],
+  );
+
 const shownWarningToasts = React.useRef<Set<string>>(new Set());
   //const [addonBusyId, setAddonBusyId] = React.useState<string | null>(null);
 
@@ -336,7 +376,12 @@ const shownWarningToasts = React.useRef<Set<string>>(new Set());
   }
 
   return (
-    <AdminLayout title={eventName} subtitle={subtitle} tabs={eventTabs} currentTabKey="overview">
+    <AdminLayout
+      title={eventName}
+      subtitle={subtitle}
+      tabs={eventTabs}
+      currentTabKey={isRecapRoute ? 'recap' : 'overview'}
+    >
       {error && (
         <Alert variant="destructive">
           <AlertTitle>{t('events.alerts.failedTitle', 'Aktion fehlgeschlagen')}</AlertTitle>
@@ -344,9 +389,9 @@ const shownWarningToasts = React.useRef<Set<string>>(new Set());
         </Alert>
       )}
 
-      {limitWarnings.length > 0 && (
+      {visibleWarnings.length > 0 && (
         <div className="mb-6 space-y-2">
-          {limitWarnings.map((warning) => (
+          {visibleWarnings.map((warning) => (
             <Alert
               key={warning.id}
               variant={warning.tone === 'danger' ? 'destructive' : 'default'}
@@ -357,33 +402,43 @@ const shownWarningToasts = React.useRef<Set<string>>(new Set());
                   <AlertTriangle className="h-4 w-4" />
                   {warning.message}
                 </AlertDescription>
-                {(['photos', 'guests', 'gallery'] as const).includes(warning.scope) ? (
-                  <div className="flex flex-col gap-2 sm:flex-row sm:items-center sm:gap-3">
-                    <Button
-                      variant="outline"
-                      size="sm"
-                      onClick={() => { void handleAddonPurchase(warning.scope as 'photos' | 'guests' | 'gallery'); }}
-                      disabled={addonBusyId === warning.scope}
-                      className="justify-start"
-                    >
-                      <ShoppingCart className="mr-2 h-4 w-4" />
-                      {warning.scope === 'photos'
-                        ? t('events.actions.buyMorePhotos', 'Mehr Fotos freischalten')
-                        : warning.scope === 'guests'
-                          ? t('events.actions.buyMoreGuests', 'Mehr Gäste freischalten')
-                          : t('events.actions.extendGallery', 'Galerie verlängern')}
-                    </Button>
-                    {addonsCatalog.length > 0 ? (
-                      <AddonsPicker
-                        addons={addonsCatalog}
-                        scope={warning.scope as 'photos' | 'guests' | 'gallery'}
-                        onCheckout={(key) => { void handleAddonPurchase(warning.scope as 'photos' | 'guests' | 'gallery', key); }}
-                        busy={addonBusyId === warning.scope}
-                        t={(key, fallback) => t(key, fallback)}
-                      />
-                    ) : null}
-                  </div>
-                ) : null}
+                <div className="flex flex-col gap-2 sm:flex-row sm:items-center sm:gap-3">
+                  {(['photos', 'guests', 'gallery'] as const).includes(warning.scope) ? (
+                    <>
+                      <Button
+                        variant="outline"
+                        size="sm"
+                        onClick={() => { void handleAddonPurchase(warning.scope as 'photos' | 'guests' | 'gallery'); }}
+                        disabled={addonBusyId === warning.scope}
+                        className="justify-start"
+                      >
+                        <ShoppingCart className="mr-2 h-4 w-4" />
+                        {warning.scope === 'photos'
+                          ? t('events.actions.buyMorePhotos', 'Mehr Fotos freischalten')
+                          : warning.scope === 'guests'
+                            ? t('events.actions.buyMoreGuests', 'Mehr Gäste freischalten')
+                            : t('events.actions.extendGallery', 'Galerie verlängern')}
+                      </Button>
+                      {addonsCatalog.length > 0 ? (
+                        <AddonsPicker
+                          addons={addonsCatalog}
+                          scope={warning.scope as 'photos' | 'guests' | 'gallery'}
+                          onCheckout={(key) => { void handleAddonPurchase(warning.scope as 'photos' | 'guests' | 'gallery', key); }}
+                          busy={addonBusyId === warning.scope}
+                          t={(key, fallback) => t(key, fallback)}
+                        />
+                      ) : null}
+                    </>
+                  ) : null}
+                  <Button
+                    variant="ghost"
+                    size="sm"
+                    onClick={() => dismissWarning(warning.id)}
+                    className="justify-start text-slate-600 hover:text-slate-900"
+                  >
+                    {tCommon('actions.dismiss', 'Hinweis ausblenden')}
+                  </Button>
+                </div>
               </div>
             </Alert>
           ))}
@@ -408,12 +463,11 @@ const shownWarningToasts = React.useRef<Set<string>>(new Set());
             navigate={navigate}
           />
 
-          <Tabs defaultValue="overview" className="space-y-6">
-            <TabsList className="grid gap-2 rounded-2xl bg-slate-100/80 p-1 dark:bg-white/5 sm:grid-cols-4">
-              <TabsTrigger value="overview">{tabLabels.overview}</TabsTrigger>
-              <TabsTrigger value="live">{tabLabels.live}</TabsTrigger>
-              <TabsTrigger value="setup">{tabLabels.setup}</TabsTrigger>
-              <TabsTrigger value="recap">{tabLabels.recap}</TabsTrigger>
+          <Tabs defaultValue={isRecapRoute ? 'recap' : 'overview'} className="space-y-6">
+            <TabsList className="grid gap-2 rounded-2xl bg-slate-100/80 p-1 dark:bg-white/5 sm:grid-cols-3">
+              <TabsTrigger value="overview">{t('events.workspace.tabs.overview', 'Überblick')}</TabsTrigger>
+              <TabsTrigger value="setup">{t('events.workspace.tabs.setup', 'Vorbereitung')}</TabsTrigger>
+              <TabsTrigger value="recap">{t('events.workspace.tabs.recap', 'Nachbereitung')}</TabsTrigger>
             </TabsList>
 
             <TabsContent value="overview" className="space-y-6">
@@ -424,31 +478,6 @@ const shownWarningToasts = React.useRef<Set<string>>(new Set());
               <MetricsGrid metrics={toolkitData?.metrics} stats={stats} />
             </TabsContent>
 
-            <TabsContent value="live" className="space-y-6">
-              {(toolkitData?.alerts?.length ?? 0) > 0 && <AlertList alerts={toolkitData?.alerts ?? []} />}
-
-              <SectionCard className="space-y-6">
-                <SectionHeader
-                  eyebrow={t('events.notifications.badge', 'Gästefeeds')}
-                  title={t('events.notifications.panelTitle', 'Nachrichten an Gäste')}
-                  description={t('events.notifications.panelDescription', 'Verschicke kurze Hinweise oder Hilfe an die Gästepwa. Links werden direkt im Notification-Center angezeigt.')}
-                />
-                <div className="grid gap-6 lg:grid-cols-[minmax(0,1.1fr)_minmax(0,0.9fr)]">
-                  <GuestNotificationStatsCard notifications={toolkitData?.notifications} />
-                  <GuestBroadcastCard eventSlug={event.slug} eventName={eventName} />
-                </div>
-              </SectionCard>
-
-              <div className="grid gap-6 xl:grid-cols-[minmax(0,1.4fr)_minmax(0,0.8fr)]">
-                <PendingPhotosCard
-                  slug={event.slug}
-                  photos={toolkitData?.photos.pending ?? []}
-                  navigateToModeration={() => navigate(ADMIN_EVENT_PHOTOS_PATH(event.slug))}
-                />
-                <RecentUploadsCard slug={event.slug} photos={toolkitData?.photos.recent ?? []} />
-              </div>
-            </TabsContent>
-
             <TabsContent value="setup" className="space-y-6">
               <div className="grid gap-6 xl:grid-cols-[minmax(0,1.4fr)_minmax(0,0.8fr)]">
                 <TaskOverviewCard tasks={toolkitData?.tasks} navigateToTasks={() => navigate(ADMIN_EVENT_TASKS_PATH(event.slug))} />
@@ -480,7 +509,13 @@ const shownWarningToasts = React.useRef<Set<string>>(new Set());
             </TabsContent>
 
             <TabsContent value="recap" className="space-y-6">
-              <GalleryShareCard invites={toolkitData?.invites} onManageInvites={() => navigate(`${ADMIN_EVENT_INVITES_PATH(event.slug)}?tab=layout`)} />
+              <GalleryShareCard
+                invites={toolkitData?.invites}
+                onManageInvites={() => navigate(`${ADMIN_EVENT_INVITES_PATH(event.slug)}?tab=layout`)}
+              />
+              {event.limits?.gallery ? (
+                <GalleryStatusCard gallery={event.limits.gallery} />
+              ) : null}
               <FeedbackCard slug={event.slug} />
             </TabsContent>
           </Tabs>
@@ -1033,6 +1068,59 @@ function GalleryShareCard({
   );
 }
 
+function GalleryStatusCard({ gallery }: { gallery: GallerySummary }) {
+  const { t } = useTranslation('management');
+
+  const stateLabel =
+    gallery.state === 'expired'
+      ? t('events.galleryStatus.stateExpired', 'Galerie abgelaufen')
+      : gallery.state === 'warning'
+        ? t('events.galleryStatus.stateWarning', 'Galerie läuft bald ab')
+        : t('events.galleryStatus.stateOk', 'Galerie aktiv');
+
+  const expiresLabel =
+    gallery.expires_at && gallery.state !== 'unlimited'
+      ? formatDate(gallery.expires_at)
+      : t('events.galleryStatus.noExpiry', 'Kein Ablaufdatum gesetzt');
+
+  const daysRemaining =
+    typeof gallery.days_remaining === 'number' && gallery.days_remaining >= 0
+      ? gallery.days_remaining
+      : null;
+
+  return (
+    <SectionCard className="space-y-3">
+      <SectionHeader
+        eyebrow={t('events.galleryStatus.badge', 'Laufzeit')}
+        title={t('events.galleryStatus.title', 'Galerie-Laufzeit & Verfügbarkeit')}
+        description={t('events.galleryStatus.subtitle', 'Halte im Blick, wie lange Gäste noch auf die Galerie zugreifen können.')}
+      />
+      <div className="flex flex-col gap-3 rounded-2xl border border-slate-200 bg-white/90 p-4 text-sm text-slate-700 dark:border-white/10 dark:bg-white/5 dark:text-slate-200 md:flex-row md:items-center md:justify-between">
+        <div className="space-y-1">
+          <p className="text-xs uppercase tracking-[0.3em] text-slate-500 dark:text-slate-400">
+            {t('events.galleryStatus.stateLabel', 'Status')}
+          </p>
+          <p className="text-sm font-semibold text-slate-900 dark:text-white">{stateLabel}</p>
+          <p className="text-xs text-slate-600 dark:text-slate-300">
+            {t('events.galleryStatus.expiresAt', {
+              defaultValue: 'Ablaufdatum: {{date}}',
+              date: expiresLabel,
+            })}
+          </p>
+        </div>
+        <div className="space-y-1">
+          <p className="text-xs uppercase tracking-[0.3em] text-slate-500 dark:text-slate-400">
+            {t('events.galleryStatus.daysLabel', 'Verbleibende Tage')}
+          </p>
+          <p className="text-2xl font-semibold text-slate-900 dark:text-white">
+            {daysRemaining !== null ? daysRemaining : '—'}
+          </p>
+        </div>
+      </div>
+    </SectionCard>
+  );
+}
+
 
 function extractBrandingPalette(
   settings: TenantEvent['settings'],
@@ -1068,133 +1156,7 @@ function extractBrandingPalette(
   return { colors, font };
 }
 
-function PendingPhotosCard({
-  slug,
-  photos,
-  navigateToModeration,
-}: {
-  slug: string;
-  photos: TenantPhoto[];
-  navigateToModeration: () => void;
-}) {
-  const { t } = useTranslation('management');
-  const [entries, setEntries] = React.useState(photos);
-  const [updatingId, setUpdatingId] = React.useState<number | null>(null);
-
-  React.useEffect(() => {
-    setEntries(photos);
-  }, [photos]);
-
-  const handleVisibility = async (photo: TenantPhoto, visible: boolean) => {
-    setUpdatingId(photo.id);
-    try {
-      const updated = await updatePhotoVisibility(slug, photo.id, visible);
-      setEntries((prev) => prev.map((item) => (item.id === photo.id ? updated : item)));
-      toast.success(
-        visible
-          ? t('events.photos.toastVisible', 'Foto wieder sichtbar gemacht.')
-          : t('events.photos.toastHidden', 'Foto ausgeblendet.'),
-      );
-    } catch (err) {
-      toast.error(
-        isAuthError(err)
-          ? t('events.photos.errorAuth', 'Session abgelaufen. Bitte erneut anmelden.')
-          : t('events.photos.errorVisibility', 'Sichtbarkeit konnte nicht geändert werden.'),
-      );
-    } finally {
-      setUpdatingId(null);
-    }
-  };
-
-  const handleFeature = async (photo: TenantPhoto, feature: boolean) => {
-    setUpdatingId(photo.id);
-    try {
-      const updated = feature ? await featurePhoto(slug, photo.id) : await unfeaturePhoto(slug, photo.id);
-      setEntries((prev) => prev.map((item) => (item.id === photo.id ? updated : item)));
-      toast.success(
-        feature
-          ? t('events.photos.toastFeatured', 'Foto als Highlight markiert.')
-          : t('events.photos.toastUnfeatured', 'Highlight entfernt.'),
-      );
-    } catch (err) {
-      toast.error(getApiErrorMessage(err, t('events.photos.errorFeature', 'Aktion fehlgeschlagen.')));
-    } finally {
-      setUpdatingId(null);
-    }
-  };
-
-  return (
-    <SectionCard className="space-y-3">
-      <SectionHeader
-        eyebrow={t('events.photos.pendingBadge', 'Moderation')}
-        title={t('events.photos.pendingTitle', 'Fotos in Moderation')}
-        description={t('events.photos.pendingSubtitle', 'Schnell prüfen, bevor Gäste live gehen.')}
-        endSlot={(
-          <Badge variant="outline" className="border-emerald-200 text-emerald-600 dark:border-emerald-500/30 dark:text-emerald-200">
-            {t('events.photos.pendingCount', { defaultValue: '{{count}} Fotos offen', count: entries.length })}
-          </Badge>
-        )}
-      />
-      <div className="space-y-3 text-sm text-slate-700 dark:text-slate-300">
-        {entries.length ? (
-          <div className="grid gap-3 sm:grid-cols-2">
-            {entries.slice(0, 4).map((photo) => {
-              const hidden = photo.status === 'hidden';
-              return (
-                <div key={photo.id} className="rounded-xl border border-slate-200 bg-white/90 p-2">
-                  <div className="relative overflow-hidden rounded-lg">
-                    <img
-                      src={photo.thumbnail_url ?? photo.url ?? undefined}
-                      alt={photo.caption ?? 'Foto'}
-                      className={`h-32 w-full object-cover ${hidden ? 'opacity-60' : ''}`}
-                    />
-                    {photo.is_featured ? (
-                      <span className="absolute left-2 top-2 rounded-full bg-pink-500/90 px-2 py-0.5 text-[10px] font-semibold text-white">
-                        Highlight
-                      </span>
-                    ) : null}
-                  </div>
-                  <div className="mt-2 flex flex-wrap gap-2 text-[11px] text-slate-500">
-                    <Badge variant="outline">{photo.uploader_name ?? 'Gast'}</Badge>
-                    <Badge variant="outline">♥ {photo.likes_count}</Badge>
-                  </div>
-                  <div className="mt-2 flex flex-wrap gap-2 text-xs">
-                    <Button
-                      size="sm"
-                      variant="outline"
-                      disabled={updatingId === photo.id}
-                      onClick={() => handleVisibility(photo, hidden)}
-                    >
-                      {hidden
-                        ? t('events.photos.show', 'Einblenden')
-                        : t('events.photos.hide', 'Verstecken')}
-                    </Button>
-                    <Button
-                      size="sm"
-                      variant={photo.is_featured ? 'secondary' : 'outline'}
-                      disabled={updatingId === photo.id}
-                      onClick={() => handleFeature(photo, !photo.is_featured)}
-                    >
-                      {photo.is_featured
-                        ? t('events.photos.unfeature', 'Highlight entfernen')
-                        : t('events.photos.feature', 'Als Highlight markieren')}
-                    </Button>
-                  </div>
-                </div>
-              );
-            })}
-          </div>
-        ) : (
-          <p className="text-xs text-slate-500">{t('events.photos.pendingEmpty', 'Aktuell warten keine Fotos auf Freigabe.')}</p>
-        )}
-
-        <Button variant="outline" onClick={navigateToModeration} className="border-emerald-200 text-emerald-600 hover:bg-emerald-50">
-          <Camera className="mr-2 h-4 w-4" /> {t('events.photos.openModeration', 'Moderation öffnen')}
-        </Button>
-      </div>
-    </SectionCard>
-  );
-}
+// Pending photos summary moved to the dedicated Live/Photos view.
 
 function RecentUploadsCard({ slug, photos }: { slug: string; photos: TenantPhoto[] }) {
   const { t } = useTranslation('management');