From cba3db1508b33666762e5fbda3dba65daff0c31e Mon Sep 17 00:00:00 2001
From: Denozordec <shatskiy.blog@gmail.com>
Date: Thu, 1 Oct 2026 04:11:43 +0700
Subject: [PATCH] =?UTF-8?q?fix(ui):=20=D1=81=D0=BE=D1=85=D1=80=D0=B0=D0=BD?=
 =?UTF-8?q?=D1=8F=D1=82=D1=8C=20=D0=BA=D0=B0=D1=82=D0=B0=D0=BB=D0=BE=D0=B3?=
 =?UTF-8?q?=20=D1=83=D1=81=D1=82=D1=80=D0=BE=D0=B9=D1=81=D1=82=D0=B2=20?=
 =?UTF-8?q?=D0=B4=D0=B8=D0=B0=D0=B3=D0=BD=D0=BE=D1=81=D1=82=D0=B8=D0=BA?=
 =?UTF-8?q?=D0=B8=20=D0=BF=D1=80=D0=B8=20=D0=BE=D1=82=D0=BA=D0=B0=D0=B7?=
 =?UTF-8?q?=D0=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/(main)/probes/page.tsx       | 75 ++++++++++++++------------------
 docs/ux-ui-progress.md           |  9 +++-
 docs/ux-ui-stage-10.md           |  8 ++++
 lib/probe-response.test.ts       |  3 ++
 lib/probe-response.ts            |  7 +++
 tests/e2e/probes-context.spec.ts |  2 +-
 tests/e2e/probes-data.spec.ts    | 20 ++++++++-
 7 files changed, 78 insertions(+), 46 deletions(-)

diff --git a/app/(main)/probes/page.tsx b/app/(main)/probes/page.tsx
index 9b762bb7..c9003651 100644
--- a/app/(main)/probes/page.tsx
+++ b/app/(main)/probes/page.tsx
@@ -20,7 +20,7 @@ import { Input } from "@/components/ui/input"
 import { ServerRailLayout, ServerRailMobileButton } from "@/components/server-rail-layout"
 import { type ServerTileItem } from "@/components/server-tile-rail"
 import { servers, greTunnels, type GreTunnel, type Server } from "@/lib/data"
