26 lines
937 B
JavaScript
26 lines
937 B
JavaScript
/**
|
|
* Renders a colored status badge.
|
|
* @param {{ status: string }} props
|
|
* @returns {import('react').ReactNode}
|
|
*/
|
|
export default function StatusBadge({ status }) {
|
|
const colors = {
|
|
running: 'bg-status-green/20 text-status-green border-status-green/30',
|
|
stopped: 'bg-status-red/20 text-status-red border-status-red/30',
|
|
paused: 'bg-status-yellow/20 text-status-yellow border-status-yellow/30',
|
|
};
|
|
const colorClass = colors[status] || 'bg-status-gray/20 text-status-gray border-status-gray/30';
|
|
|
|
return (
|
|
<span className={`inline-flex items-center gap-1 rounded-full border px-2 py-0.5 text-xs font-medium capitalize ${colorClass}`}>
|
|
<span className={`h-1.5 w-1.5 rounded-full ${
|
|
status === 'running' ? 'bg-status-green' :
|
|
status === 'stopped' ? 'bg-status-red' :
|
|
status === 'paused' ? 'bg-status-yellow' :
|
|
'bg-status-gray'
|
|
}`} />
|
|
{status}
|
|
</span>
|
|
);
|
|
}
|