Info modal + proto

web/src/App.tsx

@@ -94,7 +94,11 @@ export function App() {
         </div>
       </div>
 
-      <div class="flex-1 w-full max-w-md mx-auto px-4 pb-24 md:pb-6 pt-[env(safe-area-inset-top)]">
+      <div
+        class={`flex-1 w-full mx-auto px-4 pb-24 md:pb-6 pt-[env(safe-area-inset-top)] ${
+          category === "services" ? "max-w-5xl" : "max-w-md"
+        }`}
+      >
         {category === "links" && <LinkList links={content.links} />}
         {category === "monitor" && (
           <div class="flex flex-col gap-3 mt-4">
@@ -103,7 +107,7 @@ export function App() {
         )}
         {category === "exec" && content.exec.map((it) => <ScriptCard s={it} />)}
         {category === "services" && (
-          <div class="flex flex-col gap-3 mt-4">
+          <div class="grid gap-3 mt-4 md:grid-cols-2 lg:grid-cols-3">
             {content.services.map((s) => <ServiceCard s={s} refresh={refresh} />)}
           </div>
         )}

web/src/components/ServiceCard.tsx

@@ -1,13 +1,13 @@
 import { useState } from "preact/hooks";
 import { createClient } from "@connectrpc/connect";
 import { createConnectTransport } from "@connectrpc/connect-web";
-import { Container, Server } from "lucide-preact";
+import { Container, Info, Server, X } 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 — агрегат проекта. */
+/** Бейдж статуса: systemd — 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) {
@@ -21,10 +21,29 @@ function badge(s: Service) {
   return <span class="badge badge-ghost badge-sm">остановлен</span>;
 }
 
-/** Карточка сервиса: systemd-юнит или docker-проект, start/stop/restart через ServiceAction. */
+/** Кнопки контроля; вынесены, чтобы переиспользовать на карточке и в модалке. */
+function Controls({ s, onAct, busy }: { s: Service; onAct: (op: ServiceOp) => void; busy: boolean }) {
+  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={() => onAct(op)}>
+      {label}
+    </button>
+  );
+  return (
+    <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>
+  );
+}
+
+/** Карточка сервиса: systemd-юнит или docker-проект, start/stop/restart через ServiceAction, info — статус-вывод в модалке. */
 export function ServiceCard({ s, refresh }: { s: Service; refresh: () => void }) {
   const [busy, setBusy] = useState(false);
   const [error, setError] = useState("");
+  const [info, setInfo] = useState<string | null>(null);
+  const [infoBusy, setInfoBusy] = useState(false);
 
   const act = async (op: ServiceOp) => {
     setBusy(true);
@@ -32,6 +51,10 @@ export function ServiceCard({ s, refresh }: { s: Service; refresh: () => void })
     try {
       await client.serviceAction({ name: s.name, kind: s.kind, op });
       refresh(); // не ждём 3s поллинга
+      if (info !== null) {
+        const r = await client.serviceInfo({ name: s.name, kind: s.kind });
+        setInfo(r.output);
+      }
     } catch (e) {
       setError(String(e).replace(/^.*real error: /, ""));
     } finally {
@@ -39,40 +62,69 @@ export function ServiceCard({ s, refresh }: { s: Service; refresh: () => void })
     }
   };
 
-  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>
-  );
+  const openInfo = async () => {
+    setInfoBusy(true);
+    setError("");
+    try {
+      setInfo((await client.serviceInfo({ name: s.name, kind: s.kind })).output);
+    } catch (e) {
+      setError(String(e).replace(/^.*real error: /, ""));
+    } finally {
+      setInfoBusy(false);
+    }
+  };
+
+  const kindIcon =
+    s.kind === ServiceKind.DOCKER ? (
+      <Container size={14} class="text-info shrink-0" />
+    ) : (
+      <Server size={14} class="text-primary shrink-0" />
+    );
 
   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" />
-          )}
+          {kindIcon}
           <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")}
