upgrade to tamagui v2 and guest pwa overhaul

This commit is contained in:
Codex Agent
2026-02-02 13:01:20 +01:00
parent 2e78f3ab8d
commit 7c6e14ffe2
168 changed files with 47462 additions and 8914 deletions

View File

@@ -50,7 +50,7 @@ export default function WelcomeEventPage() {
onSkip={handleSkip}
skipLabel={t('layout.jumpToDashboard', 'Jump to dashboard')}
>
<MobileCard space="$3">
<MobileCard gap="$3">
<Text fontSize="$sm" fontWeight="800">
{t('eventSetup.step.title', 'Event setup in minutes')}
</Text>
@@ -60,7 +60,7 @@ export default function WelcomeEventPage() {
'We guide you through name, date, mood, and tasks. Afterwards you can moderate photos and support guests live.',
)}
</Text>
<YStack space="$2">
<YStack gap="$2">
<FeatureRow
icon={Sparkles}
title={t('eventSetup.tiles.story.title', 'Story & mood')}
@@ -79,7 +79,7 @@ export default function WelcomeEventPage() {
</YStack>
</MobileCard>
<MobileCard space="$2">
<MobileCard gap="$2">
<Text fontSize="$sm" fontWeight="800">
{t('eventSetup.cta.heading', 'Ready for your first event?')}
</Text>
@@ -95,7 +95,7 @@ export default function WelcomeEventPage() {
/>
</MobileCard>
<YStack space="$2">
<YStack gap="$2">
<CTAButton
label={t('eventSetup.actions.dashboard.button', 'Open dashboard')}
tone="ghost"
@@ -121,7 +121,7 @@ function FeatureRow({
body: string;
}) {
return (
<XStack alignItems="center" space="$2">
<XStack alignItems="center" gap="$2">
<XStack
width={34}
height={34}

View File

@@ -48,7 +48,7 @@ export default function WelcomeLandingPage() {
onSkip={handleSkip}
skipLabel={t('layout.jumpToDashboard', 'Jump to dashboard')}
>
<MobileCard space="$3">
<MobileCard gap="$3">
<PillBadge tone="muted">{t('hero.eyebrow', 'Your event, your stage')}</PillBadge>
<Text fontSize="$lg" fontWeight="900">
{t('hero.title', 'Design the next Fotospiel experience')}
@@ -59,7 +59,7 @@ export default function WelcomeLandingPage() {
'In just a few steps you guide guests through a magical photo journey complete with storytelling, tasks, and a moderated gallery.',
)}
</Text>
<XStack space="$2" flexWrap="wrap">
<XStack gap="$2" flexWrap="wrap">
<CTAButton
label={
shouldGoBilling
@@ -80,7 +80,7 @@ export default function WelcomeLandingPage() {
</XStack>
</MobileCard>
<YStack space="$3">
<YStack gap="$3">
<FeatureCard
icon={ImageIcon}
title={t('highlights.gallery.title', 'Premium guest gallery')}
@@ -117,9 +117,9 @@ function FeatureCard({
badge?: string;
}) {
return (
<MobileCard space="$2">
<MobileCard gap="$2">
<XStack alignItems="center" justifyContent="space-between">
<XStack alignItems="center" space="$2">
<XStack alignItems="center" gap="$2">
<XStack
width={36}
height={36}

View File

@@ -85,7 +85,7 @@ export default function WelcomePackagesPage() {
</Text>
</MobileCard>
) : (
<YStack space="$3">
<YStack gap="$3">
{packages?.map((pkg) => (
<PackageCard
key={pkg.id}
@@ -97,7 +97,7 @@ export default function WelcomePackagesPage() {
</YStack>
)}
<MobileCard space="$2">
<MobileCard gap="$2">
<Text fontSize="$sm" fontWeight="800">
{t('packages.step.title', 'Activate the right plan')}
</Text>
@@ -106,7 +106,7 @@ export default function WelcomePackagesPage() {
</Text>
</MobileCard>
<XStack space="$2">
<XStack gap="$2">
<CTAButton
label={t('packages.cta.summary.button', 'Continue to summary')}
onPress={() => navigate(ADMIN_WELCOME_SUMMARY_PATH)}
@@ -143,9 +143,9 @@ function PackageCard({
return (
<Pressable onPress={onSelect}>
<MobileCard borderColor={selected ? primary : border} space="$2">
<MobileCard borderColor={selected ? primary : border} gap="$2">
<XStack alignItems="center" justifyContent="space-between">
<XStack alignItems="center" space="$2">
<XStack alignItems="center" gap="$2">
<XStack width={36} height={36} borderRadius={12} backgroundColor={accentSoft} alignItems="center" justifyContent="center">
<PackageIcon size={18} color={primary} />
</XStack>
@@ -162,7 +162,7 @@ function PackageCard({
{selected ? t('packages.card.selected', 'Selected') : t('packages.card.select', 'Select package')}
</PillBadge>
</XStack>
<XStack flexWrap="wrap" space="$2">
<XStack flexWrap="wrap" gap="$2">
{badges.map((badge) => (
<PillBadge key={badge as any} tone="muted">
{badge as any}
@@ -170,7 +170,7 @@ function PackageCard({
))}
</XStack>
{selected ? (
<XStack alignItems="center" space="$1">
<XStack alignItems="center" gap="$1">
<Check size={14} color={primary} />
<Text fontSize="$xs" color={primary} fontWeight="700">
{t('packages.card.selected', 'Selected')}

View File

@@ -94,9 +94,9 @@ export default function WelcomeSummaryPage() {
<CTAButton label={t('summary.footer.back', 'Back to package selection')} onPress={() => navigate(ADMIN_WELCOME_PACKAGES_PATH)} />
</MobileCard>
) : (
<MobileCard space="$3">
<MobileCard gap="$3">
<XStack alignItems="center" justifyContent="space-between">
<XStack alignItems="center" space="$2">
<XStack alignItems="center" gap="$2">
<XStack
width={36}
height={36}
@@ -123,7 +123,7 @@ export default function WelcomeSummaryPage() {
</PillBadge>
</XStack>
<YStack space="$2">
<YStack gap="$2">
<SummaryRow
label={t('summary.details.section.photosTitle', 'Photos & gallery')}
value={t('summary.details.section.photosValue', {
@@ -148,7 +148,7 @@ export default function WelcomeSummaryPage() {
</YStack>
{resolvedPackage.active ? (
<XStack alignItems="center" space="$2">
<XStack alignItems="center" gap="$2">
<CheckCircle2 size={18} color={ADMIN_COLORS.success} />
<Text fontSize="$sm" color={ADMIN_COLORS.success} fontWeight="700">
{t('summary.details.section.statusActive', 'Already purchased')}
@@ -158,11 +158,11 @@ export default function WelcomeSummaryPage() {
</MobileCard>
)}
<MobileCard space="$2">
<MobileCard gap="$2">
<Text fontSize="$sm" fontWeight="800">
{t('summary.nextStepsTitle', 'Next steps')}
</Text>
<YStack space="$1">
<YStack gap="$1">
{(t('summary.nextSteps', {
returnObjects: true,
defaultValue: [
@@ -171,7 +171,7 @@ export default function WelcomeSummaryPage() {
'Check your event slots before go-live and share your guest link.',
],
}) as string[]).map((item) => (
<XStack key={item} space="$2">
<XStack key={item} gap="$2">
<Text fontSize="$xs" color={ADMIN_COLORS.textMuted}>
</Text>
@@ -183,7 +183,7 @@ export default function WelcomeSummaryPage() {
</YStack>
</MobileCard>
<XStack space="$2">
<XStack gap="$2">
<CTAButton
label={t('summary.cta.billing.button', 'Go to billing')}
tone="ghost"