add tests

apps/website/lib/display-objects/HealthComponentDisplay.ts

@@ -0,0 +1,50 @@
+/**
+ * Health Component Display Object
+ *
+ * Provides formatting and display logic for health components.
+ * This display object isolates UI-specific formatting from business logic.
+ */
+
+export class HealthComponentDisplay {
+  static formatStatusLabel(status: 'ok' | 'degraded' | 'error' | 'unknown'): string {
+    const labels: Record<string, string> = {
+      ok: 'Healthy',
+      degraded: 'Degraded',
+      error: 'Error',
+      unknown: 'Unknown',
+    };
+    return labels[status] || 'Unknown';
+  }
+
+  static formatStatusColor(status: 'ok' | 'degraded' | 'error' | 'unknown'): string {
+    const colors: Record<string, string> = {
+      ok: '#10b981', // green-500
+      degraded: '#f59e0b', // amber-500
+      error: '#ef4444', // red-500
+      unknown: '#6b7280', // gray-500
+    };
+    return colors[status] || '#6b7280';
+  }
+
+  static formatStatusIcon(status: 'ok' | 'degraded' | 'error' | 'unknown'): string {
+    const icons: Record<string, string> = {
+      ok: '✓',
+      degraded: '⚠',
+      error: '✕',
+      unknown: '?',
+    };
+    return icons[status] || '?';
+  }
+
+  static formatTimestamp(timestamp: string): string {
+    const date = new Date(timestamp);
+    return date.toLocaleString('en-US', {
+      year: 'numeric',
+      month: 'short',
+      day: 'numeric',
+      hour: '2-digit',
+      minute: '2-digit',
+      second: '2-digit',
+    });
+  }
+}