+          <Controls s={s} onAct={act} busy={busy} />
+          <button
+            class="btn btn-xs btn-ghost btn-square ml-auto"
+            title="status"
+            disabled={infoBusy}
+            onClick={openInfo}
+          >
+            <Info size={14} />
+          </button>
         </div>
         {s.containers.length > 0 && (
           <p class="text-xs text-base-content/50 font-mono break-all">{s.containers.join(", ")}</p>
         )}
       </div>
+
+      {info !== null && (
+        <div class="modal modal-open">
+          <div class="modal-box max-w-2xl">
+            <button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2" onClick={() => setInfo(null)}>
+              <X size={16} />
+            </button>
+            <h3 class="font-bold text-lg flex items-center gap-2">
+              {kindIcon} {s.name}
+            </h3>
+            <div class="mt-3">
+              <Controls s={s} onAct={act} busy={busy} />
+            </div>
+            <pre class="bg-base-300 rounded-box p-3 mt-3 text-xs whitespace-pre-wrap overflow-x-auto">
+              {infoBusy ? "…" : info}
+            </pre>
+          </div>
+          <div class="modal-backdrop" onClick={() => setInfo(null)} />
+        </div>
+      )}
     </div>
   );
 }

web/src/gen/homelab/v1/homelab_pb.ts

@@ -10,7 +10,7 @@ import type { Message } from "@bufbuild/protobuf";
  * Describes the file homelab/v1/homelab.proto.
  */
 export const file_homelab_v1_homelab: GenFile = /*@__PURE__*/
