website refactor
This commit is contained in:
@@ -6,16 +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 { 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 {
|
||||
SharedBox,
|
||||
SharedButton,
|
||||
SharedCard,
|
||||
SharedContainer,
|
||||
SharedIcon,
|
||||
SharedGrid,
|
||||
SharedStack,
|
||||
SharedText,
|
||||
SharedBadge
|
||||
} from '@/components/shared/UIComponents';
|
||||
import { QuickActionLink } from '@/ui/QuickActionLink';
|
||||
import { StatusBadge } from '@/ui/StatusBadge';
|
||||
import { Text } from '@/ui/Text';
|
||||
import {
|
||||
Activity,
|
||||
ArrowRight,
|
||||
@@ -24,6 +26,7 @@ import {
|
||||
Shield,
|
||||
Users
|
||||
} from 'lucide-react';
|
||||
import { TemplateProps } from '@/lib/contracts/components/ComponentContracts';
|
||||
|
||||
/**
|
||||
* AdminDashboardTemplate
|
||||
@@ -35,8 +38,7 @@ export function AdminDashboardTemplate({
|
||||
viewData,
|
||||
onRefresh,
|
||||
isLoading
|
||||
}: {
|
||||
viewData: AdminDashboardViewData;
|
||||
}: TemplateProps<AdminDashboardViewData> & {
|
||||
onRefresh: () => void;
|
||||
isLoading: boolean;
|
||||
}) {
|
||||
@@ -68,103 +70,93 @@ export function AdminDashboardTemplate({
|
||||
];
|
||||
|
||||
return (
|
||||
<Container size="lg" py={8}>
|
||||
<Stack gap={8}>
|
||||
<AdminHeaderPanel
|
||||
title="Admin Dashboard"
|
||||
description="System-wide telemetry and operations control"
|
||||
isLoading={isLoading}
|
||||
actions={
|
||||
<Button
|
||||
onClick={onRefresh}
|
||||
disabled={isLoading}
|
||||
variant="secondary"
|
||||
size="sm"
|
||||
icon={<Icon icon={RefreshCw} size={3} animate={isLoading ? 'spin' : 'none'} />}
|
||||
>
|
||||
Refresh Telemetry
|
||||
</Button>
|
||||
}
|
||||
/>
|
||||
<SharedContainer size="lg">
|
||||
<SharedBox paddingY={8}>
|
||||
<SharedStack gap={8}>
|
||||
<AdminHeaderPanel
|
||||
title="Admin Dashboard"
|
||||
description="System-wide telemetry and operations control"
|
||||
isLoading={isLoading}
|
||||
actions={
|
||||
<SharedButton
|
||||
onClick={onRefresh}
|
||||
disabled={isLoading}
|
||||
variant="secondary"
|
||||
size="sm"
|
||||
icon={<SharedIcon icon={RefreshCw} size={3} animate={isLoading ? 'spin' : 'none'} />}
|
||||
>
|
||||
Refresh Telemetry
|
||||
</SharedButton>
|
||||
}
|
||||
/>
|
||||
|
||||
<AdminStatsPanel stats={stats} />
|
||||
<AdminStatsPanel stats={stats} />
|
||||
|
||||
<Grid cols={1} mdCols={2} gap={6}>
|
||||
{/* System Health & Status */}
|
||||
<Card p={6}>
|
||||
<Stack gap={6}>
|
||||
<AdminSectionHeader
|
||||
title="System Status"
|
||||
actions={
|
||||
<StatusBadge variant="success" icon={Activity}>
|
||||
Operational
|
||||
</StatusBadge>
|
||||
}
|
||||
/>
|
||||
|
||||
<Stack gap={4}>
|
||||
<Box borderTop borderColor="border-gray" opacity={0.3} />
|
||||
<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="text-warning-amber">{viewData.stats.suspendedUsers}</Text>
|
||||
</Stack>
|
||||
</Box>
|
||||
<Box borderTop borderColor="border-gray" opacity={0.3} />
|
||||
<Box>
|
||||
<Stack direction="row" align="center" justify="between" py={2}>
|
||||
<Text size="sm" color="text-gray-400">Deleted Users</Text>
|
||||
<Text weight="bold" color="text-error-red">{viewData.stats.deletedUsers}</Text>
|
||||
</Stack>
|
||||
</Box>
|
||||
<Box borderTop borderColor="border-gray" opacity={0.3} />
|
||||
<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="text-primary-blue">{viewData.stats.newUsersToday}</Text>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Stack>
|
||||
</Card>
|
||||
<SharedGrid cols={{ base: 1, md: 2 }} gap={6}>
|
||||
{/* System Health & Status */}
|
||||
<SharedCard p={6}>
|
||||
<SharedStack 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>
|
||||
}
|
||||
/>
|
||||
|
||||
<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>
|
||||
|
||||
{/* Quick Operations */}
|
||||
<Card p={6}>
|
||||
<Stack gap={6}>
|
||||
<AdminSectionHeader title="Quick Operations" />
|
||||
<Grid cols={1} gap={3}>
|
||||
<QuickActionLink href={routes.admin.users} variant="blue">
|
||||
<Stack direction="row" align="center" justify="between" fullWidth>
|
||||
<Text size="sm" weight="bold">User Management</Text>
|
||||
<Icon icon={ArrowRight} size={4} />
|
||||
</Stack>
|
||||
</QuickActionLink>
|
||||
<QuickActionLink href="/admin" variant="purple">
|
||||
<Stack direction="row" align="center" justify="between" fullWidth>
|
||||
<Text size="sm" weight="bold">Security & Roles</Text>
|
||||
<Icon icon={ArrowRight} size={4} />
|
||||
</Stack>
|
||||
</QuickActionLink>
|
||||
<QuickActionLink href="/admin" variant="orange">
|
||||
<Stack direction="row" align="center" justify="between" fullWidth>
|
||||
<Text size="sm" weight="bold">System Audit Logs</Text>
|
||||
<Icon icon={ArrowRight} size={4} />
|
||||
</Stack>
|
||||
</QuickActionLink>
|
||||
</Grid>
|
||||
</Stack>
|
||||
</Card>
|
||||
</Grid>
|
||||
{/* Quick Operations */}
|
||||
<SharedCard p={6}>
|
||||
<SharedStack gap={6}>
|
||||
<AdminSectionHeader title="Quick Operations" />
|
||||
<SharedGrid cols={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>
|
||||
|
||||
<AdminDangerZonePanel
|
||||
title="System Maintenance"
|
||||
description="Perform destructive system-wide operations. Use with extreme caution."
|
||||
>
|
||||
<Button variant="danger" size="sm">
|
||||
Enter Maintenance Mode
|
||||
</Button>
|
||||
</AdminDangerZonePanel>
|
||||
</Stack>
|
||||
</Container>
|
||||
<AdminDangerZonePanel
|
||||
title="System Maintenance"
|
||||
description="Perform destructive system-wide operations. Use with extreme caution."
|
||||
>
|
||||
<SharedButton variant="danger" size="sm">
|
||||
Enter Maintenance Mode
|
||||
</SharedButton>
|
||||
</AdminDangerZonePanel>
|
||||
</SharedStack>
|
||||
</SharedBox>
|
||||
</SharedContainer>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user