website refactor

This commit is contained in:
2026-01-19 18:01:30 +01:00
parent 6154d54435
commit 61b5cf3b64
120 changed files with 2226 additions and 2021 deletions

View File

@@ -6,21 +6,18 @@ import { AdminSectionHeader } from '@/components/admin/AdminSectionHeader';
import { AdminStatsPanel } from '@/components/admin/AdminStatsPanel';
import { routes } from '@/lib/routing/RouteConfig';
import { AdminDashboardViewData } from '@/lib/view-data/AdminDashboardViewData';
import {
SharedBox,
SharedButton,
SharedCard,
SharedContainer,
SharedIcon,
SharedGrid,
SharedStack,
SharedText,
SharedBadge
} from '@/components/shared/UIComponents';
import { Box } from '@/ui/Box';
import { Button } from '@/ui/Button';
import { Card } from '@/ui/Card';
import { Container } from '@/ui/Container';
import { Icon } from '@/ui/Icon';
import { Grid } from '@/ui/Grid';
import { Stack } from '@/ui/Stack';
import { Text } from '@/ui/Text';
import { Badge } from '@/ui/Badge';
import { QuickActionLink } from '@/ui/QuickActionLink';
import {
Activity,
ArrowRight,
Clock,
RefreshCw,
Shield,
@@ -70,93 +67,95 @@ export function AdminDashboardTemplate({
];
return (
<SharedContainer size="lg">
<SharedBox paddingY={8}>
<SharedStack gap={8}>
<Container size="lg">
<Box paddingY={8}>
<Stack gap={8}>
<AdminHeaderPanel
title="Admin Dashboard"
description="System-wide telemetry and operations control"
isLoading={isLoading}
actions={
<SharedButton
<Button
onClick={onRefresh}
disabled={isLoading}
variant="secondary"
size="sm"
icon={<SharedIcon icon={RefreshCw} size={3} animate={isLoading ? 'spin' : 'none'} />}
>
Refresh Telemetry
</SharedButton>
<Stack direction="row" align="center" gap={2}>
<Icon icon={RefreshCw} size={3} animate={isLoading ? 'spin' : 'none'} />
<Text>Refresh Telemetry</Text>
</Stack>
</Button>
}
/>
<AdminStatsPanel stats={stats} />
<SharedGrid cols={{ base: 1, md: 2 }} gap={6}>
<Grid responsiveGridCols={{ base: 1, md: 2 }} gap={6}>
{/* System Health & Status */}
<SharedCard p={6}>
<SharedStack gap={6}>
<Card padding={6}>
<Stack gap={6}>
<AdminSectionHeader
title="System Status"
actions={
<SharedBadge variant="success">
<SharedStack direction="row" align="center" gap={1.5}>
<SharedIcon icon={Activity} size={3} />
<SharedText>Operational</SharedText>
</SharedStack>
</SharedBadge>
<Badge variant="success">
<Stack direction="row" align="center" gap={1.5}>
<Icon icon={Activity} size={3} />
<Text>Operational</Text>
</Stack>
</Badge>
}
/>
<SharedStack gap={4}>
<SharedBox borderTop borderColor="border-gray" opacity={0.3} />
<SharedBox pt={0}>
<SharedStack direction="row" align="center" justify="between" py={2}>
<SharedText size="sm" color="text-gray-400">Suspended Users</SharedText>
<SharedText weight="bold" color="text-warning-amber">{viewData.stats.suspendedUsers}</SharedText>
</SharedStack>
</SharedBox>
<SharedBox borderTop borderColor="border-gray" opacity={0.3} />
<SharedBox>
<SharedStack direction="row" align="center" justify="between" py={2}>
<SharedText size="sm" color="text-gray-400">Deleted Users</SharedText>
<SharedText weight="bold" color="text-error-red">{viewData.stats.deletedUsers}</SharedText>
</SharedStack>
</SharedBox>
<SharedBox borderTop borderColor="border-gray" opacity={0.3} />
<SharedBox>
<SharedStack direction="row" align="center" justify="between" py={2}>
<SharedText size="sm" color="text-gray-400">New Registrations (24h)</SharedText>
<SharedText weight="bold" color="text-primary-blue">{viewData.stats.newUsersToday}</SharedText>
</SharedStack>
</SharedBox>
</SharedStack>
</SharedStack>
</SharedCard>
<Stack gap={4}>
<Box borderTop borderColor="rgba(255,255,255,0.1)" />
<Box pt={0}>
<Stack direction="row" align="center" justify="between" py={2}>
<Text size="sm" color="text-gray-400">Suspended Users</Text>
<Text weight="bold" color="warning-amber">{viewData.stats.suspendedUsers}</Text>
</Stack>
</Box>
<Box borderTop borderColor="rgba(255,255,255,0.1)" />
<Box>
<Stack direction="row" align="center" justify="between" py={2}>
<Text size="sm" color="text-gray-400">Deleted Users</Text>
<Text weight="bold" color="critical-red">{viewData.stats.deletedUsers}</Text>
</Stack>
</Box>
<Box borderTop borderColor="rgba(255,255,255,0.1)" />
<Box>
<Stack direction="row" align="center" justify="between" py={2}>
<Text size="sm" color="text-gray-400">New Registrations (24h)</Text>
<Text weight="bold" color="primary-accent">{viewData.stats.newUsersToday}</Text>
</Stack>
</Box>
</Stack>
</Stack>
</Card>
{/* Quick Operations */}
<SharedCard p={6}>
<SharedStack gap={6}>
<Card padding={6}>
<Stack gap={6}>
<AdminSectionHeader title="Quick Operations" />
<SharedGrid cols={1} gap={3}>
<Grid responsiveGridCols={{ base: 1 }} gap={3}>
<QuickActionLink href={routes.admin.users} label="User Management" icon={Users} />
<QuickActionLink href="/admin" label="Security & Roles" icon={Shield} />
<QuickActionLink href="/admin" label="System Audit Logs" icon={Activity} />
</SharedGrid>
</SharedStack>
</SharedCard>
</SharedGrid>
</Grid>
</Stack>
</Card>
</Grid>
<AdminDangerZonePanel
title="System Maintenance"
description="Perform destructive system-wide operations. Use with extreme caution."
>
<SharedButton variant="danger" size="sm">
<Button variant="danger" size="sm">
Enter Maintenance Mode
</SharedButton>
</Button>
</AdminDangerZonePanel>
</SharedStack>
</SharedBox>
</SharedContainer>
</Stack>
</Box>
</Container>
);
}