forked from cardosofelipe/pragma-stack
Felipe Cardoso
c17fdab3d3
- Refactored JSX elements to improve readability by collapsing multi-line props and attributes into single lines if their length permits. - Improved consistency in component imports by grouping and consolidating them. - No functional changes, purely restructuring for clarity and maintainability.
70 lines
1.4 KiB
TypeScript
70 lines
1.4 KiB
TypeScript
/**
|
|
* Agent Status Indicator
|
|
*
|
|
* Visual indicator for agent status (idle, working, error, etc.)
|
|
*/
|
|
|
|
'use client';
|
|
|
|
import { cn } from '@/lib/utils';
|
|
import type { AgentStatus } from './types';
|
|
|
|
const statusConfig: Record<AgentStatus, { color: string; label: string }> = {
|
|
idle: {
|
|
color: 'bg-yellow-500',
|
|
label: 'Idle',
|
|
},
|
|
working: {
|
|
color: 'bg-green-500 animate-pulse',
|
|
label: 'Working',
|
|
},
|
|
waiting: {
|
|
color: 'bg-blue-500',
|
|
label: 'Waiting',
|
|
},
|
|
paused: {
|
|
color: 'bg-gray-400',
|
|
label: 'Paused',
|
|
},
|
|
terminated: {
|
|
color: 'bg-gray-600',
|
|
label: 'Terminated',
|
|
},
|
|
};
|
|
|
|
interface AgentStatusIndicatorProps {
|
|
status: AgentStatus;
|
|
size?: 'sm' | 'md' | 'lg';
|
|
showLabel?: boolean;
|
|
className?: string;
|
|
}
|
|
|
|
export function AgentStatusIndicator({
|
|
status,
|
|
size = 'sm',
|
|
showLabel = false,
|
|
className,
|
|
}: AgentStatusIndicatorProps) {
|
|
const config = statusConfig[status] || statusConfig.idle;
|
|
|
|
const sizeClasses = {
|
|
sm: 'h-2 w-2',
|
|
md: 'h-3 w-3',
|
|
lg: 'h-4 w-4',
|
|
};
|
|
|
|
return (
|
|
<span
|
|
className={cn('inline-flex items-center gap-1.5', className)}
|
|
role="status"
|
|
aria-label={`Status: ${config.label}`}
|
|
>
|
|
<span
|
|
className={cn('inline-block rounded-full', sizeClasses[size], config.color)}
|
|
aria-hidden="true"
|
|
/>
|
|
{showLabel && <span className="text-xs text-muted-foreground">{config.label}</span>}
|
|
</span>
|
|
);
|
|
}
|