fix(ui): привязать фильтр интерфейса к серверу потоков

app/(main)/traffic/page.tsx

@@ -805,7 +805,10 @@ export default function TrafficPage() {
   const flowClients = useMemo(() => currentFlows?.clients ?? [], [currentFlows])
   const [analyticsRetry, setAnalyticsRetry] = useState(0)
   const [analyticsResult, setAnalyticsResult] = useState<{ key: string; data?: FlowAnalyticsDto; monthly?: FlowMonthlyDto; error?: string } | null>(null)
-  const [flowIface, setFlowIface] = useState("__all__")
+  const flowIfaceOwner = JSON.stringify([isLive, backendUrl, groupMode, flowScope, selectedId])
+  const [flowIfaceSelection, setFlowIfaceSelection] = useState<{ owner: string; iface: string } | null>(null)
+  const flowIface = flowIfaceSelection?.owner === flowIfaceOwner ? flowIfaceSelection.iface : "__all__"
+  const setFlowIface = (iface: string) => setFlowIfaceSelection({ owner: flowIfaceOwner, iface })
   const [flowDedup, setFlowDedup] = useState(true)
   const [flowExcludeMesh, setFlowExcludeMesh] = useState(true)
   const [flowExcludeOverlay, setFlowExcludeOverlay] = useState(true)
@@ -911,10 +914,6 @@ export default function TrafficPage() {
     return () => { cancelled = true }
   }, [isLive, effectiveMode, selectedId, range, flowScope, flowIface, flowDedup, flowExcludeMesh, flowExcludeOverlay, backendUrl, analyticsKey])
 
