Sanitized mirror from private repository - 2026-04-04 12:42:10 UTC

dashboard/ui/components/host-card.tsx

@@ -0,0 +1,43 @@
+import { Card, CardContent } from "@/components/ui/card";
+import { StatusBadge } from "./status-badge";
+
+const hostDescriptions: Record<string, string> = {
+  atlantis: "NAS \u00b7 media stack",
+  calypso: "DNS \u00b7 SSO \u00b7 Headscale",
+  olares: "K3s \u00b7 RTX 5090",
+  nuc: "lightweight svcs",
+  rpi5: "Uptime Kuma",
+};
+
+interface HostCardProps {
+  name: string;
+  running: number;
+  total: number;
+  error?: boolean;
+}
+
+export function HostCard({ name, running, total, error }: HostCardProps) {
+  return (
+    <Card>
+      <CardContent className="pt-3 pb-3 px-4">
+        <div className="flex items-center justify-between mb-1">
+          <span className="text-sm font-medium text-foreground capitalize">
+            {name}
+          </span>
+          <StatusBadge
+            color={error ? "red" : running > 0 ? "green" : "amber"}
+            label={error ? "error" : "online"}
+          />
+        </div>
+        <p className="text-xs text-muted-foreground">
+          {running}/{total} containers
+        </p>
+        {hostDescriptions[name] && (
+          <p className="text-[10px] text-muted-foreground mt-0.5">
+            {hostDescriptions[name]}
+          </p>
+        )}
+      </CardContent>
+    </Card>
+  );
+}