37 lines
1.1 KiB
TypeScript
37 lines
1.1 KiB
TypeScript
import React from 'react';
|
|
import { Box } from './Box';
|
|
import { Stack } from './Stack';
|
|
import { Text } from './Text';
|
|
|
|
interface SponsorActivityItemProps {
|
|
message: string;
|
|
time: string;
|
|
typeColor: string;
|
|
formattedImpressions?: string | null;
|
|
}
|
|
|
|
export function SponsorActivityItem({
|
|
message,
|
|
time,
|
|
typeColor,
|
|
formattedImpressions,
|
|
}: SponsorActivityItemProps) {
|
|
return (
|
|
<Stack direction="row" align="start" gap={3} py={3} borderBottom={true} borderColor="border-charcoal-outline/50">
|
|
<Box width="2" height="2" rounded="full" mt={2} className={typeColor} flexShrink={0} />
|
|
<Box flexGrow={1} minWidth="0">
|
|
<Text size="sm" color="text-white" block truncate>{message}</Text>
|
|
<Stack direction="row" align="center" gap={2} mt={1}>
|
|
<Text size="xs" color="text-gray-500">{time}</Text>
|
|
{formattedImpressions && (
|
|
<>
|
|
<Text size="xs" color="text-gray-600">•</Text>
|
|
<Text size="xs" color="text-gray-400">{formattedImpressions} views</Text>
|
|
</>
|
|
)}
|
|
</Stack>
|
|
</Box>
|
|
</Stack>
|
|
);
|
|
}
|