- 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.
This commit is contained in:
@@ -0,0 +1,69 @@
|
||||
import React from 'react';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { cn } from '@/lib/utils';
|
||||
import { LucideIcon } from 'lucide-react';
|
||||
|
||||
export interface OnboardingAction {
|
||||
id: string;
|
||||
label: string;
|
||||
description?: string;
|
||||
href?: string;
|
||||
onClick?: () => void;
|
||||
icon?: LucideIcon;
|
||||
variant?: 'primary' | 'secondary';
|
||||
disabled?: boolean;
|
||||
buttonLabel?: string;
|
||||
}
|
||||
|
||||
interface OnboardingCTAListProps {
|
||||
actions: OnboardingAction[];
|
||||
className?: string;
|
||||
}
|
||||
|
||||
export function OnboardingCTAList({ actions, className }: OnboardingCTAListProps) {
|
||||
if (!actions.length) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className={cn('grid gap-4 md:grid-cols-2', className)}>
|
||||
{actions.map(({ id, label, description, href, onClick, icon: Icon, variant = 'primary', disabled, buttonLabel }) => (
|
||||
<div
|
||||
key={id}
|
||||
className="flex flex-col gap-3 rounded-2xl border border-brand-rose-soft bg-brand-card p-5 shadow-brand-primary backdrop-blur"
|
||||
>
|
||||
<div className="flex items-center gap-3">
|
||||
{Icon && (
|
||||
<span className="flex size-10 items-center justify-center rounded-full bg-brand-rose-soft text-brand-rose shadow-inner">
|
||||
<Icon className="size-5" />
|
||||
</span>
|
||||
)}
|
||||
<span className="text-base font-semibold text-brand-slate">{label}</span>
|
||||
</div>
|
||||
{description && (
|
||||
<p className="text-sm text-brand-navy/80">{description}</p>
|
||||
)}
|
||||
<div>
|
||||
<Button
|
||||
variant="default"
|
||||
size="lg"
|
||||
className={cn(
|
||||
'w-full rounded-full transition-all',
|
||||
variant === 'secondary'
|
||||
? 'bg-brand-gold text-brand-slate shadow-md shadow-amber-200/40 hover:bg-[var(--brand-gold-soft)]'
|
||||
: 'bg-brand-rose text-white shadow-md shadow-rose-400/30 hover:bg-[var(--brand-rose-strong)]'
|
||||
)}
|
||||
disabled={disabled}
|
||||
onClick={onClick}
|
||||
{...(href ? { asChild: true } : {})}
|
||||
>
|
||||
{href ? <a href={href}>{buttonLabel ?? label}</a> : buttonLabel ?? label}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
OnboardingCTAList.displayName = 'OnboardingCTAList';
|
||||
Reference in New Issue
Block a user