@cloudbase/cloudbase-mcp 2.21.1-beta.2 → 2.22.0-beta.0

package/dist/{267.index.js → 341.index.js}

@@ -1,12 +1,9 @@
-import * as __WEBPACK_EXTERNAL_MODULE_express__ from "express";
-import * as __WEBPACK_EXTERNAL_MODULE_open__ from "open";
-import * as __WEBPACK_EXTERNAL_MODULE_ws__ from "ws";
-export const __webpack_esm_id__ = 267;
-export const __webpack_esm_ids__ = [267];
-export const __webpack_esm_modules__ = {
+export const __webpack_id__ = 341;
+export const __webpack_ids__ = [341];
+export const __webpack_modules__ = {
 
-/***/ 6267
-(__unused_webpack_module, exports, __webpack_require__) {
+/***/ 2341:
+/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 
 var __importDefault = (this && this.__importDefault) || function (mod) {
@@ -22,8 +19,8 @@ const http_1 = __importDefault(__webpack_require__(3782));
 const child_process_1 = __webpack_require__(5814);
 const open_1 = __importDefault(__webpack_require__(1622));
 const ws_1 = __webpack_require__(6220);
-const index_js_1 = __webpack_require__(9903);
-const logger_js_1 = __webpack_require__(781);
+const index_js_1 = __webpack_require__(9529);
+const logger_js_1 = __webpack_require__(3039);
 function isVSCodeEnvironment() {
     return Boolean(process.env.VSCODE_IPC_HOOK_CLI ||
         process.env.VSCODE_PID ||
@@ -2979,873 +2976,254 @@ async function getInteractiveServerSafe(mcpServer) {
 }
 
 
-/***/ },
+/***/ }),
 
-/***/ 4415
-(__unused_webpack_module, exports) {
+/***/ 4112:
+/***/ ((__unused_webpack_module, exports) => {
 
-var __webpack_unused_export__;
 
 /**
- * Reusable UI components for env setup page
+ * HTML template structure
  */
-__webpack_unused_export__ = ({ value: true });
-exports.renderHeader = renderHeader;
-exports.renderSearchBox = renderSearchBox;
-exports.renderEnvItem = renderEnvItem;
-exports.renderEmptyState = renderEmptyState;
-exports.renderNoResultsState = renderNoResultsState;
-exports.renderHelpLinks = renderHelpLinks;
-exports.renderActionButtons = renderActionButtons;
-exports.renderLoadingState = renderLoadingState;
-exports.renderSuccessState = renderSuccessState;
-exports.renderErrorBanner = renderErrorBanner;
-function renderHeader(accountInfo, ide) {
-    const hasAccount = !!accountInfo?.uin;
-    const isCodeBuddy = ide === "CodeBuddy";
-    return `
-    <div class="header">
-      <div class="header-left">
-        <img class="logo" src="https://7463-tcb-advanced-a656fc-1257967285.tcb.qcloud.la/mcp/cloudbase-logo.svg" alt="CloudBase Logo" />
-        <span class="title">CloudBase</span>
-      </div>
-      ${(hasAccount && accountInfo.region !== 'ap-singapore') ? /** 国际站不支持切 */ `
-        <div class="header-right">
-          <div class="account-section">
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
-              <path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/>
-              <circle cx="12" cy="7" r="4"/>
-            </svg>
-            <span class="account-uin">${accountInfo.uin}</span>
-            ${accountInfo.region ? `<span class="account-region">${accountInfo.region}</span>` : ''}
-            ${!isCodeBuddy ? `
-              <button class="btn-switch" onclick="switchAccount()" title="切换账号">
-                <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
-                  <path d="M17 2l4 4-4 4M7 22l-4-4 4-4M21 6H10M3 18h11"/>
-                </svg>
-              </button>
-            ` : ''}
-          </div>
-        </div>
-      ` : ''}
-    </div>
-  `.trim();
-}
-function renderSearchBox() {
-    return `
-    <div class="search-section">
-      <div class="search-box">
-        <svg class="search-icon" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
-          <circle cx="11" cy="11" r="8"/>
-          <path d="m21 21-4.35-4.35"/>
-        </svg>
-        <input 
-          type="text" 
-          id="searchInput" 
-          class="search-input" 
-          placeholder="搜索环境名称或 ID..."
-          oninput="filterEnvs(this.value)"
-        />
-        <button class="search-clear" onclick="clearSearch()" id="searchClear" style="display: none;">
-          <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
-            <path d="M18 6L6 18M6 6l12 12"/>
-          </svg>
-        </button>
-      </div>
-      <div class="search-actions">
-        <button class="btn-action" onclick="createNewEnv()" title="新建环境">
-          <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
-            <path d="M12 5v14M5 12h14"/>
-          </svg>
-          <span class="btn-text">新建环境</span>
-        </button>
-        <button class="btn-action" onclick="refreshEnvList()" title="刷新环境列表">
-          <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
-            <path d="M21.5 2v6h-6M2.5 22v-6h6M2 11.5a10 10 0 0 1 18.8-4.3M22 12.5a10 10 0 0 1-18.8 4.2"/>
-          </svg>
-        </button>
-      </div>
-    </div>
-  `.trim();
-}
-function renderEnvItem(env, index) {
-    const alias = env.Alias || '(未命名)';
-    const envId = env.EnvId;
-    const hasAlias = !!env.Alias;
-    return `
-    <div class="env-item" onclick="selectEnv('${envId}', this)">
-      <div class="env-info">
-        <div class="env-name ${!hasAlias ? 'unnamed' : ''}">${alias}</div>
-        <div class="env-id">${envId}</div>
-      </div>
-    </div>
-  `.trim();
-}
-function renderEmptyState(hasInitError) {
-    return `
-    <div class="empty-state">
-      <p class="empty-message">
-        暂无环境，请先<a href="https://buy.cloud.tencent.com/lowcode?buyType=tcb&channel=mcp" onclick="openUrl(event, 'https://buy.cloud.tencent.com/lowcode?buyType=tcb&channel=mcp'); return false;" class="create-env-link">创建环境</a>，然后点击刷新按钮重试
-      </p>
-    </div>
-  `.trim();
-}
-function renderNoResultsState() {
-    return `
-    <div class="empty-state" id="noResults" style="display: none;">
-      <svg width="40" height="40" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="opacity: 0.3;">
-        <circle cx="11" cy="11" r="8"/>
-        <path d="m21 21-4.35-4.35"/>
-      </svg>
-      <p class="empty-message">未找到匹配的环境</p>
-    </div>
-  `.trim();
-}
-function renderHelpLinks() {
-    return `
-    <div class="help-links">
-      <a href="https://docs.cloudbase.net/ai/cloudbase-ai-toolkit/" onclick="openUrl(event, 'https://docs.cloudbase.net/ai/cloudbase-ai-toolkit/'); return false;" class="help-link">
-        <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
-          <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/>
-          <polyline points="14 2 14 8 20 8"/>
-          <line x1="16" y1="13" x2="8" y2="13"/>
-          <line x1="16" y1="17" x2="8" y2="17"/>
-        </svg>
-        帮助文档
-      </a>
-      <a href="https://docs.cloudbase.net/ai/cloudbase-ai-toolkit/tutorials" onclick="openUrl(event, 'https://docs.cloudbase.net/ai/cloudbase-ai-toolkit/tutorials'); return false;" class="help-link">
-        <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
-          <polygon points="23 7 16 12 23 17 23 7"/>
-          <rect x="1" y="5" width="15" height="14" rx="2" ry="2"/>
-        </svg>
-        视频教程
-      </a>
-      <a href="https://github.com/TencentCloudBase/CloudBase-AI-ToolKit" onclick="openUrl(event, 'https://github.com/TencentCloudBase/CloudBase-AI-ToolKit'); return false;" class="help-link">
-        <svg width="13" height="13" viewBox="0 0 24 24" fill="currentColor">
-          <path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/>
-        </svg>
-        GitHub
-      </a>
-    </div>
-  `.trim();
-}
-function renderActionButtons(hasEnvs, hasInitError) {
-    return `
-    <div class="actions">
-      <button class="btn btn-secondary" onclick="cancel()">
-        <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
-          <path d="M18 6L6 18M6 6l12 12"/>
-        </svg>
-        取消
-      </button>
-      <button class="btn btn-primary" id="confirmBtn" onclick="confirm()" disabled>
-        <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
-          <path d="M20 6L9 17l-5-5"/>
-        </svg>
-        确认选择
-      </button>
-    </div>
-  `.trim();
-}
-function renderLoadingState() {
-    return `
-    <div class="loading" id="loading" style="display: none;">
-      <div class="spinner"></div>
-      <span>正在配置环境...</span>
-    </div>
-  `.trim();
-}
-function renderSuccessState() {
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.buildHTMLPage = buildHTMLPage;
+function buildHTMLPage(css, body, scripts) {
     return `
-    <div class="success-state" id="successState" style="display: none;">
-      <div class="success-icon">
-        <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-          <path d="M20 6L9 17l-5-5"/>
-        </svg>
-      </div>
-      <h2 class="success-title">环境配置成功！</h2>
-      <p class="success-message">已成功选择 CloudBase 环境</p>
-      <div class="selected-env-info">
-        <span class="env-label">环境 ID:</span>
-        <span class="env-value" id="selectedEnvDisplay"></span>
-      </div>
-    </div>
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>CloudBase MCP - 环境配置</title>
+    ${css}
+</head>
+<body>
+    ${body}
+    ${scripts}
+</body>
+</html>
   `.trim();
 }
-function renderErrorBanner(errorContext, sessionId) {
-    const initTcbError = errorContext?.initTcbError;
-    const createEnvError = errorContext?.createEnvError;
-    // Only show initTcbError, hide createEnvError
-    if (!initTcbError) {
-        return '';
-    }
-    return `
-    <div class="info-banner" id="errorBanner">
-      ${initTcbError ? `
-        <div class="info-item">
-          <div class="info-header">
-            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-              <circle cx="12" cy="12" r="10"/>
-              <line x1="12" y1="8" x2="12" y2="12"/>
-              <line x1="12" y1="16" x2="12.01" y2="16"/>
-            </svg>
-            <span class="info-title">${escapeHtml(initTcbError.message)}</span>
-          </div>
-          <div class="info-message">${escapeHtml(initTcbError.actionText || '')}</div>
-          ${initTcbError.requestId ? `
-            <div class="info-details">
-              <span class="detail-label">错误码:</span> <span class="detail-value">${escapeHtml(initTcbError.code)}</span>
-              <span class="detail-label">请求 ID:</span> <span class="detail-value">${escapeHtml(initTcbError.requestId)}</span>
-            </div>
-          ` : ''}
-          ${initTcbError.needRealNameAuth ? `
-            <div class="error-action">
-              <a href="${initTcbError.helpUrl || 'https://buy.cloud.tencent.com/lowcode?buyType=tcb&channel=mcp'}" onclick="openUrl(event, '${initTcbError.helpUrl || 'https://buy.cloud.tencent.com/lowcode?buyType=tcb&channel=mcp'}'); return false;" class="error-link">
-                前往实名认证
-              </a>
-            </div>
-          ` : ''}
-          ${initTcbError.needCamAuth ? `
-            <div class="error-action">
-              <a href="${initTcbError.helpUrl || 'https://buy.cloud.tencent.com/lowcode?buyType=tcb&channel=mcp'}" onclick="openUrl(event, '${initTcbError.helpUrl || 'https://buy.cloud.tencent.com/lowcode?buyType=tcb&channel=mcp'}'); return false;" class="error-link">
-                前往开通 CloudBase 服务
-              </a>
-              ${sessionId ? `
-                <button class="error-link error-retry-btn" onclick="retryInitTcb('${sessionId}')">
-                  <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                    <path d="M23 4v6h-6M1 20v-6h6M3.51 9a9 9 0 0 1 14.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0 0 20.49 15"/>
-                  </svg>
-                  重试
-                </button>
-              ` : ''}
-            </div>
-          ` : ''}
-          ${!initTcbError.needRealNameAuth && !initTcbError.needCamAuth && initTcbError.helpUrl ? `
-            <div class="error-action">
-              <a href="${initTcbError.helpUrl}" onclick="openUrl(event, '${initTcbError.helpUrl}'); return false;" class="error-link">
-                前往开通 CloudBase 服务
-              </a>
-              ${sessionId ? `
-                <button class="error-link error-retry-btn" onclick="retryInitTcb('${sessionId}')">
-                  <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                    <path d="M23 4v6h-6M1 20v-6h6M3.51 9a9 9 0 0 1 14.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0 0 20.49 15"/>
-                  </svg>
-                  重试
-                </button>
-              ` : ''}
-            </div>
-          ` : ''}
-        </div>
-      ` : ''}
-    </div>
-  `.trim();
-}
-// Helper function to escape HTML
-function escapeHtml(text) {
-    const map = {
-        '&': '&amp;',
-        '<': '&lt;',
-        '>': '&gt;',
-        '"': '&quot;',
-        "'": '&#039;'
-    };
-    return text.replace(/[&<>"']/g, (m) => map[m]);
-}
 
 
-/***/ },
+/***/ }),
 
-/***/ 4182
-(__unused_webpack_module, exports) {
+/***/ 6975:
+/***/ ((__unused_webpack_module, exports) => {
 
-var __webpack_unused_export__;
 
 /**
- * HTML template structure
+ * CSS styles for env setup page
  */
-__webpack_unused_export__ = ({ value: true });
-exports.buildHTMLPage = buildHTMLPage;
-function buildHTMLPage(css, body, scripts) {
-    return `
-<!DOCTYPE html>
-<html lang="zh-CN">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>CloudBase MCP - 环境配置</title>
-    ${css}
-</head>
-<body>
-    ${body}
-    ${scripts}
-</body>
-</html>
-  `.trim();
-}
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.CSS_STYLES = void 0;
+exports.CSS_STYLES = `
+<style>
+  @import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&display=swap');
 
+  * { margin: 0; padding: 0; box-sizing: border-box; }
+  
+  :root {
+    --primary-color: #1a1a1a;
+    --primary-hover: #000000;
+    --accent-color: #67E9E9;
+    --accent-hover: #2BCCCC;
+    --text-primary: #ffffff;
+    --text-secondary: #a0a0a0;
+    --border-color: rgba(255, 255, 255, 0.15);
+    --bg-secondary: rgba(255, 255, 255, 0.08);
+    --bg-glass: rgba(26, 26, 26, 0.95);
+    --shadow: 0 25px 50px rgba(0, 0, 0, 0.3), 0 10px 20px rgba(0, 0, 0, 0.2);
+    --font-mono: 'JetBrains Mono', 'SF Mono', 'Monaco', monospace;
+    --header-bg: linear-gradient(135deg, #0a0a0a 0%, #1a1a1a 50%, #0d1117 100%);
+  }
 
-/***/ },
+  body {
+    font-family: var(--font-mono);
+    background: linear-gradient(135deg, #0a0a0a 0%, #1a1a1a 100%);
+    min-height: 100vh;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 20px;
+    position: relative;
+    overflow-x: hidden;
+    overflow-y: auto;
+  }
 
-/***/ 9903
-(__unused_webpack_module, exports, __webpack_require__) {
+  /* Custom scrollbar styles */
+  ::-webkit-scrollbar {
+    width: 8px;
+  }
 
-var __webpack_unused_export__;
+  ::-webkit-scrollbar-track {
+    background: rgba(255, 255, 255, 0.05);
+    border-radius: 4px;
+  }
 
-/**
- * Main renderer for env setup page
- */
-__webpack_unused_export__ = ({ value: true });
-exports.renderEnvSetupPage = renderEnvSetupPage;
-const components_js_1 = __webpack_require__(4415);
-const html_js_1 = __webpack_require__(4182);
-const scripts_js_1 = __webpack_require__(7335);
-const styles_js_1 = __webpack_require__(7373);
-/**
- * Render the complete env setup page
- */
-function renderEnvSetupPage(options) {
-    const { envs = [], accountInfo, errorContext, sessionId, wsPort, ide } = options;
-    const hasEnvs = envs.length > 0;
-    const hasInitError = !!errorContext?.initTcbError;
-    const hasErrors = !!(errorContext?.initTcbError || errorContext?.createEnvError);
-    // Build env list HTML
-    let envListHTML = '';
-    if (hasEnvs) {
-        envListHTML = `
-      ${(0, components_js_1.renderSearchBox)()}
-      <div class="env-list" id="envList">
-        ${envs.map((env, index) => (0, components_js_1.renderEnvItem)(env, index)).join('\n')}
-      </div>
-      ${(0, components_js_1.renderNoResultsState)()}
-    `;
-    }
-    else {
-        // 暂无环境时也显示搜索框、新建和刷新按钮
-        envListHTML = `
-      ${(0, components_js_1.renderSearchBox)()}
-      <div class="env-list" id="envList">
-        ${(0, components_js_1.renderEmptyState)(hasInitError)}
-      </div>
-      ${(0, components_js_1.renderNoResultsState)()}
-    `;
-    }
-    // Build body HTML
-    const bodyHTML = `
-    <div class="modal">
-      ${(0, components_js_1.renderHeader)(accountInfo, ide)}
-      <div class="content">
-        <h1 class="content-title">选择环境</h1>
-        
-        ${hasErrors ? (0, components_js_1.renderErrorBanner)(errorContext, sessionId) : ''}
-        
-        ${envListHTML}
-        
-        ${(0, components_js_1.renderActionButtons)(hasEnvs, hasInitError)}
-        
-        ${(0, components_js_1.renderHelpLinks)()}
-        
-        ${(0, components_js_1.renderLoadingState)()}
-        
-        ${(0, components_js_1.renderSuccessState)()}
-      </div>
-    </div>
-  `;
-    // Get JavaScript with WebSocket port
-    const scripts = (0, scripts_js_1.getJavaScripts)(wsPort);
-    // Assemble final HTML
-    return (0, html_js_1.buildHTMLPage)(styles_js_1.CSS_STYLES, bodyHTML, scripts);
-}
+  ::-webkit-scrollbar-thumb {
+    background: var(--accent-color);
+    border-radius: 4px;
+  }
 
+  ::-webkit-scrollbar-thumb:hover {
+    background: var(--accent-hover);
+  }
 
-/***/ },
+  body::before {
+    content: '';
+    position: fixed;
+    top: 0; left: 0; right: 0; bottom: 0;
+    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grid" width="20" height="20" patternUnits="userSpaceOnUse"><path d="M 20 0 L 0 0 0 20" fill="none" stroke="rgba(255,255,255,0.02)" stroke-width="1"/></pattern></defs><rect width="100" height="100" fill="url(%23grid)"/></svg>') repeat;
+    pointer-events: none;
+    z-index: -1;
+  }
 
-/***/ 7335
-(__unused_webpack_module, exports) {
+  body::after {
+    content: '';
+    position: fixed;
+    top: 50%; left: 50%;
+    width: 500px; height: 500px;
+    background: radial-gradient(circle, rgba(103, 233, 233, 0.05) 0%, transparent 70%);
+    transform: translate(-50%, -50%);
+    pointer-events: none;
+    z-index: -1;
+    animation: pulse 8s ease-in-out infinite;
+  }
 
-var __webpack_unused_export__;
+  @keyframes pulse {
+    0%, 100% { opacity: 0.3; transform: translate(-50%, -50%) scale(1); }
+    50% { opacity: 0.6; transform: translate(-50%, -50%) scale(1.1); }
+  }
 
-/**
- * JavaScript logic for env setup page
- */
-__webpack_unused_export__ = ({ value: true });
-exports.getJavaScripts = getJavaScripts;
-function getJavaScripts(wsPort) {
-    return `
-<script>
-  let selectedEnvId = null;
+  .modal {
+    background: var(--bg-glass);
+    backdrop-filter: blur(20px);
+    border-radius: 20px;
+    box-shadow: var(--shadow);
+    border: 1px solid var(--border-color);
+    width: 100%;
+    max-width: 640px;
+    overflow: hidden;
+    animation: modalIn 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
+    position: relative;
+  }
 
-  // Select environment
-  function selectEnv(envId, element) {
-    console.log('[env-setup] Selecting environment:', envId);
-    selectedEnvId = envId;
-    
-    // Remove selected class from all items
-    document.querySelectorAll('.env-item').forEach(item => {
-      item.classList.remove('selected');
-    });
-    
-    // Add selected class to current item
-    element.classList.add('selected');
-    
-    // Enable confirm button
-    document.getElementById('confirmBtn').disabled = false;
+  .modal::before {
+    content: '';
+    position: absolute;
+    top: 0; left: 0; right: 0; bottom: 0;
+    background: linear-gradient(45deg, transparent 30%, rgba(255,255,255,0.02) 50%, transparent 70%);
+    animation: shimmer 3s infinite;
+    pointer-events: none;
   }
 
-  // Filter environments
-  function filterEnvs(searchTerm) {
-    const items = document.querySelectorAll('.env-item');
-    const searchClear = document.getElementById('searchClear');
-    let visibleCount = 0;
-    
-    items.forEach(item => {
-      const name = item.querySelector('.env-name').textContent.toLowerCase();
-      const id = item.querySelector('.env-id').textContent.toLowerCase();
-      const match = name.includes(searchTerm.toLowerCase()) || 
-                   id.includes(searchTerm.toLowerCase());
-      
-      item.style.display = match ? 'flex' : 'none';
-      if (match) visibleCount++;
-    });
-    
-    // Show/hide clear button
-    if (searchClear) {
-      searchClear.style.display = searchTerm ? 'flex' : 'none';
+  @keyframes shimmer {
+    0% { transform: translateX(-100%); }
+    100% { transform: translateX(100%); }
+  }
+
+  @keyframes modalIn {
+    from {
+      opacity: 0;
+      transform: scale(0.9) translateY(-20px);
     }
-    
-    // Show/hide no results message
-    const noResults = document.getElementById('noResults');
-    if (noResults) {
-      const hasItems = items.length > 0;
-      noResults.style.display = visibleCount === 0 && hasItems ? 'block' : 'none';
+    to {
+      opacity: 1;
+      transform: scale(1) translateY(0);
     }
   }
 
-  // Clear search
-  function clearSearch() {
-    const searchInput = document.getElementById('searchInput');
-    if (searchInput) {
-      searchInput.value = '';
-      filterEnvs('');
-      searchInput.focus();
-    }
+  .header {
+    background: var(--header-bg);
+    color: var(--text-primary);
+    padding: 20px 32px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    position: relative;
+    overflow: hidden;
   }
 
-  // WebSocket: same host as page so it works in remote VS Code / Cloud IDE (no localhost)
-  const wsScheme = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
-  const wsUrl = wsScheme + '//' + window.location.host;
-  const ws = new WebSocket(wsUrl);
-  
-  ws.onopen = () => {
-    console.log('[env-setup] WebSocket connected');
-    // Send session ID to server to associate this WebSocket with the session
-    const sessionId = window.location.pathname.split('/').pop();
-    ws.send(JSON.stringify({
-      type: 'registerSession',
-      sessionId: sessionId
-    }));
-  };
-  
-  ws.onmessage = (event) => {
-    const data = JSON.parse(event.data);
-    console.log('[env-setup] Received message:', data);
-    
-    if (data.type === 'success' && data.envId) {
-      showSuccess(data.envId);
-    } else if (data.type === 'envListRefreshed') {
-      if (data.success) {
-        console.log('[env-setup] Environment list refreshed, reloading page');
-        // Reload the page to show updated environment list
-        window.location.reload();
-      } else {
-        console.error('[env-setup] Failed to refresh environment list:', data.error);
-        alert('刷新环境列表失败: ' + (data.error || '未知错误'));
-      }
-    }
-  };
-
-  ws.onerror = (error) => {
-    console.error('[env-setup] WebSocket error:', error);
-  };
-
-  ws.onclose = () => {
-    console.log('[env-setup] WebSocket closed');
-  };
-
-  // Show success state
-  function showSuccess(envId) {
-    document.querySelector('.content').style.display = 'none';
-    const successState = document.getElementById('successState');
-    const selectedEnvDisplay = document.getElementById('selectedEnvDisplay');
-    
-    if (successState && selectedEnvDisplay) {
-      selectedEnvDisplay.textContent = envId;
-      successState.style.display = 'block';
-    }
+  .header::before {
+    content: '';
+    position: absolute;
+    top: 0; left: 0; right: 0; bottom: 0;
+    background: linear-gradient(45deg, transparent 30%, rgba(255,255,255,0.03) 50%, transparent 70%);
+    animation: headerShimmer 4s infinite;
+    pointer-events: none;
   }
 
-  // Confirm selection
-  function confirm() {
-    if (!selectedEnvId) {
-      console.warn('[env-setup] No environment selected');
-      return;
-    }
-    
-    console.log('[env-setup] Confirming selection:', selectedEnvId);
-    
-    if (ws.readyState === WebSocket.OPEN) {
-      ws.send(JSON.stringify({
-        type: 'envId',
-        data: selectedEnvId,
-        cancelled: false
-      }));
-      
-      // Close window immediately after sending confirmation
-      setTimeout(() => {
-        window.close();
-      }, 100);
-    } else {
-      console.error('[env-setup] WebSocket not connected');
-      alert('连接已断开，请刷新页面重试');
-    }
+  @keyframes headerShimmer {
+    0% { transform: translateX(-100%); }
+    100% { transform: translateX(100%); }
   }
 
-  // Cancel
-  function cancel() {
-    console.log('[env-setup] Cancelling');
-    if (ws.readyState === WebSocket.OPEN) {
-      ws.send(JSON.stringify({
-        type: 'envId',
-        data: null,
-        cancelled: true
-      }));
-      
-      // Close window immediately after sending cancellation
-      setTimeout(() => {
-        window.close();
-      }, 100);
-    }
+  .header-left {
+    display: flex;
+    align-items: center;
+    gap: 16px;
+    z-index: 1;
   }
 
-  // Switch account
-  function switchAccount() {
-    console.log('[env-setup] Switching account');
-    if (ws.readyState === WebSocket.OPEN) {
-      ws.send(JSON.stringify({
-        type: 'envId',
-        data: null,
-        switch: true
-      }));
-      
-      // Close window immediately after sending switch request
-      setTimeout(() => {
-        window.close();
-      }, 100);
-    }
+  .logo {
+    width: 32px;
+    height: 32px;
+    filter: drop-shadow(0 4px 8px rgba(0,0,0,0.2));
+    animation: logoFloat 3s ease-in-out infinite;
   }
 
-  // Universal URL opener - works with all IDEs including CodeBuddy
-  async function openUrl(event, url) {
-    if (event) {
-      event.preventDefault();
-    }
-    
-    console.log('[env-setup] Opening URL:', url);
-    
-    try {
-      const response = await fetch('/api/open-url', {
-        method: 'POST',
-        headers: {
-          'Content-Type': 'application/json',
-        },
-        body: JSON.stringify({ url }),
-      });
-      
-      const result = await response.json();
-      
-      if (!result.success) {
-        console.error('[env-setup] Failed to open URL:', result.error);
-        // Fallback to direct open if API fails
-        window.open(url, '_blank');
-      }
-    } catch (error) {
-      console.error('[env-setup] Error opening URL:', error);
-      // Fallback to direct open if API fails
-      window.open(url, '_blank');
-    }
+  @keyframes logoFloat {
+    0%, 100% { transform: translateY(0px); }
+    50% { transform: translateY(-3px); }
   }
 
-  // Create new environment
-  function createNewEnv() {
-    console.log('[env-setup] Creating new environment');
-    openUrl(null, 'https://buy.cloud.tencent.com/lowcode?buyType=tcb&channel=mcp');
+  .title {
+    font-size: 18px;
+    font-weight: 600;
+    text-shadow: 0 2px 4px rgba(0,0,0,0.1);
   }
 
-  // Refresh environment list
-  function refreshEnvList() {
-    console.log('[env-setup] Refreshing environment list');
-    if (ws.readyState === WebSocket.OPEN) {
-      ws.send(JSON.stringify({
-        type: 'refreshEnvList'
-      }));
-      
-      // Add rotation animation
-      const btn = event.target.closest('.btn-refresh');
-      if (btn) {
-        btn.style.transform = 'rotate(360deg)';
-        setTimeout(() => {
-          btn.style.transform = 'rotate(0deg)';
-        }, 600);
-      }
-    }
+  .header-right {
+    display: flex;
+    align-items: center;
+    gap: 16px;
+    z-index: 1;
   }
 
-  // Retry init TCB
-  function retryInitTcb(sessionId) {
-    console.log('[env-setup] Retrying TCB initialization:', sessionId);
-    if (ws.readyState === WebSocket.OPEN) {
-      ws.send(JSON.stringify({
-        type: 'retryInitTcb',
-        sessionId: sessionId
-      }));
-    }
+  .account-section {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    padding: 6px 12px;
+    background: rgba(255, 255, 255, 0.04);
+    border: 1px solid var(--border-color);
+    border-radius: 8px;
   }
 
-  // Initialize on page load
-  window.addEventListener('load', () => {
-    // Auto-select first environment if exists
-    const firstEnvItem = document.querySelector('.env-item');
-    if (firstEnvItem && !selectedEnvId) {
-      const envId = firstEnvItem.getAttribute('onclick')?.match(/selectEnv\\('([^']+)'/)?.[1];
-      if (envId) {
-        selectEnv(envId, firstEnvItem);
-        console.log('[env-setup] Auto-selected first environment:', envId);
-      }
-    }
-  });
-</script>
-  `.trim();
-}
-
-
-/***/ },
+  .account-uin {
+    font-size: 12px;
+    color: var(--text-secondary);
+    font-family: var(--font-mono);
+  }
 
-/***/ 7373
-(__unused_webpack_module, exports) {
+  .btn-switch {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 4px;
+    background: transparent;
+    border: none;
+    color: var(--text-secondary);
+    cursor: pointer;
+    transition: all 0.3s ease;
+    border-radius: 4px;
+  }
 
-var __webpack_unused_export__;
-
-/**
- * CSS styles for env setup page
- */
-__webpack_unused_export__ = ({ value: true });
-exports.CSS_STYLES = void 0;
-exports.CSS_STYLES = `
-<style>
-  @import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&display=swap');
-
-  * { margin: 0; padding: 0; box-sizing: border-box; }
-  
-  :root {
-    --primary-color: #1a1a1a;
-    --primary-hover: #000000;
-    --accent-color: #67E9E9;
-    --accent-hover: #2BCCCC;
-    --text-primary: #ffffff;
-    --text-secondary: #a0a0a0;
-    --border-color: rgba(255, 255, 255, 0.15);
-    --bg-secondary: rgba(255, 255, 255, 0.08);
-    --bg-glass: rgba(26, 26, 26, 0.95);
-    --shadow: 0 25px 50px rgba(0, 0, 0, 0.3), 0 10px 20px rgba(0, 0, 0, 0.2);
-    --font-mono: 'JetBrains Mono', 'SF Mono', 'Monaco', monospace;
-    --header-bg: linear-gradient(135deg, #0a0a0a 0%, #1a1a1a 50%, #0d1117 100%);
-  }
-
-  body {
-    font-family: var(--font-mono);
-    background: linear-gradient(135deg, #0a0a0a 0%, #1a1a1a 100%);
-    min-height: 100vh;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    padding: 20px;
-    position: relative;
-    overflow-x: hidden;
-    overflow-y: auto;
-  }
-
-  /* Custom scrollbar styles */
-  ::-webkit-scrollbar {
-    width: 8px;
-  }
-
-  ::-webkit-scrollbar-track {
-    background: rgba(255, 255, 255, 0.05);
-    border-radius: 4px;
-  }
-
-  ::-webkit-scrollbar-thumb {
-    background: var(--accent-color);
-    border-radius: 4px;
-  }
-
-  ::-webkit-scrollbar-thumb:hover {
-    background: var(--accent-hover);
-  }
-
-  body::before {
-    content: '';
-    position: fixed;
-    top: 0; left: 0; right: 0; bottom: 0;
-    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grid" width="20" height="20" patternUnits="userSpaceOnUse"><path d="M 20 0 L 0 0 0 20" fill="none" stroke="rgba(255,255,255,0.02)" stroke-width="1"/></pattern></defs><rect width="100" height="100" fill="url(%23grid)"/></svg>') repeat;
-    pointer-events: none;
-    z-index: -1;
-  }
-
-  body::after {
-    content: '';
-    position: fixed;
-    top: 50%; left: 50%;
-    width: 500px; height: 500px;
-    background: radial-gradient(circle, rgba(103, 233, 233, 0.05) 0%, transparent 70%);
-    transform: translate(-50%, -50%);
-    pointer-events: none;
-    z-index: -1;
-    animation: pulse 8s ease-in-out infinite;
-  }
-
-  @keyframes pulse {
-    0%, 100% { opacity: 0.3; transform: translate(-50%, -50%) scale(1); }
-    50% { opacity: 0.6; transform: translate(-50%, -50%) scale(1.1); }
-  }
-
-  .modal {
-    background: var(--bg-glass);
-    backdrop-filter: blur(20px);
-    border-radius: 20px;
-    box-shadow: var(--shadow);
-    border: 1px solid var(--border-color);
-    width: 100%;
-    max-width: 640px;
-    overflow: hidden;
-    animation: modalIn 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
-    position: relative;
-  }
-
-  .modal::before {
-    content: '';
-    position: absolute;
-    top: 0; left: 0; right: 0; bottom: 0;
-    background: linear-gradient(45deg, transparent 30%, rgba(255,255,255,0.02) 50%, transparent 70%);
-    animation: shimmer 3s infinite;
-    pointer-events: none;
-  }
-
-  @keyframes shimmer {
-    0% { transform: translateX(-100%); }
-    100% { transform: translateX(100%); }
-  }
-
-  @keyframes modalIn {
-    from {
-      opacity: 0;
-      transform: scale(0.9) translateY(-20px);
-    }
-    to {
-      opacity: 1;
-      transform: scale(1) translateY(0);
-    }
-  }
-
-  .header {
-    background: var(--header-bg);
-    color: var(--text-primary);
-    padding: 20px 32px;
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    position: relative;
-    overflow: hidden;
-  }
-
-  .header::before {
-    content: '';
-    position: absolute;
-    top: 0; left: 0; right: 0; bottom: 0;
-    background: linear-gradient(45deg, transparent 30%, rgba(255,255,255,0.03) 50%, transparent 70%);
-    animation: headerShimmer 4s infinite;
-    pointer-events: none;
-  }
-
-  @keyframes headerShimmer {
-    0% { transform: translateX(-100%); }
-    100% { transform: translateX(100%); }
-  }
-
-  .header-left {
-    display: flex;
-    align-items: center;
-    gap: 16px;
-    z-index: 1;
-  }
-
-  .logo {
-    width: 32px;
-    height: 32px;
-    filter: drop-shadow(0 4px 8px rgba(0,0,0,0.2));
-    animation: logoFloat 3s ease-in-out infinite;
-  }
-
-  @keyframes logoFloat {
-    0%, 100% { transform: translateY(0px); }
-    50% { transform: translateY(-3px); }
-  }
-
-  .title {
-    font-size: 18px;
-    font-weight: 600;
-    text-shadow: 0 2px 4px rgba(0,0,0,0.1);
-  }
-
-  .header-right {
-    display: flex;
-    align-items: center;
-    gap: 16px;
-    z-index: 1;
-  }
-
-  .account-section {
-    display: flex;
-    align-items: center;
-    gap: 8px;
-    padding: 6px 12px;
-    background: rgba(255, 255, 255, 0.04);
-    border: 1px solid var(--border-color);
-    border-radius: 8px;
-  }
-
-  .account-uin {
-    font-size: 12px;
-    color: var(--text-secondary);
-    font-family: var(--font-mono);
-  }
-
-  .btn-switch {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    padding: 4px;
-    background: transparent;
-    border: none;
-    color: var(--text-secondary);
-    cursor: pointer;
-    transition: all 0.3s ease;
-    border-radius: 4px;
-  }
-
-  .btn-switch:hover {
-    background: rgba(255, 255, 255, 0.1);
-    color: var(--accent-color);
-  }
+  .btn-switch:hover {
+    background: rgba(255, 255, 255, 0.1);
+    color: var(--accent-color);
+  }
 
   .btn-icon-link {
     display: flex;
@@ -4197,200 +3575,789 @@ exports.CSS_STYLES = `
     animation: spin 0.8s linear infinite;
   }
 
-  @keyframes spin {
-    to { transform: rotate(360deg); }
-  }
+  @keyframes spin {
+    to { transform: rotate(360deg); }
+  }
+
+  .loading span {
+    color: var(--text-secondary);
+    font-size: 14px;
+  }
+
+  /* Success state */
+  .success-state {
+    text-align: center;
+    padding: 40px 20px;
+    animation: fadeInUp 0.8s ease-out both;
+  }
+
+  .success-icon {
+    margin-bottom: 20px;
+    color: var(--accent-color);
+    animation: successPulse 2s ease-in-out infinite;
+  }
+
+  @keyframes successPulse {
+    0%, 100% {
+      transform: scale(1);
+      filter: drop-shadow(0 0 8px rgba(103, 233, 233, 0.3));
+    }
+    50% {
+      transform: scale(1.1);
+      filter: drop-shadow(0 0 16px rgba(103, 233, 233, 0.6));
+    }
+  }
+
+  .success-title {
+    font-size: 24px;
+    font-weight: 700;
+    color: var(--text-primary);
+    margin-bottom: 12px;
+  }
+
+  .success-message {
+    color: var(--text-secondary);
+    font-size: 16px;
+    line-height: 1.5;
+  }
+
+  .selected-env-info {
+    margin-top: 20px;
+    padding: 16px;
+    background: rgba(103, 233, 233, 0.1);
+    border: 1px solid var(--accent-color);
+    border-radius: 12px;
+    display: flex;
+    align-items: center;
+    gap: 12px;
+  }
+
+  .env-label {
+    color: var(--text-secondary);
+    font-size: 14px;
+    font-weight: 500;
+  }
+
+  .env-value {
+    color: var(--accent-color);
+    font-size: 16px;
+    font-weight: 600;
+    font-family: var(--font-mono);
+  }
+
+  /* Info banner (for non-critical notifications) */
+  .info-banner {
+    margin-bottom: 20px;
+    padding: 16px;
+    background: rgba(103, 233, 233, 0.08);
+    border: 1px solid rgba(103, 233, 233, 0.2);
+    border-radius: 12px;
+  }
+
+  .info-item {
+    margin-bottom: 16px;
+  }
+
+  .info-item:last-child {
+    margin-bottom: 0;
+  }
+
+  .info-header {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    margin-bottom: 8px;
+  }
+
+  .info-header svg {
+    color: var(--accent-color);
+  }
+
+  .info-title {
+    color: var(--text-primary);
+    font-weight: 600;
+    font-size: 14px;
+  }
+
+  .info-message {
+    color: var(--text-secondary);
+    font-size: 13px;
+    line-height: 1.5;
+    margin-bottom: 12px;
+  }
+
+  .info-details {
+    display: flex;
+    gap: 16px;
+    flex-wrap: wrap;
+    margin-bottom: 12px;
+    font-size: 12px;
+    color: var(--text-secondary);
+    opacity: 0.7;
+  }
+
+  .detail-label {
+    font-weight: 500;
+  }
+
+  .detail-value {
+    font-family: var(--font-mono);
+    opacity: 0.8;
+  }
+
+  .error-action {
+    display: flex;
+    gap: 8px;
+    flex-wrap: wrap;
+  }
+
+  .error-link {
+    display: inline-flex;
+    align-items: center;
+    gap: 6px;
+    padding: 6px 12px;
+    background: rgba(103, 233, 233, 0.15);
+    border: 1px solid rgba(103, 233, 233, 0.3);
+    border-radius: 6px;
+    color: var(--accent-color);
+    text-decoration: none;
+    font-size: 13px;
+    cursor: pointer;
+    transition: all 0.3s ease;
+  }
+
+  .error-link:hover {
+    background: rgba(103, 233, 233, 0.25);
+    border-color: var(--accent-color);
+  }
+
+  .error-retry-btn {
+    background: rgba(103, 233, 233, 0.2);
+    border-color: var(--accent-color);
+    color: var(--accent-color);
+  }
+
+  .error-retry-btn:hover {
+    background: rgba(103, 233, 233, 0.3);
+  }
+</style>
+`;
+
+
+/***/ }),
+
+/***/ 7053:
+/***/ ((__unused_webpack_module, exports) => {
+
+
+/**
+ * JavaScript logic for env setup page
+ */
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.getJavaScripts = getJavaScripts;
+function getJavaScripts(wsPort) {
+    return `
+<script>
+  let selectedEnvId = null;
+
+  // Select environment
+  function selectEnv(envId, element) {
+    console.log('[env-setup] Selecting environment:', envId);
+    selectedEnvId = envId;
+    
+    // Remove selected class from all items
+    document.querySelectorAll('.env-item').forEach(item => {
+      item.classList.remove('selected');
+    });
+    
+    // Add selected class to current item
+    element.classList.add('selected');
+    
+    // Enable confirm button
+    document.getElementById('confirmBtn').disabled = false;
+  }
+
+  // Filter environments
+  function filterEnvs(searchTerm) {
+    const items = document.querySelectorAll('.env-item');
+    const searchClear = document.getElementById('searchClear');
+    let visibleCount = 0;
+    
+    items.forEach(item => {
+      const name = item.querySelector('.env-name').textContent.toLowerCase();
+      const id = item.querySelector('.env-id').textContent.toLowerCase();
+      const match = name.includes(searchTerm.toLowerCase()) || 
+                   id.includes(searchTerm.toLowerCase());
+      
+      item.style.display = match ? 'flex' : 'none';
+      if (match) visibleCount++;
+    });
+    
+    // Show/hide clear button
+    if (searchClear) {
+      searchClear.style.display = searchTerm ? 'flex' : 'none';
+    }
+    
+    // Show/hide no results message
+    const noResults = document.getElementById('noResults');
+    if (noResults) {
+      const hasItems = items.length > 0;
+      noResults.style.display = visibleCount === 0 && hasItems ? 'block' : 'none';
+    }
+  }
+
+  // Clear search
+  function clearSearch() {
+    const searchInput = document.getElementById('searchInput');
+    if (searchInput) {
+      searchInput.value = '';
+      filterEnvs('');
+      searchInput.focus();
+    }
+  }
+
+  // WebSocket: same host as page so it works in remote VS Code / Cloud IDE (no localhost)
+  const wsScheme = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
+  const wsUrl = wsScheme + '//' + window.location.host;
+  const ws = new WebSocket(wsUrl);
+  
+  ws.onopen = () => {
+    console.log('[env-setup] WebSocket connected');
+    // Send session ID to server to associate this WebSocket with the session
+    const sessionId = window.location.pathname.split('/').pop();
+    ws.send(JSON.stringify({
+      type: 'registerSession',
+      sessionId: sessionId
+    }));
+  };
+  
+  ws.onmessage = (event) => {
+    const data = JSON.parse(event.data);
+    console.log('[env-setup] Received message:', data);
+    
+    if (data.type === 'success' && data.envId) {
+      showSuccess(data.envId);
+    } else if (data.type === 'envListRefreshed') {
+      if (data.success) {
+        console.log('[env-setup] Environment list refreshed, reloading page');
+        // Reload the page to show updated environment list
+        window.location.reload();
+      } else {
+        console.error('[env-setup] Failed to refresh environment list:', data.error);
+        alert('刷新环境列表失败: ' + (data.error || '未知错误'));
+      }
+    }
+  };
+
+  ws.onerror = (error) => {
+    console.error('[env-setup] WebSocket error:', error);
+  };
+
+  ws.onclose = () => {
+    console.log('[env-setup] WebSocket closed');
+  };
+
+  // Show success state
+  function showSuccess(envId) {
+    document.querySelector('.content').style.display = 'none';
+    const successState = document.getElementById('successState');
+    const selectedEnvDisplay = document.getElementById('selectedEnvDisplay');
+    
+    if (successState && selectedEnvDisplay) {
+      selectedEnvDisplay.textContent = envId;
+      successState.style.display = 'block';
+    }
+  }
+
+  // Confirm selection
+  function confirm() {
+    if (!selectedEnvId) {
+      console.warn('[env-setup] No environment selected');
+      return;
+    }
+    
+    console.log('[env-setup] Confirming selection:', selectedEnvId);
+    
+    if (ws.readyState === WebSocket.OPEN) {
+      ws.send(JSON.stringify({
+        type: 'envId',
+        data: selectedEnvId,
+        cancelled: false
+      }));
+      
+      // Close window immediately after sending confirmation
+      setTimeout(() => {
+        window.close();
+      }, 100);
+    } else {
+      console.error('[env-setup] WebSocket not connected');
+      alert('连接已断开，请刷新页面重试');
+    }
+  }
+
+  // Cancel
+  function cancel() {
+    console.log('[env-setup] Cancelling');
+    if (ws.readyState === WebSocket.OPEN) {
+      ws.send(JSON.stringify({
+        type: 'envId',
+        data: null,
+        cancelled: true
+      }));
+      
+      // Close window immediately after sending cancellation
+      setTimeout(() => {
+        window.close();
+      }, 100);
+    }
+  }
+
+  // Switch account
+  function switchAccount() {
+    console.log('[env-setup] Switching account');
+    if (ws.readyState === WebSocket.OPEN) {
+      ws.send(JSON.stringify({
+        type: 'envId',
+        data: null,
+        switch: true
+      }));
+      
+      // Close window immediately after sending switch request
+      setTimeout(() => {
+        window.close();
+      }, 100);
+    }
+  }
+
+  // Universal URL opener - works with all IDEs including CodeBuddy
+  async function openUrl(event, url) {
+    if (event) {
+      event.preventDefault();
+    }
+    
+    console.log('[env-setup] Opening URL:', url);
+    
+    try {
+      const response = await fetch('/api/open-url', {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify({ url }),
+      });
+      
+      const result = await response.json();
+      
+      if (!result.success) {
+        console.error('[env-setup] Failed to open URL:', result.error);
+        // Fallback to direct open if API fails
+        window.open(url, '_blank');
+      }
+    } catch (error) {
+      console.error('[env-setup] Error opening URL:', error);
+      // Fallback to direct open if API fails
+      window.open(url, '_blank');
+    }
+  }
+
+  // Create new environment
+  function createNewEnv() {
+    console.log('[env-setup] Creating new environment');
+    openUrl(null, 'https://buy.cloud.tencent.com/lowcode?buyType=tcb&channel=mcp');
+  }
+
+  // Refresh environment list
+  function refreshEnvList() {
+    console.log('[env-setup] Refreshing environment list');
+    if (ws.readyState === WebSocket.OPEN) {
+      ws.send(JSON.stringify({
+        type: 'refreshEnvList'
+      }));
+      
+      // Add rotation animation
+      const btn = event.target.closest('.btn-refresh');
+      if (btn) {
+        btn.style.transform = 'rotate(360deg)';
+        setTimeout(() => {
+          btn.style.transform = 'rotate(0deg)';
+        }, 600);
+      }
+    }
+  }
+
+  // Retry init TCB
+  function retryInitTcb(sessionId) {
+    console.log('[env-setup] Retrying TCB initialization:', sessionId);
+    if (ws.readyState === WebSocket.OPEN) {
+      ws.send(JSON.stringify({
+        type: 'retryInitTcb',
+        sessionId: sessionId
+      }));
+    }
+  }
+
+  // Initialize on page load
+  window.addEventListener('load', () => {
+    // Auto-select first environment if exists
+    const firstEnvItem = document.querySelector('.env-item');
+    if (firstEnvItem && !selectedEnvId) {
+      const envId = firstEnvItem.getAttribute('onclick')?.match(/selectEnv\\('([^']+)'/)?.[1];
+      if (envId) {
+        selectEnv(envId, firstEnvItem);
+        console.log('[env-setup] Auto-selected first environment:', envId);
+      }
+    }
+  });
+</script>
+  `.trim();
+}
+
+
+/***/ }),
+
+/***/ 7625:
+/***/ ((__unused_webpack_module, exports) => {
+
+
+/**
+ * Reusable UI components for env setup page
+ */
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.renderHeader = renderHeader;
+exports.renderSearchBox = renderSearchBox;
+exports.renderEnvItem = renderEnvItem;
+exports.renderEmptyState = renderEmptyState;
+exports.renderNoResultsState = renderNoResultsState;
+exports.renderHelpLinks = renderHelpLinks;
+exports.renderActionButtons = renderActionButtons;
+exports.renderLoadingState = renderLoadingState;
+exports.renderSuccessState = renderSuccessState;
+exports.renderErrorBanner = renderErrorBanner;
+function renderHeader(accountInfo, ide) {
+    const hasAccount = !!accountInfo?.uin;
+    const isCodeBuddy = ide === "CodeBuddy";
+    return `
+    <div class="header">
+      <div class="header-left">
+        <img class="logo" src="https://7463-tcb-advanced-a656fc-1257967285.tcb.qcloud.la/mcp/cloudbase-logo.svg" alt="CloudBase Logo" />
+        <span class="title">CloudBase</span>
+      </div>
+      ${(hasAccount && accountInfo.region !== 'ap-singapore') ? /** 国际站不支持切 */ `
+        <div class="header-right">
+          <div class="account-section">
+            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
+              <path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/>
+              <circle cx="12" cy="7" r="4"/>
+            </svg>
+            <span class="account-uin">${accountInfo.uin}</span>
+            ${accountInfo.region ? `<span class="account-region">${accountInfo.region}</span>` : ''}
+            ${!isCodeBuddy ? `
+              <button class="btn-switch" onclick="switchAccount()" title="切换账号">
+                <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
+                  <path d="M17 2l4 4-4 4M7 22l-4-4 4-4M21 6H10M3 18h11"/>
+                </svg>
+              </button>
+            ` : ''}
+          </div>
+        </div>
+      ` : ''}
+    </div>
+  `.trim();
+}
+function renderSearchBox() {
+    return `
+    <div class="search-section">
+      <div class="search-box">
+        <svg class="search-icon" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
+          <circle cx="11" cy="11" r="8"/>
+          <path d="m21 21-4.35-4.35"/>
+        </svg>
+        <input 
+          type="text" 
+          id="searchInput" 
+          class="search-input" 
+          placeholder="搜索环境名称或 ID..."
+          oninput="filterEnvs(this.value)"
+        />
+        <button class="search-clear" onclick="clearSearch()" id="searchClear" style="display: none;">
+          <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
+            <path d="M18 6L6 18M6 6l12 12"/>
+          </svg>
+        </button>
+      </div>
+      <div class="search-actions">
+        <button class="btn-action" onclick="createNewEnv()" title="新建环境">
+          <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
+            <path d="M12 5v14M5 12h14"/>
+          </svg>
+          <span class="btn-text">新建环境</span>
+        </button>
+        <button class="btn-action" onclick="refreshEnvList()" title="刷新环境列表">
+          <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
+            <path d="M21.5 2v6h-6M2.5 22v-6h6M2 11.5a10 10 0 0 1 18.8-4.3M22 12.5a10 10 0 0 1-18.8 4.2"/>
+          </svg>
+        </button>
+      </div>
+    </div>
+  `.trim();
+}
+function renderEnvItem(env, index) {
+    const alias = env.Alias || '(未命名)';
+    const envId = env.EnvId;
+    const hasAlias = !!env.Alias;
+    return `
+    <div class="env-item" onclick="selectEnv('${envId}', this)">
+      <div class="env-info">
+        <div class="env-name ${!hasAlias ? 'unnamed' : ''}">${alias}</div>
+        <div class="env-id">${envId}</div>
+      </div>
+    </div>
+  `.trim();
+}
+function renderEmptyState(hasInitError) {
+    return `
+    <div class="empty-state">
+      <p class="empty-message">
+        暂无环境，请先<a href="https://buy.cloud.tencent.com/lowcode?buyType=tcb&channel=mcp" onclick="openUrl(event, 'https://buy.cloud.tencent.com/lowcode?buyType=tcb&channel=mcp'); return false;" class="create-env-link">创建环境</a>，然后点击刷新按钮重试
+      </p>
+    </div>
+  `.trim();
+}
+function renderNoResultsState() {
+    return `
+    <div class="empty-state" id="noResults" style="display: none;">
+      <svg width="40" height="40" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="opacity: 0.3;">
+        <circle cx="11" cy="11" r="8"/>
+        <path d="m21 21-4.35-4.35"/>
+      </svg>
+      <p class="empty-message">未找到匹配的环境</p>
+    </div>
+  `.trim();
+}
+function renderHelpLinks() {
+    return `
+    <div class="help-links">
+      <a href="https://docs.cloudbase.net/ai/cloudbase-ai-toolkit/" onclick="openUrl(event, 'https://docs.cloudbase.net/ai/cloudbase-ai-toolkit/'); return false;" class="help-link">
+        <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
+          <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/>
+          <polyline points="14 2 14 8 20 8"/>
+          <line x1="16" y1="13" x2="8" y2="13"/>
+          <line x1="16" y1="17" x2="8" y2="17"/>
+        </svg>
+        帮助文档
+      </a>
+      <a href="https://docs.cloudbase.net/ai/cloudbase-ai-toolkit/tutorials" onclick="openUrl(event, 'https://docs.cloudbase.net/ai/cloudbase-ai-toolkit/tutorials'); return false;" class="help-link">
+        <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
+          <polygon points="23 7 16 12 23 17 23 7"/>
+          <rect x="1" y="5" width="15" height="14" rx="2" ry="2"/>
+        </svg>
+        视频教程
+      </a>
+      <a href="https://github.com/TencentCloudBase/CloudBase-AI-ToolKit" onclick="openUrl(event, 'https://github.com/TencentCloudBase/CloudBase-AI-ToolKit'); return false;" class="help-link">
+        <svg width="13" height="13" viewBox="0 0 24 24" fill="currentColor">
+          <path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/>
+        </svg>
+        GitHub
+      </a>
+    </div>
+  `.trim();
+}
+function renderActionButtons(hasEnvs, hasInitError) {
+    return `
+    <div class="actions">
+      <button class="btn btn-secondary" onclick="cancel()">
+        <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
+          <path d="M18 6L6 18M6 6l12 12"/>
+        </svg>
+        取消
+      </button>
+      <button class="btn btn-primary" id="confirmBtn" onclick="confirm()" disabled>
+        <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
+          <path d="M20 6L9 17l-5-5"/>
+        </svg>
+        确认选择
+      </button>
+    </div>
+  `.trim();
+}
+function renderLoadingState() {
+    return `
+    <div class="loading" id="loading" style="display: none;">
+      <div class="spinner"></div>
+      <span>正在配置环境...</span>
+    </div>
+  `.trim();
+}
+function renderSuccessState() {
+    return `
+    <div class="success-state" id="successState" style="display: none;">
+      <div class="success-icon">
+        <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+          <path d="M20 6L9 17l-5-5"/>
+        </svg>
+      </div>
+      <h2 class="success-title">环境配置成功！</h2>
+      <p class="success-message">已成功选择 CloudBase 环境</p>
+      <div class="selected-env-info">
+        <span class="env-label">环境 ID:</span>
+        <span class="env-value" id="selectedEnvDisplay"></span>
+      </div>
+    </div>
+  `.trim();
+}
+function renderErrorBanner(errorContext, sessionId) {
+    const initTcbError = errorContext?.initTcbError;
+    const createEnvError = errorContext?.createEnvError;
+    // Only show initTcbError, hide createEnvError
+    if (!initTcbError) {
+        return '';
+    }
+    return `
+    <div class="info-banner" id="errorBanner">
+      ${initTcbError ? `
+        <div class="info-item">
+          <div class="info-header">
+            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+              <circle cx="12" cy="12" r="10"/>
+              <line x1="12" y1="8" x2="12" y2="12"/>
+              <line x1="12" y1="16" x2="12.01" y2="16"/>
+            </svg>
+            <span class="info-title">${escapeHtml(initTcbError.message)}</span>
+          </div>
+          <div class="info-message">${escapeHtml(initTcbError.actionText || '')}</div>
+          ${initTcbError.requestId ? `
+            <div class="info-details">
+              <span class="detail-label">错误码:</span> <span class="detail-value">${escapeHtml(initTcbError.code)}</span>
+              <span class="detail-label">请求 ID:</span> <span class="detail-value">${escapeHtml(initTcbError.requestId)}</span>
+            </div>
+          ` : ''}
+          ${initTcbError.needRealNameAuth ? `
+            <div class="error-action">
+              <a href="${initTcbError.helpUrl || 'https://buy.cloud.tencent.com/lowcode?buyType=tcb&channel=mcp'}" onclick="openUrl(event, '${initTcbError.helpUrl || 'https://buy.cloud.tencent.com/lowcode?buyType=tcb&channel=mcp'}'); return false;" class="error-link">
+                前往实名认证
+              </a>
+            </div>
+          ` : ''}
+          ${initTcbError.needCamAuth ? `
+            <div class="error-action">
+              <a href="${initTcbError.helpUrl || 'https://buy.cloud.tencent.com/lowcode?buyType=tcb&channel=mcp'}" onclick="openUrl(event, '${initTcbError.helpUrl || 'https://buy.cloud.tencent.com/lowcode?buyType=tcb&channel=mcp'}'); return false;" class="error-link">
+                前往开通 CloudBase 服务
+              </a>
+              ${sessionId ? `
+                <button class="error-link error-retry-btn" onclick="retryInitTcb('${sessionId}')">
+                  <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                    <path d="M23 4v6h-6M1 20v-6h6M3.51 9a9 9 0 0 1 14.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0 0 20.49 15"/>
+                  </svg>
+                  重试
+                </button>
+              ` : ''}
+            </div>
+          ` : ''}
+          ${!initTcbError.needRealNameAuth && !initTcbError.needCamAuth && initTcbError.helpUrl ? `
+            <div class="error-action">
+              <a href="${initTcbError.helpUrl}" onclick="openUrl(event, '${initTcbError.helpUrl}'); return false;" class="error-link">
+                前往开通 CloudBase 服务
+              </a>
+              ${sessionId ? `
+                <button class="error-link error-retry-btn" onclick="retryInitTcb('${sessionId}')">
+                  <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                    <path d="M23 4v6h-6M1 20v-6h6M3.51 9a9 9 0 0 1 14.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0 0 20.49 15"/>
+                  </svg>
+                  重试
+                </button>
+              ` : ''}
+            </div>
+          ` : ''}
+        </div>
+      ` : ''}
+    </div>
+  `.trim();
+}
+// Helper function to escape HTML
+function escapeHtml(text) {
+    const map = {
+        '&': '&amp;',
+        '<': '&lt;',
+        '>': '&gt;',
+        '"': '&quot;',
+        "'": '&#039;'
+    };
+    return text.replace(/[&<>"']/g, (m) => map[m]);
+}
+
 
-  .loading span {
-    color: var(--text-secondary);
-    font-size: 14px;
-  }
+/***/ }),
 
-  /* Success state */
-  .success-state {
-    text-align: center;
-    padding: 40px 20px;
-    animation: fadeInUp 0.8s ease-out both;
-  }
+/***/ 9529:
+/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
 
-  .success-icon {
-    margin-bottom: 20px;
-    color: var(--accent-color);
-    animation: successPulse 2s ease-in-out infinite;
-  }
 
-  @keyframes successPulse {
-    0%, 100% {
-      transform: scale(1);
-      filter: drop-shadow(0 0 8px rgba(103, 233, 233, 0.3));
+/**
+ * Main renderer for env setup page
+ */
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.renderEnvSetupPage = renderEnvSetupPage;
+const components_js_1 = __webpack_require__(7625);
+const html_js_1 = __webpack_require__(4112);
+const scripts_js_1 = __webpack_require__(7053);
+const styles_js_1 = __webpack_require__(6975);
+/**
+ * Render the complete env setup page
+ */
+function renderEnvSetupPage(options) {
+    const { envs = [], accountInfo, errorContext, sessionId, wsPort, ide } = options;
+    const hasEnvs = envs.length > 0;
+    const hasInitError = !!errorContext?.initTcbError;
+    const hasErrors = !!(errorContext?.initTcbError || errorContext?.createEnvError);
+    // Build env list HTML
+    let envListHTML = '';
+    if (hasEnvs) {
+        envListHTML = `
+      ${(0, components_js_1.renderSearchBox)()}
+      <div class="env-list" id="envList">
+        ${envs.map((env, index) => (0, components_js_1.renderEnvItem)(env, index)).join('\n')}
+      </div>
+      ${(0, components_js_1.renderNoResultsState)()}
+    `;
     }
-    50% {
-      transform: scale(1.1);
-      filter: drop-shadow(0 0 16px rgba(103, 233, 233, 0.6));
+    else {
+        // 暂无环境时也显示搜索框、新建和刷新按钮
+        envListHTML = `
+      ${(0, components_js_1.renderSearchBox)()}
+      <div class="env-list" id="envList">
+        ${(0, components_js_1.renderEmptyState)(hasInitError)}
+      </div>
+      ${(0, components_js_1.renderNoResultsState)()}
+    `;
     }
-  }
-
-  .success-title {
-    font-size: 24px;
-    font-weight: 700;
-    color: var(--text-primary);
-    margin-bottom: 12px;
-  }
-
-  .success-message {
-    color: var(--text-secondary);
-    font-size: 16px;
-    line-height: 1.5;
-  }
-
-  .selected-env-info {
-    margin-top: 20px;
-    padding: 16px;
-    background: rgba(103, 233, 233, 0.1);
-    border: 1px solid var(--accent-color);
-    border-radius: 12px;
-    display: flex;
-    align-items: center;
-    gap: 12px;
-  }
-
-  .env-label {
-    color: var(--text-secondary);
-    font-size: 14px;
-    font-weight: 500;
-  }
-
-  .env-value {
-    color: var(--accent-color);
-    font-size: 16px;
-    font-weight: 600;
-    font-family: var(--font-mono);
-  }
-
-  /* Info banner (for non-critical notifications) */
-  .info-banner {
-    margin-bottom: 20px;
-    padding: 16px;
-    background: rgba(103, 233, 233, 0.08);
-    border: 1px solid rgba(103, 233, 233, 0.2);
-    border-radius: 12px;
-  }
-
-  .info-item {
-    margin-bottom: 16px;
-  }
-
-  .info-item:last-child {
-    margin-bottom: 0;
-  }
-
-  .info-header {
-    display: flex;
-    align-items: center;
-    gap: 8px;
-    margin-bottom: 8px;
-  }
-
-  .info-header svg {
-    color: var(--accent-color);
-  }
-
-  .info-title {
-    color: var(--text-primary);
-    font-weight: 600;
-    font-size: 14px;
-  }
-
-  .info-message {
-    color: var(--text-secondary);
-    font-size: 13px;
-    line-height: 1.5;
-    margin-bottom: 12px;
-  }
-
-  .info-details {
-    display: flex;
-    gap: 16px;
-    flex-wrap: wrap;
-    margin-bottom: 12px;
-    font-size: 12px;
-    color: var(--text-secondary);
-    opacity: 0.7;
-  }
-
-  .detail-label {
-    font-weight: 500;
-  }
-
-  .detail-value {
-    font-family: var(--font-mono);
-    opacity: 0.8;
-  }
-
-  .error-action {
-    display: flex;
-    gap: 8px;
-    flex-wrap: wrap;
-  }
-
-  .error-link {
-    display: inline-flex;
-    align-items: center;
-    gap: 6px;
-    padding: 6px 12px;
-    background: rgba(103, 233, 233, 0.15);
-    border: 1px solid rgba(103, 233, 233, 0.3);
-    border-radius: 6px;
-    color: var(--accent-color);
-    text-decoration: none;
-    font-size: 13px;
-    cursor: pointer;
-    transition: all 0.3s ease;
-  }
-
-  .error-link:hover {
-    background: rgba(103, 233, 233, 0.25);
-    border-color: var(--accent-color);
-  }
-
-  .error-retry-btn {
-    background: rgba(103, 233, 233, 0.2);
-    border-color: var(--accent-color);
-    color: var(--accent-color);
-  }
-
-  .error-retry-btn:hover {
-    background: rgba(103, 233, 233, 0.3);
-  }
-</style>
-`;
-
-
-/***/ },
-
-/***/ 2674
-(module) {
-
-module.exports = __WEBPACK_EXTERNAL_MODULE_express__;
-
-/***/ },
-
-/***/ 1622
-(module) {
-
-module.exports = __WEBPACK_EXTERNAL_MODULE_open__;
-
-/***/ },
-
-/***/ 6220
-(module, __unused_webpack_exports, __webpack_require__) {
+    // Build body HTML
+    const bodyHTML = `
+    <div class="modal">
+      ${(0, components_js_1.renderHeader)(accountInfo, ide)}
+      <div class="content">
+        <h1 class="content-title">选择环境</h1>
+        
+        ${hasErrors ? (0, components_js_1.renderErrorBanner)(errorContext, sessionId) : ''}
+        
+        ${envListHTML}
+        
+        ${(0, components_js_1.renderActionButtons)(hasEnvs, hasInitError)}
+        
+        ${(0, components_js_1.renderHelpLinks)()}
+        
+        ${(0, components_js_1.renderLoadingState)()}
+        
+        ${(0, components_js_1.renderSuccessState)()}
+      </div>
+    </div>
+  `;
+    // Get JavaScript with WebSocket port
+    const scripts = (0, scripts_js_1.getJavaScripts)(wsPort);
+    // Assemble final HTML
+    return (0, html_js_1.buildHTMLPage)(styles_js_1.CSS_STYLES, bodyHTML, scripts);
+}
 
-var x = (y) => {
-	var x = {}; __webpack_require__.d(x, y); return x
-} 
-var y = (x) => (() => (x))
-module.exports = x({ ["WebSocket"]: () => (__WEBPACK_EXTERNAL_MODULE_ws__.WebSocket), ["WebSocketServer"]: () => (__WEBPACK_EXTERNAL_MODULE_ws__.WebSocketServer) });
 
-/***/ }
+/***/ })
 
 };