@serve.zone/dcrouter 11.9.1 → 11.10.1

package/ts/monitoring/classes.metricsmanager.ts

@@ -558,6 +558,7 @@ export class MetricsManager {
           throughputByIP: new Map<string, { in: number; out: number }>(),
           requestsPerSecond: 0,
           requestsTotal: 0,
+          backends: [] as Array<any>,
         };
       }
 
@@ -590,6 +591,73 @@ export class MetricsManager {
       const requestsPerSecond = proxyMetrics.requests.perSecond();
       const requestsTotal = proxyMetrics.requests.total();
 
+      // Collect backend protocol data
+      const backendMetrics = proxyMetrics.backends.byBackend();
+      const protocolCache = proxyMetrics.backends.detectedProtocols();
+
+      // Index protocol cache by "host:port"
+      const cacheByKey = new Map<string, (typeof protocolCache)[number]>();
+      for (const entry of protocolCache) {
+        cacheByKey.set(`${entry.host}:${entry.port}`, entry);
+      }
+
+      const backends: Array<any> = [];
+      const seen = new Set<string>();
+
+      for (const [key, bm] of backendMetrics) {
+        seen.add(key);
+        const cache = cacheByKey.get(key);
+        backends.push({
+          backend: key,
+          domain: cache?.domain ?? null,
+          protocol: bm.protocol,
+          activeConnections: bm.activeConnections,
+          totalConnections: bm.totalConnections,
+          connectErrors: bm.connectErrors,
+          handshakeErrors: bm.handshakeErrors,
+          requestErrors: bm.requestErrors,
+          avgConnectTimeMs: Math.round(bm.avgConnectTimeMs * 10) / 10,
+          poolHitRate: Math.round(bm.poolHitRate * 1000) / 1000,
+          h2Failures: bm.h2Failures,
+          h2Suppressed: cache?.h2Suppressed ?? false,
+          h3Suppressed: cache?.h3Suppressed ?? false,
+          h2CooldownRemainingSecs: cache?.h2CooldownRemainingSecs ?? null,
+          h3CooldownRemainingSecs: cache?.h3CooldownRemainingSecs ?? null,
+          h2ConsecutiveFailures: cache?.h2ConsecutiveFailures ?? null,
+          h3ConsecutiveFailures: cache?.h3ConsecutiveFailures ?? null,
+          h3Port: cache?.h3Port ?? null,
+          cacheAgeSecs: cache?.ageSecs ?? null,
+        });
+      }
+
+      // Include protocol cache entries with no matching backend metric
+      for (const entry of protocolCache) {
+        const key = `${entry.host}:${entry.port}`;
+        if (!seen.has(key)) {
+          backends.push({
+            backend: key,
+            domain: entry.domain,
+            protocol: entry.protocol,
+            activeConnections: 0,
+            totalConnections: 0,
+            connectErrors: 0,
+            handshakeErrors: 0,
+            requestErrors: 0,
+            avgConnectTimeMs: 0,
+            poolHitRate: 0,
+            h2Failures: 0,
+            h2Suppressed: entry.h2Suppressed,
+            h3Suppressed: entry.h3Suppressed,
+            h2CooldownRemainingSecs: entry.h2CooldownRemainingSecs,
+            h3CooldownRemainingSecs: entry.h3CooldownRemainingSecs,
+            h2ConsecutiveFailures: entry.h2ConsecutiveFailures,
+            h3ConsecutiveFailures: entry.h3ConsecutiveFailures,
+            h3Port: entry.h3Port,
+            cacheAgeSecs: entry.ageSecs,
+          });
+        }
+      }
+
       return {
         connectionsByIP,
         throughputRate,
@@ -599,6 +667,7 @@ export class MetricsManager {
         throughputByIP,
         requestsPerSecond,
         requestsTotal,
+        backends,
       };
     }, 1000); // 1s cache — matches typical dashboard poll interval
   }

package/ts/opsserver/handlers/security.handler.ts

@@ -101,6 +101,7 @@ export class SecurityHandler {
               throughputByIP,
               requestsPerSecond: networkStats.requestsPerSecond || 0,
               requestsTotal: networkStats.requestsTotal || 0,
+              backends: networkStats.backends || [],
             };
           }
 
@@ -114,6 +115,7 @@ export class SecurityHandler {
             throughputByIP: [],
             requestsPerSecond: 0,
             requestsTotal: 0,
+            backends: [],
           };
         }
       )

