feat(admin): finalize live show settings and related tests
This commit is contained in:
@@ -146,6 +146,8 @@ export default function MobileEventLiveShowSettingsPage() {
|
||||
const back = useBackNavigation(slug ? adminPath(`/mobile/events/${slug}`) : adminPath('/mobile/events'));
|
||||
|
||||
const locale = i18n.language?.startsWith('en') ? 'en-GB' : 'de-DE';
|
||||
const linkExpiryInfo = React.useMemo(() => parseLinkExpiry(liveShowLink?.expires_at ?? null, locale), [liveShowLink?.expires_at, locale]);
|
||||
const linkExpired = linkExpiryInfo?.isExpired ?? false;
|
||||
|
||||
const loadLink = React.useCallback(async () => {
|
||||
if (!slug) return;
|
||||
@@ -316,21 +318,21 @@ export default function MobileEventLiveShowSettingsPage() {
|
||||
<XStack gap="$2" marginTop="$2" alignItems="center" flexWrap="nowrap">
|
||||
<IconAction
|
||||
label={t('liveShowSettings.link.copy', 'Copy')}
|
||||
disabled={!liveShowLink?.url}
|
||||
disabled={!liveShowLink?.url || linkExpired}
|
||||
onPress={() => liveShowLink?.url && copyToClipboard(liveShowLink.url, t)}
|
||||
>
|
||||
<Copy size={18} />
|
||||
</IconAction>
|
||||
<IconAction
|
||||
label={t('liveShowSettings.link.share', 'Share')}
|
||||
disabled={!liveShowLink?.url}
|
||||
disabled={!liveShowLink?.url || linkExpired}
|
||||
onPress={() => liveShowLink?.url && shareLink(liveShowLink.url, event, t)}
|
||||
>
|
||||
<Share2 size={18} />
|
||||
</IconAction>
|
||||
<IconAction
|
||||
label={t('liveShowSettings.link.open', 'Open')}
|
||||
disabled={!liveShowLink?.url}
|
||||
disabled={!liveShowLink?.url || linkExpired}
|
||||
onPress={() => liveShowLink?.url && openLink(liveShowLink.url)}
|
||||
>
|
||||
<ExternalLink size={18} />
|
||||
@@ -360,10 +362,28 @@ export default function MobileEventLiveShowSettingsPage() {
|
||||
</XStack>
|
||||
) : null}
|
||||
{liveShowLink ? (
|
||||
<Text fontSize="$xs" color={muted} marginTop="$1.5">
|
||||
{t('liveShowSettings.link.noExpiry', 'No expiry date set.')}
|
||||
<Text fontSize="$xs" color={linkExpired ? danger : muted} marginTop="$1.5">
|
||||
{linkExpiryInfo
|
||||
? linkExpiryInfo.isExpired
|
||||
? t('liveShowSettings.link.expiredAt', 'Expired at {{time}}', { time: linkExpiryInfo.formatted })
|
||||
: linkExpiryInfo.isSoon
|
||||
? t('liveShowSettings.link.expiresSoonAt', 'Expires soon: {{time}}', { time: linkExpiryInfo.formatted })
|
||||
: t('liveShowSettings.link.expiresAt', 'Valid until {{time}}', { time: linkExpiryInfo.formatted })
|
||||
: t('liveShowSettings.link.noExpiry', 'No expiry date set.')}
|
||||
</Text>
|
||||
) : null}
|
||||
{linkExpired ? (
|
||||
<YStack gap="$2" marginTop="$2">
|
||||
<Text fontSize="$xs" color={muted}>
|
||||
{t('liveShowSettings.link.expiredHint', 'Rotate the link to generate a new active URL and QR code.')}
|
||||
</Text>
|
||||
<CTAButton
|
||||
label={linkBusy ? t('common.processing', '...') : t('liveShowSettings.link.rotateNow', 'Rotate now')}
|
||||
onPress={() => handleRotateLink()}
|
||||
disabled={linkBusy}
|
||||
/>
|
||||
</YStack>
|
||||
) : null}
|
||||
{liveShowLink?.rotated_at ? (
|
||||
<Text fontSize="$xs" color={muted} marginTop="$1.5">
|
||||
{t('liveShowSettings.link.rotatedAt', 'Last rotated {{time}}', {
|
||||
@@ -623,6 +643,35 @@ function formatTimestamp(value: string, locale: string): string {
|
||||
return date.toLocaleString(locale, { day: '2-digit', month: 'short', year: 'numeric', hour: '2-digit', minute: '2-digit' });
|
||||
}
|
||||
|
||||
function parseLinkExpiry(
|
||||
value: string | null,
|
||||
locale: string
|
||||
): {
|
||||
formatted: string;
|
||||
isExpired: boolean;
|
||||
isSoon: boolean;
|
||||
} | null {
|
||||
if (!value) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const date = new Date(value);
|
||||
if (Number.isNaN(date.getTime())) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const now = Date.now();
|
||||
const expiresAt = date.getTime();
|
||||
const isExpired = expiresAt < now;
|
||||
const isSoon = !isExpired && expiresAt - now <= 24 * 60 * 60 * 1000;
|
||||
|
||||
return {
|
||||
formatted: formatTimestamp(value, locale),
|
||||
isExpired,
|
||||
isSoon,
|
||||
};
|
||||
}
|
||||
|
||||
function resolveOption<T extends string>(value: unknown, options: T[], fallback: T): T {
|
||||
if (typeof value !== 'string') return fallback;
|
||||
return options.includes(value as T) ? (value as T) : fallback;
|
||||
|
||||
Reference in New Issue
Block a user