-  fileDesc("Chhob21lbGFiL3YxL2hvbWVsYWIucHJvdG8SCmhvbWVsYWIudjEiUgoESXRlbRIMCgRuYW1lGAEgASgJEgwKBGRhdGEYAiABKAkSDQoFdmFsdWUYAyABKAkSDAoEYXJncxgEIAEoBRIRCglhcmdfdHlwZXMYBSADKAkiIQoETGluaxIMCgRuYW1lGAEgASgJEgsKA3VybBgCIAEoCSIUChJMaXN0Q29udGVudFJlcXVlc3QioQEKE0xpc3RDb250ZW50UmVzcG9uc2USHwoFbGlua3MYASADKAsyEC5ob21lbGFiLnYxLkxpbmsSIgoIbW9uaXRvcnMYAiADKAsyEC5ob21lbGFiLnYxLkl0ZW0SHgoEZXhlYxgDIAMoCzIQLmhvbWVsYWIudjEuSXRlbRIlCghzZXJ2aWNlcxgEIAMoCzITLmhvbWVsYWIudjEuU2VydmljZSIlCgdEb2NNZXRhEgwKBG5hbWUYASABKAkSDAoEaGFzaBgCIAEoCSIRCg9MaXN0RG9jc1JlcXVlc3QiNQoQTGlzdERvY3NSZXNwb25zZRIhCgRkb2NzGAEgAygLMhMuaG9tZWxhYi52MS5Eb2NNZXRhIh0KDUdldERvY1JlcXVlc3QSDAoEbmFtZRgBIAEoCSIhCg5HZXREb2NSZXNwb25zZRIPCgdjb250ZW50GAEgASgJIi8KDlNhdmVEb2NSZXF1ZXN0EgwKBG5hbWUYASABKAkSDwoHY29udGVudBgCIAEoCSIfCg9TYXZlRG9jUmVzcG9uc2USDAoEaGFzaBgBIAEoCSKvAQoHU2VydmljZRIlCgRraW5kGAEgASgOMhcuaG9tZWxhYi52MS5TZXJ2aWNlS2luZBIMCgRuYW1lGAIgASgJEg0KBXN0YXRlGAMgASgJEhAKCHN1YnN0YXRlGAQgASgJEhIKCmxvYWRfc3RhdGUYBSABKAkSFwoPdW5pdF9maWxlX3N0YXRlGAYgASgJEhIKCmNvbnRhaW5lcnMYByADKAkSDQoFZXJyb3IYCCABKAkibgoUU2VydmljZUFjdGlvblJlcXVlc3QSDAoEbmFtZRgBIAEoCRIlCgRraW5kGAIgASgOMhcuaG9tZWxhYi52MS5TZXJ2aWNlS2luZBIhCgJvcBgDIAEoDjIVLmhvbWVsYWIudjEuU2VydmljZU9wIicKFVNlcnZpY2VBY3Rpb25SZXNwb25zZRIOCgZvdXRwdXQYASABKAkiLgoQUnVuU2NyaXB0UmVxdWVzdBIMCgRuYW1lGAEgASgJEgwKBGFyZ3MYAiADKAkiIwoRUnVuU2NyaXB0UmVzcG9uc2USDgoGb3V0cHV0GAEgASgJKiYKC1NlcnZpY2VLaW5kEgsKB1NZU1RFTUQQABIKCgZET0NLRVIQASotCglTZXJ2aWNlT3ASCQoFU1RBUlQQABIICgRTVE9QEAESCwoHUkVTVEFSVBACMswDCg5Ib21lbGFiU2VydmljZRJOCgtMaXN0Q29udGVudBIeLmhvbWVsYWIudjEuTGlzdENvbnRlbnRSZXF1ZXN0Gh8uaG9tZWxhYi52MS5MaXN0Q29udGVudFJlc3BvbnNlEkUKCExpc3REb2NzEhsuaG9tZWxhYi52MS5MaXN0RG9jc1JlcXVlc3QaHC5ob21lbGFiLnYxLkxpc3REb2NzUmVzcG9uc2USPwoGR2V0RG9jEhkuaG9tZWxhYi52MS5HZXREb2NSZXF1ZXN0GhouaG9tZWxhYi52MS5HZXREb2NSZXNwb25zZRJCCgdTYXZlRG9jEhouaG9tZWxhYi52MS5TYXZlRG9jUmVxdWVzdBobLmhvbWVsYWIudjEuU2F2ZURvY1Jlc3BvbnNlElQKDVNlcnZpY2VBY3Rpb24SIC5ob21lbGFiLnYxLlNlcnZpY2VBY3Rpb25SZXF1ZXN0GiEuaG9tZWxhYi52MS5TZXJ2aWNlQWN0aW9uUmVzcG9uc2USSAoJUnVuU2NyaXB0EhwuaG9tZWxhYi52MS5SdW5TY3JpcHRSZXF1ZXN0Gh0uaG9tZWxhYi52MS5SdW5TY3JpcHRSZXNwb25zZUIqWihwd2EtaG9tZWxhYi1tb24vZ2VuL2hvbWVsYWIvdjE7aG9tZWxhYnYxYgZwcm90bzM");
+  fileDesc("Chhob21lbGFiL3YxL2hvbWVsYWIucHJvdG8SCmhvbWVsYWIudjEiUgoESXRlbRIMCgRuYW1lGAEgASgJEgwKBGRhdGEYAiABKAkSDQoFdmFsdWUYAyABKAkSDAoEYXJncxgEIAEoBRIRCglhcmdfdHlwZXMYBSADKAkiIQoETGluaxIMCgRuYW1lGAEgASgJEgsKA3VybBgCIAEoCSIUChJMaXN0Q29udGVudFJlcXVlc3QioQEKE0xpc3RDb250ZW50UmVzcG9uc2USHwoFbGlua3MYASADKAsyEC5ob21lbGFiLnYxLkxpbmsSIgoIbW9uaXRvcnMYAiADKAsyEC5ob21lbGFiLnYxLkl0ZW0SHgoEZXhlYxgDIAMoCzIQLmhvbWVsYWIudjEuSXRlbRIlCghzZXJ2aWNlcxgEIAMoCzITLmhvbWVsYWIudjEuU2VydmljZSIlCgdEb2NNZXRhEgwKBG5hbWUYASABKAkSDAoEaGFzaBgCIAEoCSIRCg9MaXN0RG9jc1JlcXVlc3QiNQoQTGlzdERvY3NSZXNwb25zZRIhCgRkb2NzGAEgAygLMhMuaG9tZWxhYi52MS5Eb2NNZXRhIh0KDUdldERvY1JlcXVlc3QSDAoEbmFtZRgBIAEoCSIhCg5HZXREb2NSZXNwb25zZRIPCgdjb250ZW50GAEgASgJIi8KDlNhdmVEb2NSZXF1ZXN0EgwKBG5hbWUYASABKAkSDwoHY29udGVudBgCIAEoCSIfCg9TYXZlRG9jUmVzcG9uc2USDAoEaGFzaBgBIAEoCSKvAQoHU2VydmljZRIlCgRraW5kGAEgASgOMhcuaG9tZWxhYi52MS5TZXJ2aWNlS2luZBIMCgRuYW1lGAIgASgJEg0KBXN0YXRlGAMgASgJEhAKCHN1YnN0YXRlGAQgASgJEhIKCmxvYWRfc3RhdGUYBSABKAkSFwoPdW5pdF9maWxlX3N0YXRlGAYgASgJEhIKCmNvbnRhaW5lcnMYByADKAkSDQoFZXJyb3IYCCABKAkibgoUU2VydmljZUFjdGlvblJlcXVlc3QSDAoEbmFtZRgBIAEoCRIlCgRraW5kGAIgASgOMhcuaG9tZWxhYi52MS5TZXJ2aWNlS2luZBIhCgJvcBgDIAEoDjIVLmhvbWVsYWIudjEuU2VydmljZU9wIicKFVNlcnZpY2VBY3Rpb25SZXNwb25zZRIOCgZvdXRwdXQYASABKAkiSQoSU2VydmljZUluZm9SZXF1ZXN0EgwKBG5hbWUYASABKAkSJQoEa2luZBgCIAEoDjIXLmhvbWVsYWIudjEuU2VydmljZUtpbmQiJQoTU2VydmljZUluZm9SZXNwb25zZRIOCgZvdXRwdXQYASABKAkiLgoQUnVuU2NyaXB0UmVxdWVzdBIMCgRuYW1lGAEgASgJEgwKBGFyZ3MYAiADKAkiIwoRUnVuU2NyaXB0UmVzcG9uc2USDgoGb3V0cHV0GAEgASgJKiYKC1NlcnZpY2VLaW5kEgsKB1NZU1RFTUQQABIKCgZET0NLRVIQASotCglTZXJ2aWNlT3ASCQoFU1RBUlQQABIICgRTVE9QEAESCwoHUkVTVEFSVBACMpwECg5Ib21lbGFiU2VydmljZRJOCgtMaXN0Q29udGVudBIeLmhvbWVsYWIudjEuTGlzdENvbnRlbnRSZXF1ZXN0Gh8uaG9tZWxhYi52MS5MaXN0Q29udGVudFJlc3BvbnNlEkUKCExpc3REb2NzEhsuaG9tZWxhYi52MS5MaXN0RG9jc1JlcXVlc3QaHC5ob21lbGFiLnYxLkxpc3REb2NzUmVzcG9uc2USPwoGR2V0RG9jEhkuaG9tZWxhYi52MS5HZXREb2NSZXF1ZXN0GhouaG9tZWxhYi52MS5HZXREb2NSZXNwb25zZRJCCgdTYXZlRG9jEhouaG9tZWxhYi52MS5TYXZlRG9jUmVxdWVzdBobLmhvbWVsYWIudjEuU2F2ZURvY1Jlc3BvbnNlElQKDVNlcnZpY2VBY3Rpb24SIC5ob21lbGFiLnYxLlNlcnZpY2VBY3Rpb25SZXF1ZXN0GiEuaG9tZWxhYi52MS5TZXJ2aWNlQWN0aW9uUmVzcG9uc2USTgoLU2VydmljZUluZm8SHi5ob21lbGFiLnYxLlNlcnZpY2VJbmZvUmVxdWVzdBofLmhvbWVsYWIudjEuU2VydmljZUluZm9SZXNwb25zZRJICglSdW5TY3JpcHQSHC5ob21lbGFiLnYxLlJ1blNjcmlwdFJlcXVlc3QaHS5ob21lbGFiLnYxLlJ1blNjcmlwdFJlc3BvbnNlQipaKHB3YS1ob21lbGFiLW1vbi9nZW4vaG9tZWxhYi92MTtob21lbGFidjFiBnByb3RvMw");
 
 /**
  * @generated from message homelab.v1.Item
@@ -361,6 +361,45 @@ export type ServiceActionResponse = Message<"homelab.v1.ServiceActionResponse">
 export const ServiceActionResponseSchema: GenMessage<ServiceActionResponse> = /*@__PURE__*/
   messageDesc(file_homelab_v1_homelab, 13);
 
