fix(web): time out API requests and flag line strips that failed to refresh [CI]

web/display/src/LineStrips.tsx

@@ -70,6 +70,7 @@ export function LineStrips({ lineId, range, m }: Props) {
       ) : <div className="line-mini-stack">
         <div className="line-mini-quic-head" title={`QUIC RTT p50 ${fmtMs(m['rtt.p50'])} · p95 ${fmtMs(m['rtt.p95'])} · p99 ${fmtMs(m['rtt.p99'])}`}>
           <span>QUIC</span><strong className="num">{fmtMs(m['rtt.p50'])}</strong><small>悬停看 p95 / p99</small>
+          {series.error ? <span className="line-mini-badge bad" title={`上一次取数失败：${series.error.message}`}>数据未更新</span> : null}
         </div>
         <div className="line-mini-direction">
           <div className="line-mini-direction-head" title={`去程 Probe → Agent 丢包 ${fmtPct(up)}`}>

web/shared/api/client.ts

@@ -40,12 +40,16 @@ async function request<T>(method: string, path: string, body?: unknown, init?: R
   const headers: Record<string, string> = { Accept: 'application/json', ...authHeaders() }
   if (body !== undefined) headers['Content-Type'] = method === 'PATCH' ? 'application/merge-patch+json' : 'application/json'
   if (method !== 'GET' && csrfToken) headers['X-CSRF-Token'] = csrfToken
+  // 没有时限的 fetch 在被黑洞的线路上会一直挂着，轮询的界面就停在旧数据上；超时后抛错，下一轮轮询换一条连接重试
+  const timeout = AbortSignal.timeout(method === 'GET' ? 15_000 : 30_000)
+  const signal = init?.signal ? AbortSignal.any([init.signal, timeout]) : timeout
   const response = await fetch(resolveUrl(path), {
     method,
     headers,
     credentials: isRemote() ? 'omit' : 'include',
     body: body === undefined ? undefined : JSON.stringify(body),
     ...init,
+    signal,
   })
   if (response.status === 204) return undefined as T
   const text = await response.text()