44 lines
1.1 KiB
TypeScript
44 lines
1.1 KiB
TypeScript
'use client';
|
|
|
|
import { Box } from '@/ui/Box';
|
|
import { Text } from '@/ui/Text';
|
|
|
|
interface ActionStatusBadgeProps {
|
|
status: 'PENDING' | 'COMPLETED' | 'FAILED' | 'IN_PROGRESS';
|
|
}
|
|
|
|
export function ActionStatusBadge({ status }: ActionStatusBadgeProps) {
|
|
const styles = {
|
|
PENDING: { bg: 'bg-amber-500/10', text: 'text-[#FFBE4D]', border: 'border-amber-500/20' },
|
|
COMPLETED: { bg: 'bg-emerald-500/10', text: 'text-emerald-400', border: 'border-emerald-500/20' },
|
|
FAILED: { bg: 'bg-red-500/10', text: 'text-red-400', border: 'border-red-500/30' },
|
|
IN_PROGRESS: { bg: 'bg-blue-500/10', text: 'text-[#198CFF]', border: 'border-blue-500/20' },
|
|
};
|
|
|
|
const config = styles[status];
|
|
|
|
return (
|
|
<Box
|
|
as="span"
|
|
px={2}
|
|
py={0.5}
|
|
rounded="sm"
|
|
bg={config.bg}
|
|
border
|
|
borderColor={config.border}
|
|
display="inline-block"
|
|
>
|
|
<Text
|
|
size="xs"
|
|
weight="bold"
|
|
color={config.text}
|
|
uppercase
|
|
letterSpacing="tight"
|
|
fontSize="10px"
|
|
>
|
|
{status.replace('_', ' ')}
|
|
</Text>
|
|
</Box>
|
|
);
|
|
}
|