feat: improve browser extension sidepanel config

[1923213756]

描述 / Summary

本次改造浏览器插件 side panel 的对话与配置体验：插件端不再只是外层壳加载 Web UI，而是使用 browser-extension 专属 surface。插件对话会持久化为 Nine1Bot 历史会话，并带有 client.source = "browser-extension" 元数据；插件设置支持 Browser relay origin、默认模型、提示词、MCP 和 Skills。

同时将浏览器 relay 连接配置迁移为 browserRelayOrigin，支持旧 serverOrigin / relayUrl / webUiUrl 自动迁移，并在连接异常时保持侧边栏可用，允许用户修改端口重连。

类型 / Type of change

• 新功能 (feature)
• Bug 修复 (bugfix)
• 文档 (docs)
• 重构 (refactor)
• 其他 (describe):

关联的 issue（如果有）/ Related issues

/

变更点 / What changed

• 新增 browser-extension 专属 Web surface，插件侧边栏使用专属布局、页面上下文状态、新对话入口和插件设置入口。
• 插件原生 side panel 去除外层顶部白框；连接成功时全屏加载 Web 插件界面，断连时显示可用的内嵌连接提示与 relay 设置。
• 新增 Browser relay origin 工具，统一默认值、URL normalize、derived /browser/bootstrap 与 /browser/extension endpoint，以及 legacy storage 迁移。
• relay-client 监听 browserRelayOrigin 变化并自动断开旧 WebSocket 后重连。
• Session 增加 client 元数据，browser-extension 会话可进入历史并与普通 Web 对话区分。
• 新增 GET/PATCH /config/nine1bot/browser-extension，持久化插件默认模型、插件提示词、默认 MCP servers、默认 Skills。
• 创建 browser-extension 会话时应用插件默认模型，并将插件默认 MCP / Skills 合并进 session resources。
• 发送 browser-extension 消息时注入插件专属提示词，普通 Web 会话不受影响。
• 插件 relay 只控制当前 Nine1Bot 专属标签组内的 tab。
• 插件侧边栏检测到 PTY/agent terminal 时提示跳转到 Nine1Bot 主界面对应会话继续。

如何测试 / How to test

1. 构建与类型检查：

   • bun run --cwd packages/browser-extension typecheck
   • bun run --cwd packages/browser-extension build
   • bun run --cwd opencode/packages/opencode typecheck
   • bun run build:web

2. 单元测试：

   • bun test packages/browser-extension/test
   • bun test web/test
   • bun test opencode/packages/opencode/test/server/config-routes.test.ts opencode/packages/opencode/test/server/nine1bot-agent.test.ts packages/nine1bot/src/config/loader.test.ts

3. 手动验收：

   • Nine1Bot 未启动时打开插件 side panel，预期不白屏，可看到未连接提示并修改 relay origin。
   • 修改端口后点击测试/保存，预期能自动派生 /browser/bootstrap 和 /browser/extension 并重连。
   • 连接成功后插件界面加载 browser-extension 对话布局。
   • 插件设置中修改默认模型、提示词、MCP、Skills，预期只影响新建插件会话。
   • 发送插件对话后回到 Nine1Bot 主界面，预期历史中可看到带 Browser 标识的插件会话。
   • 点击扩展图标打开 side panel，预期新建/激活 Nine1Bot 专属标签组，浏览器控制只作用于组内 tab。
   • 插件会话触发终端时，预期侧边栏提示跳转主界面继续。

截图（UI 变更时提供）/ Screenshots for UI changed

待补充：插件对话界面、插件设置弹窗、断连状态提示。

Checklist（合并前请确认） / Checklist

• 本地已通过测试

备注 / Notes for reviewers

• 建议重点审查：
  • packages/browser-extension/src/sidepanel/index.ts 的断连/重连和 postMessage 协议。
  • web/src/components/BrowserExtensionSettingsPanel.vue 的插件设置 UX 和保存逻辑。
  • opencode/packages/opencode/src/server/routes/nine1bot-agent.ts 中 browser-extension 默认模型、MCP、Skills、提示词注入逻辑。
  • packages/browser-extension/src/background/relay-client.ts 和 tab-group-manager.ts 的专属标签组控制边界。
• 当前发现一个合并前建议修复的问题：后端从断连恢复为可达时，健康检查不会自动重新挂载 iframe，可能需要用户手动点重试。

