| 1 |
const STATUS_STYLES = { |
| 2 |
active: { dot: '#16a34a', text: '#374151' }, |
| 3 |
expired: { dot: '#9ca3af', text: '#6b7280' }, |
| 4 |
deleted: { dot: '#ef4444', text: '#374151' }, |
| 5 |
}; |
| 6 |
|
| 7 |
const StatusBadge = ({ status }) => { |
| 8 |
let style = STATUS_STYLES[status] || { dot: '#d1d5db', text: '#6b7280' }; |
| 9 |
|
| 10 |
return ( |
| 11 |
<span |
| 12 |
className="disco:inline-flex disco:items-center disco:gap-1.5 disco:text-xs" |
| 13 |
style={{ color: style.text }} |
| 14 |
> |
| 15 |
<span |
| 16 |
className="disco:size-[6px] disco:rounded-full disco:shrink-0" |
| 17 |
style={{ backgroundColor: style.dot }} |
| 18 |
/> |
| 19 |
{status} |
| 20 |
</span> |
| 21 |
); |
| 22 |
}; |
| 23 |
|
| 24 |
export default StatusBadge; |
| 25 |
|
