ft-scout 9.0.8 → 9.0.9

package/web/app.js

@@ -1,5 +1,5 @@
 /* ==========================================================================
-   FrontTerrain Scout  Multi-Page Application Engine v9.0.8
+   FrontTerrain Scout  Multi-Page Application Engine v9.0.9
    ========================================================================== */
 
 const FIREBASE_CONFIG = {
@@ -220,14 +220,28 @@ async function loadDynamicPricing() {
 
     try {
         const adminToken = sessionStorage.getItem('scout_admin_token');
-        const userEmail = (state.user?.email || '').toLowerCase();
-        if (adminToken || userEmail === 'rishishandilya40@gmail.com' || userEmail.includes('admin')) {
-            showAdminNavigationLink();
-        } else {
-            const checkRes = await fetch('/api/admin/check');
-            if (checkRes.ok) {
-                const checkData = await checkRes.json();
-                if (checkData.authorized) showAdminNavigationLink();
+        const userEmail = (state.user?.email || '').trim().toLowerCase();
+        const AUTHORIZED_ADMIN_EMAILS = [
+            'rishishandilya40@gmail.com',
+            'rishi.shandilya@frontterrain.com',
+            'company@frontterrain.com'
+        ];
+
+        if (adminToken && AUTHORIZED_ADMIN_EMAILS.includes(userEmail)) {
+            if (state.serverConnected) {
+                const checkRes = await fetch('/api/admin/check', {
+                    headers: { 'Authorization': `Bearer ${adminToken}` }
+                });
+                if (checkRes.ok) {
+                    const checkData = await checkRes.json();
+                    if (checkData.authorized) {
+                        showAdminNavigationLink();
+                    } else {
+                        sessionStorage.removeItem('scout_admin_token');
+                    }
+                }
+            } else {
+                showAdminNavigationLink();
             }
         }
     } catch { }
@@ -249,7 +263,13 @@ function showAdminNavigationLink() {
 
     // Highlight admin identity in sidebar user footer
     const sidebarTier = document.getElementById('sidebar-user-tier');
-    if (sidebarTier && (sessionStorage.getItem('scout_admin_token') || (state.user?.email || '').toLowerCase().includes('admin') || (state.user?.email || '').toLowerCase() === 'rishishandilya40@gmail.com')) {
+    const userEmail = (state.user?.email || '').trim().toLowerCase();
+    const AUTHORIZED_ADMIN_EMAILS = [
+        'rishishandilya40@gmail.com',
+        'rishi.shandilya@frontterrain.com',
+        'company@frontterrain.com'
+    ];
+    if (sidebarTier && sessionStorage.getItem('scout_admin_token') && AUTHORIZED_ADMIN_EMAILS.includes(userEmail)) {
         sidebarTier.innerHTML = '<span style="color: #e15b37; font-weight: 700;"><i class="fa-solid fa-shield-halved"></i> Master Admin</span>';
     }
 
@@ -1057,7 +1077,7 @@ function initTerminalSimulator() {
 `;
         } else if (lower.includes('status')) {
             response.innerHTML = `
-<span class="term-green">✔ Scout CLI Engine: v9.0.8 Online</span><br>
+<span class="term-green">✔ Scout CLI Engine: v9.0.9 Online</span><br>
 ↳ User: <strong>${escapeHtml(state.user ? state.user.name : 'Guest Session')}</strong><br>
 ↳ Active Subscription: <strong>${escapeHtml(TIER_DETAILS[state.currentTier].name)}</strong><br>
 ↳ Credit Quota: <strong>${state.byokEnabled ? 'BYOK Mode (Unlimited)' : `${state.creditsUsed} / ${state.creditsTotal} Credits Used`}</strong><br>
@@ -1304,7 +1324,7 @@ function renderTiersUI() {
             getEl('price-pro-val').innerText = proUSD;
         }
     }
-    if (getEl('price-pro-period')) getEl('price-pro-period').innerText = isProOffer ? `/ month (${p.pro?.offerBadge || 'PROMO OFFER'})` : (isAnnual ? '(billed annually)' : '/ month');
+    if (getEl('price-pro-period')) getEl('price-pro-period').innerText = isProOffer ? `/ month (${p.pro?.offerBadge || 'PROMO OFFER'})` : (isAnnual ? '/month(billed annually)' : '/ month');
     const proCurrency = document.querySelector('#tier-card-pro .price-currency');
     if (proCurrency) proCurrency.innerText = isProOffer ? '' : '$';
 
@@ -1315,7 +1335,7 @@ function renderTiersUI() {
             getEl('price-ent-val').innerText = entUSD;
         }
     }
-    if (getEl('price-ent-period')) getEl('price-ent-period').innerText = isEntOffer ? `/ month (${p.enterprise?.offerBadge || 'PROMO OFFER'})` : (isAnnual ? '(billed annually)' : '/ month');
+    if (getEl('price-ent-period')) getEl('price-ent-period').innerText = isEntOffer ? `/ month (${p.enterprise?.offerBadge || 'PROMO OFFER'})` : (isAnnual ? '/month(billed annually)' : '/ month');
     const entCurrency = document.querySelector('#tier-card-enterprise .price-currency');
     if (entCurrency) entCurrency.innerText = isEntOffer ? '' : '$';
 
@@ -1367,8 +1387,8 @@ async function checkServerStatusAndSession() {
     let connected = false;
     let data = null;
 
-    // Only attempt local server if running locally
-    const isLocalhost = window.location.hostname === 'localhost' || window.location.hostname === '127.0.0.1';
+    // Only attempt direct relative path if running locally or via file protocol
+    const isLocalhost = window.location.hostname === 'localhost' || window.location.hostname === '127.0.0.1' || window.location.protocol === 'file:';
 
     if (isLocalhost) {
         try {
@@ -1381,15 +1401,22 @@ async function checkServerStatusAndSession() {
                 }
             }
         } catch { }
+    }
 
-        if (!connected) {
+    if (!connected) {
+        const candidateHosts = ['http://localhost:9120', 'http://127.0.0.1:9120', 'http://localhost:9121', 'http://localhost:9122'];
+        for (const host of candidateHosts) {
             try {
-                const res = await fetch('http://localhost:9120/api/status', { method: 'GET' });
+                const controller = new AbortController();
+                const timeoutId = setTimeout(() => controller.abort(), 1200);
+                const res = await fetch(`${host}/api/status`, { method: 'GET', signal: controller.signal });
+                clearTimeout(timeoutId);
                 if (res.ok) {
                     data = await res.json();
                     if (data && data.status === 'ok') {
-                        state.apiBaseUrl = 'http://localhost:9120';
+                        state.apiBaseUrl = host;
                         connected = true;
+                        break;
                     }
                 }
             } catch { }
@@ -1475,8 +1502,46 @@ async function handleSignIn(e) {
     if (!email || !password) return;
 
     // Check Master Admin Credentials
-    const isMasterAdminAuth = (email.toLowerCase() === 'rishishandilya40@gmail.com' || email.toLowerCase().includes('admin')) && (password === 'scout_admin_2026' || password === 'admin');
+    const AUTHORIZED_ADMIN_EMAILS = [
+        'rishishandilya40@gmail.com',
+        'rishi.shandilya@frontterrain.com',
+        'company@frontterrain.com'
+    ];
+    const isMasterAdminAuth = AUTHORIZED_ADMIN_EMAILS.includes(email.toLowerCase().trim()) && password === 'scout_admin_2026';
     if (isMasterAdminAuth) {
+        if (state.serverConnected) {
+            try {
+                const adminLoginRes = await fetch(`${state.apiBaseUrl}/api/admin/login`, {
+                    method: 'POST',
+                    headers: { 'Content-Type': 'application/json' },
+                    body: JSON.stringify({ email: email.trim(), passkey: password }),
+                });
+                if (adminLoginRes.ok) {
+                    const adminData = await adminLoginRes.json();
+                    if (adminData.success && adminData.token) {
+                        state.token = adminData.token;
+                        state.refreshToken = 'rt_' + Date.now().toString(36);
+                        state.user = {
+                            id: 'usr_admin_001',
+                            email: email,
+                            name: 'Scout Administrator',
+                            createdAt: new Date().toISOString(),
+                        };
+                        state.currentTier = 'pro';
+                        state.creditsTotal = 1000;
+                        state.creditsUsed = 0;
+                        sessionStorage.setItem('scout_admin_token', adminData.token);
+                        saveSessionToStorage();
+                        updateUserUI();
+                        showToast('Authenticated as Scout Administrator! Redirecting to Control Center...', 'success');
+                        setTimeout(() => { window.location.href = '/admin'; }, 400);
+                        return;
+                    }
+                }
+            } catch { }
+        }
+
+        // Standalone fallback
         state.token = 'scout_admin_token_' + Date.now().toString(36);
         state.refreshToken = 'rt_' + Date.now().toString(36);
         state.user = {
@@ -1784,6 +1849,11 @@ function updateUserUI() {
             inceptionBadge.style.display = 'none';
         }
     }
+
+    // Refresh MCP servers scoped to active user
+    if (typeof loadMcpData === 'function') {
+        loadMcpData();
+    }
 }
 
 async function handleLogout() {
@@ -1801,6 +1871,11 @@ async function handleLogout() {
     localStorage.removeItem('scout_auth_token');
     localStorage.removeItem('scout_refresh_token');
 
+    if (typeof mcpState !== 'undefined') {
+        mcpState.servers = [];
+        if (typeof renderMcpServersList === 'function') renderMcpServersList();
+    }
+
     showToast('Signed out of Scout session.', 'info');
     window.location.href = '/auth';
 }
@@ -3145,8 +3220,25 @@ function initWorkstationRouter() {
 // Model Context Protocol (MCP) Ecosystem Controller
 // ==========================================================================
 
+function getMcpApiBase() {
+    return state.apiBaseUrl || '';
+}
+
+function getAccountMcpStorageKey() {
+    const email = (state.user?.email || '').trim().toLowerCase();
+    return email ? `scout_mcp_servers_${email}` : 'scout_cached_mcp_servers';
+}
+
 const mcpState = {
-    servers: [],
+    servers: (() => {
+        try {
+            const key = (state.user?.email) ? `scout_mcp_servers_${state.user.email.toLowerCase()}` : 'scout_cached_mcp_servers';
+            const cached = localStorage.getItem(key) || localStorage.getItem('scout_cached_mcp_servers');
+            return cached ? JSON.parse(cached) : [];
+        } catch {
+            return [];
+        }
+    })(),
     activity: [],
     health: {},
     selectedServer: null,
@@ -3154,21 +3246,69 @@ const mcpState = {
 };
 
 async function loadMcpData() {
-    try {
-        const [serversRes, healthRes, activityRes] = await Promise.all([
-            fetch('/api/mcp/servers').then(r => r.json()).catch(() => ({ success: false, servers: [] })),
-            fetch('/api/mcp/health').then(r => r.json()).catch(() => ({ success: false, health: {} })),
-            fetch('/api/mcp/activity?limit=30').then(r => r.json()).catch(() => ({ success: false, activity: [] }))
-        ]);
+    const userEmail = (state.user?.email || '').trim().toLowerCase();
+    const storageKey = getAccountMcpStorageKey();
 
-        if (serversRes.success && Array.isArray(serversRes.servers)) {
-            mcpState.servers = serversRes.servers;
+    // 1. Immediately display cached servers for this account
+    try {
+        const cached = localStorage.getItem(storageKey);
+        if (cached) {
+            const parsed = JSON.parse(cached);
+            if (Array.isArray(parsed) && parsed.length > 0) {
+                mcpState.servers = parsed;
+                renderMcpKpis();
+                renderMcpServersList();
+            }
         }
-        if (healthRes.success && healthRes.health) {
-            mcpState.health = healthRes.health;
+    } catch { }
+
+    // 2. Update account badge in header
+    const badgeEl = getEl('mcp-account-badge');
+    if (badgeEl) {
+        if (state.user?.email) {
+            badgeEl.style.display = 'inline-flex';
+            badgeEl.innerHTML = `<i class="fa-solid fa-user-check" style="margin-right: 4px;"></i> ${escapeHtml(state.user.email)}`;
+        } else {
+            badgeEl.style.display = 'none';
         }
-        if (activityRes.success && Array.isArray(activityRes.activity)) {
-            mcpState.activity = activityRes.activity;
+    }
+
+    try {
+        const apiBase = getMcpApiBase();
+        const canFetchServer = state.serverConnected || window.location.hostname === 'localhost' || window.location.hostname === '127.0.0.1' || (apiBase && apiBase.length > 0);
+
+        if (canFetchServer) {
+            const queryParams = userEmail ? `?user=${encodeURIComponent(userEmail)}` : '';
+            const [serversRes, healthRes, activityRes] = await Promise.all([
+                fetch(`${apiBase}/api/mcp/servers${queryParams}`).then(r => r.json()).catch(() => ({ success: false, servers: [] })),
+                fetch(`${apiBase}/api/mcp/health`).then(r => r.json()).catch(() => ({ success: false, health: {} })),
+                fetch(`${apiBase}/api/mcp/activity?limit=30`).then(r => r.json()).catch(() => ({ success: false, activity: [] }))
+            ]);
+
+            if (serversRes.success && Array.isArray(serversRes.servers)) {
+                mcpState.servers = serversRes.servers;
+                try {
+                    localStorage.setItem(storageKey, JSON.stringify(serversRes.servers));
+                    localStorage.setItem('scout_cached_mcp_servers', JSON.stringify(serversRes.servers));
+                } catch { }
+            }
+            if (healthRes.success && healthRes.health) {
+                mcpState.health = healthRes.health;
+            }
+            if (activityRes.success && Array.isArray(activityRes.activity)) {
+                mcpState.activity = activityRes.activity;
+            }
+        } else {
+            // Standalone Cloud Web Mode (e.g. on scout.frontterrain.com without local server online)
+            try {
+                const stored = localStorage.getItem(storageKey);
+                if (stored) {
+                    mcpState.servers = JSON.parse(stored);
+                } else if (!userEmail) {
+                    const fallback = localStorage.getItem('scout_cached_mcp_servers');
+                    if (fallback) mcpState.servers = JSON.parse(fallback);
+                }
+            } catch { }
         }
 
         renderMcpKpis();
@@ -3221,6 +3361,32 @@ function renderMcpServersList() {
     if (!container) return;
 
     if (mcpState.servers.length === 0) {
+        if (!state.serverConnected) {
+            container.innerHTML = `
+                <div style="padding: 36px 24px; text-align: center; border: 1px dashed rgba(0, 229, 255, 0.3); border-radius: 12px; background: rgba(0, 229, 255, 0.03); margin: 16px;">
+                    <div style="width: 52px; height: 52px; border-radius: 12px; background: rgba(0, 229, 255, 0.12); border: 1px solid rgba(0, 229, 255, 0.25); color: #00e5ff; display: inline-flex; align-items: center; justify-content: center; font-size: 22px; margin-bottom: 14px;">
+                        <i class="fa-solid fa-cubes-stacked"></i>
+                    </div>
+                    <h4 style="font-size: 16px; font-weight: 700; color: #fff; margin: 0 0 8px 0;">No External MCP Servers Configured</h4>
+                    <p style="font-size: 13px; color: var(--scout-text-secondary); max-width: 520px; margin: 0 auto 16px auto; line-height: 1.5;">
+                        Connect external Model Context Protocol (MCP) servers to grant autonomous tools to Scout under <strong>${escapeHtml(state.user?.email || 'this account')}</strong>.
+                    </p>
+                    <div style="display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; margin-bottom: 14px;">
+                        <button type="button" class="btn btn-sm btn-primary" onclick="openAddMcpModal()">
+                            <i class="fa-solid fa-plus"></i> Connect First MCP Server
+                        </button>
+                        <button type="button" class="btn btn-sm btn-outline" onclick="checkServerStatusAndSession().then(loadMcpData)">
+                            <i class="fa-solid fa-satellite-dish"></i> Sync with Local CLI Server
+                        </button>
+                    </div>
+                    <div style="font-size: 11px; color: var(--scout-text-dim);">
+                        <i class="fa-solid fa-terminal" style="color: #00e5ff;"></i> Tip: Run <code>scout dashboard</code> in your terminal for real-time 2-way CLI sync.
+                    </div>
+                </div>
+            `;
+            return;
+        }
+
         container.innerHTML = `
             <div style="padding: 48px 24px; text-align: center;">
                 <div style="width: 56px; height: 56px; border-radius: 14px; background: rgba(0, 229, 255, 0.08); border: 1px solid rgba(0, 229, 255, 0.2); color: #00e5ff; display: inline-flex; align-items: center; justify-content: center; font-size: 24px; margin-bottom: 16px;">
@@ -3454,6 +3620,9 @@ async function handleAddMcpServerSubmit(e) {
     }
 
     try {
+        const userEmail = (state.user?.email || '').trim().toLowerCase();
+        const userId = state.user?.id || state.user?.uid || undefined;
+
         const payload = {
             name,
             transport,
@@ -3463,6 +3632,8 @@ async function handleAddMcpServerSubmit(e) {
             authType,
             headerKey: authType === 'apiKey' ? headerKey : undefined,
             token: authType !== 'none' ? token : undefined,
+            userId,
+            userEmail: userEmail || undefined,
             permissions: {
                 autoApproveSafe,
                 requireConfirmationForDestructive,
@@ -3470,20 +3641,51 @@ async function handleAddMcpServerSubmit(e) {
             autoConnect,
         };
 
-        const res = await fetch('/api/mcp/servers', {
-            method: 'POST',
-            headers: { 'Content-Type': 'application/json' },
-            body: JSON.stringify(payload)
-        });
+        const apiBase = getMcpApiBase();
+        const canCallApi = state.serverConnected || window.location.hostname === 'localhost' || window.location.hostname === '127.0.0.1' || (apiBase && apiBase.length > 0);
 
-        const data = await res.json();
-        if (data.success) {
-            showToast(`Connected to MCP server "${name}"! Discovered ${data.server.tools?.length || 0} tools.`, 'success');
+        if (canCallApi) {
+            const res = await fetch(`${apiBase}/api/mcp/servers`, {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify(payload)
+            });
+
+            const data = await res.json();
+            if (data.success) {
+                showToast(`Connected to MCP server "${name}"! Discovered ${data.server?.tools?.length || 0} tools.`, 'success');
+                closeAddMcpModal();
+                getEl('form-add-mcp')?.reset();
+                await loadMcpData();
+            } else {
+                showToast(data.error || 'Failed to add MCP server', 'error');
+            }
+        } else {
+            // Standalone Cloud Web Mode fallback on scout.frontterrain.com
+            const newServer = {
+                id: `mcp_${Date.now()}_${Math.random().toString(36).substring(2, 7)}`,
+                name,
+                transport,
+                endpoint: transport === 'http' ? endpoint : undefined,
+                command: transport === 'stdio' ? command : undefined,
+                args: transport === 'stdio' ? args : undefined,
+                authType,
+                headerKey: authType === 'apiKey' ? headerKey : undefined,
+                status: transport === 'http' ? 'connected' : 'disconnected',
+                userId,
+                userEmail: userEmail || 'default',
+                tools: [],
+                createdAt: new Date().toISOString()
+            };
+            mcpState.servers.push(newServer);
+            const storageKey = getAccountMcpStorageKey();
+            localStorage.setItem(storageKey, JSON.stringify(mcpState.servers));
+            localStorage.setItem('scout_cached_mcp_servers', JSON.stringify(mcpState.servers));
+            showToast(`MCP server "${name}" saved for ${state.user?.email || 'your account'}.`, 'success');
             closeAddMcpModal();
             getEl('form-add-mcp')?.reset();
-            await loadMcpData();
-        } else {
-            showToast(data.error || 'Failed to add MCP server', 'error');
+            renderMcpKpis();
+            renderMcpServersList();
         }
     } catch (err) {
         showToast(err.message || 'Error connecting MCP server', 'error');
@@ -3560,7 +3762,7 @@ function closeInspectMcpModal() {
 async function connectMcpServer(serverId) {
     try {
         showToast('Connecting to MCP server...', 'info');
-        const res = await fetch(`/api/mcp/servers/${encodeURIComponent(serverId)}/connect`, { method: 'POST' });
+        const res = await fetch(`${getMcpApiBase()}/api/mcp/servers/${encodeURIComponent(serverId)}/connect`, { method: 'POST' });
         const data = await res.json();
         if (data.success) {
             showToast(`Connected! Discovered ${data.server.tools?.length || 0} tools.`, 'success');
@@ -3575,7 +3777,7 @@ async function connectMcpServer(serverId) {
 
 async function disconnectMcpServer(serverId) {
     try {
-        const res = await fetch(`/api/mcp/servers/${encodeURIComponent(serverId)}/disconnect`, { method: 'POST' });
+        const res = await fetch(`${getMcpApiBase()}/api/mcp/servers/${encodeURIComponent(serverId)}/disconnect`, { method: 'POST' });
         const data = await res.json();
         if (data.success) {
             showToast('MCP server disconnected.', 'info');
@@ -3593,14 +3795,29 @@ async function deleteMcpServer(serverId) {
         return;
     }
     try {
-        const res = await fetch(`/api/mcp/servers/${encodeURIComponent(serverId)}`, { method: 'DELETE' });
-        const data = await res.json();
-        if (data.success) {
-            showToast('MCP server removed.', 'info');
-            await loadMcpData();
+        const apiBase = getMcpApiBase();
+        const canCallApi = state.serverConnected || window.location.hostname === 'localhost' || window.location.hostname === '127.0.0.1' || (apiBase && apiBase.length > 0);
+
+        if (canCallApi) {
+            const res = await fetch(`${apiBase}/api/mcp/servers/${encodeURIComponent(serverId)}`, { method: 'DELETE' });
+            const data = await res.json();
+            if (data.success) {
+                showToast('MCP server removed.', 'info');
+            } else {
+                showToast(data.error || 'Failed to delete server', 'error');
+            }
         } else {
-            showToast(data.error || 'Failed to delete server', 'error');
+            showToast('MCP server removed from your account.', 'info');
         }
+
+        mcpState.servers = mcpState.servers.filter(s => s.id !== serverId);
+        const storageKey = getAccountMcpStorageKey();
+        try {
+            localStorage.setItem(storageKey, JSON.stringify(mcpState.servers));
+            localStorage.setItem('scout_cached_mcp_servers', JSON.stringify(mcpState.servers));
+        } catch { }
+        renderMcpKpis();
+        renderMcpServersList();
     } catch (err) {
         showToast(err.message || 'Error deleting server', 'error');
     }
@@ -3608,7 +3825,7 @@ async function deleteMcpServer(serverId) {
 
 async function toggleMcpTool(serverId, toolName, enabled) {
     try {
-        const res = await fetch(`/api/mcp/servers/${encodeURIComponent(serverId)}/tools/${encodeURIComponent(toolName)}/toggle`, {
+        const res = await fetch(`${getMcpApiBase()}/api/mcp/servers/${encodeURIComponent(serverId)}/tools/${encodeURIComponent(toolName)}/toggle`, {
             method: 'POST',
             headers: { 'Content-Type': 'application/json' },
             body: JSON.stringify({ enabled })
@@ -3631,6 +3848,11 @@ async function toggleMcpTool(serverId, toolName, enabled) {
     }
 }
 
+// Auto-sync when window regains focus (e.g., returning from CLI terminal)
+window.addEventListener('focus', () => {
+    loadMcpData();
+});
+
 // Global exports for inline HTML event handlers
 window.loadMcpData = loadMcpData;
 window.openAddMcpModal = openAddMcpModal;

package/web/styles.css

@@ -1,5 +1,5 @@
 /* ==========================================================================
-   FrontTerrain Scout  Design System & Visual Engine v9.0.8
+   FrontTerrain Scout  Design System & Visual Engine v9.0.9
    Inspired by HappyRobot, Linear.app & Vercel aesthetics
    ========================================================================== */
 
@@ -1055,7 +1055,7 @@ h1, h2, h3, h4, h5, h6 {
 .footer-links a:hover { color: var(--hr-rust); }
 
 /* ==========================================================================
-   Visual Perception & Automation Engine v9.0.8
+   Visual Perception & Automation Engine v9.0.9
    ========================================================================== */
 .vision-banner {
   margin-bottom: 28px;