hub v0.1.6: Handle disabled reporting status, storage labels, date in history

hub/internal/web/server.go

@@ -140,7 +140,9 @@ func (s *Server) handleDashboard(w http.ResponseWriter, r *http.Request) {
 		dc := dashboardCustomer{CustomerSummary: c}
 
 		// Determine overall status
-		if c.TimeSinceReport > time.Hour {
+		if c.HealthStatus == "disabled" {
+			dc.OverallStatus = "disabled"
+		} else if c.TimeSinceReport > time.Hour {
 			dc.OverallStatus = "down"
 		} else if c.TimeSinceReport > 30*time.Minute || c.HealthStatus == "warn" {
 			dc.OverallStatus = "warn"
@@ -199,7 +201,9 @@ func (s *Server) handleCustomerDetail(w http.ResponseWriter, r *http.Request, cu
 	}
 
 	overallStatus := "ok"
-	if customer.TimeSinceReport > time.Hour {
+	if customer.HealthStatus == "disabled" {
+		overallStatus = "disabled"
+	} else if customer.TimeSinceReport > time.Hour {
 		overallStatus = "down"
 	} else if customer.TimeSinceReport > 30*time.Minute || customer.HealthStatus == "warn" {
 		overallStatus = "warn"
@@ -259,6 +263,8 @@ func statusColor(status string) string {
 		return "#facc15" // yellow
 	case "down", "fail":
 		return "#f87171" // red
+	case "disabled":
+		return "#94a3b8" // gray
 	default:
 		return "#94a3b8" // gray
 	}

hub/internal/web/templates/customer.html

@@ -62,7 +62,7 @@
             <div class="metrics-grid">
                 {{range .}}
                 <div class="metric">
-                    <span class="metric-label">{{index . "mount"}}</span>
+                    <span class="metric-label">{{with index . "label"}}{{.}}{{else}}{{index . "mount"}}{{end}}</span>
                     <span class="metric-value">{{printf "%.0f" (index . "percent")}}%</span>
                     <div class="bar"><div class="bar-fill" style="width: {{printf "%.0f" (index . "percent")}}%"></div></div>
                     <span class="metric-detail">{{printf "%.1f" (index . "used_gb")}} / {{printf "%.1f" (index . "total_gb")}} GB</span>
@@ -130,6 +130,10 @@
         <!-- Health -->
         <section class="card">
             <h2>Health</h2>
+            {{if eq .OverallStatus "disabled"}}
+            <p class="health-status health-status-disabled">Reporting has been disabled on this node</p>
+            <p class="hint">Enable it in the controller's <code>controller.yaml</code>: <code>hub.enabled: true</code></p>
+            {{else}}
             {{with .Report.health}}
             <p class="health-status health-status-{{index . "status"}}">
                 Status: {{index . "status"}}
@@ -153,6 +157,7 @@
             </ul>
             {{end}}
             {{end}}
+            {{end}}
         </section>
 
         <!-- Notifications -->
@@ -213,7 +218,7 @@
                     <tbody>
                         {{range .History}}
                         <tr>
-                            <td>{{.ReceivedAt.Format "15:04:05"}}</td>
+                            <td>{{.ReceivedAt.Format "Jan 02 15:04"}}</td>
                             <td><span class="status-badge status-badge-{{.HealthStatus}}">{{.HealthStatus}}</span></td>
                             <td>{{formatFloat .CPUPercent}}%</td>
                             <td>{{formatFloat .MemoryPercent}}%</td>

hub/internal/web/templates/dashboard.html

@@ -43,7 +43,7 @@
                     </td>
                     <td>
                         <span class="status-badge status-badge-{{.OverallStatus}}">
-                            {{if eq .OverallStatus "ok"}}OK{{else if eq .OverallStatus "warn"}}WARN{{else}}DOWN{{end}}
+                            {{if eq .OverallStatus "ok"}}OK{{else if eq .OverallStatus "warn"}}WARN{{else if eq .OverallStatus "disabled"}}PAUSED{{else}}DOWN{{end}}
                         </span>
                     </td>
                     <td>{{timeAgo .ReceivedAt}}</td>

hub/internal/web/templates/style.css

@@ -124,6 +124,7 @@ header h1 {
 .status-badge-ok { background: rgba(74, 222, 128, 0.15); color: var(--green); }
 .status-badge-warn { background: rgba(250, 204, 21, 0.15); color: var(--yellow); }
 .status-badge-down, .status-badge-fail { background: rgba(248, 113, 113, 0.15); color: var(--red); }
+.status-badge-disabled { background: #475569; color: #e2e8f0; }
 
 /* Cards */
 .card {