+/**
+ * @generated from message homelab.v1.ServiceInfoRequest
+ */
+export type ServiceInfoRequest = Message<"homelab.v1.ServiceInfoRequest"> & {
+  /**
+   * @generated from field: string name = 1;
+   */
+  name: string;
+
+  /**
+   * @generated from field: homelab.v1.ServiceKind kind = 2;
+   */
+  kind: ServiceKind;
+};
+
+/**
+ * Describes the message homelab.v1.ServiceInfoRequest.
+ * Use `create(ServiceInfoRequestSchema)` to create a new message.
+ */
+export const ServiceInfoRequestSchema: GenMessage<ServiceInfoRequest> = /*@__PURE__*/
+  messageDesc(file_homelab_v1_homelab, 14);
+
+/**
+ * @generated from message homelab.v1.ServiceInfoResponse
+ */
+export type ServiceInfoResponse = Message<"homelab.v1.ServiceInfoResponse"> & {
+  /**
+   * @generated from field: string output = 1;
+   */
+  output: string;
+};
+
+/**
+ * Describes the message homelab.v1.ServiceInfoResponse.
+ * Use `create(ServiceInfoResponseSchema)` to create a new message.
+ */
+export const ServiceInfoResponseSchema: GenMessage<ServiceInfoResponse> = /*@__PURE__*/
+  messageDesc(file_homelab_v1_homelab, 15);
+
 /**
  * @generated from message homelab.v1.RunScriptRequest
  */