-import { readProbeOutput } from "@/lib/probe-response"
+import { readProbeOutput, probeServersSchema } from "@/lib/probe-response"
 import { useDataSource } from "@/lib/data-source"
 import {
   PlayIcon, SquareIcon, CopyIcon, Trash2Icon, PlusIcon,
@@ -94,18 +94,6 @@ function parseProbeOutput(text: string): OutputLine[] {
   return text.split("\n").map(t => ({ text: t || " ", kind: inferProbeLineKind(t) }))
 }
 
-interface BackendServerRow {
-  id: number
-  name: string
-  host: string
-  site: string
-  country: string
-  asn: string
-  type: Server["type"]
-  enabled: boolean
-  status?: Server["status"]
-  latency?: number | null
-}
 
 // SpeedProbeApiRow imported from probes-speed-probes-data-grid
 
@@ -589,6 +577,9 @@ function ProbesContent() {
 
   const [liveServers, setLiveServers] = useState<Server[]>([])
   const [liveLoad, setLiveLoad]       = useState<"idle" | "loading" | "error">(() => (isLive ? "loading" : "idle"))
+  const [catalogError, setCatalogError] = useState<string | null>(null)
+  const [catalogRevision, setCatalogRevision] = useState(0)
+  const [catalogReadAt, setCatalogReadAt] = useState<number | null>(null)
   const [greByServer, setGreByServer] = useState<Record<string, GreTunnel[]>>({})
 
   const [tool,       setTool]       = useState<DiagTool>("ping")
@@ -609,36 +600,31 @@ function ProbesContent() {
   const [rosSrcV4, setRosSrcV4] = useState<string | null | undefined>(undefined)
 
   useEffect(() => {
-    if (!isLive) {
-      queueMicrotask(() => setLiveLoad("idle"))
-      return
-    }
-    setLiveLoad("loading")
-    void apiFetch<BackendServerRow[]>("/api/servers")
-      .then(rows => {
-        const mapped: Server[] = rows.map(s => ({
-          id: String(s.id),
-          name: s.name || s.host,
-          host: s.host,
-          model: "—",
-          os: "—",
-          site: s.site,
-          country: s.country || "UN",
-          asn: s.asn,
-          type: s.type,
-          enabled: s.enabled,
-          status: (s.status ?? "offline") as Server["status"],
-          latency: s.latency != null ? Math.round(s.latency) : null,
-          sessions: 0,
-        }))
-        setLiveServers(mapped)
+    if (!isLive) return
+    let cancelled = false
+    const ctrl = new AbortController()
+    queueMicrotask(() => { if (!cancelled) { setLiveLoad("loading"); setCatalogError(null) } })
+    void apiFetch<unknown>("/api/servers", { signal: ctrl.signal })
+      .then(raw => {
+        const result = probeServersSchema.safeParse(raw)
+        if (!result.success) throw new Error("Некорректный ответ API: каталог устройств не подтверждён.")
+        if (cancelled) return
+        setLiveServers(result.data.map(s => ({
+          id: String(s.id), name: s.name || s.host, host: s.host, model: "—", os: "—",
+          site: s.site ?? "", country: s.country ?? "UN", asn: s.asn ?? "", type: s.type,
+          enabled: s.enabled, status: s.status ?? "unknown",
+          latency: s.latency != null ? Math.round(s.latency) : null, sessions: 0,
+        })))
+        setCatalogReadAt(Date.now())
         setLiveLoad("idle")
       })
-      .catch(() => {
-        setLiveServers([])
+      .catch(error => {
+        if (cancelled) return
+        setCatalogError(error instanceof Error ? error.message : "Не удалось прочитать устройства.")
         setLiveLoad("error")
       })
-  }, [isLive, apiFetch])
+    return () => { cancelled = true; ctrl.abort() }
+  }, [isLive, apiFetch, catalogRevision])
 
   const allServers = useMemo(() => {
     if (!isLive) return servers
@@ -921,7 +907,7 @@ function ProbesContent() {
 
   const running = tests.filter(t => t.status === "running")
 
-  if (isLive && liveLoad === "loading") {
+  if (isLive && liveLoad === "loading" && catalogReadAt === null) {
     return (
       <div className="flex flex-col h-full">
         <PageHeader crumbs={[{ label: "Инструменты" }, { label: "Диагностика" }]} />
@@ -946,6 +932,7 @@ function ProbesContent() {
           actions={
             <>
               <ServerRailMobileButton />
+              {isLive && <Button type="button" size="sm" variant="outline" aria-label="Обновить устройства диагностики" disabled={liveLoad === "loading"} onClick={() => setCatalogRevision(n => n + 1)}>Обновить</Button>}
               {running.length > 0
                 ? <Button variant="outline" size="sm" onClick={() => {
                     running.forEach(test => stopTest(test.id))
@@ -961,11 +948,13 @@ function ProbesContent() {
         <div className="flex flex-col gap-4">
 
           {isLive && liveLoad === "error" && (
-            <div className="rounded-lg border border-destructive/30 bg-destructive/10 px-4 py-2.5 text-xs text-destructive flex items-center gap-2">
-              <AlertCircleIcon className="size-3.5 shrink-0" />
-              Бекенд недоступен — переключитесь в режим «Демо» в настройках источника данных или проверьте URL API.
+            <div role="alert" aria-label="Каталог диагностики" className="rounded-lg border border-destructive/30 bg-destructive/10 px-4 py-2.5 text-sm text-destructive">
+              <p>{catalogReadAt === null ? "Устройства пока неизвестны." : "Не удалось обновить устройства. Последний список сохранён; запуск приостановлен."}</p>
+              <p>{catalogError}</p>
             </div>
           )}
+          {isLive && catalogReadAt !== null && <p role="status" className="text-xs text-muted-foreground">Каталог получен: {new Date(catalogReadAt).toLocaleTimeString("ru-RU")}{liveLoad === "loading" ? " · обновляется" : ""}</p>}
+          {isLive && liveLoad === "idle" && allServers.length === 0 && <p role="status">В каталоге нет устройств. Добавьте устройство в разделе «Серверы».</p>}
 
           {isLive && (
             <p className="text-xs text-muted-foreground">
diff --git a/docs/ux-ui-progress.md b/docs/ux-ui-progress.md
index 633b0716..88c612ea 100644
--- a/docs/ux-ui-progress.md
+++ b/docs/ux-ui-progress.md
@@ -26,7 +26,7 @@
 | 7 | Серверы и мониторинг: детали, формы, URL-контекст, права | Завершён в границах локальной приёмки 2026-09-23; внешние ограничения ниже |
 | 8 | Трафик и статистика | Завершён 2026-09-28 в границах локальной приёмки; ограничения в блоке 8.13 |
 | 9 | VPN, Firewall и Filters | Завершён в границах локальной приёмки 2026-09-30; блоки 9.1–9.64, ограничения в 9.64 |
-| 10 | Маршрутизация, диагностика, карта и терминал | В работе: 10.1–10.58; оптимизатор, карта и терминал приняты локально; диагностика /probes в работе |
+| 10 | Маршрутизация, диагностика, карта и терминал | В работе: 10.1–10.59; оптимизатор, карта и терминал приняты локально; диагностика /probes в работе |
 | 11А | Пользователи, контейнеры, сертификаты и резервные копии | Не начат |
 | 11Б | Оповещения, сбор данных, интеграции, релизы и настройки | Не начат |
 | 12 | Итоговая доступность, адаптивность, производительность и регрессия | Не начат |
@@ -36,6 +36,13 @@
 
 
 
+## Блок 10.59 — каталог устройств диагностики (2026-10-01)
+
+- Каталог проверяется по типам id/host/status/enabled/type, уникальности id и конечной неотрицательной latency. Неизвестный status отображается как unknown, не offline. Abort/cleanup запрещают прежний результат после ухода/смены источника.
+- Отказ сохраняет последний список и черновик; ошибка API показана отдельно от пустого каталога. Обновить допускает ручной повтор. Во время обновления/ошибки запуск приостановлен; время получения последнего каталога видимо. Фоновая загрузка не удаляет форму.
+- 12 основных + 4 source E2E, 3 unit, TypeScript и production frontend прошли. Первый прогон новых тестов остановился на пересечении role=alert с Next route announcer; alert каталога именован, повтор 12/12 чистый. Helper/tests проходят lint; исходные ошибки страницы остаются (catalog эффект исправлен, остальные эффекты/расписание ещё не приняты).
+- Далее 10.60: права страницы/запуска должны соответствовать фактическим /api/servers read/write. Затем GRE каталог, URL/device context, backend и адаптивная приёмка. Внутреннее sessions=0 не отображается в диагностике и не является измерением; заменить при общей типизации. Реальная сеть не проверена.
+
 ## Блок 10.58 — достоверный результат диагностики GRE (2026-10-01)
 
 - /probes проверяет строковый output и legacy error; неверный контракт не превращается в пустой успех. Пустой подтверждённый вывод подписан, цель/параметры сохраняются после отказа.
diff --git a/docs/ux-ui-stage-10.md b/docs/ux-ui-stage-10.md
index d760b140..47dde63c 100644
--- a/docs/ux-ui-stage-10.md
+++ b/docs/ux-ui-stage-10.md
@@ -347,3 +347,11 @@ Shared контракт и backend observed исходные значения/д
 - 7 основных и 4 source E2E, 2 unit, TypeScript и production frontend прошли. Новые helper/test файлы проходят lint. Страница сохраняет исходные 8 set-state-in-effect ошибок и 2 предупреждения: сравнение ESLint HEAD/current подтвердило одинаковые counts; это не чистый lint страницы.
 - Далее 10.59: каталог серверов/ошибка/повтор и неизвестный status; затем URL-контекст, права, GRE каталог, backend probes и адаптивная приёмка. Расписание отдельно в 11Б. Реальный RouterOS не проверен.
 
+
+## Блок 10.59 — каталог устройств диагностики (2026-10-01)
+
+- Каталог проверяется по типам id/host/status/enabled/type, уникальности id и конечной неотрицательной latency. Неизвестный status отображается как unknown, не offline. Abort/cleanup запрещают прежний результат после ухода/смены источника.
+- Отказ сохраняет последний список и черновик; ошибка API показана отдельно от пустого каталога. Обновить допускает ручной повтор. Во время обновления/ошибки запуск приостановлен; время получения последнего каталога видимо. Фоновая загрузка не удаляет форму.
+- 12 основных + 4 source E2E, 3 unit, TypeScript и production frontend прошли. Первый прогон новых тестов остановился на пересечении role=alert с Next route announcer; alert каталога именован, повтор 12/12 чистый. Helper/tests проходят lint; исходные ошибки страницы остаются (catalog эффект исправлен, остальные эффекты/расписание ещё не приняты).
+- Далее 10.60: права страницы/запуска должны соответствовать фактическим /api/servers read/write. Затем GRE каталог, URL/device context, backend и адаптивная приёмка. Внутреннее sessions=0 не отображается в диагностике и не является измерением; заменить при общей типизации. Реальная сеть не проверена.
+
diff --git a/lib/probe-response.test.ts b/lib/probe-response.test.ts
index 7ed85fea..b452d76b 100644
--- a/lib/probe-response.test.ts
+++ b/lib/probe-response.test.ts
@@ -3,3 +3,6 @@ import assert from "node:assert/strict"
 import { readProbeOutput } from "./probe-response"
 test("Диагностика требует подтверждённый string output",()=>{for(const raw of [null,{},[],{output:null},{output:1},{output:"ok",error:"fail"}])assert.throws(()=>readProbeOutput(raw));assert.equal(readProbeOutput({output:""}),"");assert.equal(readProbeOutput({output:"PING"}),"PING")})
 test("Диагностика отклоняет legacy error и oversized output",()=>{assert.throws(()=>readProbeOutput({output:"  error: отказ"}),/отказ/);assert.throws(()=>readProbeOutput({output:"x".repeat(1024*1024+1)}))})
+
+import { probeServersSchema } from "./probe-response"
+test("Каталог диагностики требует уникальные id и достоверный status/enabled",()=>{const row={id:1,name:"Тест",host:"192.0.2.1",type:"exit-node",enabled:true,status:null};assert.equal(probeServersSchema.safeParse([row]).success,true);for(const rows of [[row,row],[{...row,id:0}],[{...row,status:"active"}],[{...row,enabled:"yes"}]])assert.equal(probeServersSchema.safeParse(rows).success,false)})
diff --git a/lib/probe-response.ts b/lib/probe-response.ts
index 7cdf3ec9..58fd21d1 100644
--- a/lib/probe-response.ts
+++ b/lib/probe-response.ts
@@ -6,3 +6,10 @@ export function readProbeOutput(raw: unknown): string {
   if (/^error:/i.test(result.data.output.trimStart())) throw new Error(result.data.output.trim())
   return result.data.output
 }
+
+export const probeServersSchema = z.array(z.object({
+  id: z.number().int().positive(), name: z.string(), host: z.string().min(1), enabled: z.boolean(),
+  status: z.enum(["online", "offline", "degraded", "unknown"]).nullable(),
+  site: z.string().optional(), country: z.string().optional(), asn: z.string().optional(),
+  type: z.enum(["jump-host", "exit-node", "home-router"]), latency: z.number().finite().nonnegative().nullable().optional(),
+})).refine(rows => new Set(rows.map(row => row.id)).size === rows.length, "Повторяющийся идентификатор устройства")
diff --git a/tests/e2e/probes-context.spec.ts b/tests/e2e/probes-context.spec.ts
index 70b1a3b5..e9af883f 100644
--- a/tests/e2e/probes-context.spec.ts
+++ b/tests/e2e/probes-context.spec.ts
@@ -3,7 +3,7 @@ const headers={"access-control-allow-origin":"*","access-control-allow-methods":
 for(const change of ["backend","mode"])for(const fails of [false,true])test("Диагностика: поздний запрос/"+change+"/"+fails,async({page})=>{
  let started=false,completed=false,release!:()=>void;const gate=new Promise<void>(r=>release=r)
  await page.route("**/health",r=>r.fulfill({headers,json:{ok:true}}))
- await page.route("**/api/**",r=>{const u=new URL(r.request().url()),p=u.pathname;return r.fulfill({headers,json:p==="/api/auth/config"?{required:false}:p==="/api/servers"?[{id:1,name:u.port==="8101"?"Новый источник":"Прежний источник",host:"192.0.2.1",country:"RU",enabled:true,status:"online"}]:p.endsWith("/ros-src-address")?{ipv4:"192.0.2.1"}:p.endsWith("/probes/run")?{output:"НОВЫЙ РЕЗУЛЬТАТ"}:{tunnels:[]}})})
+ await page.route("**/api/**",r=>{const u=new URL(r.request().url()),p=u.pathname;return r.fulfill({headers,json:p==="/api/auth/config"?{required:false}:p==="/api/servers"?[{id:1,name:u.port==="8101"?"Новый источник":"Прежний источник",host:"192.0.2.1",type:"exit-node",country:"RU",enabled:true,status:"online"}]:p.endsWith("/ros-src-address")?{ipv4:"192.0.2.1"}:p.endsWith("/probes/run")?{output:"НОВЫЙ РЕЗУЛЬТАТ"}:{tunnels:[]}})})
  await page.goto("/probes");await expect(page.getByRole("button",{name:"Запустить",exact:true})).toBeEnabled()
  await page.route("**/api/servers/1/probes/run",async r=>{if(new URL(r.request().url()).port!=="8000")return r.fallback();started=true;await gate;try{await r.fulfill(fails?{headers,status:503,json:{error:"СТАРАЯ ОШИБКА"}}:{headers,json:{output:"СТАРЫЙ РЕЗУЛЬТАТ"}})}catch{}finally{completed=true}})
  await page.getByRole("button",{name:"Запустить",exact:true}).click();await expect.poll(()=>started).toBe(true);await page.getByRole("link",{name:/^Настройки/}).click()
diff --git a/tests/e2e/probes-data.spec.ts b/tests/e2e/probes-data.spec.ts
index 9398e920..b39e30c4 100644
--- a/tests/e2e/probes-data.spec.ts
+++ b/tests/e2e/probes-data.spec.ts
@@ -1,5 +1,5 @@
 import { test, expect, type Page } from "@playwright/test"
-const devices=[{id:1,name:"Первый",host:"192.0.2.1",site:"Тест",country:"RU",asn:"AS64500",type:"vps",enabled:true,status:"online",latency:null}]
+const devices=[{id:1,name:"Первый",host:"192.0.2.1",site:"Тест",country:"RU",asn:"AS64500",type:"exit-node",enabled:true,status:"online",latency:null}]
 async function routes(page:Page){
  await page.route("**/health",r=>r.fulfill({json:{ok:true}}))
  await page.route("**/api/**",r=>{const p=new URL(r.request().url()).pathname;return r.fulfill({json:p==="/api/servers"?devices:p==="/api/auth/config"?{required:false}:p.endsWith("/ros-src-address")?{ipv4:"192.0.2.1"}:{tunnels:[]}})})
@@ -33,3 +33,21 @@ test("Диагностика: уход со страницы не перенос
  await page.route("**/api/servers/1/probes/run",async r=>{if(first){first=false;await gate;await r.fulfill({json:{output:"СТАРЫЙ ВЫВОД"}}).catch(()=>{})}else await r.fulfill({json:{output:"НОВЫЙ ВЫВОД"}})})
  await page.goto("/probes");await run(page).click();await expect(run(page)).toBeDisabled();await page.goto("/terminal");release();await page.goto("/probes");await run(page).click();await expect(page.getByText("НОВЫЙ ВЫВОД",{exact:true})).toBeVisible();await expect(page.getByText("СТАРЫЙ ВЫВОД",{exact:true})).toHaveCount(0)
 })
+
+for(const malformed of [false,true])test("Диагностика: первоначальный отказ каталога и повтор "+malformed,async({page})=>{
+ let fail=true;await page.route("**/api/servers",r=>r.fulfill(fail?(malformed?{json:[{...devices[0],enabled:"yes"}]}:{status:403,json:{error:"Каталог запрещён"}}):{json:devices}))
+ await page.goto("/probes");await expect(page.getByRole("alert",{name:"Каталог диагностики"})).toContainText("Устройства пока неизвестны");await expect(run(page)).toBeDisabled()
+ fail=false;await page.getByRole("button",{name:"Обновить устройства диагностики"}).click();await expect(run(page)).toBeEnabled()
+})
+test("Диагностика: фоновая ошибка сохраняет список и цель до повтора",async({page})=>{
+ let fail=false;await page.route("**/api/servers",r=>r.fulfill(fail?{status:503,json:{error:"Каталог недоступен"}}:{json:devices}))
+ await page.goto("/probes");await expect(run(page)).toBeEnabled();await page.getByRole("textbox",{name:"Цель диагностики"}).fill("198.51.100.5");fail=true;await page.getByRole("button",{name:"Обновить устройства диагностики"}).click()
+ await expect(page.getByRole("alert",{name:"Каталог диагностики"})).toContainText("Последний список сохранён");await expect(page.getByRole("option",{name:/Первый/})).toBeVisible();await expect(run(page)).toBeDisabled();await expect(page.getByRole("textbox",{name:"Цель диагностики"})).toHaveValue("198.51.100.5")
+ fail=false;await page.getByRole("button",{name:"Обновить устройства диагностики"}).click();await expect(run(page)).toBeEnabled();await expect(page.getByRole("textbox",{name:"Цель диагностики"})).toHaveValue("198.51.100.5")
+})
+test("Диагностика: пустой каталог отличается от отказа",async({page})=>{
+ await page.route("**/api/servers",r=>r.fulfill({json:[]}));await page.goto("/probes");await expect(page.getByRole("status").filter({hasText:"В каталоге нет устройств"})).toBeVisible();await expect(page.getByRole("alert",{name:"Каталог диагностики"})).toHaveCount(0);await expect(run(page)).toBeDisabled()
+})
+test("Диагностика: неизвестный статус не становится offline",async({page})=>{
+ await page.route("**/api/servers",r=>r.fulfill({json:[{...devices[0],status:null}]}));await page.goto("/probes");await expect(run(page)).toBeEnabled();await expect(page.getByRole("option",{name:/Первый/})).not.toHaveAccessibleName(/Не в сети|offline/i)
+})