-  useEffect(() => {
-    setFlowIface("__all__")
-  }, [selectedId, flowScope])
-
   useEffect(() => {
     if (!isLive) return
     void listServers(backendUrl).then(setCatalogServers).catch(() => setCatalogServers([]))
@@ -1264,7 +1263,7 @@ export default function TrafficPage() {
                         key={card.id}
                         card={card}
                         selected={card.id === (selFlowCard?.id ?? selectedId)}
-                        onClick={() => setSelectedId(card.id)}
+                        onClick={() => { setFlowIface("__all__"); setSelectedId(card.id) }}
                       />
                     ))}
                     {!liveBusy && !liveError && sortedFlowCards.length === 0 ? (

docs/ux-ui-progress.md

@@ -29,6 +29,13 @@
 | 11Б | Оповещения, сбор данных, интеграции, релизы и настройки | Не начат |
 | 12 | Итоговая доступность, адаптивность, производительность и регрессия | Не начат |
 
+## Блок 8.4И — интерфейс в контексте flow-сервера (2026-09-24)
+
+- Выбор flow-интерфейса хранится вместе с контекстом backend, live/mock, раздела, источника и объекта. Чужой интерфейс не используется при первом рендере нового контекста. При выборе карточки фильтр сбрасывается; синхронный сброс через useEffect удалён.
+- Страница traffic и изменённый тест теперь проходят lint без замечаний. 18 flow-E2E прошли; новый сценарий задерживает ответ ether1 первого сервера, выбирает второй, проверяет отсутствие iface во всех его запросах и сохранение аналитики после позднего ответа первого.
+- diff-check, production build/TypeScript прошли (34 страницы). Использовано 89% пятичасового и 91% недельного лимита; локальный коммит без push.
+- Далее: свежесть данных трафика, отдельные проверки смены backend и позднего SSE, общая приёмка этапа 8. Новый тест проверяет REST-смену сервера; backend/SSE этим сценарием не считаются проверенными. Реальный IPFIX/RouterOS не проверен.
+
 ## Блок 8.4З — разрывы общего Sparkline (2026-09-24)
 
 - Sparkline принимает null/undefined и исключает нечисловые значения из расчётов, сохраняя исходную позицию каждой точки. Линия и заливка разделены на сегменты, пропуски не соединяются. Одиночная точка (включая ноль) отображается; пустая история имеет доступное имя. Масштаб для валидных значений сохранён.

tests/e2e/traffic-flow.spec.ts

@@ -1,7 +1,7 @@
 import { test, expect, type Page } from '@playwright/test'
 
 async function setup(page: Page) {
-  const control = { hold: '', fail: false, failList: false, invalidSample: undefined as unknown, mergeSample: false, metrics: {} as Record<string, unknown>, release: () => {} }
+  const control = { hold: '', holdIface: '', fail: false, failList: false, invalidSample: undefined as unknown, mergeSample: false, metrics: {} as Record<string, unknown>, release: () => {} }
   const gate = new Promise<void>(resolve => { control.release = resolve })
   const card = { id: '1', name: 'Экспортёр тест', subtitle: '', site: 'TEST', country: 'RU', status: 'online', rxNow: 2, txNow: 3, sessions: 1, rxSeries: [1, 2], txSeries: [2, 3], bytes: 200 }
   const data = { bpsNow: 1000000, bytes: 200, packets: 2, conversations: 1, uniqueSrc: 1, uniqueDst: 1, topProto: 'TCP', rxSeries: [1], txSeries: [2], applications: [], protocols: [], sources: [], destinations: [], interfaces: [], conversationsList: [], ifaces: [], live: false }
@@ -10,14 +10,14 @@ async function setup(page: Page) {
     const url = new URL(route.request().url()), path = url.pathname, range = url.searchParams.get('range')
     if (path === '/api/traffic/flow/monthly') return route.fulfill({ json: { month: url.searchParams.get('month'), bytes: 1500, countries: [{ id: 'RU', label: 'Россия', bytes: 1500, packets: 1, bps: 0, percent: 100 }], services: [], asns: [] } })
     if (path === '/api/traffic/flow/analytics') {
-      if (control.hold === range) await gate
+      if (control.hold === range || (control.holdIface && url.searchParams.get('iface') === control.holdIface)) await gate
       if (control.fail) return route.fulfill({ status: 500, json: { error: 'Срез временно недоступен' } })
-      return route.fulfill({ json: { ...data, ...control.metrics, topCategory: 'Категория ' + range } })
+      return route.fulfill({ json: { ...data, ...control.metrics, topCategory: url.searchParams.get('serverId') === '2' ? 'Второй сервер' : 'Категория ' + range } })
     }
     if (path === '/api/traffic/flow/live') return route.fulfill({ contentType: 'text/event-stream', body: 'event: sample\ndata: ' + JSON.stringify({ ...data, live: true }) + '\n\n' + (control.invalidSample === undefined ? '' : 'event: sample\ndata: ' + JSON.stringify(control.mergeSample ? { ...data, ...(control.invalidSample as object) } : control.invalidSample) + '\n\n') })
     if (path === '/api/traffic/flow/exporters' && control.failList) return route.fulfill({ status: 403, json: { error: 'Нет доступа к экспортёрам' } })
     const json = path === '/api/auth/config' ? { required: false }
-      : path === '/api/traffic/flow/exporters' ? { exporters: [card] }
+      : path === '/api/traffic/flow/exporters' ? { exporters: [card, { ...card, id: '2', name: 'Экспортёр второй' }] }
       : path === '/api/traffic/flow/clients' ? { clients: [{ ...card, id: 'client1', name: 'Клиент тест' }] }
       : path === '/api/traffic/flows' ? { exportersOnline: 1, bytesPerMin: 1, uniqueSrc: 1, uniqueDst: 1, topProto: 'TCP', talkers: [], listenerBound: true }
       : path === '/api/traffic/servers' ? { servers: [] }
@@ -166,3 +166,27 @@ for (const [name, metrics, rate, bytes] of [
     if (name === 'нулевые') await expect(card('JH↔EN overlay')).toContainText('0 Б')
   })
 }
+
+
+test('Flow: интерфейс прежнего сервера не передаётся новому; поздний ответ игнорируется', async ({ page }) => {
+  const control = await setup(page)
+  control.metrics = { ifaces: [{ name: 'ether1', index: '1', bps: 1 }] }
+  await page.getByRole('button', { name: '15м', exact: true }).click()
+  await expect(page.getByRole('button', { name: 'ether1', exact: true })).toBeVisible()
+  control.holdIface = 'ether1'
+  const oldRequest = page.waitForRequest(r => r.url().includes('/flow/analytics?') && r.url().includes('iface=ether1'))
+  await page.getByRole('button', { name: 'ether1', exact: true }).click()
+  await oldRequest
+  const requests: URL[] = []
+  page.on('request', r => { if (r.url().includes('/flow/analytics?')) requests.push(new URL(r.url())) })
+  await page.getByRole('button').filter({ hasText: 'Экспортёр второй' }).click()
+  await expect(page.getByText('Второй сервер', { exact: true }).filter({ visible: true })).toBeVisible()
+  const newRequests = requests.filter(url => url.searchParams.get('serverId') === '2')
+  expect(newRequests.length).toBeGreaterThan(0)
+  expect(newRequests.every(url => !url.searchParams.has('iface'))).toBe(true)
+  const late = page.waitForResponse(r => r.url().includes('/flow/analytics?') && r.url().includes('iface=ether1'))
+  control.release()
+  await late
+  await expect(page.getByText('Второй сервер', { exact: true }).filter({ visible: true })).toBeVisible()
+  await expect(page.getByText('Категория 15m', { exact: true })).toHaveCount(0)
+})