Function renderConnectTabMultiInterface

web/scripts/ragnar_modern.js:8532–8620

(state)

        }
        if (!out) return;
        if (!d.success) { out.innerHTML = '<span class="text-red-300">' + escapeHtml(d.error || 'failed') + '</span>'; return; }
        if (action === 'rib') {
            const rib = d.rib || { total: 0, routes: [] };
            let h = '<div class="text-xs text-gray-400 mb-1">RIB: ' + rib.total + ' prefixes · session ' + escapeHtml(d.state || '?') + '</div>';
            if (rib.routes && rib.routes.length) {
                h += '<table class="w-full text-xs"><tr class="text-gray-500 text-left"><th class="pr-3">Prefix</th><th class="pr-3">Origin AS</th><th class="pr-3">AS-path</th><th>Flapping</th></tr>';
                for (const r of rib.routes) {
                    h += '<tr><td class="pr-3 font-mono">' + escapeHtml(r.prefix) + '</td><td class="pr-3">' + escapeHtml(String(r.origin_as ?? '?')) + '</td><td class="pr-3 font-mono text-gray-400">' + escapeHtml((r.as_path || []).join(' ')) + '</td><td>' + (r.flapping ? '<span class="text-red-300">yes</span>' : '<span class="text-gray-500">no</span>') + '</td></tr>';
                }
                h += '</table>';
            } else { h += '<div class="text-gray-500 text-xs">no prefixes learned yet</div>'; }
            out.innerHTML = h;
            return;
        }
        const st = (d.status || {});
        const cls = _BGP_STATE_STYLE[st.state] || 'text-gray-400';
        let h = '<div>Session: <span class="' + cls + ' font-semibold">' + escapeHtml(st.state || 'Idle') + '</span>';
        if (st.peer_ip) h += ' <span class="text-gray-400">peer ' + escapeHtml(st.peer_ip) + ' AS' + escapeHtml(String(st.peer_as ?? '?')) + '</span>';
        if (st.rib && typeof st.rib.total === 'number') h += ' · <span class="text-gray-400">' + st.rib.total + ' prefixes' + (st.rib.flapping ? ', ' + st.rib.flapping + ' flapping' : '') + '</span>';
        h += '</div>';
        if (action === 'start') addConsoleMessage('BGP collector starting toward ' + (st.peer_ip || '?') + ' (receive-only)', 'info');
        if (action === 'stop') addConsoleMessage('BGP collector stopped', 'info');
        out.innerHTML = h;
    } catch (e) {
        if (out) out.innerHTML = '<span class="text-red-300">' + escapeHtml(e.message) + '</span>';
    }
}
async function owdReflector(action) {
    const span = document.getElementById('owd-reflector-status');
    try {
        const d = await postAPI('/api/net/owd-reflector', { action });
        if (!span) return;
        if (!d.success) { span.innerHTML = '<span class="text-red-300">' + escapeHtml(d.error || 'failed') + '</span>'; return; }
        if (d.running || d.already_running) span.innerHTML = '<span class="text-green-400">reflecting on udp/' + (d.port || '?') + '</span>';
        else span.innerHTML = '<span class="text-gray-500">stopped</span>';
    } catch (e) { if (span) span.innerHTML = '<span class="text-red-300">' + escapeHtml(e.message) + '</span>'; }
}
async function runPathAsymmetry() {
    const out = document.getElementById('pa-results');
    if (!out) return;
    const target = (document.getElementById('pa-target').value || '').trim();
    if (!target) { out.classList.remove('hidden'); out.innerHTML = '<span class="text-amber-300">enter a target</span>'; return; }
    out.classList.remove('hidden');
    out.innerHTML = '<span class="text-gray-400">measuring one-way delay…</span>';
    try {
        const body = {
            target,
            count: parseInt(document.getElementById('pa-count').value, 10) || 20,
            clock_synced: document.getElementById('pa-synced').checked,
        };
        const d = await postAPI('/api/net/path-asymmetry', body);
        if (!d.success) { out.innerHTML = '<span class="text-red-300">' + escapeHtml(d.error || 'failed') + '</span>'; return; }
        const s = d.summary || {};
        let h = '<div class="text-xs text-gray-400 mb-1">' + d.replies + '/' + d.probes_sent + ' replies · state <span class="' + (s.state === 'asymmetric' ? 'text-red-300' : 'text-green-400') + '">' + escapeHtml(s.state || '?') + '</span>';
        if (d.rib_correlation) h += ' · <span class="text-cyan-400">RIB-correlated</span>';
        h += '</div>';
        if (d.note) h += '<div class="text-amber-300 text-xs mb-1">' + escapeHtml(d.note) + '</div>';
        if (s.last) {