Files
YANPM/apps/frontend/app/components/home/TablePlaceholder.tsx

28 lines
809 B
TypeScript

import React from 'react';
import { Flex, Text, Button, Separator, Box, Badge } from '@radix-ui/themes';
export default function TablePlaceholder() {
return (
<Flex direction="column" gap="3" p="4">
<Flex justify="between" align="center">
<Text weight="bold">Proxy Hosts</Text>
<Button size="1">Add Host</Button>
</Flex>
<Separator size="4" />
{[1, 2, 3].map((i) => (
<Flex key={i} justify="between" align="center">
<Box>
<Text size="2" weight="bold" as="div">
{`host-${i}.example.com`}
</Text>
<Text size="1" color="gray">
{`http://10.0.0.${i}:8080`}
</Text>
</Box>
<Badge color="green">Online</Badge>
</Flex>
))}
</Flex>
);
}