Files
gridpilot.gg/apps/website/components/feed/ActivityFeedItem.tsx
2026-01-15 19:55:46 +01:00

51 lines
993 B
TypeScript

import { ReactNode } from 'react';
import { Box } from '@/ui/Box';
import { Surface } from '@/ui/Surface';
import { Text } from '@/ui/Text';
interface ActivityFeedItemProps {
icon: ReactNode;
content: ReactNode;
timestamp: string;
}
export function ActivityFeedItem({
icon,
content,
timestamp,
}: ActivityFeedItemProps) {
return (
<Box
display="flex"
alignItems="start"
gap={3}
py={3}
borderBottom
style={{ borderColor: 'rgba(38, 38, 38, 0.3)' }}
className="last:border-0"
>
<Surface
variant="muted"
w="8"
h="8"
rounded="full"
display="flex"
center
flexShrink={0}
>
{icon}
</Surface>
<Box style={{ flex: 1, minWidth: 0 }}>
<Text size="sm" leading="relaxed" block>
{content}
</Text>
<Text size="xs" color="text-gray-500" mt={1} block>
{timestamp}
</Text>
</Box>
</Box>
);
}