Update architecture

index.html

@@ -39,13 +39,30 @@
             margin-bottom: 10px;
         }
 
+        .header-info {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            gap: 12px;
+            flex-wrap: wrap;
+            margin-top: 12px;
+            font-size: 0.95em;
+        }
+
         .header .status {
             display: inline-block;
             padding: 8px 16px;
             background: rgba(255, 255, 255, 0.2);
             border-radius: 20px;
             font-size: 0.9em;
-            margin-top: 10px;
+        }
+
+        .header-sep {
+            opacity: 0.7;
+        }
+
+        .header-info strong {
+            font-weight: 600;
         }
 
         .status.connected {
@@ -326,7 +343,11 @@
     <div class="container">
         <div class="header">
             <h1>🚀 NATS Queue Visualizer</h1>
-            <div id="status" class="status disconnected">Отключено</div>
+            <div class="header-info">
+                <span id="status" class="status disconnected">Отключено</span>
+                <span class="header-sep">•</span>
+                <span>Подписки: <strong id="subscribedList">—</strong></span>
+            </div>
         </div>
 
         <div class="controls">
@@ -565,6 +586,19 @@
             updateMessages();
         });
 
+        function loadSubscribed() {
+            fetch('/api/subscribed')
+                .then(res => res.json())
+                .then(data => {
+                    const list = data.subscribed || [];
+                    const el = document.getElementById('subscribedList');
+                    el.textContent = list.length ? list.join(', ') : '—';
+                })
+                .catch(() => {
+                    document.getElementById('subscribedList').textContent = '—';
+                });
+        }
+
         function loadConnections() {
             fetch('/api/connections')
                 .then(res => res.json())
@@ -613,6 +647,7 @@
 
         // Инициализация - только WebSocket, все сообщения придут автоматически
         connectWebSocket();
+        loadSubscribed();
         loadConnections();
         setInterval(loadConnections, 5000);
     </script>