soeren/fotospiel-app
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

upgrade to tamagui v2 and guest pwa overhaul

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

40
resources/js/admin/mobile/EventAnalyticsPage.tsx
View File

@@ -37,7 +37,7 @@ export default function MobileEventAnalyticsPage() {
return (
<MobileShell title={t('analytics.title', 'Analytics')} activeTab="home">
<MobileCard
space="$4"
gap="$4"
padding="$6"
alignItems="center"
justifyContent="center"
@@ -55,7 +55,7 @@ export default function MobileEventAnalyticsPage() {
>
<Lock size={32} color={primary} />
</YStack>
<YStack space="$2" alignItems="center">
<YStack gap="$2" alignItems="center">
<Text fontSize="$xl" fontWeight="900" color={textStrong} textAlign="center">
{t('analytics.lockedTitle', 'Unlock Analytics')}
</Text>
@@ -75,7 +75,7 @@ export default function MobileEventAnalyticsPage() {
if (isLoading) {
return (
<MobileShell title={t('analytics.title', 'Analytics')} activeTab="home">
<YStack space="$3">
<YStack gap="$3">
<SkeletonCard height={200} />
<SkeletonCard height={150} />
<SkeletonCard height={150} />
@@ -116,12 +116,12 @@ export default function MobileEventAnalyticsPage() {
activeTab="home"
onBack={() => navigate(-1)}
>
<YStack space="$4">
<YStack space="$2">
<YStack gap="$4">
<YStack gap="$2">
<Text fontSize="$sm" fontWeight="800" color={textStrong}>
{t('analytics.kpiTitle', 'Event snapshot')}
</Text>
<XStack space="$2" flexWrap="wrap">
<XStack gap="$2" flexWrap="wrap">
<KpiTile
icon={TrendingUp}
label={t('analytics.kpiUploads', 'Uploads')}
@@ -140,14 +140,14 @@ export default function MobileEventAnalyticsPage() {
</XStack>
</YStack>
{/* Activity Timeline */}
<MobileCard space="$3" borderColor={border} backgroundColor={surface}>
<XStack alignItems="center" space="$2">
<MobileCard gap="$3" borderColor={border} backgroundColor={surface}>
<XStack alignItems="center" gap="$2">
<TrendingUp size={18} color={primary} />
<Text fontSize="$md" fontWeight="800" color={textStrong}>
{t('analytics.activityTitle', 'Activity Timeline')}
</Text>
</XStack>
<YStack space="$0.5">
<YStack gap="$0.5">
<Text fontSize="$xs" color={muted}>
{t('analytics.timeframe', 'Last {{hours}} hours', { hours: timeframeHours })}
</Text>
@@ -159,7 +159,7 @@ export default function MobileEventAnalyticsPage() {
</YStack>
{hasTimeline ? (
<YStack height={180} justifyContent="flex-end" space="$2">
<YStack height={180} justifyContent="flex-end" gap="$2">
<XStack alignItems="flex-end" justifyContent="space-between" height={150} gap="$1">
{timeline.map((point, index) => {
const heightPercent = (point.count / maxTimelineCount) * 100;
@@ -168,7 +168,7 @@ export default function MobileEventAnalyticsPage() {
const showLabel = timeline.length < 8 || index % 3 === 0;
return (
<YStack key={point.timestamp} flex={1} alignItems="center" space="$1">
<YStack key={point.timestamp} flex={1} alignItems="center" gap="$1">
<YStack
width="100%"
height={`${Math.max(heightPercent, 4)}%`}
@@ -200,8 +200,8 @@ export default function MobileEventAnalyticsPage() {
</MobileCard>
{/* Top Contributors */}
<MobileCard space="$3" borderColor={border} backgroundColor={surface}>
<XStack alignItems="center" space="$2">
<MobileCard gap="$3" borderColor={border} backgroundColor={surface}>
<XStack alignItems="center" gap="$2">
<Trophy size={18} color={primary} />
<Text fontSize="$md" fontWeight="800" color={textStrong}>
{t('analytics.contributorsTitle', 'Top Contributors')}
@@ -209,10 +209,10 @@ export default function MobileEventAnalyticsPage() {
</XStack>
{hasContributors ? (
<YStack space="$3">
<YStack gap="$3">
{contributors.map((contributor, idx) => (
<XStack key={idx} alignItems="center" justifyContent="space-between" paddingVertical="$1">
<XStack alignItems="center" space="$3">
<XStack alignItems="center" gap="$3">
<YStack
width={28}
height={28}
@@ -250,8 +250,8 @@ export default function MobileEventAnalyticsPage() {
</MobileCard>
{/* Task Stats */}
<MobileCard space="$3" borderColor={border} backgroundColor={surface}>
<XStack alignItems="center" space="$2">
<MobileCard gap="$3" borderColor={border} backgroundColor={surface}>
<XStack alignItems="center" gap="$2">
<ListTodo size={18} color={primary} />
<Text fontSize="$md" fontWeight="800" color={textStrong}>
{t('analytics.tasksTitle', 'Popular photo tasks')}
@@ -259,11 +259,11 @@ export default function MobileEventAnalyticsPage() {
</XStack>
{hasTasks ? (
<YStack space="$3">
<YStack gap="$3">
{tasks.map((task) => {
const percent = (task.count / maxTaskCount) * 100;
return (
<YStack key={task.task_id} space="$1">
<YStack key={task.task_id} gap="$1">
<XStack justifyContent="space-between">
<Text fontSize="$sm" color={textStrong} numberOfLines={1} flex={1}>
{task.task_name}
@@ -308,7 +308,7 @@ function EmptyState({
}) {
const { muted } = useAdminTheme();
return (
<YStack padding="$4" alignItems="center" justifyContent="center" space="$2">
<YStack padding="$4" alignItems="center" justifyContent="center" gap="$2">
<Text fontSize="$sm" color={muted}>
{message}
</Text>