package/ts/opsserver/handlers/stats.handler.ts

@@ -309,6 +309,7 @@ export class StatsHandler {
                   throughputHistory: stats.throughputHistory || [],
                   requestsPerSecond: stats.requestsPerSecond || 0,
                   requestsTotal: stats.requestsTotal || 0,
+                  backends: stats.backends || [],
                 };
               })()
             );

package/ts_web/00_commitinfo_data.ts

@@ -3,6 +3,6 @@
  */
 export const commitinfo = {
   name: '@serve.zone/dcrouter',
-  version: '11.9.1',
+  version: '11.10.1',
   description: 'A multifaceted routing service handling mail and SMS delivery functions.'
 }

package/ts_web/appstate.ts

@@ -53,6 +53,7 @@ export interface INetworkState {
   throughputHistory: Array<{ timestamp: number; in: number; out: number }>;
   requestsPerSecond: number;
   requestsTotal: number;
+  backends: interfaces.data.IBackendInfo[];
   lastUpdated: number;
   isLoading: boolean;
   error: string | null;
@@ -148,6 +149,7 @@ export const networkStatePart = await appState.getStatePart<INetworkState>(
     throughputHistory: [],
     requestsPerSecond: 0,
     requestsTotal: 0,
+    backends: [],
     lastUpdated: 0,
     isLoading: false,
     error: null,
@@ -503,6 +505,7 @@ export const fetchNetworkStatsAction = networkStatePart.createAction(async (stat
       throughputHistory: networkStatsResponse.throughputHistory || [],
       requestsPerSecond: networkStatsResponse.requestsPerSecond || 0,
       requestsTotal: networkStatsResponse.requestsTotal || 0,
+      backends: networkStatsResponse.backends || [],
       lastUpdated: Date.now(),
       isLoading: false,
       error: null,

package/ts_web/elements/ops-view-network.ts

@@ -1,5 +1,6 @@
 import { DeesElement, property, html, customElement, type TemplateResult, css, state, cssManager } from '@design.estate/dees-element';
 import * as appstate from '../appstate.js';
+import * as interfaces from '../../dist_ts_interfaces/index.js';
 import { viewHostCss } from './shared/css.js';
 import { type IStatsTile } from '@design.estate/dees-catalog';
 
@@ -198,6 +199,38 @@ export class OpsViewNetwork extends DeesElement {
         color: ${cssManager.bdTheme('#00796b', '#4db6ac')};
       }
 
+      .protocolBadge.h1 {
+        background: ${cssManager.bdTheme('#e3f2fd', '#1a2c3a')};
+        color: ${cssManager.bdTheme('#1976d2', '#5a9fd4')};
+      }
+
+      .protocolBadge.h2 {
+        background: ${cssManager.bdTheme('#e8f5e9', '#1a3a1a')};
+        color: ${cssManager.bdTheme('#388e3c', '#66bb6a')};
+      }
+
+      .protocolBadge.h3 {
+        background: ${cssManager.bdTheme('#f3e5f5', '#2a1a3a')};
+        color: ${cssManager.bdTheme('#7b1fa2', '#ba68c8')};
+      }
+
+      .protocolBadge.unknown {
+        background: ${cssManager.bdTheme('#f5f5f5', '#2a2a2a')};
+        color: ${cssManager.bdTheme('#757575', '#999999')};
+      }
+
+      .suppressionBadge {
+        display: inline-flex;
+        align-items: center;
+        padding: 2px 6px;
+        border-radius: 3px;
+        font-size: 11px;
+        font-weight: 500;
+        background: ${cssManager.bdTheme('#fff3e0', '#3a2a1a')};
+        color: ${cssManager.bdTheme('#f57c00', '#ff9933')};
+        margin-left: 4px;
+      }
+
       .statusBadge {
         display: inline-flex;
         align-items: center;
@@ -265,6 +298,9 @@ export class OpsViewNetwork extends DeesElement {
         <!-- Top IPs Section -->
         ${this.renderTopIPs()}
 
+        <!-- Backend Protocols Section -->
+        ${this.renderBackendProtocols()}
+
         <!-- Requests Table -->
         <dees-table
           .data=${this.networkRequests}
@@ -519,6 +555,106 @@ export class OpsViewNetwork extends DeesElement {
     `;
   }
 
+  private renderBackendProtocols(): TemplateResult {
+    const backends = this.networkState.backends;
+    if (!backends || backends.length === 0) {
+      return html``;
+    }
+
+    return html`
+      <dees-table
+        .data=${backends}
+        .displayFunction=${(item: interfaces.data.IBackendInfo) => {
+          const totalErrors = item.connectErrors + item.handshakeErrors + item.requestErrors;
+          const protocolClass = item.protocol.toLowerCase().replace(/[^a-z0-9]/g, '');
+
+          return {
+            'Backend': item.backend,
+            'Domain': item.domain || '-',
+            'Protocol': html`
+              <span class="protocolBadge ${protocolClass}">${item.protocol.toUpperCase()}</span>
+              ${item.h2Suppressed ? html`<span class="suppressionBadge" title="H2 suppressed: ${item.h2ConsecutiveFailures ?? 0} failures, cooldown ${item.h2CooldownRemainingSecs ?? 0}s">H2 suppressed</span>` : ''}
+              ${item.h3Suppressed ? html`<span class="suppressionBadge" title="H3 suppressed: ${item.h3ConsecutiveFailures ?? 0} failures, cooldown ${item.h3CooldownRemainingSecs ?? 0}s">H3 suppressed</span>` : ''}
+            `,
+            'Active': item.activeConnections,
+            'Total': this.formatNumber(item.totalConnections),
+            'Avg Connect': item.avgConnectTimeMs > 0 ? `${item.avgConnectTimeMs.toFixed(1)}ms` : '-',
+            'Pool Hit Rate': item.poolHitRate > 0 ? `${(item.poolHitRate * 100).toFixed(1)}%` : '-',
+            'Errors': totalErrors > 0
+              ? html`<span class="statusBadge error">${totalErrors}</span>`
+              : html`<span class="statusBadge success">0</span>`,
+            'Cache Age': item.cacheAgeSecs != null ? `${Math.round(item.cacheAgeSecs)}s` : '-',
+          };
+        }}
+        .dataActions=${[
+          {
+            name: 'View Details',
+            iconName: 'lucide:info',
+            type: ['inRow', 'doubleClick', 'contextmenu'] as any,
+            actionFunc: async (actionData: any) => {
+              await this.showBackendDetails(actionData.item);
+            }
+          }
+        ]}
+        heading1="Backend Protocols"
+        heading2="Auto-detected backend protocols and connection pool health"
+        searchable
+        .pagination=${false}
+        dataName="backend"
+      ></dees-table>
+    `;
+  }
+
+  private async showBackendDetails(backend: interfaces.data.IBackendInfo) {
+    const { DeesModal } = await import('@design.estate/dees-catalog');
+
+    await DeesModal.createAndShow({
+      heading: `Backend: ${backend.backend}`,
+      content: html`
+        <div style="padding: 20px;">
+          <dees-dataview-codebox
+            .heading=${'Backend Details'}
+            progLang="json"
+            .codeToDisplay=${JSON.stringify({
+              backend: backend.backend,
+              domain: backend.domain,
+              protocol: backend.protocol,
+              activeConnections: backend.activeConnections,
+              totalConnections: backend.totalConnections,
+              avgConnectTimeMs: backend.avgConnectTimeMs,
+              poolHitRate: backend.poolHitRate,
+              errors: {
+                connect: backend.connectErrors,
+                handshake: backend.handshakeErrors,
+                request: backend.requestErrors,
+                h2Failures: backend.h2Failures,
+              },
+              suppression: {
+                h2Suppressed: backend.h2Suppressed,
+                h3Suppressed: backend.h3Suppressed,
+                h2CooldownRemainingSecs: backend.h2CooldownRemainingSecs,
+                h3CooldownRemainingSecs: backend.h3CooldownRemainingSecs,
+                h2ConsecutiveFailures: backend.h2ConsecutiveFailures,
+                h3ConsecutiveFailures: backend.h3ConsecutiveFailures,
+              },
+              h3Port: backend.h3Port,
+              cacheAgeSecs: backend.cacheAgeSecs,
+            }, null, 2)}
+          ></dees-dataview-codebox>
+        </div>
+      `,
+      menuOptions: [
+        {
+          name: 'Copy Backend Key',
+          iconName: 'lucide:Copy',
+          action: async () => {
+            await navigator.clipboard.writeText(backend.backend);
+          }
+        }
+      ]
+    });
+  }
+
   private async updateNetworkData() {
     // Track requests/sec history for the trend sparkline (moved out of render)
     const reqPerSec = this.networkState.requestsPerSecond || 0;