Clarify UI status and remove noisy live regions
This commit is contained in:
+17
-3
@@ -1,7 +1,20 @@
|
||||
export type StatusTone = 'neutral' | 'online' | 'warning' | 'danger' | 'info';
|
||||
export type StatusShape = 'hollow' | 'circle' | 'triangle' | 'square' | 'ring';
|
||||
export interface StatusPresentation {
|
||||
label: string;
|
||||
tone: StatusTone;
|
||||
shape: StatusShape;
|
||||
}
|
||||
|
||||
/** A second visual cue keeps state readable without relying on color. */
|
||||
export const statusShapes: Record<StatusTone, StatusShape> = {
|
||||
neutral: 'hollow', online: 'circle', warning: 'triangle', danger: 'square', info: 'ring'
|
||||
};
|
||||
|
||||
const states: Record<string, [string, StatusTone]> = {
|
||||
provisioning: ['Provisioning', 'info'],
|
||||
online: ['Online', 'online'], offline: ['Offline', 'danger'], stale: ['Report outdated', 'warning'], starting: ['Starting', 'info'],
|
||||
online: ['Online', 'online'], offline: ['Offline', 'danger'], stale: ['Not responding', 'warning'], starting: ['Starting', 'info'],
|
||||
'host-offline': ['Host offline', 'danger'], 'not-responding': ['Not responding', 'warning'], stopped: ['Stopped', 'neutral'], unknown: ['Unknown', 'neutral'],
|
||||
queued: ['Queued', 'neutral'], pending: ['Queued for restart', 'neutral'], running: ['In progress', 'info'], active: ['In progress', 'info'],
|
||||
deploying: ['Installing files', 'info'], restarting: ['Restarting', 'info'],
|
||||
observing: ['Collecting test evidence', 'info'], 'rolling-back': ['Rolling back', 'info'],
|
||||
@@ -15,7 +28,8 @@ const states: Record<string, [string, StatusTone]> = {
|
||||
manual: ['Manual action needed', 'warning'], paused: ['Paused', 'warning'], inconclusive: ['Missing evidence', 'warning'],
|
||||
untested: ['Needs testing', 'neutral'], testing: ['Beta active', 'info'], empty: ['No versions', 'neutral'], attention: ['Needs attention', 'warning']
|
||||
};
|
||||
export function statusPresentation(state: string): { label: string; tone: StatusTone } {
|
||||
export function statusPresentation(state: string): StatusPresentation {
|
||||
const result = states[state];
|
||||
return result ? { label: result[0], tone: result[1] } : { label: (state.charAt(0).toUpperCase() + state.slice(1)).replaceAll('-', ' '), tone: 'neutral' };
|
||||
const [label, tone] = result ?? [(state.charAt(0).toUpperCase() + state.slice(1)).replaceAll('-', ' ') || 'Unknown', 'neutral'];
|
||||
return { label, tone, shape: statusShapes[tone] };
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user