[chatgpt-codex-connector]

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: d35c2fa0ae

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

• Open a pull request for review
• Mark a draft as ready
• Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

[Copilot]

Pull request overview

This PR upgrades the Nine1Bot browser extension side panel from a simple “shell loading the Web UI” into a dedicated browser-extension surface, with persisted session metadata (client.source = "browser-extension"), extension-scoped defaults (model/prompt/MCP/skills), and a more resilient relay-origin configuration + migration flow.

Changes:

• Introduces a browser-extension client surface in the Web UI, including surface-aware session filtering and an extension-specific layout + settings modal.
• Adds backend support for browser-extension defaults via GET/PATCH /config/nine1bot/browser-extension, and applies those defaults (model/resources/prompt) only to extension sessions.
• Refactors the extension relay + tab-group behavior to scope automation to a dedicated Nine1Bot tab group and migrates legacy relay storage keys to browserRelayOrigin.

Reviewed changes

Copilot reviewed 25 out of 25 changed files in this pull request and generated 2 comments.

Show a summary per file

File	Description
web/test/session-surface.test.ts	Adds tests for client-surface-based session filtering behavior.
web/test/config-api.test.ts	Adds tests for browser-extension config API client endpoints.
web/src/composables/useClientSurface.ts	Detects initial surface from query params and syncs surface into API client.
web/src/components/Sidebar.vue	Adds a “Browser” badge for browser-extension sessions in Web history.
web/src/components/BrowserExtensionSettingsPanel.vue	New extension settings modal (model/prompt/MCP/skills + relay status via postMessage).
web/src/App.vue	Adds extension-specific layout, relay status banner, page-context refresh, and “continue in web” action.
web/src/api/client.ts	Adds ClientSurface, Session.client, surface filtering for session list APIs, and extension config endpoints.
packages/nine1bot/src/config/schema.ts	Adds browser.sidepanel schema for extension defaults (model/prompt/MCP/skills).
packages/nine1bot/src/config/loader.test.ts	Updates config-loader expectations to include browser.sidepanel.
packages/browser-extension/test/server-config.test.ts	Adds unit tests for relay-origin normalization, URL derivation, and legacy migration.
packages/browser-extension/src/tools/tabs.ts	Scopes tab context/create tools to the active Nine1Bot tab group and removes in-memory tab tracking.
packages/browser-extension/src/sidepanel/index.ts	Reworks side panel boot/health, relay origin save/test, settings overlay, and parent↔iframe messaging.
packages/browser-extension/src/shared/tab-group.ts	Introduces storage key for the active Nine1Bot tab group id.
packages/browser-extension/src/shared/server-config.ts	Centralizes relay-origin normalization, endpoint derivation, and legacy storage migration.
packages/browser-extension/src/background/tab-group-manager.ts	Implements dedicated Nine1Bot tab group tracking + persistence and group-scoped queries.
packages/browser-extension/src/background/relay-client.ts	Reconnects on relay-origin change and scopes CDP targets to the active Nine1Bot group.
packages/browser-extension/src/background/index.ts	Ensures tab-group activation + nonce updates when opening side panel (icon/command).
packages/browser-extension/sidepanel/index.html	Updates side panel UI/UX for disconnected state + settings overlay.
packages/browser-extension/README.md	Updates user-facing instructions to configure relay origin via the side panel Settings UI.
opencode/packages/opencode/test/server/nine1bot-agent.test.ts	Adds tests ensuring extension defaults/prompt apply only to extension sessions.
opencode/packages/opencode/test/server/config-routes.test.ts	Adds tests for reading/writing browser-extension sidepanel defaults via config route.
opencode/packages/opencode/src/session/index.ts	Adds Session.client schema/serialization for source/mode/platform metadata.
opencode/packages/opencode/src/server/routes/nine1bot-agent.ts	Applies extension defaults (model/resources/prompt) and persists client metadata on session creation.
opencode/packages/opencode/src/server/routes/config.ts	Adds GET/PATCH /config/nine1bot/browser-extension routes.
opencode/packages/opencode/src/server/nine1bot-browser-extension-config.ts	Implements read/patch logic for browser.sidepanel (model/prompt/MCP/skills) in config file.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[Copilot]

Pull request overview

Copilot reviewed 25 out of 25 changed files in this pull request and generated 6 comments.

[contrueCT]

LGTM