- Tenant-Admin-PWA: Neues /event-admin/welcome Onboarding mit WelcomeHero, Packages-, Order-Summary- und Event-Setup-Pages, Zustandsspeicher, Routing-Guard und Dashboard-CTA für Erstnutzer; Filament-/admin-Login via Custom-View behoben.

- Brand/Theming: Marketing-Farb- und Typographievariablen in `resources/css/app.css` eingeführt, AdminLayout, Dashboardkarten und Onboarding-Komponenten entsprechend angepasst; Dokumentation (`docs/todo/tenant-admin-onboarding-fusion.md`, `docs/changes/...`) aktualisiert. - Checkout & Payments: Checkout-, PayPal-Controller und Tests für integrierte Stripe/PayPal-Flows sowie Paket-Billing-Abläufe überarbeitet; neue PayPal SDK-Factory und Admin-API-Helper (`resources/js/admin/api.ts`) schaffen Grundlage für Billing/Members/Tasks-Seiten. - DX & Tests: Neue Playwright/E2E-Struktur (docs/testing/e2e.md, `tests/e2e/tenant-onboarding-flow.test.ts`, Utilities), E2E-Tenant-Seeder und zusätzliche Übersetzungen/Factories zur Unterstützung der neuen Flows. - Marketing-Kommunikation: Automatische Kontakt-Bestätigungsmail (`ContactConfirmation` + Blade-Template) implementiert; Guest-PWA unter `/event` erreichbar. - Nebensitzung: Blogsystem gefixt und umfassenden BlogPostSeeder für Beispielinhalte angelegt.
2025-10-10 21:31:55 +02:00
parent 52197f216d
commit d04e234ca0
84 changed files with 8397 additions and 1005 deletions
--- a/resources/js/admin/onboarding/pages/WelcomeLandingPage.tsx
+++ b/resources/js/admin/onboarding/pages/WelcomeLandingPage.tsx
@@ -0,0 +1,114 @@
+import React from "react";
+import { useNavigate } from "react-router-dom";
+import { Sparkles, Users, Camera, CalendarDays, ChevronRight } from "lucide-react";
+import {
+  TenantWelcomeLayout,
+  WelcomeHero,
+  OnboardingHighlightsGrid,
+  OnboardingCTAList,
+  useOnboardingProgress,
+} from "..";
+import { ADMIN_WELCOME_PACKAGES_PATH, ADMIN_EVENTS_PATH } from "../../constants";
+
+export default function WelcomeLandingPage() {
+  const navigate = useNavigate();
+  const { markStep } = useOnboardingProgress();
+
+  React.useEffect(() => {
+    markStep({ welcomeSeen: true, lastStep: "landing" });
+  }, [markStep]);
+
+  return (
+    <TenantWelcomeLayout
+      eyebrow="Fotospiel Tenant Admin"
+      title="Willkommen im Event-Erlebnisstudio"
+      subtitle="Starte mit einer inspirierten Einführung, sichere dir dein Event-Paket und kreiere die perfekte Gästegalerie – alles optimiert für mobile Hosts."
+      footer={
+        <>
+          <span className="text-brand-navy/80">Schon vertraut mit Fotospiel?</span>
+          <button
+            type="button"
+            className="inline-flex items-center gap-1 text-sm font-semibold text-brand-rose hover:text-[var(--brand-rose-strong)]"
+            onClick={() => navigate(ADMIN_EVENTS_PATH)}
+          >
+            Direkt zum Dashboard
+            <ChevronRight className="size-4" />
+          </button>
+        </>
+      }
+    >
+      <WelcomeHero
+        eyebrow="Dein Event, deine Bühne"
+        title="Gestalte das nächste Fotospiel Erlebnis"
+        scriptTitle="Einmalig für Gäste, mühelos für dich."
+        description="Mit nur wenigen Schritten führst du deine Gäste durch ein magisches Fotoabenteuer – inklusive Storytelling, Aufgaben und moderierter Galerie."
+        actions={[
+          {
+            label: "Pakete entdecken",
+            buttonLabel: "Pakete entdecken",
+            onClick: () => navigate(ADMIN_WELCOME_PACKAGES_PATH),
+            icon: Sparkles,
+          },
+          {
+            label: "Events anzeigen",
+            buttonLabel: "Bestehende Events anzeigen",
+            onClick: () => navigate(ADMIN_EVENTS_PATH),
+            icon: CalendarDays,
+            variant: "outline",
+          },
+        ]}
+      />
+
+      <OnboardingHighlightsGrid
+        items={[
+          {
+            id: "gallery",
+            icon: Camera,
+            title: "Premium Gästegalerie",
+            description:
+              "Kuratiere Fotos in Echtzeit, markiere Highlights und teile QR-Codes mit einem Tap.",
+            badge: "Neu",
+          },
+          {
+            id: "team",
+            icon: Users,
+            title: "Flexibles Team-Onboarding",
+            description:
+              "Lade Co-Hosts ein, weise Rollen zu und behalte den Überblick über Moderation und Aufgaben.",
+          },
+          {
+            id: "sparkles",
+            icon: Sparkles,
+            title: "Storytelling in Etappen",
+            description:
+              "Geführte Aufgaben und Emotionskarten machen jedes Event zu einer erinnerungswürdigen Reise.",
+          },
+        ]}
+      />
+
+      <OnboardingCTAList
+        actions={[
+          {
+            id: "choose-package",
+            label: "Dein Eventpaket auswählen",
+            description:
+              "Reserviere Credits oder Abos, um sofort Events zu aktivieren. Flexible Optionen für jede Eventgröße.",
+            onClick: () => navigate(ADMIN_WELCOME_PACKAGES_PATH),
+            icon: Sparkles,
+            buttonLabel: "Weiter zu Paketen",
+          },
+          {
+            id: "create-event",
+            label: "Event vorbereiten",
+            description:
+              "Sammle Eventdetails, plane Aufgaben und sorge für einen reibungslosen Ablauf noch vor dem Tag des Events.",
+            onClick: () => navigate(ADMIN_EVENTS_PATH),
+            icon: CalendarDays,
+            buttonLabel: "Zum Event-Manager",
+            variant: "secondary",
+          },
+        ]}
+      />
+    </TenantWelcomeLayout>
+  );
+}