UI for systemd srv

2026-08-31 14:29:04 +05:00
parent 20e1d5a726
commit 202ab22530
3 changed files with 101 additions and 12 deletions
@@ -0,0 +1,78 @@
+import { useState } from "preact/hooks";
+import { createClient } from "@connectrpc/connect";
+import { createConnectTransport } from "@connectrpc/connect-web";
+import { Container, Server } from "lucide-preact";
+import type { Service } from "../gen/homelab/v1/homelab_pb";
+import { HomelabService, ServiceKind, ServiceOp } from "../gen/homelab/v1/homelab_pb";
+
+const client = createClient(HomelabService, createConnectTransport({ baseUrl: "" }));
+
+/** Бейдж статуса: system d — active/failed/выключен (not-found = намеренно disabled, не ошибка), docker — агрегат проекта. */
+function badge(s: Service) {
+  if (s.error) return <span class="badge badge-error badge-sm" title={s.error}>ошибка</span>;
+  if (s.kind === ServiceKind.DOCKER) {
+    if (s.state === "active") return <span class="badge badge-success badge-sm">работает {s.substate}</span>;
+    if (s.state === "partial") return <span class="badge badge-warning badge-sm">частично {s.substate}</span>;
+    return <span class="badge badge-ghost badge-sm">остановлен</span>;
+  }
+  if (s.loadState === "not-found") return <span class="badge badge-ghost badge-sm">выключен</span>;
+  if (s.state === "active") return <span class="badge badge-success badge-sm">{s.substate || "активен"}</span>;
+  if (s.state === "failed") return <span class="badge badge-error badge-sm">сбой</span>;
+  return <span class="badge badge-ghost badge-sm">остановлен</span>;
+}
+
+/** Карточка сервиса: systemd-юнит или docker-проект, start/stop/restart через ServiceAction. */
+export function ServiceCard({ s, refresh }: { s: Service; refresh: () => void }) {
+  const [busy, setBusy] = useState(false);
+  const [error, setError] = useState("");
+
+  const act = async (op: ServiceOp) => {
+    setBusy(true);
+    setError("");
+    try {
+      await client.serviceAction({ name: s.name, kind: s.kind, op });
+      refresh(); // не ждём 3s поллинга
+    } catch (e) {
+      setError(String(e).replace(/^.*real error: /, ""));
+    } finally {
+      setBusy(false);
+    }
+  };
+
+  const disabled = s.kind === ServiceKind.SYSTEMD && s.loadState === "not-found";
+  const btn = (op: ServiceOp, label: string, title?: string) => (
+    <button
+      class="btn btn-xs btn-outline"
+      disabled={busy || disabled}
+      title={title}
+      onClick={() => act(op)}
+    >
+      {label}
+    </button>
+  );
+
+  return (
+    <div class="card bg-base-200 shadow">
+      <div class="card-body p-4 gap-2">
+        <div class="flex items-center gap-2">
+          {s.kind === ServiceKind.DOCKER ? (
+            <Container size={14} class="text-primary shrink-0" />
+          ) : (
+            <Server size={14} class="text-primary shrink-0" />
+          )}
+          <span class="font-medium text-sm flex-1 truncate">{s.name}</span>
+          {badge(s)}
+        </div>
+        {error && <div role="alert" class="alert alert-error text-sm py-2">{error}</div>}
+        <div class="flex flex-wrap gap-2 items-center">
+          {btn(ServiceOp.START, "start")}
+          {btn(ServiceOp.STOP, "stop", "docker stop: контейнер не поднимется при ребуте (unless-stopped)")}
+          {btn(ServiceOp.RESTART, "restart")}
+        </div>
+        {s.containers.length > 0 && (
+          <p class="text-xs text-base-content/50 font-mono break-all">{s.containers.join(", ")}</p>
+        )}
+      </div>
+    </div>
+  );
+}