@@ -381,7 +420,7 @@ export type RunScriptRequest = Message<"homelab.v1.RunScriptRequest"> & {
  * Use `create(RunScriptRequestSchema)` to create a new message.
  */
 export const RunScriptRequestSchema: GenMessage<RunScriptRequest> = /*@__PURE__*/
-  messageDesc(file_homelab_v1_homelab, 14);
+  messageDesc(file_homelab_v1_homelab, 16);
 
 /**
  * @generated from message homelab.v1.RunScriptResponse
@@ -398,7 +437,7 @@ export type RunScriptResponse = Message<"homelab.v1.RunScriptResponse"> & {
  * Use `create(RunScriptResponseSchema)` to create a new message.
  */
 export const RunScriptResponseSchema: GenMessage<RunScriptResponse> = /*@__PURE__*/
-  messageDesc(file_homelab_v1_homelab, 15);
+  messageDesc(file_homelab_v1_homelab, 17);
 
 /**
  * One card in the Services view: a systemd user unit or a docker compose project.
@@ -493,6 +532,14 @@ export const HomelabService: GenService<{
     input: typeof ServiceActionRequestSchema;
     output: typeof ServiceActionResponseSchema;
   },
+  /**
+   * @generated from rpc homelab.v1.HomelabService.ServiceInfo
+   */
+  serviceInfo: {
+    methodKind: "unary";
+    input: typeof ServiceInfoRequestSchema;
+    output: typeof ServiceInfoResponseSchema;
+  },
   /**
    * @generated from rpc homelab.v1.HomelabService.RunScript
    */