fix(dashboard): resolve missing translations and refine alert styling
- Updated useEventReadiness hook to use 'Bearbeiten' instead of untranslated string - Fixed 'guestsBlocked' literal appearing in alerts by passing translator correctly - Refined limit warning styles to respect danger tone - Localized pulse strip labels (Fotos, Gäste) properly
This commit is contained in:
@@ -20,6 +20,12 @@ import { buildLimitWarnings } from '../lib/limitWarnings';
|
|||||||
import { withAlpha } from './components/colors';
|
import { withAlpha } from './components/colors';
|
||||||
import { useEventReadiness } from './hooks/useEventReadiness';
|
import { useEventReadiness } from './hooks/useEventReadiness';
|
||||||
|
|
||||||
|
// --- HELPERS ---
|
||||||
|
|
||||||
|
function translateLimits(t: any) {
|
||||||
|
return (key: string, options?: any) => t(`management:limits.${key}`, key, options);
|
||||||
|
}
|
||||||
|
|
||||||
// --- MODERN PRIMITIVES ---
|
// --- MODERN PRIMITIVES ---
|
||||||
|
|
||||||
function ModernCard({ children, style, ...rest }: any) {
|
function ModernCard({ children, style, ...rest }: any) {
|
||||||
@@ -194,7 +200,7 @@ export default function MobileDashboardPage() {
|
|||||||
<PulseStrip event={activeEvent} stats={stats} />
|
<PulseStrip event={activeEvent} stats={stats} />
|
||||||
|
|
||||||
{/* 3. ALERTS */}
|
{/* 3. ALERTS */}
|
||||||
<AlertsSection event={activeEvent} stats={stats} />
|
<AlertsSection event={activeEvent} stats={stats} t={t} />
|
||||||
|
|
||||||
{/* 4. UNIFIED COMMAND GRID */}
|
{/* 4. UNIFIED COMMAND GRID */}
|
||||||
<UnifiedToolGrid
|
<UnifiedToolGrid
|
||||||
@@ -520,28 +526,39 @@ function RecentPhotosSection({ photos, navigate, slug }: { photos: TenantPhoto[]
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
function AlertsSection({ event, stats }: any) {
|
function AlertsSection({ event, stats, t }: any) {
|
||||||
const theme = useAdminTheme();
|
const theme = useAdminTheme();
|
||||||
const limitWarnings = buildLimitWarnings(event?.limits ?? null, (k: string) => k);
|
const limitWarnings = buildLimitWarnings(event?.limits ?? null, translateLimits(t));
|
||||||
|
|
||||||
if (!limitWarnings.length) return null;
|
if (!limitWarnings.length) return null;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<YStack space="$2">
|
<YStack space="$2">
|
||||||
{limitWarnings.map((w: any, idx: number) => (
|
{limitWarnings.map((w: any, idx: number) => {
|
||||||
|
const isDanger = w.tone === 'danger';
|
||||||
|
const bg = isDanger ? theme.dangerBg : theme.warningBg;
|
||||||
|
const border = isDanger ? theme.dangerText : theme.warningBorder;
|
||||||
|
const text = isDanger ? theme.dangerText : theme.warningText;
|
||||||
|
const Icon = isDanger ? AlertCircle : Bell;
|
||||||
|
|
||||||
|
return (
|
||||||
<XStack
|
<XStack
|
||||||
key={idx}
|
key={idx}
|
||||||
backgroundColor={theme.warningBg}
|
backgroundColor={bg}
|
||||||
padding="$3"
|
padding="$3"
|
||||||
borderRadius={12}
|
borderRadius={12}
|
||||||
borderWidth={1}
|
borderWidth={1}
|
||||||
borderColor={theme.warningBorder}
|
borderColor={border}
|
||||||
|
alignItems="center"
|
||||||
|
space="$2"
|
||||||
>
|
>
|
||||||
<Text fontSize="$sm" color={theme.warningText}>
|
<Icon size={16} color={text} />
|
||||||
|
<Text fontSize="$sm" color={text} fontWeight="600">
|
||||||
{w.message}
|
{w.message}
|
||||||
</Text>
|
</Text>
|
||||||
</XStack>
|
</XStack>
|
||||||
))}
|
);
|
||||||
|
})}
|
||||||
</YStack>
|
</YStack>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -45,16 +45,16 @@ export function useEventReadiness(event: TenantEvent | null, t: (key: string, fa
|
|||||||
const steps: ReadinessStep[] = [
|
const steps: ReadinessStep[] = [
|
||||||
{
|
{
|
||||||
id: 'basics',
|
id: 'basics',
|
||||||
label: t('management:events.form.date', 'Date & Location'),
|
label: t('management:events.form.date', 'Datum & Ort'),
|
||||||
isComplete: hasDate && hasLocation,
|
isComplete: hasDate && hasLocation,
|
||||||
ctaLabel: t('management:events.actions.edit', 'Set Date & Location'),
|
ctaLabel: t('management:events.actions.edit', 'Bearbeiten'),
|
||||||
targetPath: `/mobile/events/${event.slug}/edit`,
|
targetPath: `/mobile/events/${event.slug}/edit`,
|
||||||
priority: 1
|
priority: 1
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'access',
|
id: 'access',
|
||||||
label: t('management:invites.badge', 'QR Codes'),
|
label: t('management:invites.badge', 'QR-Codes'),
|
||||||
ctaLabel: t('management:invites.actions.create', 'Get QR Code'),
|
ctaLabel: t('management:invites.actions.create', 'QR-Code erstellen'),
|
||||||
isComplete: hasInvite,
|
isComplete: hasInvite,
|
||||||
targetPath: `/mobile/events/${event.slug}/qr`,
|
targetPath: `/mobile/events/${event.slug}/qr`,
|
||||||
priority: 3
|
priority: 3
|
||||||
@@ -64,9 +64,9 @@ export function useEventReadiness(event: TenantEvent | null, t: (key: string, fa
|
|||||||
if (tasksEnabled) {
|
if (tasksEnabled) {
|
||||||
steps.push({
|
steps.push({
|
||||||
id: 'tasks',
|
id: 'tasks',
|
||||||
label: t('management:tasks.badge', 'Photo Tasks'),
|
label: t('management:tasks.badge', 'Aufgaben'),
|
||||||
isComplete: hasTasks,
|
isComplete: hasTasks,
|
||||||
ctaLabel: t('management:tasks.actions.assign', 'Add Photo Tasks'),
|
ctaLabel: t('management:tasks.actions.assign', 'Aufgaben hinzufügen'),
|
||||||
targetPath: `/mobile/events/${event.slug}/tasks`,
|
targetPath: `/mobile/events/${event.slug}/tasks`,
|
||||||
priority: 2
|
priority: 2
|
||||||
});
|
});
|
||||||
@@ -87,4 +87,4 @@ export function useEventReadiness(event: TenantEvent | null, t: (key: string, fa
|
|||||||
nextStep,
|
nextStep,
|
||||||
isReady: !nextStep
|
isReady: !nextStep
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
Reference in New Issue
Block a user