fix(server): tighten CORS allowlist for the agent server (#966)

* fix(server): tighten CORS allowlist for the agent server

Replace the permissive `origin || '*'` reflection in
`defaultCorsConfig` with an explicit allowlist composed of:

- a static list (empty by default)
- comma-separated origins from `BROWSEROS_TRUSTED_ORIGINS`

Add a small `requireTrustedOrigin` middleware that actively
rejects (403) any request whose `Origin` header is present and
not in the allowlist. The middleware is permissive when the
`Origin` header is absent — CLI tools, internal Node clients,
and some service-worker fetches legitimately omit it; the
threat model only covers cross-origin browser fetches, which
always carry `Origin` (it's on the Forbidden Header List, so
JS cannot suppress it).

Mount the middleware globally in `createHttpServer` after the
existing `cors()` layer. Document the new env var in
`.env.example`.

Tests cover allowlist parsing (empty, single, multi, trims,
case sensitivity, port match) and middleware behaviour
(missing Origin allowed, allowlisted Origin allowed, unknown
Origin rejected, "null" rejected, port mismatch rejected,
disallowed Origin doesn't reach the handler).

* fix(server): include published extension origin in default allowlist

Pin the published BrowserOS extension origin in the static
allowlist so the default install accepts the legitimate
extension without requiring `BROWSEROS_TRUSTED_ORIGINS` to be
populated. Additional origins (dev / alpha) keep working
through the env override.

* chore(server): trim .env.example comments

* chore(server): drop redundant comments from cors helpers

.gitattributes

@@ -9,4 +9,6 @@ packages/browseros/chromium_patches/**/*.py linguist-generated
 scripts/*.py linguist-generated
 # Mark build directories as generated
 build/* linguist-generated
+# Mark eval/test framework as vendored so it's excluded from language stats
+packages/browseros-agent/apps/eval/** linguist-vendored
 docs/videos/** filter=lfs diff=lfs merge=lfs -text

.github/workflows/eval-weekly.yml

@@ -4,6 +4,11 @@ on:
   schedule:
     # Every Saturday at 06:00 UTC
     - cron: '0 6 * * 6'
+  push:
+    branches: [main]
+    paths:
+      - 'packages/browseros-agent/apps/server/src/agent/**'
+      - 'packages/browseros-agent/apps/server/src/tools/**'
   workflow_dispatch:
     inputs:
       config:
@@ -38,6 +43,15 @@ jobs:
         working-directory: packages/browseros-agent
         run: bun install --ignore-scripts && bun run build:agent-sdk
 
+      - name: Install Python eval dependencies
+        run: pip install agisdk requests
+
+      - name: Clone WebArena-Infinity
+        run: git clone --depth 1 https://github.com/web-arena-x/webarena-infinity.git /tmp/webarena-infinity
+
+      - name: Install xvfb
+        run: sudo apt-get update && sudo apt-get install -y xvfb
+
       - name: Install captcha solver extension
         working-directory: packages/browseros-agent/apps/eval
         run: |
@@ -49,12 +63,15 @@ jobs:
         working-directory: packages/browseros-agent/apps/eval
         env:
           FIREWORKS_API_KEY: ${{ secrets.FIREWORKS_API_KEY }}
+          OPENROUTER_API_KEY: ${{ secrets.OPENROUTER_API_KEY }}
           CLAUDE_CODE_OAUTH_TOKEN: ${{ secrets.CLAUDE_CODE_OAUTH_TOKEN }}
+          NOPECHA_API_KEY: ${{ secrets.NOPECHA_API_KEY }}
           BROWSEROS_BINARY: /usr/bin/browseros
+          WEBARENA_INFINITY_DIR: /tmp/webarena-infinity
           EVAL_CONFIG: ${{ github.event.inputs.config || 'configs/browseros-agent-weekly.json' }}
         run: |
           echo "Running eval with config: $EVAL_CONFIG"
-          bun run src/index.ts -c "$EVAL_CONFIG"
+          xvfb-run --auto-servernum --server-args="-screen 0 1440x900x24" bun run src/index.ts -c "$EVAL_CONFIG"
 
       - name: Upload runs to R2
         if: success()
@@ -72,6 +89,8 @@ jobs:
 
       - name: Generate trend report
         if: success()
+        timeout-minutes: 5
+        continue-on-error: true
         working-directory: packages/browseros-agent
         env:
           EVAL_R2_ACCOUNT_ID: ${{ secrets.EVAL_R2_ACCOUNT_ID }}

.github/workflows/pr-title.yml

@@ -2,7 +2,7 @@ name: PR Conventional Commit Validation
 
 on:
   pull_request:
-    types: [opened, synchronize, reopened, edited]
+    types: [opened, edited]
 
 permissions:
   pull-requests: write

.github/workflows/release-agent-extension.yml

@@ -0,0 +1,148 @@
+name: Release BrowserOS Extension
+
+on:
+  workflow_dispatch:
+
+concurrency:
+  group: release-agent-extension
+  cancel-in-progress: false
+
+jobs:
+  release:
+    if: github.ref == 'refs/heads/main'
+    runs-on: ubuntu-latest
+    permissions:
+      contents: write
+      pull-requests: write
+    defaults:
+      run:
+        working-directory: packages/browseros-agent/apps/agent
+
+    steps:
+      - uses: actions/checkout@v6
+        with:
+          fetch-depth: 0
+
+      - uses: oven-sh/setup-bun@v2
+
+      - name: Install dependencies
+        run: bun ci
+        working-directory: packages/browseros-agent
+
+      - name: Build and zip extension
+        run: bun run codegen && bun run zip
+        env:
+          VITE_PUBLIC_BROWSEROS_API: https://api.browseros.com
+
+      - name: Get version and zip path
+        id: version
+        run: |
+          echo "version=$(node -p "require('./package.json').version")" >> "$GITHUB_OUTPUT"
+          echo "release_sha=$(git rev-parse HEAD)" >> "$GITHUB_OUTPUT"
+          ZIP_FILE=$(ls "$(pwd)/dist/"*-chrome.zip | head -n 1)
+          echo "zip_path=$ZIP_FILE" >> "$GITHUB_OUTPUT"
+          echo "zip_name=$(basename "$ZIP_FILE")" >> "$GITHUB_OUTPUT"
+
+      - name: Generate release notes
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        run: |
+          AGENT_PATH="packages/browseros-agent/apps/agent"
+          CURRENT_TAG="agent-extension-v${{ steps.version.outputs.version }}"
+          PREV_TAG=$(git tag -l "agent-extension-v*" --sort=-v:refname | grep -v "^${CURRENT_TAG}$" | head -n 1)
+
+          if [ -z "$PREV_TAG" ]; then
+            echo "Initial release" > /tmp/release-notes.md
+          else
+            COMMITS=$(git log "$PREV_TAG"..HEAD --pretty=format:"%H" -- "$AGENT_PATH")
+
+            if [ -z "$COMMITS" ]; then
+              echo "No notable changes." > /tmp/release-notes.md
+            else
+              echo "## What's Changed" > /tmp/release-notes.md
+              echo "" >> /tmp/release-notes.md
+
+              while IFS= read -r SHA; do
+                SUBJECT=$(git log -1 --pretty=format:"%s" "$SHA")
+                PR_NUM=$(gh api "/repos/${{ github.repository }}/commits/${SHA}/pulls" --jq '.[0].number // empty' 2>/dev/null)
+
+                # Skip PR number if already in the commit subject (squash merges include it)
+                if [ -n "$PR_NUM" ] && ! echo "$SUBJECT" | grep -qF "(#${PR_NUM})"; then
+                  echo "- ${SUBJECT} (#${PR_NUM})" >> /tmp/release-notes.md
+                else
+                  echo "- ${SUBJECT}" >> /tmp/release-notes.md
+                fi
+              done <<< "$COMMITS"
+            fi
+          fi
+        working-directory: ${{ github.workspace }}
+
+      - name: Create GitHub release
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        run: |
+          TAG="agent-extension-v${{ steps.version.outputs.version }}"
+          RELEASE_SHA="${{ steps.version.outputs.release_sha }}"
+          TITLE="BrowserOS Extension - v${{ steps.version.outputs.version }}"
+
+          if git rev-parse "$TAG" >/dev/null 2>&1; then
+            echo "Tag $TAG already exists, skipping tag creation"
+          else
+            git tag "$TAG" "$RELEASE_SHA"
+          fi
+
+          if git ls-remote --tags origin "$TAG" | grep -q "$TAG"; then
+            echo "Tag $TAG already on remote, skipping push"
+          else
+            git push origin "$TAG"
+          fi
+
+          if gh release view "$TAG" >/dev/null 2>&1; then
+            echo "Release $TAG already exists, updating"
+            gh release edit "$TAG" --title "$TITLE" --notes-file /tmp/release-notes.md
+            gh release upload "$TAG" "${{ steps.version.outputs.zip_path }}" --clobber
+          else
+            gh release create "$TAG" \
+              --title "$TITLE" \
+              --notes-file /tmp/release-notes.md \
+              "${{ steps.version.outputs.zip_path }}"
+          fi
+        working-directory: ${{ github.workspace }}
+
+      - name: Update CHANGELOG.md via PR
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        run: |
+          VERSION="${{ steps.version.outputs.version }}"
+          DATE=$(date -u +"%Y-%m-%d")
+          BRANCH="docs/agent-extension-changelog-v${VERSION}"
+          CHANGELOG="packages/browseros-agent/apps/agent/CHANGELOG.md"
+
+          git checkout main
+
+          {
+            head -n 1 "$CHANGELOG"
+            echo ""
+            echo "## v${VERSION} (${DATE})"
+            echo ""
+            cat /tmp/release-notes.md
+            echo ""
+            tail -n +2 "$CHANGELOG"
+          } > /tmp/new-changelog.md
+          mv /tmp/new-changelog.md "$CHANGELOG"
+
+          git config user.name "github-actions[bot]"
+          git config user.email "github-actions[bot]@users.noreply.github.com"
+          git checkout -b "$BRANCH"
+          git add "$CHANGELOG"
+          git commit -m "docs: update agent extension changelog for v${VERSION}"
+          git push origin "$BRANCH"
+
+          gh pr create \
+            --title "docs: update agent extension changelog for v${VERSION}" \
+            --body "Auto-generated changelog update for BrowserOS Extension v${VERSION}." \
+            --base main \
+            --head "$BRANCH"
+
+          gh pr merge "$BRANCH" --squash --auto || true
+        working-directory: ${{ github.workspace }}

.github/workflows/release-agent-sdk.yml

@@ -1,18 +1,27 @@
-name: Release Agent SDK
+name: Release BrowserOS Agent SDK
 
 on:
   workflow_dispatch:
 
+concurrency:
+  group: release-agent-sdk
+  cancel-in-progress: false
+
 jobs:
   publish:
     if: github.ref == 'refs/heads/main'
     runs-on: ubuntu-latest
+    permissions:
+      contents: write
+      pull-requests: write
     defaults:
       run:
         working-directory: packages/browseros-agent/packages/agent-sdk
 
     steps:
       - uses: actions/checkout@v6
+        with:
+          fetch-depth: 0
 
       - uses: oven-sh/setup-bun@v2
 
@@ -31,7 +40,129 @@ jobs:
       - name: Test
         run: bun test
 
+      - name: Get version
+        id: version
+        run: |
+          echo "version=$(node -p "require('./package.json').version")" >> "$GITHUB_OUTPUT"
+          echo "release_sha=$(git rev-parse HEAD)" >> "$GITHUB_OUTPUT"
+
+      - name: Generate release notes
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        run: |
+          SDK_PATH="packages/browseros-agent/packages/agent-sdk"
+          CURRENT_TAG="agent-sdk-v${{ steps.version.outputs.version }}"
+          # Find the previous tag, excluding the current version's tag
+          # (which may already exist from a prior failed run)
+          PREV_TAG=$(git tag -l "agent-sdk-v*" --sort=-v:refname | grep -v "^${CURRENT_TAG}$" | head -n 1)
+
+          if [ -z "$PREV_TAG" ]; then
+            echo "Initial release" > /tmp/release-notes.md
+          else
+            # Get commits scoped to the SDK directory
+            COMMITS=$(git log "$PREV_TAG"..HEAD --pretty=format:"%H" -- "$SDK_PATH")
+
+            if [ -z "$COMMITS" ]; then
+              echo "No notable changes." > /tmp/release-notes.md
+            else
+              echo "## What's Changed" > /tmp/release-notes.md
+              echo "" >> /tmp/release-notes.md
+
+              # For each commit, find the associated PR and format with author
+              CONTRIBUTORS=""
+              while IFS= read -r SHA; do
+                # Get commit subject and author
+                SUBJECT=$(git log -1 --pretty=format:"%s" "$SHA")
+                AUTHOR=$(git log -1 --pretty=format:"%an" "$SHA")
+                GITHUB_USER=$(gh api "/repos/${{ github.repository }}/commits/${SHA}" --jq '.author.login // empty' 2>/dev/null)
+
+                # Find associated PR number
+                PR_NUM=$(gh api "/repos/${{ github.repository }}/commits/${SHA}/pulls" --jq '.[0].number // empty' 2>/dev/null)
+
+                # Format line: skip PR number if already in the commit subject
+                # (squash merges include "(#123)" in the subject automatically)
+                if [ -n "$PR_NUM" ] && ! echo "$SUBJECT" | grep -qF "(#${PR_NUM})"; then
+                  echo "- ${SUBJECT} (#${PR_NUM})" >> /tmp/release-notes.md
+                else
+                  echo "- ${SUBJECT}" >> /tmp/release-notes.md
+                fi
+              done <<< "$COMMITS"
+            fi
+          fi
+        working-directory: ${{ github.workspace }}
+
       - name: Publish
         run: npm publish --access public
         env:
           NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
+
+      - name: Create GitHub release
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        run: |
+          TAG="agent-sdk-v${{ steps.version.outputs.version }}"
+          RELEASE_SHA="${{ steps.version.outputs.release_sha }}"
+          TITLE="BrowserOS Agent SDK - v${{ steps.version.outputs.version }}"
+
+          # Create or reuse tag (idempotent for re-runs)
+          if git rev-parse "$TAG" >/dev/null 2>&1; then
+            echo "Tag $TAG already exists, skipping tag creation"
+          else
+            git tag "$TAG" "$RELEASE_SHA"
+          fi
+
+          # Push tag (skip if already on remote)
+          if git ls-remote --tags origin "$TAG" | grep -q "$TAG"; then
+            echo "Tag $TAG already on remote, skipping push"
+          else
+            git push origin "$TAG"
+          fi
+
+          # Create or update release
+          if gh release view "$TAG" >/dev/null 2>&1; then
+            echo "Release $TAG already exists, updating"
+            gh release edit "$TAG" --title "$TITLE" --notes-file /tmp/release-notes.md
+          else
+            gh release create "$TAG" --title "$TITLE" --notes-file /tmp/release-notes.md
+          fi
+        working-directory: ${{ github.workspace }}
+
+      - name: Update CHANGELOG.md via PR
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        run: |
+          VERSION="${{ steps.version.outputs.version }}"
+          DATE=$(date -u +"%Y-%m-%d")
+          BRANCH="docs/agent-sdk-changelog-v${VERSION}"
+          CHANGELOG="packages/browseros-agent/packages/agent-sdk/CHANGELOG.md"
+
+          # Return to main before branching
+          git checkout main
+
+          # Use head/tail to safely insert without sed quoting issues
+          {
+            head -n 1 "$CHANGELOG"
+            echo ""
+            echo "## v${VERSION} (${DATE})"
+            echo ""
+            cat /tmp/release-notes.md
+            echo ""
+            tail -n +2 "$CHANGELOG"
+          } > /tmp/new-changelog.md
+          mv /tmp/new-changelog.md "$CHANGELOG"
+
+          git config user.name "github-actions[bot]"
+          git config user.email "github-actions[bot]@users.noreply.github.com"
+          git checkout -b "$BRANCH"
+          git add "$CHANGELOG"
+          git commit -m "docs: update agent-sdk changelog for v${VERSION}"
+          git push origin "$BRANCH"
+
+          gh pr create \
+            --title "docs: update agent-sdk changelog for v${VERSION}" \
+            --body "Auto-generated changelog update for BrowserOS Agent SDK v${VERSION}." \
+            --base main \
+            --head "$BRANCH"
+
+          gh pr merge "$BRANCH" --squash --auto || true
+        working-directory: ${{ github.workspace }}

.github/workflows/release-cli.yml

@@ -0,0 +1,161 @@
+name: Release BrowserOS CLI
+
+on:
+  workflow_dispatch:
+    inputs:
+      version:
+        description: "Release version (e.g. 0.1.0)"
+        required: true
+        type: string
+
+concurrency:
+  group: release-cli
+  cancel-in-progress: false
+
+jobs:
+  release:
+    if: github.ref == 'refs/heads/main'
+    runs-on: ubuntu-latest
+    environment: release-core
+    permissions:
+      contents: write
+      pull-requests: write
+    defaults:
+      run:
+        working-directory: packages/browseros-agent/apps/cli
+
+    steps:
+      - uses: actions/checkout@v6
+        with:
+          fetch-depth: 0
+
+      - uses: actions/setup-go@v5
+        with:
+          go-version-file: packages/browseros-agent/apps/cli/go.mod
+
+      - uses: oven-sh/setup-bun@v2
+        with:
+          bun-version: "1.3.6"
+
+      - name: Run tests
+        run: make test
+
+      - name: Run vet
+        run: make vet
+
+      - name: Build all platforms
+        run: make release VERSION=${{ inputs.version }} POSTHOG_API_KEY=${{ secrets.POSTHOG_API_KEY }}
+
+      - name: Install dependencies
+        run: bun install
+        working-directory: packages/browseros-agent
+
+      - name: Upload to CDN
+        env:
+          R2_ACCOUNT_ID: ${{ secrets.R2_ACCOUNT_ID }}
+          R2_ACCESS_KEY_ID: ${{ secrets.R2_ACCESS_KEY_ID }}
+          R2_SECRET_ACCESS_KEY: ${{ secrets.R2_SECRET_ACCESS_KEY }}
+          R2_BUCKET: ${{ secrets.R2_BUCKET }}
+          R2_UPLOAD_PREFIX: cli
+          CLI_VERSION: ${{ inputs.version }}
+        run: |
+          bun scripts/build/cli.ts \
+            --release \
+            --version "$CLI_VERSION" \
+            --binaries-dir apps/cli/dist
+        working-directory: packages/browseros-agent
+
+      - name: Generate release notes
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        run: |
+          CLI_PATH="packages/browseros-agent/apps/cli"
+          TAG="browseros-cli-v${{ inputs.version }}"
+          CHANGELOG_FILE="/tmp/release-changelog.md"
+          PREV_TAG=$(git tag -l "browseros-cli-v*" --sort=-v:refname | grep -v "^${TAG}$" | head -n 1)
+
+          if [ -z "$PREV_TAG" ]; then
+            echo "Initial release of browseros-cli." > "$CHANGELOG_FILE"
+          else
+            COMMITS=$(git log "$PREV_TAG"..HEAD --pretty=format:"%H" -- "$CLI_PATH")
+
+            if [ -z "$COMMITS" ]; then
+              echo "No notable changes." > "$CHANGELOG_FILE"
+            else
+              echo "## What's Changed" > "$CHANGELOG_FILE"
+              echo "" >> "$CHANGELOG_FILE"
+
+              while IFS= read -r SHA; do
+                SUBJECT=$(git log -1 --pretty=format:"%s" "$SHA")
+                PR_NUM=$(gh api "/repos/${{ github.repository }}/commits/${SHA}/pulls" --jq '.[0].number // empty' 2>/dev/null)
+
+                if [ -n "$PR_NUM" ] && ! echo "$SUBJECT" | grep -qF "(#${PR_NUM})"; then
+                  echo "- ${SUBJECT} (#${PR_NUM})" >> "$CHANGELOG_FILE"
+                else
+                  echo "- ${SUBJECT}" >> "$CHANGELOG_FILE"
+                fi
+              done <<< "$COMMITS"
+            fi
+          fi
+
+          cat "$CHANGELOG_FILE" > /tmp/release-notes.md
+          cat >> /tmp/release-notes.md <<'EOF'
+
+          ## Install `browseros-cli`
+
+          ### npm / npx
+
+          ```bash
+          npx browseros-cli --help
+          npm install -g browseros-cli
+          ```
+
+          ### macOS / Linux
+
+          ```bash
+          curl -fsSL https://cdn.browseros.com/cli/install.sh | bash
+          ```
+
+          ### Windows
+
+          ```powershell
+          irm https://cdn.browseros.com/cli/install.ps1 | iex
+          ```
+
+          After install, run `browseros-cli init` to point the CLI at your BrowserOS MCP server.
+          EOF
+        working-directory: ${{ github.workspace }}
+
+      - name: Create tag and release
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        run: |
+          TAG="browseros-cli-v${{ inputs.version }}"
+          git config user.name "github-actions[bot]"
+          git config user.email "github-actions[bot]@users.noreply.github.com"
+
+          if ! git rev-parse "$TAG" >/dev/null 2>&1; then
+            git tag -a "$TAG" -m "browseros-cli v${{ inputs.version }}"
+            git push origin "$TAG"
+          fi
+
+          CLI_DIST="packages/browseros-agent/apps/cli/dist"
+          gh release create "$TAG" \
+            --title "BrowserOS CLI - v${{ inputs.version }}" \
+            --notes-file /tmp/release-notes.md \
+            ${CLI_DIST}/*
+        working-directory: ${{ github.workspace }}
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: "20"
+          registry-url: "https://registry.npmjs.org"
+
+      - name: Publish to npm
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
+        run: |
+          make npm-version VERSION=${{ inputs.version }}
+          cd npm
+          npm publish --access public

.github/workflows/release-server.yml

@@ -0,0 +1,147 @@
+name: Release BrowserOS Server
+
+on:
+  workflow_dispatch:
+    inputs:
+      version:
+        description: "Release version (e.g. 0.0.80)"
+        required: true
+        type: string
+
+concurrency:
+  group: release-server
+  cancel-in-progress: false
+
+jobs:
+  release:
+    if: github.ref == 'refs/heads/main'
+    runs-on: ubuntu-latest
+    environment: release-core
+    permissions:
+      contents: write
+    defaults:
+      run:
+        working-directory: packages/browseros-agent
+
+    steps:
+      - uses: actions/checkout@v6
+        with:
+          fetch-depth: 0
+
+      - uses: oven-sh/setup-bun@v2
+        with:
+          bun-version: "1.3.6"
+
+      - name: Install dependencies
+        run: bun ci
+
+      - name: Prepare production env file
+        run: cp apps/server/.env.production.example apps/server/.env.production
+
+      - name: Validate version
+        id: version
+        env:
+          REQUESTED_VERSION: ${{ inputs.version }}
+        run: |
+          PACKAGE_VERSION=$(node -p "require('./apps/server/package.json').version")
+          echo "package_version=$PACKAGE_VERSION" >> "$GITHUB_OUTPUT"
+          echo "release_sha=$(git rev-parse HEAD)" >> "$GITHUB_OUTPUT"
+
+          if [ "$PACKAGE_VERSION" != "$REQUESTED_VERSION" ]; then
+            echo "Requested version $REQUESTED_VERSION does not match apps/server/package.json ($PACKAGE_VERSION)"
+            exit 1
+          fi
+
+      - name: Build release artifacts
+        run: bun run build:server:ci
+
+      - name: Verify release artifacts
+        run: |
+          mapfile -t ZIP_FILES < <(find dist/prod/server -maxdepth 1 -type f -name 'browseros-server-resources-*.zip' | sort)
+
+          if [ "${#ZIP_FILES[@]}" -eq 0 ]; then
+            echo "No server release zip files were produced"
+            exit 1
+          fi
+
+          printf 'Found release artifacts:\n%s\n' "${ZIP_FILES[@]}"
+
+      - name: Generate release notes
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          PACKAGE_VERSION: ${{ steps.version.outputs.package_version }}
+        run: |
+          SERVER_APP_PATH="packages/browseros-agent/apps/server"
+          SERVER_BUILD_DIR="packages/browseros-agent/scripts/build/server"
+          SERVER_BUILD_ENTRY="packages/browseros-agent/scripts/build/server.ts"
+          SERVER_RESOURCE_MANIFEST="packages/browseros-agent/scripts/build/config/server-prod-resources.json"
+          SERVER_WORKSPACE_PKG="packages/browseros-agent/package.json"
+          CURRENT_TAG="browseros-server-v$PACKAGE_VERSION"
+          PREV_TAG=$(git tag -l "browseros-server-v*" --sort=-v:refname | grep -v "^${CURRENT_TAG}$" | head -n 1)
+
+          if [ -z "$PREV_TAG" ]; then
+            echo "Initial release of browseros-server." > /tmp/release-notes.md
+          else
+            COMMITS=$(git log "$PREV_TAG"..HEAD --pretty=format:"%H" -- \
+              "$SERVER_APP_PATH" \
+              "$SERVER_BUILD_DIR" \
+              "$SERVER_BUILD_ENTRY" \
+              "$SERVER_RESOURCE_MANIFEST" \
+              "$SERVER_WORKSPACE_PKG")
+
+            if [ -z "$COMMITS" ]; then
+              echo "No notable changes." > /tmp/release-notes.md
+            else
+              echo "## What's Changed" > /tmp/release-notes.md
+              echo "" >> /tmp/release-notes.md
+
+              while IFS= read -r SHA; do
+                SUBJECT=$(git log -1 --pretty=format:"%s" "$SHA")
+                PR_NUM=$(gh api "/repos/${{ github.repository }}/commits/${SHA}/pulls" --jq '.[0].number // empty' 2>/dev/null)
+
+                if [ -n "$PR_NUM" ] && ! echo "$SUBJECT" | grep -qF "(#${PR_NUM})"; then
+                  echo "- ${SUBJECT} (#${PR_NUM})" >> /tmp/release-notes.md
+                else
+                  echo "- ${SUBJECT}" >> /tmp/release-notes.md
+                fi
+              done <<< "$COMMITS"
+            fi
+          fi
+        working-directory: ${{ github.workspace }}
+
+      - name: Create GitHub release
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          PACKAGE_VERSION: ${{ steps.version.outputs.package_version }}
+          RELEASE_SHA: ${{ steps.version.outputs.release_sha }}
+        run: |
+          TAG="browseros-server-v$PACKAGE_VERSION"
+          TITLE="BrowserOS Server - v$PACKAGE_VERSION"
+          mapfile -t ZIP_FILES < <(find packages/browseros-agent/dist/prod/server -maxdepth 1 -type f -name 'browseros-server-resources-*.zip' | sort)
+
+          git config user.name "github-actions[bot]"
+          git config user.email "github-actions[bot]@users.noreply.github.com"
+
+          if git rev-parse "$TAG" >/dev/null 2>&1; then
+            echo "Tag $TAG already exists, skipping tag creation"
+          else
+            git tag -a "$TAG" -m "browseros-server v$PACKAGE_VERSION" "$RELEASE_SHA"
+          fi
+
+          if git ls-remote --tags origin "$TAG" | grep -q "$TAG"; then
+            echo "Tag $TAG already on remote, skipping push"
+          else
+            git push origin "$TAG"
+          fi
+
+          if gh release view "$TAG" >/dev/null 2>&1; then
+            echo "Release $TAG already exists, updating"
+            gh release edit "$TAG" --title "$TITLE" --notes-file /tmp/release-notes.md
+            gh release upload "$TAG" "${ZIP_FILES[@]}" --clobber
+          else
+            gh release create "$TAG" \
+              --title "$TITLE" \
+              --notes-file /tmp/release-notes.md \
+              "${ZIP_FILES[@]}"
+          fi
+        working-directory: ${{ github.workspace }}

.gitignore

@@ -1,4 +1,6 @@
 **/.DS_Store
+**.auctor/**
+.auctor.json
 .gcs_entries
 **/dmg
 **/env
@@ -29,3 +31,4 @@ packages/browseros/build/tools/
 
 # AI SDK DevTools traces
 .devtools/
+.omc/

README.md

@@ -6,6 +6,7 @@
 [![Slack](https://img.shields.io/badge/Slack-Join%20us-4A154B?logo=slack&logoColor=white)](https://dub.sh/browserOS-slack)
 [![Twitter](https://img.shields.io/twitter/follow/browserOS_ai?style=social)](https://twitter.com/browseros_ai)
 [![License: AGPL v3](https://img.shields.io/badge/License-AGPL%20v3-blue.svg)](LICENSE)
+[![Docs](https://img.shields.io/badge/Docs-docs.browseros.com-blue)](https://docs.browseros.com)
 <br></br>
 <a href="https://files.browseros.com/download/BrowserOS.dmg">
   <img src="https://img.shields.io/badge/Download-macOS-black?style=flat&logo=apple&logoColor=white" alt="Download for macOS (beta)" />
@@ -22,146 +23,183 @@
 <br />
 </div>
 
-##
-🌐 BrowserOS is an open-source Chromium fork that runs AI agents natively. **The privacy-first alternative to ChatGPT Atlas, Perplexity Comet, and Dia.**
+BrowserOS is an open-source Chromium fork that runs AI agents natively. **The privacy-first alternative to ChatGPT Atlas, Perplexity Comet, and Dia.**
 
-🔒 Use your own API keys or run local models with Ollama. Your data never leaves your machine.
+Use your own API keys or run local models with Ollama. Your data never leaves your machine.
 
-💡 Join our [Discord](https://discord.gg/YKwjt5vuKr) or [Slack](https://dub.sh/browserOS-slack) and help us build! Have feature requests? [Suggest here](https://github.com/browseros-ai/BrowserOS/issues/99).
+> **[Documentation](https://docs.browseros.com)** · **[Discord](https://discord.gg/YKwjt5vuKr)** · **[Slack](https://dub.sh/browserOS-slack)** · **[Twitter](https://x.com/browserOS_ai)** · **[Feature Requests](https://github.com/browseros-ai/BrowserOS/issues/99)**
 
-## Quick start
+## Quick Start
 
-1. Download and install BrowserOS:
-   - [macOS](https://files.browseros.com/download/BrowserOS.dmg)
-   - [Windows](https://files.browseros.com/download/BrowserOS_installer.exe)
-   - [Linux (AppImage)](https://files.browseros.com/download/BrowserOS.AppImage)
-   - [Linux (Debian)](https://cdn.browseros.com/download/BrowserOS.deb)
+1. **Download and install** BrowserOS — [macOS](https://files.browseros.com/download/BrowserOS.dmg) · [Windows](https://files.browseros.com/download/BrowserOS_installer.exe) · [Linux (AppImage)](https://files.browseros.com/download/BrowserOS.AppImage) · [Linux (Debian)](https://cdn.browseros.com/download/BrowserOS.deb)
+2. **Import your Chrome data** (optional) — bookmarks, passwords, extensions all carry over
+3. **Connect your AI provider** — Claude, OpenAI, Gemini, ChatGPT Pro via OAuth, or local models via Ollama/LM Studio
 
-2. Import your Chrome data (optional)
+## Features
 
-3. Connect your AI provider — use Claude, OpenAI, Gemini, or local models via Ollama and LMStudio.
-
-4. Start automating!
-
-## What makes BrowserOS special
-- 🏠 Feels like home — same Chrome interface, all your extensions just work
-- 🤖 AI agents that run on YOUR browser, not in the cloud
-- 🔒 Privacy first — bring your own keys or run local models with Ollama. Your browsing history stays on your machine
-- 🤝 [BrowserOS as MCP server](https://docs.browseros.com/features/use-with-claude-code) — control the browser from `claude-code`, `gemini-cli`, or any MCP client (31 tools)
-- 🔄 [Workflows](https://docs.browseros.com/features/workflows) — build repeatable browser automations with a visual graph builder
-- 📂 [Cowork](https://docs.browseros.com/features/cowork) — combine browser automation with local file operations. Research the web, save reports to your folder
-- ⏰ [Scheduled Tasks](https://docs.browseros.com/features/scheduled-tasks) — run the agent on autopilot, daily or every few minutes
-- 💬 [LLM Hub](https://docs.browseros.com/features/llm-chat-hub) — compare Claude, ChatGPT, and Gemini side-by-side on any page
-- 🛡️ Built-in ad blocker — [10x more protection than Chrome](https://docs.browseros.com/features/ad-blocking) with uBlock Origin + Manifest V2 support
-- 🚀 100% open source under AGPL-3.0
+| Feature | Description | Docs |
+|---------|-------------|------|
+| **AI Agent** | 53+ browser automation tools — navigate, click, type, extract data, all with natural language | [Guide](https://docs.browseros.com/getting-started) |
+| **MCP Server** | Control the browser from Claude Code, Gemini CLI, or any MCP client | [Setup](https://docs.browseros.com/features/use-with-claude-code) |
+| **Workflows** | Build repeatable browser automations with a visual graph builder | [Docs](https://docs.browseros.com/features/workflows) |
+| **Cowork** | Combine browser automation with local file operations — research the web, save reports to your folder | [Docs](https://docs.browseros.com/features/cowork) |
+| **Scheduled Tasks** | Run agents on autopilot — daily, hourly, or every few minutes | [Docs](https://docs.browseros.com/features/scheduled-tasks) |
+| **Memory** | Persistent memory across conversations — your assistant remembers context over time | [Docs](https://docs.browseros.com/features/memory) |
+| **SOUL.md** | Define your AI's personality and instructions in a single markdown file | [Docs](https://docs.browseros.com/features/soul-md) |
+| **LLM Hub** | Compare Claude, ChatGPT, and Gemini responses side-by-side on any page | [Docs](https://docs.browseros.com/features/llm-chat-hub) |
+| **40+ App Integrations** | Gmail, Slack, GitHub, Linear, Notion, Figma, Salesforce, and more via MCP | [Docs](https://docs.browseros.com/features/connect-apps) |
+| **Vertical Tabs** | Side-panel tab management — stay organized even with 100+ tabs open | [Docs](https://docs.browseros.com/features/vertical-tabs) |
+| **Ad Blocking** | uBlock Origin + Manifest V2 support — [10x more protection](https://docs.browseros.com/features/ad-blocking) than Chrome | [Docs](https://docs.browseros.com/features/ad-blocking) |
+| **Cloud Sync** | Sync browser config and agent history across devices | [Docs](https://docs.browseros.com/features/sync) |
+| **Skills** | Custom instruction sets that shape how your AI assistant behaves | [Docs](https://docs.browseros.com/features/skills) |
+| **Smart Nudges** | Contextual suggestions to connect apps and use features at the right moment | [Docs](https://docs.browseros.com/features/smart-nudges) |
 
 ## Demos
 
-### 🤖 BrowserOS agent in action
+### BrowserOS agent in action
 [![BrowserOS agent in action](docs/videos/browserOS-agent-in-action.gif)](https://www.youtube.com/watch?v=SoSFev5R5dI)
 <br/><br/>
 
-### 🎇 Install [BrowserOS as MCP](https://docs.browseros.com/features/use-with-claude-code) and control it from `claude-code`
+### Install [BrowserOS as MCP](https://docs.browseros.com/features/use-with-claude-code) and control it from `claude-code`
 
 https://github.com/user-attachments/assets/c725d6df-1a0d-40eb-a125-ea009bf664dc
 
 <br/><br/>
 
-### 💬 Use BrowserOS to chat
+### Use BrowserOS to chat
 
 https://github.com/user-attachments/assets/726803c5-8e36-420e-8694-c63a2607beca
 
 <br/><br/>
 
-### ⚡ Use BrowserOS to scrape data
+### Use BrowserOS to scrape data
 
 https://github.com/user-attachments/assets/9f038216-bc24-4555-abf1-af2adcb7ebc0
 
 <br/><br/>
 
-## Why We're Building BrowserOS
+## Install `browseros-cli`
 
-For the first time since Netscape pioneered the web in 1994, AI gives us the chance to completely reimagine the browser. We've seen tools like Cursor deliver 10x productivity gains for developers—yet everyday browsing remains frustratingly archaic.
+Use `browseros-cli` to launch and control BrowserOS from the terminal or from AI coding agents like Claude Code.
 
-You're likely juggling 70+ tabs, battling your browser instead of having it assist you. Routine tasks, like ordering something from amazon or filling a form should be handled seamlessly by AI agents.
+**macOS / Linux:**
 
-At BrowserOS, we're convinced that AI should empower you by automating tasks locally and securely—keeping your data private. We are building the best browser for this future!
+```bash
+curl -fsSL https://cdn.browseros.com/cli/install.sh | bash
+```
 
-## How we compare
+**Windows:**
 
-<details>
-<summary><b>vs Chrome</b></summary>
-<br>
-While we're grateful for Google open-sourcing Chromium, but Chrome hasn't evolved much in 10 years. No AI features, no automation, no MCP support.
-</details>
+```powershell
+irm https://cdn.browseros.com/cli/install.ps1 | iex
+```
 
-<details>
-<summary><b>vs Brave</b></summary>
-<br>
-We love what Brave started, but they've spread themselves too thin with crypto, search, VPNs. We're laser-focused on AI-powered browsing.
-</details>
+After install, run `browseros-cli init` to connect the CLI to your running BrowserOS instance.
 
-<details>
-<summary><b>vs Arc/Dia</b></summary>
-<br>
-Many loved Arc, but it was closed source. When they abandoned users, there was no recourse. We're 100% open source - fork it anytime!
-</details>
+## LLM Providers
 
-<details>
-<summary><b>vs Perplexity Comet</b></summary>
-<br>
-They're a search/ad company. Your browser history becomes their product. We keep everything local.
-</details>
+BrowserOS works with any LLM. Bring your own keys, use OAuth, or run models locally.
 
-<details>
-<summary><b>vs ChatGPT Atlas</b></summary>
-<br>
-Your browsing data could be used for ads or to train their models. We keep your history and agent interactions strictly local.
-</details>
+| Provider | Type | Auth |
+|----------|------|------|
+| Kimi K2.5 | Cloud (default) | Built-in |
+| ChatGPT Pro/Plus | Cloud | [OAuth](https://docs.browseros.com/features/chatgpt) |
+| GitHub Copilot | Cloud | [OAuth](https://docs.browseros.com/features/github-copilot) |
+| Qwen Code | Cloud | [OAuth](https://docs.browseros.com/features/qwen-code) |
+| Claude (Anthropic) | Cloud | API key |
+| GPT-4o / o3 (OpenAI) | Cloud | API key |
+| Gemini (Google) | Cloud | API key |
+| Azure OpenAI | Cloud | API key |
+| AWS Bedrock | Cloud | IAM credentials |
+| OpenRouter | Cloud | API key |
+| Ollama | Local | [Setup](https://docs.browseros.com/features/ollama) |
+| LM Studio | Local | [Setup](https://docs.browseros.com/features/lm-studio) |
+
+## How We Compare
+
+| | BrowserOS | Chrome | Brave | Dia | Comet | Atlas |
+|---|:---:|:---:|:---:|:---:|:---:|:---:|
+| Open Source | ✅ | ❌ | ✅ | ❌ | ❌ | ❌ |
+| AI Agent | ✅ | ❌ | ❌ | ❌ | ✅ | ✅ |
+| MCP Server | ✅ | ❌ | ❌ | ❌ | ❌ | ❌ |
+| Visual Workflows | ✅ | ❌ | ❌ | ❌ | ❌ | ❌ |
+| Cowork (files + browser) | ✅ | ❌ | ❌ | ❌ | ❌ | ❌ |
+| Scheduled Tasks | ✅ | ❌ | ❌ | ❌ | ❌ | ❌ |
+| Bring Your Own Keys | ✅ | ❌ | ✅ | ❌ | ❌ | ❌ |
+| Local Models (Ollama) | ✅ | ❌ | ✅ | ❌ | ❌ | ❌ |
+| Local-first Privacy | ✅ | ❌ | ✅ | ❌ | ❌ | ❌ |
+| Ad Blocking (MV2) | ✅ | ❌ | ✅ | ❌ | ✅ | ❌ |
+
+**Detailed comparisons:**
+- [BrowserOS vs Chrome DevTools MCP](https://docs.browseros.com/comparisons/chrome-devtools-mcp) — developer-focused comparison for browser automation
+- [BrowserOS vs Claude Cowork](https://docs.browseros.com/comparisons/claude-cowork) — getting real work done with AI
+- [BrowserOS vs OpenClaw](https://docs.browseros.com/comparisons/openclaw) — everyday AI assistance
+
+## Architecture
+
+BrowserOS is a monorepo with two main subsystems: the **browser** (Chromium fork) and the **agent platform** (TypeScript/Go).
+
+```
+BrowserOS/
+├── packages/browseros/              # Chromium fork + build system (Python)
+│   ├── chromium_patches/            # Patches applied to Chromium source
+│   ├── build/                       # Build CLI and modules
+│   └── resources/                   # Icons, entitlements, signing
+│
+├── packages/browseros-agent/        # Agent platform (TypeScript/Go)
+│   ├── apps/
+│   │   ├── server/                  # MCP server + AI agent loop (Bun)
+│   │   ├── agent/                   # Browser extension UI (WXT + React)
+│   │   ├── cli/                     # CLI tool (Go)
+│   │   ├── eval/                    # Benchmark framework
+│   │   └── controller-ext/          # Chrome API bridge extension
+│   │
+│   └── packages/
+│       ├── agent-sdk/               # Node.js SDK (npm: @browseros-ai/agent-sdk)
+│       ├── cdp-protocol/            # CDP type bindings
+│       └── shared/                  # Shared constants
+```
+
+| Package | What it does |
+|---------|-------------|
+| [`packages/browseros`](packages/browseros/) | Chromium fork — patches, build system, signing |
+| [`apps/server`](packages/browseros-agent/apps/server/) | Bun server exposing 53+ MCP tools and running the AI agent loop |
+| [`apps/agent`](packages/browseros-agent/apps/agent/) | Browser extension — new tab, side panel chat, onboarding, settings |
+| [`apps/cli`](packages/browseros-agent/apps/cli/) | Go CLI — control BrowserOS from the terminal or AI coding agents |
+| [`apps/eval`](packages/browseros-agent/apps/eval/) | Benchmark framework — WebVoyager, Mind2Web evaluation |
+| [`agent-sdk`](packages/browseros-agent/packages/agent-sdk/) | Node.js SDK for browser automation with natural language |
+| [`cdp-protocol`](packages/browseros-agent/packages/cdp-protocol/) | Type-safe Chrome DevTools Protocol bindings |
 
 ## Contributing
 
-We'd love your help making BrowserOS better!
+We'd love your help making BrowserOS better! See our [Contributing Guide](CONTRIBUTING.md) for details.
 
-- 🐛 [Report bugs](https://github.com/browseros-ai/BrowserOS/issues)
-- 💡 [Suggest features](https://github.com/browseros-ai/BrowserOS/issues/99)
-- 💬 [Join Discord](https://discord.gg/YKwjt5vuKr)
-- 🐦 [Follow on Twitter](https://x.com/browserOS_ai)
+- [Report bugs](https://github.com/browseros-ai/BrowserOS/issues)
+- [Suggest features](https://github.com/browseros-ai/BrowserOS/issues/99)
+- [Join Discord](https://discord.gg/YKwjt5vuKr) · [Join Slack](https://dub.sh/browserOS-slack)
+- [Follow on Twitter](https://x.com/browserOS_ai)
+
+**Agent development** (TypeScript/Go) — see the [agent monorepo README](packages/browseros-agent/README.md) for setup instructions.
+
+**Browser development** (C++/Python) — requires ~100GB disk space. See [`packages/browseros`](packages/browseros/) for build instructions.
+
+## Credits
+
+- [ungoogled-chromium](https://github.com/ungoogled-software/ungoogled-chromium) — BrowserOS uses some patches for enhanced privacy. Thanks to everyone behind this project!
+- [The Chromium Project](https://www.chromium.org/) — at the core of BrowserOS, making it possible to exist in the first place.
 
 ## License
 
 BrowserOS is open source under the [AGPL-3.0 license](LICENSE).
 
-## Credits
-
-- [ungoogled-chromium](https://github.com/ungoogled-software/ungoogled-chromium) - BrowserOS uses some patches for enhanced privacy. Thanks to everyone behind this project!
-- [The Chromium Project](https://www.chromium.org/) - At the core of BrowserOS, making it possible to exist in the first place.
-
-## Citation
-
-If you use BrowserOS in your research or project, please cite:
-
-```bibtex
-@software{browseros2025,
-  author = {Sonti, Nithin and Sonti, Nikhil and {BrowserOS-team}},
-  title = {BrowserOS: The open-source Agentic browser},
-  url = {https://github.com/browseros-ai/BrowserOS},
-  year = {2025},
-  publisher = {GitHub},
-  license = {AGPL-3.0},
-}
-```
-
-Copyright &copy; 2025 Felafax, Inc.
+Copyright &copy; 2026 Felafax, Inc.
 
 ## Stargazers
+
 Thank you to all our supporters!
 
 [![Star History Chart](https://api.star-history.com/svg?repos=browseros-ai/BrowserOS&type=Date)](https://www.star-history.com/#browseros-ai/BrowserOS&Date)
 
-## 
 <p align="center">
 Built with ❤️ from San Francisco
 </p>
-
-

docs/docs.json

@@ -23,6 +23,9 @@
         "group": "Core Features",
         "pages": [
           "features/bring-your-own-llm",
+          "features/chatgpt-pro-oauth",
+          "features/github-copilot-oauth",
+          "features/qwen-code-oauth",
           "features/local-models",
           "features/workflows",
           "features/scheduled-tasks",

docs/features/ad-blocking.mdx

@@ -3,13 +3,17 @@ title: "Ad Blocking"
 description: "BrowserOS supports full ad blocking with uBlock Origin"
 ---
 
-BrowserOS supports full ad blocking through [uBlock Origin](https://ublockorigin.com/), the most effective open-source ad blocker available.
+BrowserOS supports full ad blocking through [uBlock Origin](https://ublockorigin.com/), the most powerful open-source ad blocker available — the full extension, not the watered-down "Lite" version.
 
-## How It Works
+## Why BrowserOS?
 
-Chrome has been [phasing out support](https://developer.chrome.com/docs/extensions/develop/migrate/mv2-deprecation-timeline) for Manifest V2 extensions, which uBlock Origin relies on for its full blocking capabilities. We re-enabled Manifest V2 support in BrowserOS so uBlock Origin can run at full power.
+Chrome [killed support](https://developer.chrome.com/docs/extensions/develop/migrate/mv2-deprecation-timeline) for uBlock Origin by phasing out Manifest V2 extensions. The only option left on Chrome is "uBlock Origin Lite," a significantly weaker version that can't use advanced filtering rules.
 
-Install it from the Chrome Web Store: [uBlock Origin](https://chromewebstore.google.com/detail/ublock-origin/cjpalhdlnbpafiamejdnhcphjbkeiagm)
+**BrowserOS re-enabled full Manifest V2 support**, so you can install and run the original uBlock Origin at full power — the same extension Chrome no longer allows.
+
+<Card title="Install uBlock Origin" icon="shield-check" href="https://chromewebstore.google.com/detail/ublock-origin/cjpalhdlnbpafiamejdnhcphjbkeiagm">
+  Install the full uBlock Origin extension from the Chrome Web Store. Works on BrowserOS out of the box.
+</Card>
 
 ## BrowserOS vs Chrome
 

docs/features/bring-your-own-llm.mdx

@@ -13,6 +13,33 @@ See how to connect your own LLM in under a minute:
   src="https://pub-80f8a01e6e8b4239ae53a7652ef85877.r2.dev/resources/feature-videos/1-bring-your-own-LLM.mov"
 ></video>
 
+## Use Your Existing Subscription
+
+Already paying for ChatGPT Pro, GitHub Copilot, or Qwen Code? Connect your existing account to BrowserOS with a single sign-in — no API keys, no extra cost.
+
+<CardGroup cols={3}>
+  <Card href="/features/chatgpt-pro-oauth">
+    <svg fill="currentColor" fillRule="evenodd" height="24" width="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M9.205 8.658v-2.26c0-.19.072-.333.238-.428l4.543-2.616c.619-.357 1.356-.523 2.117-.523 2.854 0 4.662 2.212 4.662 4.566 0 .167 0 .357-.024.547l-4.71-2.759a.797.797 0 00-.856 0l-5.97 3.473zm10.609 8.8V12.06c0-.333-.143-.57-.429-.737l-5.97-3.473 1.95-1.118a.433.433 0 01.476 0l4.543 2.617c1.309.76 2.189 2.378 2.189 3.948 0 1.808-1.07 3.473-2.76 4.163zM7.802 12.703l-1.95-1.142c-.167-.095-.239-.238-.239-.428V5.899c0-2.545 1.95-4.472 4.591-4.472 1 0 1.927.333 2.712.928L8.23 5.067c-.285.166-.428.404-.428.737v6.898zM12 15.128l-2.795-1.57v-3.33L12 8.658l2.795 1.57v3.33L12 15.128zm1.796 7.23c-1 0-1.927-.332-2.712-.927l4.686-2.712c.285-.166.428-.404.428-.737v-6.898l1.974 1.142c.167.095.238.238.238.428v5.233c0 2.545-1.974 4.472-4.614 4.472zm-5.637-5.303l-4.544-2.617c-1.308-.761-2.188-2.378-2.188-3.948A4.482 4.482 0 014.21 6.327v5.423c0 .333.143.571.428.738l5.947 3.449-1.95 1.118a.432.432 0 01-.476 0zm-.262 3.9c-2.688 0-4.662-2.021-4.662-4.519 0-.19.024-.38.047-.57l4.686 2.71c.286.167.571.167.856 0l5.97-3.448v2.26c0 .19-.07.333-.237.428l-4.543 2.616c-.619.357-1.356.523-2.117.523zm5.899 2.83a5.947 5.947 0 005.827-4.756C22.287 18.339 24 15.84 24 13.296c0-1.665-.713-3.282-1.998-4.448.119-.5.19-.999.19-1.498 0-3.401-2.759-5.947-5.946-5.947-.642 0-1.26.095-1.88.31A5.962 5.962 0 0010.205 0a5.947 5.947 0 00-5.827 4.757C1.713 5.447 0 7.945 0 10.49c0 1.666.713 3.283 1.998 4.448-.119.5-.19 1-.19 1.499 0 3.401 2.759 5.946 5.946 5.946.642 0 1.26-.095 1.88-.309a5.96 5.96 0 004.162 1.713z"></path></svg>
+    **ChatGPT Pro / Plus**
+
+    Sign in with your OpenAI account. Access GPT-5 Codex, GPT-5.4, and the full Codex lineup with up to 400K context.
+  </Card>
+  <Card href="/features/github-copilot-oauth">
+    <svg fill="currentColor" fillRule="evenodd" height="24" width="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M19.245 5.364c1.322 1.36 1.877 3.216 2.11 5.817.622 0 1.2.135 1.592.654l.73.964c.21.278.323.61.323.955v2.62c0 .339-.173.669-.453.868C20.239 19.602 16.157 21.5 12 21.5c-4.6 0-9.205-2.583-11.547-4.258-.28-.2-.452-.53-.453-.868v-2.62c0-.345.113-.679.321-.956l.73-.963c.392-.517.974-.654 1.593-.654l.029-.297c.25-2.446.81-4.213 2.082-5.52 2.461-2.54 5.71-2.851 7.146-2.864h.198c1.436.013 4.685.323 7.146 2.864zm-7.244 4.328c-.284 0-.613.016-.962.05-.123.447-.305.85-.57 1.108-1.05 1.023-2.316 1.18-2.994 1.18-.638 0-1.306-.13-1.851-.464-.516.165-1.012.403-1.044.996a65.882 65.882 0 00-.063 2.884l-.002.48c-.002.563-.005 1.126-.013 1.69.002.326.204.63.51.765 2.482 1.102 4.83 1.657 6.99 1.657 2.156 0 4.504-.555 6.985-1.657a.854.854 0 00.51-.766c.03-1.682.006-3.372-.076-5.053-.031-.596-.528-.83-1.046-.996-.546.333-1.212.464-1.85.464-.677 0-1.942-.157-2.993-1.18-.266-.258-.447-.661-.57-1.108-.32-.032-.64-.049-.96-.05zm-2.525 4.013c.539 0 .976.426.976.95v1.753c0 .525-.437.95-.976.95a.964.964 0 01-.976-.95v-1.752c0-.525.437-.951.976-.951zm5 0c.539 0 .976.426.976.95v1.753c0 .525-.437.95-.976.95a.964.964 0 01-.976-.95v-1.752c0-.525.437-.951.976-.951zM7.635 5.087c-1.05.102-1.935.438-2.385.906-.975 1.037-.765 3.668-.21 4.224.405.394 1.17.657 1.995.657h.09c.649-.013 1.785-.176 2.73-1.11.435-.41.705-1.433.675-2.47-.03-.834-.27-1.52-.63-1.813-.39-.336-1.275-.482-2.265-.394zm6.465.394c-.36.292-.6.98-.63 1.813-.03 1.037.24 2.06.675 2.47.968.957 2.136 1.104 2.776 1.11h.044c.825 0 1.59-.263 1.995-.657.555-.556.765-3.187-.21-4.224-.45-.468-1.335-.804-2.385-.906-.99-.088-1.875.058-2.265.394zM12 7.615c-.24 0-.525.015-.84.044.03.16.045.336.06.526l-.001.159a2.94 2.94 0 01-.014.25c.225-.022.425-.027.612-.028h.366c.187 0 .387.006.612.028-.015-.146-.015-.277-.015-.409.015-.19.03-.365.06-.526a9.29 9.29 0 00-.84-.044z"></path></svg>
+    **GitHub Copilot**
+
+    Sign in with your GitHub account. Access 19+ models including Claude, GPT-5, and Gemini through one subscription.
+  </Card>
+  <Card href="/features/qwen-code-oauth">
+    <svg fill="currentColor" fillRule="evenodd" height="24" width="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M12.604 1.34c.393.69.784 1.382 1.174 2.075a.18.18 0 00.157.091h5.552c.174 0 .322.11.446.327l1.454 2.57c.19.337.24.478.024.837-.26.43-.513.864-.76 1.3l-.367.658c-.106.196-.223.28-.04.512l2.652 4.637c.172.301.111.494-.043.77-.437.785-.882 1.564-1.335 2.34-.159.272-.352.375-.68.37-.777-.016-1.552-.01-2.327.016a.099.099 0 00-.081.05 575.097 575.097 0 01-2.705 4.74c-.169.293-.38.363-.725.364-.997.003-2.002.004-3.017.002a.537.537 0 01-.465-.271l-1.335-2.323a.09.09 0 00-.083-.049H4.982c-.285.03-.553-.001-.805-.092l-1.603-2.77a.543.543 0 01-.002-.54l1.207-2.12a.198.198 0 000-.197 550.951 550.951 0 01-1.875-3.272l-.79-1.395c-.16-.31-.173-.496.095-.965.465-.813.927-1.625 1.387-2.436.132-.234.304-.334.584-.335a338.3 338.3 0 012.589-.001.124.124 0 00.107-.063l2.806-4.895a.488.488 0 01.422-.246c.524-.001 1.053 0 1.583-.006L11.704 1c.341-.003.724.032.9.34zm-3.432.403a.06.06 0 00-.052.03L6.254 6.788a.157.157 0 01-.135.078H3.253c-.056 0-.07.025-.041.074l5.81 10.156c.025.042.013.062-.034.063l-2.795.015a.218.218 0 00-.2.116l-1.32 2.31c-.044.078-.021.118.068.118l5.716.008c.046 0 .08.02.104.061l1.403 2.454c.046.081.092.082.139 0l5.006-8.76.783-1.382a.055.055 0 01.096 0l1.424 2.53a.122.122 0 00.107.062l2.763-.02a.04.04 0 00.035-.02.041.041 0 000-.04l-2.9-5.086a.108.108 0 010-.113l.293-.507 1.12-1.977c.024-.041.012-.062-.035-.062H9.2c-.059 0-.073-.026-.043-.077l1.434-2.505a.107.107 0 000-.114L9.225 1.774a.06.06 0 00-.053-.031zm6.29 8.02c.046 0 .058.02.034.06l-.832 1.465-2.613 4.585a.056.056 0 01-.05.029.058.058 0 01-.05-.029L8.498 9.841c-.02-.034-.01-.052.028-.054l.216-.012 6.722-.012z"></path></svg>
+    **Qwen Code**
+
+    Sign in with your Qwen account. Access Qwen 3 Coder with a 1 million token context window.
+  </Card>
+</CardGroup>
+
+---
+
 ## Which Model Should I Use?
 
 | Mode | What works | Recommendation |
@@ -104,6 +131,29 @@ Connect to powerful AI models using your API keys. Your keys stay on your machin
     ![Gemini config](/images/byollm--gemini-provider-config.png)
   </Accordion>
 
+  <div id="nvidia" />
+  <Accordion title="NVIDIA (Free)" icon="microchip">
+    NVIDIA's [build.nvidia.com](https://build.nvidia.com/models) hosts 80+ models — including GLM 5.1, MiniMax M2.7, GPT-OSS-120B, Qwen 3.5, Mistral, and Nemotron — behind a **free OpenAI-compatible API endpoint**. Great for chatting, prototyping, and personal projects.
+
+    **Get your API key:**
+    1. Go to [build.nvidia.com/models](https://build.nvidia.com/models) and sign in with a free NVIDIA developer account
+    2. Pick any model tagged **Free Endpoint** (e.g. [`minimaxai/minimax-m2.7`](https://build.nvidia.com/minimaxai/minimax-m2.7), [`z-ai/glm-5.1`](https://build.nvidia.com/z-ai/glm-5.1), [`qwen/qwen3.5-122b-a10b`](https://build.nvidia.com/qwen/qwen3.5-122b-a10b))
+    3. Click **Get API Key** on the model page and copy the `nvapi-...` key
+
+    **Add to BrowserOS:**
+    1. Go to `chrome://browseros/settings`
+    2. Click **USE** on the **OpenAI Compatible** card
+    3. Set **Base URL** to `https://integrate.api.nvidia.com/v1`
+    4. Set **Model ID** to a model from the catalog (e.g. `minimaxai/minimax-m2.7`, `z-ai/glm-5.1`, `qwen/qwen3.5-122b-a10b`)
+    5. Paste your NVIDIA API key
+    6. Set **Context Window** based on the model (most are `128000` or higher)
+    7. Click **Save**
+
+    <Tip>
+    NVIDIA's free endpoints share GPU capacity across all developers, so throughput is slower than a paid API. They're best for Chat Mode, exploring new open-source models, and personal projects. For production agent workloads, use a paid provider like Claude or Kimi.
+    </Tip>
+  </Accordion>
+
   <div id="claude" />
   <Accordion title="Claude (Best for Agents)" icon="message-bot">
     Claude Opus 4.5 gives the best results for Agent Mode.

docs/features/chatgpt-pro-oauth.mdx

@@ -0,0 +1,56 @@
+---
+title: "ChatGPT Pro / Plus"
+description: "Use your ChatGPT subscription to power BrowserOS"
+---
+
+Connect your ChatGPT Pro or Plus subscription to BrowserOS and access GPT-5 Codex, GPT-5.4, and the full lineup of OpenAI's most advanced models — with up to 400K context. No API keys needed.
+
+## Setup
+
+**1.** Open BrowserOS and go to **Settings** (`chrome://browseros/settings`). You'll see the AI Providers section.
+
+![AI Settings screen](/images/setting-up-chatgpt/llm-screen.png)
+
+**2.** Click **USE** on the **ChatGPT Plus/Pro** card. You'll be prompted to sign in with your OpenAI account.
+
+![Login screen](/images/setting-up-chatgpt/login-screen.png)
+
+**3.** Sign in with the OpenAI account that has your ChatGPT Pro or Plus subscription active, and accept the authorization.
+
+![Accept authorization](/images/setting-up-chatgpt/accept-screen.png)
+
+**4.** Once authorized, ChatGPT will appear as a provider in your settings. Select a model and start using it.
+
+## Available Models
+
+| Model | Context Window |
+|-------|---------------|
+| `gpt-5.4` | 400K |
+| `gpt-5.3-codex` | 400K |
+| `gpt-5.2-codex` | 400K |
+| `gpt-5.2` | 200K |
+| `gpt-5.1-codex` | 400K |
+| `gpt-5.1-codex-max` | 400K |
+| `gpt-5.1-codex-mini` | 400K |
+| `gpt-5.1` | 200K |
+
+<Info>
+ChatGPT Pro subscribers have access to the full model lineup. ChatGPT Plus subscribers can access a subset of models depending on their plan. The available models will be shown automatically after you connect.
+</Info>
+
+<Tip>
+The Codex models (e.g., `gpt-5.3-codex`) are optimized for code and reasoning tasks — ideal for complex browser automation workflows that involve form filling, data extraction, and multi-step navigation.
+</Tip>
+
+## Reasoning Settings
+
+ChatGPT Pro includes additional settings for models that support reasoning:
+
+- **Reasoning Effort** — Control how much the model "thinks" before responding. Options: none, low, medium, high.
+- **Reasoning Summary** — Choose how reasoning is displayed. Options: auto, concise, detailed.
+
+These settings are available in the provider configuration after connecting.
+
+## Disconnecting
+
+To disconnect your OpenAI account, go to **Settings**, find the ChatGPT Plus/Pro provider, and click **Disconnect**. Your OAuth tokens will be immediately deleted from your machine.

docs/features/github-copilot-oauth.mdx

@@ -0,0 +1,60 @@
+---
+title: "GitHub Copilot"
+description: "Use your GitHub Copilot subscription to power BrowserOS"
+---
+
+Connect your GitHub Copilot subscription to BrowserOS and access 19+ models — including Claude, GPT-5, and Gemini — through a single GitHub sign-in. No API keys needed.
+
+<Info>
+**Free tier** includes GPT-5 Mini, Claude Haiku 4.5, GPT-4o, and GPT-4.1. **Copilot Pro** ($10/month) unlocks Claude Sonnet 4.6, Claude Opus 4.6, Gemini 3 Pro, GPT-5.4, and more.
+</Info>
+
+## Setup
+
+**1.** Open BrowserOS and go to **Settings** (`chrome://browseros/settings`). You'll see the AI Providers section.
+
+![AI Settings screen](/images/setting-up-copilot/llm-screen.png)
+
+**2.** Click **USE** on the **GitHub Copilot** card. A device code will appear — copy it, then click the link to open GitHub's device authorization page.
+
+![Device code displayed](/images/setting-up-copilot/device-code.png)
+
+**3.** Select your GitHub account to authorize.
+
+![Select GitHub account](/images/setting-up-copilot/select-account.png)
+
+**4.** Paste the device code and authorize BrowserOS to access your Copilot subscription.
+
+![Authorize device](/images/setting-up-copilot/authorize-device.png)
+
+**5.** Once authorized, GitHub Copilot will appear as a provider in your settings. Select a model and start using it.
+
+## Available Models
+
+### Free Tier
+| Model | Context Window |
+|-------|---------------|
+| `gpt-5-mini` | 128K |
+| `claude-haiku-4.5` | 128K |
+| `gpt-4o` | 64K |
+| `gpt-4.1` | 64K |
+
+### Copilot Pro / Pro+
+| Model | Context Window |
+|-------|---------------|
+| `claude-sonnet-4.6` | 200K |
+| `claude-opus-4.6` | 200K |
+| `gemini-2.5-pro` | 1M |
+| `gemini-3-pro-preview` | 1M |
+| `gpt-5.4` | 400K |
+| `gpt-5.3-codex` | 400K |
+| `gpt-5.2-codex` | 400K |
+| `grok-code-fast-1` | 128K |
+
+<Tip>
+GitHub Copilot is the most versatile provider — one subscription gives you access to models from OpenAI, Anthropic, Google, and xAI. Great if you want to switch between models for different tasks.
+</Tip>
+
+## Disconnecting
+
+To disconnect your GitHub account, go to **Settings**, find the GitHub Copilot provider, and click **Disconnect**. Your OAuth tokens will be immediately deleted from your machine.

docs/features/qwen-code-oauth.mdx

@@ -0,0 +1,39 @@
+---
+title: "Qwen Code"
+description: "Use your Qwen Code account to power BrowserOS"
+---
+
+Connect your Qwen Code account to BrowserOS and access Alibaba's coding models with up to a **1 million token context window** — the largest of any provider we support. No API keys needed.
+
+## Setup
+
+**1.** Open BrowserOS and go to **Settings** (`chrome://browseros/settings`). You'll see the AI Providers section.
+
+![AI Settings screen](/images/setting-up-qwen/llm-screen.png)
+
+**2.** Click **USE** on the **Qwen Code** card. You'll be prompted to sign in with your Qwen account.
+
+![Select Qwen Code](/images/setting-up-qwen/select-qwen.png)
+
+**3.** Sign in with your Alibaba Cloud / Qwen account to authorize BrowserOS.
+
+![Qwen sign in](/images/setting-up-qwen/qwen-signin.png)
+
+**4.** Once authorized, Qwen Code will appear as a provider in your settings. Select a model and start using it.
+
+## Available Models
+
+| Model | Context Window |
+|-------|---------------|
+| `coder-model` | 1M |
+| `qwen3-coder-plus` | 1M |
+| `qwen3-coder-flash` | 1M |
+| `qwen3.5-plus` | 1M |
+
+<Tip>
+Qwen Code's 1 million token context window is ideal for tasks that involve long documents, entire documentation sites, or working across many browser tabs simultaneously — the agent can hold everything in context at once.
+</Tip>
+
+## Disconnecting
+
+To disconnect your Qwen account, go to **Settings**, find the Qwen Code provider, and click **Disconnect**. Your OAuth tokens will be immediately deleted from your machine.

docs/images/icons/githubcopilot.svg

@@ -0,0 +1 @@
+<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>GithubCopilot</title><path d="M19.245 5.364c1.322 1.36 1.877 3.216 2.11 5.817.622 0 1.2.135 1.592.654l.73.964c.21.278.323.61.323.955v2.62c0 .339-.173.669-.453.868C20.239 19.602 16.157 21.5 12 21.5c-4.6 0-9.205-2.583-11.547-4.258-.28-.2-.452-.53-.453-.868v-2.62c0-.345.113-.679.321-.956l.73-.963c.392-.517.974-.654 1.593-.654l.029-.297c.25-2.446.81-4.213 2.082-5.52 2.461-2.54 5.71-2.851 7.146-2.864h.198c1.436.013 4.685.323 7.146 2.864zm-7.244 4.328c-.284 0-.613.016-.962.05-.123.447-.305.85-.57 1.108-1.05 1.023-2.316 1.18-2.994 1.18-.638 0-1.306-.13-1.851-.464-.516.165-1.012.403-1.044.996a65.882 65.882 0 00-.063 2.884l-.002.48c-.002.563-.005 1.126-.013 1.69.002.326.204.63.51.765 2.482 1.102 4.83 1.657 6.99 1.657 2.156 0 4.504-.555 6.985-1.657a.854.854 0 00.51-.766c.03-1.682.006-3.372-.076-5.053-.031-.596-.528-.83-1.046-.996-.546.333-1.212.464-1.85.464-.677 0-1.942-.157-2.993-1.18-.266-.258-.447-.661-.57-1.108-.32-.032-.64-.049-.96-.05zm-2.525 4.013c.539 0 .976.426.976.95v1.753c0 .525-.437.95-.976.95a.964.964 0 01-.976-.95v-1.752c0-.525.437-.951.976-.951zm5 0c.539 0 .976.426.976.95v1.753c0 .525-.437.95-.976.95a.964.964 0 01-.976-.95v-1.752c0-.525.437-.951.976-.951zM7.635 5.087c-1.05.102-1.935.438-2.385.906-.975 1.037-.765 3.668-.21 4.224.405.394 1.17.657 1.995.657h.09c.649-.013 1.785-.176 2.73-1.11.435-.41.705-1.433.675-2.47-.03-.834-.27-1.52-.63-1.813-.39-.336-1.275-.482-2.265-.394zm6.465.394c-.36.292-.6.98-.63 1.813-.03 1.037.24 2.06.675 2.47.968.957 2.136 1.104 2.776 1.11h.044c.825 0 1.59-.263 1.995-.657.555-.556.765-3.187-.21-4.224-.45-.468-1.335-.804-2.385-.906-.99-.088-1.875.058-2.265.394zM12 7.615c-.24 0-.525.015-.84.044.03.16.045.336.06.526l-.001.159a2.94 2.94 0 01-.014.25c.225-.022.425-.027.612-.028h.366c.187 0 .387.006.612.028-.015-.146-.015-.277-.015-.409.015-.19.03-.365.06-.526a9.29 9.29 0 00-.84-.044z"></path></svg>

docs/images/icons/openai.svg

@@ -0,0 +1 @@
+<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>OpenAI</title><path d="M9.205 8.658v-2.26c0-.19.072-.333.238-.428l4.543-2.616c.619-.357 1.356-.523 2.117-.523 2.854 0 4.662 2.212 4.662 4.566 0 .167 0 .357-.024.547l-4.71-2.759a.797.797 0 00-.856 0l-5.97 3.473zm10.609 8.8V12.06c0-.333-.143-.57-.429-.737l-5.97-3.473 1.95-1.118a.433.433 0 01.476 0l4.543 2.617c1.309.76 2.189 2.378 2.189 3.948 0 1.808-1.07 3.473-2.76 4.163zM7.802 12.703l-1.95-1.142c-.167-.095-.239-.238-.239-.428V5.899c0-2.545 1.95-4.472 4.591-4.472 1 0 1.927.333 2.712.928L8.23 5.067c-.285.166-.428.404-.428.737v6.898zM12 15.128l-2.795-1.57v-3.33L12 8.658l2.795 1.57v3.33L12 15.128zm1.796 7.23c-1 0-1.927-.332-2.712-.927l4.686-2.712c.285-.166.428-.404.428-.737v-6.898l1.974 1.142c.167.095.238.238.238.428v5.233c0 2.545-1.974 4.472-4.614 4.472zm-5.637-5.303l-4.544-2.617c-1.308-.761-2.188-2.378-2.188-3.948A4.482 4.482 0 014.21 6.327v5.423c0 .333.143.571.428.738l5.947 3.449-1.95 1.118a.432.432 0 01-.476 0zm-.262 3.9c-2.688 0-4.662-2.021-4.662-4.519 0-.19.024-.38.047-.57l4.686 2.71c.286.167.571.167.856 0l5.97-3.448v2.26c0 .19-.07.333-.237.428l-4.543 2.616c-.619.357-1.356.523-2.117.523zm5.899 2.83a5.947 5.947 0 005.827-4.756C22.287 18.339 24 15.84 24 13.296c0-1.665-.713-3.282-1.998-4.448.119-.5.19-.999.19-1.498 0-3.401-2.759-5.947-5.946-5.947-.642 0-1.26.095-1.88.31A5.962 5.962 0 0010.205 0a5.947 5.947 0 00-5.827 4.757C1.713 5.447 0 7.945 0 10.49c0 1.666.713 3.283 1.998 4.448-.119.5-.19 1-.19 1.499 0 3.401 2.759 5.946 5.946 5.946.642 0 1.26-.095 1.88-.309a5.96 5.96 0 004.162 1.713z"></path></svg>

docs/images/icons/qwen.svg

@@ -0,0 +1 @@
+<svg fill="currentColor" fill-rule="evenodd" height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>Qwen</title><path d="M12.604 1.34c.393.69.784 1.382 1.174 2.075a.18.18 0 00.157.091h5.552c.174 0 .322.11.446.327l1.454 2.57c.19.337.24.478.024.837-.26.43-.513.864-.76 1.3l-.367.658c-.106.196-.223.28-.04.512l2.652 4.637c.172.301.111.494-.043.77-.437.785-.882 1.564-1.335 2.34-.159.272-.352.375-.68.37-.777-.016-1.552-.01-2.327.016a.099.099 0 00-.081.05 575.097 575.097 0 01-2.705 4.74c-.169.293-.38.363-.725.364-.997.003-2.002.004-3.017.002a.537.537 0 01-.465-.271l-1.335-2.323a.09.09 0 00-.083-.049H4.982c-.285.03-.553-.001-.805-.092l-1.603-2.77a.543.543 0 01-.002-.54l1.207-2.12a.198.198 0 000-.197 550.951 550.951 0 01-1.875-3.272l-.79-1.395c-.16-.31-.173-.496.095-.965.465-.813.927-1.625 1.387-2.436.132-.234.304-.334.584-.335a338.3 338.3 0 012.589-.001.124.124 0 00.107-.063l2.806-4.895a.488.488 0 01.422-.246c.524-.001 1.053 0 1.583-.006L11.704 1c.341-.003.724.032.9.34zm-3.432.403a.06.06 0 00-.052.03L6.254 6.788a.157.157 0 01-.135.078H3.253c-.056 0-.07.025-.041.074l5.81 10.156c.025.042.013.062-.034.063l-2.795.015a.218.218 0 00-.2.116l-1.32 2.31c-.044.078-.021.118.068.118l5.716.008c.046 0 .08.02.104.061l1.403 2.454c.046.081.092.082.139 0l5.006-8.76.783-1.382a.055.055 0 01.096 0l1.424 2.53a.122.122 0 00.107.062l2.763-.02a.04.04 0 00.035-.02.041.041 0 000-.04l-2.9-5.086a.108.108 0 010-.113l.293-.507 1.12-1.977c.024-.041.012-.062-.035-.062H9.2c-.059 0-.073-.026-.043-.077l1.434-2.505a.107.107 0 000-.114L9.225 1.774a.06.06 0 00-.053-.031zm6.29 8.02c.046 0 .058.02.034.06l-.832 1.465-2.613 4.585a.056.056 0 01-.05.029.058.058 0 01-.05-.029L8.498 9.841c-.02-.034-.01-.052.028-.054l.216-.012 6.722-.012z"></path></svg>

docs/onboarding.mdx

@@ -42,6 +42,10 @@ Welcome to BrowserOS! Let's get you set up.
 
 ## You're all set!
 
+<Tip>
+**Block ads with uBlock Origin** — Chrome dropped support for the full uBlock Origin extension, but BrowserOS brought it back. [Install it from the Chrome Web Store](https://chromewebstore.google.com/detail/ublock-origin/cjpalhdlnbpafiamejdnhcphjbkeiagm) and browse ad-free. [Learn more →](/features/ad-blocking)
+</Tip>
+
 Explore what BrowserOS can do:
 
 <Columns cols={2}>

packages/browseros-agent/.gitignore

@@ -195,3 +195,4 @@ test-results/
 .agent/
 .llm/
 .grove/
+docs/plans/2026-03-24-models-dev-integration.md

packages/browseros-agent/CLAUDE.md

@@ -32,7 +32,7 @@ Use **kebab-case** for all file and folder names:
 | Multi-word files | kebab-case | `gemini-agent.ts`, `mcp-context.ts` |
 | Single-word files | lowercase | `types.ts`, `browser.ts`, `index.ts` |
 | Test files | `.test.ts` suffix | `mcp-context.test.ts` |
-| Folders | kebab-case | `controller-server/`, `rate-limiter/` |
+| Folders | kebab-case | `rate-limiter/`, `browser-tools/` |
 
 Classes remain PascalCase in code, but live in kebab-case files:
 ```typescript
@@ -81,6 +81,9 @@ bun run dev:server               # Build server for development
 bun run dev:ext                  # Build extension for development
 bun run dist:server              # Build server for production (all targets)
 bun run dist:ext                 # Build extension for production
+
+# Refresh models.dev data
+bun run generate:models          # Fetches latest from models.dev/api.json
 ```
 
 ## Architecture
@@ -94,21 +97,16 @@ The main MCP server that exposes browser automation tools via HTTP/SSE.
 
 **Key components:**
 - `src/tools/` - MCP tool definitions, split into:
-  - `cdp-based/` - Tools using Chrome DevTools Protocol (network, console, emulation, input, etc.)
-  - `controller-based/` - Tools using the browser extension (navigation, clicks, screenshots, tabs, history, bookmarks)
-- `src/controller-server/` - WebSocket server that bridges to the browser extension
-  - `ControllerBridge` handles WebSocket connections with extension clients
-  - `ControllerContext` wraps the bridge for tool handlers
+  - `cdp-based/` - Tools using Chrome DevTools Protocol (navigation, DOM interaction, network, console, emulation, input, etc.)
 - `src/common/` - Shared utilities (McpContext, PageCollector, browser connection, identity, db)
 - `src/agent/` - AI agent functionality (Gemini adapter, rate limiting, session management)
 - `src/http/` - Hono HTTP server with MCP, health, and provider routes
 
 **Tool types:**
 - CDP tools require a direct CDP connection (`--cdp-port`)
-- Controller tools work via the browser extension over WebSocket
 
 ### Shared (`packages/shared`)
-Shared constants, types, and configuration used by both server and extension. Avoids magic numbers.
+Shared constants, types, and configuration used across packages. Avoids magic numbers.
 
 **Structure:**
 - `src/constants/` - Configuration values (ports, timeouts, limits, urls, paths)
@@ -116,22 +114,12 @@ Shared constants, types, and configuration used by both server and extension. Av
 
 **Exports:** `@browseros/shared/constants/*`, `@browseros/shared/types/*`
 
-### Controller Extension (`apps/controller-ext`)
-Chrome extension that receives commands from the server via WebSocket.
-
-**Entry point:** `src/background/index.ts` → `BrowserOSController`
-
-**Structure:**
-- `src/actions/` - Action handlers organized by domain (browser/, tab/, bookmark/, history/)
-- `src/adapters/` - Chrome API adapters (TabAdapter, BookmarkAdapter, HistoryAdapter)
-- `src/websocket/` - WebSocket client that connects to the server
-
 ### Communication Flow
 
 ```
 AI Agent/MCP Client → HTTP Server (Hono) → Tool Handler
                                               ↓
-                        CDP (direct) ←── or ──→ WebSocket → Extension → Chrome APIs
+                                   CDP → BrowserOS / Chrome APIs
 ```
 
 ## Creating Packages

packages/browseros-agent/README.md

@@ -1,8 +1,6 @@
 # BrowserOS Agent
 
-Monorepo for the BrowserOS-agent -- contains 3 packages: agent-UI, server (which contains the agent loop) and controller-extension (which is used by the tools within the agent loop).
-
-> **⚠️ NOTE:** This is only a submodule, the main project is at -- https://github.com/browseros-ai/BrowserOS
+The agent platform powering [BrowserOS](https://github.com/browseros-ai/BrowserOS) — contains the MCP server, agent UI, CLI, evaluation framework, and SDK.
 
 ## Monorepo Structure
 
@@ -10,24 +8,29 @@ Monorepo for the BrowserOS-agent -- contains 3 packages: agent-UI, server (which
 apps/
   server/          # Bun server - MCP endpoints + agent loop
   agent/           # Agent UI (Chrome extension)
-  controller-ext/  # BrowserOS Controller (Chrome extension for chrome.* APIs)
+  cli/             # Go CLI for controlling BrowserOS from the terminal
+  eval/            # Evaluation framework for benchmarking agents
 
 packages/
+  agent-sdk/       # Node.js SDK (@browseros-ai/agent-sdk)
+  cdp-protocol/    # Type-safe Chrome DevTools Protocol bindings
   shared/          # Shared constants (ports, timeouts, limits)
 ```
 
 | Package | Description |
 |---------|-------------|
 | `apps/server` | Bun server exposing MCP tools and running the agent loop |
-| `apps/agent` | Agent UI - Chrome extension for the chat interface |
-| `apps/controller-ext` | BrowserOS Controller - Chrome extension that bridges `chrome.*` APIs (tabs, bookmarks, history) to the server via WebSocket |
+| `apps/agent` | Agent UI — Chrome extension for the chat interface |
+| `apps/cli` | Go CLI — control BrowserOS from the terminal or AI coding agents |
+| `apps/eval` | Benchmark framework — WebVoyager, Mind2Web evaluation |
+| `packages/agent-sdk` | Node.js SDK for browser automation with natural language |
+| `packages/cdp-protocol` | Auto-generated CDP type bindings used by the server |
 | `packages/shared` | Shared constants used across packages |
 
 ## Architecture
 
 - `apps/server`: Bun server which contains the agent loop and tools.
 - `apps/agent`: Agent UI (Chrome extension).
-- `apps/controller-ext`: BrowserOS Controller - a Chrome extension that bridges `chrome.*` APIs to the server. Controller tools within the server communicate with this extension via WebSocket.
 
 ```
 ┌──────────────────────────────────────────────────────────────────────────┐
@@ -45,19 +48,19 @@ packages/
 │   /health ─── Health check                                               │
 │                                                                          │
 │   Tools:                                                                 │
-│   ├── CDP Tools (console, network, input, screenshot, ...)              │
-│   └── Controller Tools (tabs, navigation, clicks, bookmarks, history)   │
+│   └── CDP-backed browser tools (tabs, navigation, input, screenshots,   │
+│       bookmarks, history, console, DOM, tab groups, windows, ...)       │
 └──────────────────────────────────────────────────────────────────────────┘
-          │                                         │
-          │ CDP (client)                            │ WebSocket (server)
-          ▼                                         ▼
-┌─────────────────────┐              ┌─────────────────────────────────────┐
-│   Chromium CDP      │              │   BrowserOS Controller Extension    │
-│  (cdpPort: 9000)    │              │     (extensionPort: 9300)           │
-│                     │              │                                     │
-│ Server connects     │              │ Bridges chrome.tabs, chrome.history │
-│ TO this as client   │              │ chrome.bookmarks to the server      │
-└─────────────────────┘              └─────────────────────────────────────┘
+                                    │
+                                    │ CDP (client)
+                                    ▼
+                         ┌─────────────────────┐
+                         │   Chromium CDP      │
+                         │  (cdpPort: 9000)    │
+                         │                     │
+                         │ Server connects     │
+                         │ TO this as client   │
+                         └─────────────────────┘
 ```
 
 ### Ports
@@ -66,7 +69,7 @@ packages/
 |------|--------------|---------|
 | 9100 | `BROWSEROS_SERVER_PORT` | HTTP server - MCP endpoints, agent chat, health |
 | 9000 | `BROWSEROS_CDP_PORT` | Chromium CDP server (BrowserOS Server connects as client) |
-| 9300 | `BROWSEROS_EXTENSION_PORT` | WebSocket server for controller extension |
+| 9300 | `BROWSEROS_EXTENSION_PORT` | Legacy BrowserOS launch arg kept for compatibility; not used by the server |
 
 ## Development
 
@@ -90,9 +93,8 @@ process-compose up
 
 The `process-compose up` command runs the following in order:
 1. `bun install` — installs dependencies
-2. `bun --cwd apps/controller-ext build` — builds the controller extension
-3. `bun --cwd apps/agent codegen` — generates agent code
-4. `bun --cwd apps/server start` and `bun --cwd apps/agent dev` — starts server and agent in parallel
+2. `bun --cwd apps/agent codegen` — generates agent code
+3. `bun --cwd apps/server start` and `bun --cwd apps/agent dev` — starts server and agent in parallel
 
 ### Environment Variables
 
@@ -108,7 +110,7 @@ Runtime uses `.env.development`, while production artifact builds use `.env.prod
 |----------|---------|-------------|
 | `BROWSEROS_SERVER_PORT` | 9100 | HTTP server port (MCP, chat, health) |
 | `BROWSEROS_CDP_PORT` | 9000 | Chromium CDP port (server connects as client) |
-| `BROWSEROS_EXTENSION_PORT` | 9300 | WebSocket port for controller extension |
+| `BROWSEROS_EXTENSION_PORT` | 9300 | Legacy BrowserOS launch arg kept for compatibility |
 | `BROWSEROS_CONFIG_URL` | - | Remote config endpoint for rate limits |
 | `BROWSEROS_INSTALL_ID` | - | Unique installation identifier (analytics) |
 | `BROWSEROS_CLIENT_ID` | - | Client identifier (analytics) |
@@ -140,7 +142,7 @@ Copy from `apps/server/.env.production.example` before running `build:server`.
 |----------|---------|-------------|
 | `BROWSEROS_SERVER_PORT` | 9100 | Passed to BrowserOS via CLI args |
 | `BROWSEROS_CDP_PORT` | 9000 | Passed to BrowserOS via CLI args |
-| `BROWSEROS_EXTENSION_PORT` | 9300 | Passed to BrowserOS via CLI args |
+| `BROWSEROS_EXTENSION_PORT` | 9300 | Legacy BrowserOS CLI arg still passed for compatibility |
 | `VITE_BROWSEROS_SERVER_PORT` | 9100 | Agent UI connects to server (must match `BROWSEROS_SERVER_PORT`) |
 | `BROWSEROS_BINARY` | - | Path to BrowserOS binary |
 | `USE_BROWSEROS_BINARY` | true | Use BrowserOS instead of default Chrome |
@@ -157,15 +159,13 @@ bun run start:server          # Start the server
 bun run start:agent           # Start agent extension (dev mode)
 
 # Build
-bun run build                 # Build server, agent, and controller extension
+bun run build                 # Build server and agent
 bun run build:server          # Build production server resource artifacts and upload zips to R2
 bun run build:agent           # Build agent extension
-bun run build:ext             # Build controller extension
 
 # Test
 bun run test                  # Run standard tests
 bun run test:cdp              # Run CDP-based tests
-bun run test:controller       # Run controller-based tests
 bun run test:integration      # Run integration tests
 
 # Quality

packages/browseros-agent/apps/agent/.env.example

@@ -15,9 +15,6 @@ VITE_PUBLIC_SENTRY_DSN=
 # BrowserOS API URL
 VITE_PUBLIC_BROWSEROS_API=https://api.browseros.com
 
-# Launch feature flags
-VITE_PUBLIC_KIMI_LAUNCH=false
-
 # GraphQL Schema Path (optional — falls back to schema/schema.graphql)
 GRAPHQL_SCHEMA_PATH=
 

packages/browseros-agent/apps/agent/CHANGELOG.md

@@ -0,0 +1,30 @@
+# BrowserOS Agent Extension
+
+## v0.0.99 (2026-04-08)
+
+## What's Changed
+
+- chore: bump server and extension version (#659)
+- chore(agent): remove workflows feature (#656)
+- feat: replace model picker with shadcn Combobox + fuse.js fuzzy search (#617)
+- feat: clean-up - remove obsolete controller extension (#610)
+- docs: update agent extension changelog for v0.0.98 (#609)
+
+
+## v0.0.98 (2026-03-27)
+
+## What's Changed
+
+- chore: update agent version (#608)
+- chore: fix version number for extension (#606)
+- fix: improve chat history freshness and reduce query payload (#598)
+- feat: isolate new-tab agent navigation from origin tab (#593)
+- docs: overhaul READMEs across all major packages (#594)
+- fix(ui): resolve MCP promo banner dismiss button overlapping with text (#581)
+- docs: update agent extension changelog for v0.0.52 (#573)
+
+
+## v0.0.52 (2026-03-26)
+
+Initial release
+

packages/browseros-agent/apps/agent/CLAUDE.md

@@ -12,7 +12,7 @@ This file provides guidance to Claude Code (claude.ai/code) when working with co
 |------|------------|---------|
 | Folders | kebab-case | `ai-settings/`, `jtbd-popup/`, `llm-hub/` |
 | React components (.tsx) | PascalCase | `AISettingsPage.tsx`, `SurveyHeader.tsx` |
-| Hooks (.ts) | camelCase with `use` prefix | `useRunWorkflow.ts`, `useVoiceInput.ts` |
+| Hooks (.ts) | camelCase with `use` prefix | `useVoiceInput.ts`, `useMessageTree.ts` |
 | Non-component files (.ts) | lowercase | `types.ts`, `models.ts`, `storage.ts` |
 
 ## Project Overview

packages/browseros-agent/apps/agent/README.md

@@ -1,16 +1,24 @@
-# BrowserOS Agent Chrome Extension
+# BrowserOS Agent Extension
 
-The official Chrome extension for BrowserOS Agent, providing the UI layer for interacting with BrowserOS Core and Controllers. This extension enables intelligent browser automation, AI-powered search, and seamless integration with multiple LLM providers.
+[![License: AGPL v3](https://img.shields.io/badge/License-AGPL%20v3-blue.svg)](../../../../LICENSE)
+
+The built-in browser extension that powers BrowserOS's AI interface — new tab with unified search, side panel chat, onboarding, and settings. Built with [WXT](https://wxt.dev) and React.
+
+> For user-facing feature documentation, see [docs.browseros.com](https://docs.browseros.com).
 
 ## Features
 
 - **AI-Powered New Tab**: Custom new tab page with unified search across Google and AI assistants
-- **Side Panel Chat**: Full-featured chat interface for interacting with BrowserOS Core
+- **Side Panel Chat**: Full-featured chat interface for interacting with BrowserOS
 - **Multi-Provider Support**: Connect to various LLM providers (OpenAI, Anthropic, Azure, Bedrock, and more)
 - **MCP Integration**: Model Context Protocol support for extending AI capabilities
 - **Visual Feedback**: Animated glow effect on tabs during AI agent operations
 - **Privacy-First**: Local data handling with configurable provider settings
 
+## How It Connects
+
+The extension communicates with the [BrowserOS Server](../../apps/server/) running locally. The server handles the AI agent loop, MCP tools, and CDP connections — the extension provides the UI layer.
+
 ## Project Structure
 
 ```
@@ -80,47 +88,20 @@ Settings dashboard with multiple sections:
 
 Content script that creates a visual indicator (pulsing orange glow) around the browser viewport when an AI agent is actively working on a tab.
 
-## How Tools Are Used
-
-### Bun
-
-Bun is the exclusive runtime and package manager:
-- All scripts use `bun run <script>` instead of npm
-- Package installation via `bun install`
-- Environment files automatically loaded (no dotenv needed)
-- Enforced via `engines` field in `package.json`
-
-```bash
-bun install          # Install dependencies
-bun run dev          # Development mode
-bun run build        # Production build
-bun run lint         # Run Biome linting
-```
-
-### Biome
-
-Unified linter and formatter configured in `biome.json`:
-- **Formatting**: 2-space indentation, single quotes, no semicolons
-- **Linting**: Recommended rules plus custom rules for unused imports/variables
-- **CSS Support**: Tailwind directives parsing enabled
-- **Import Organization**: Automatic import sorting via assist actions
-
-```bash
-bun run lint         # Check for issues
-bun run lint:fix     # Auto-fix issues
-```
-
 ## Development
 
 ### Prerequisites
 
 - [Bun](https://bun.sh) installed
 - Chrome or Chromium-based browser
-- BrowserOS Core running locally (for full functionality)
+- BrowserOS Server running locally (for full functionality)
 
 ### Setup
 
 ```bash
+# Copy environment file
+cp .env.example .env.development
+
 # Install dependencies
 bun install
 
@@ -153,12 +134,30 @@ SENTRY_AUTH_TOKEN=your-token
 
 ### GraphQL Schema
 
-Codegen requires a GraphQL schema. By default it uses the bundled `schema/schema.graphql`, so no extra setup is needed. If you have access to the original API source, you can set the following environment variable
+Codegen requires a GraphQL schema. By default it uses the bundled `schema/schema.graphql`, so no extra setup is needed. If you have access to the original API source, you can set the following environment variable:
 
 ```env
 GRAPHQL_SCHEMA_PATH=/path/to/api-repo/.../schema.graphql
 ```
 
+## Development Tooling
+
+### Bun
+
+Bun is the exclusive runtime and package manager:
+- All scripts use `bun run <script>` instead of npm
+- Package installation via `bun install`
+- Environment files automatically loaded (no dotenv needed)
+- Enforced via `engines` field in `package.json`
+
+### Biome
+
+Unified linter and formatter configured in `biome.json`:
+- **Formatting**: 2-space indentation, single quotes, no semicolons
+- **Linting**: Recommended rules plus custom rules for unused imports/variables
+- **CSS Support**: Tailwind directives parsing enabled
+- **Import Organization**: Automatic import sorting via assist actions
+
 ## Scripts
 
 | Script | Description |
@@ -169,4 +168,5 @@ GRAPHQL_SCHEMA_PATH=/path/to/api-repo/.../schema.graphql
 | `bun run lint` | Run Biome linter |
 | `bun run lint:fix` | Auto-fix linting issues |
 | `bun run typecheck` | Run TypeScript type checking |
+| `bun run codegen` | Generate GraphQL types |
 | `bun run clean:cache` | Clear build caches |

packages/browseros-agent/apps/agent/components/ai-elements/run-result-dialog.tsx

@@ -66,7 +66,7 @@ export const RunResultDialog: FC<RunResultDialogProps> = ({
 
   return (
     <Dialog open={!!run} onOpenChange={onOpenChange}>
-      <DialogContent className="sm:max-w-2xl">
+      <DialogContent className="sm:w-[70vw] sm:max-w-4xl">
         <DialogHeader>
           <DialogTitle className="flex items-center gap-2">
             {run.status === 'completed' ? (
@@ -94,7 +94,7 @@ export const RunResultDialog: FC<RunResultDialogProps> = ({
               <p className="text-destructive text-sm">{run.result}</p>
             </div>
           ) : run.result ? (
-            <div className="prose prose-sm dark:prose-invert [&_[data-streamdown='code-block']]:!w-full [&_[data-streamdown='table-wrapper']]:!w-full max-w-none break-words rounded-lg border border-border bg-muted/50 p-4">
+            <div className="prose prose-sm dark:prose-invert [&_[data-streamdown='code-block']]:!w-full [&_[data-streamdown='table-wrapper']]:!w-full max-w-none break-words rounded-lg border border-border bg-muted/50 p-4 [&_[data-streamdown='table-wrapper']]:overflow-x-auto">
               <MessageResponse>{run.result}</MessageResponse>
             </div>
           ) : (

packages/browseros-agent/apps/agent/components/chat/ChatProviderSelector.tsx

@@ -1,4 +1,4 @@
-import { Check } from 'lucide-react'
+import { Check, Plus } from 'lucide-react'
 import type { FC, PropsWithChildren } from 'react'
 import { useState } from 'react'
 import {
@@ -77,6 +77,19 @@ export const ChatProviderSelector: FC<
                 )
               })}
             </CommandGroup>
+            <div className="border-border border-t p-1">
+              <button
+                type="button"
+                className="flex w-full items-center gap-3 rounded-md p-2 text-muted-foreground text-sm transition-colors hover:bg-accent hover:text-foreground"
+                onClick={() => {
+                  window.open('/app.html#/settings/ai', '_blank')
+                  setOpen(false)
+                }}
+              >
+                <Plus className="h-4 w-4" />
+                Add Provider
+              </button>
+            </div>
           </CommandList>
         </Command>
       </PopoverContent>

packages/browseros-agent/apps/agent/components/credits/CreditBadge.tsx

@@ -14,7 +14,7 @@ export const CreditBadge: FC<CreditBadgeProps> = ({ credits, onClick }) => {
       type="button"
       onClick={onClick}
       className={cn(
-        'inline-flex items-center gap-1 rounded-md px-1.5 py-0.5 font-medium text-xs transition-colors hover:bg-muted/50',
+        'inline-flex cursor-pointer items-center gap-1 rounded-md px-1.5 py-0.5 font-medium text-xs transition-colors hover:bg-muted/50',
         getCreditTextColor(credits),
       )}
       title={`${credits} credits remaining`}

packages/browseros-agent/apps/agent/components/referral/ShareForCredits.tsx

@@ -0,0 +1,148 @@
+import { REFERRAL_LIMITS } from '@browseros/shared/constants/limits'
+import { ExternalLink, Loader2, Send } from 'lucide-react'
+import type { FC } from 'react'
+import { useState } from 'react'
+import { Button } from '@/components/ui/button'
+import { Input } from '@/components/ui/input'
+import { useCredits, useInvalidateCredits } from '@/lib/credits/useCredits'
+import {
+  getShareOnTwitterUrl,
+  submitReferral,
+} from '@/lib/referral/submit-referral'
+
+interface ShareForCreditsProps {
+  compact?: boolean
+}
+
+export const ShareForCredits: FC<ShareForCreditsProps> = ({ compact }) => {
+  const [tweetUrl, setTweetUrl] = useState('')
+  const [isSubmitting, setIsSubmitting] = useState(false)
+  const [result, setResult] = useState<{
+    success: boolean
+    message: string
+  } | null>(null)
+
+  const { data } = useCredits()
+  const invalidateCredits = useInvalidateCredits()
+
+  const credits = data?.credits ?? 0
+  const atDailyMax = credits >= REFERRAL_LIMITS.MAX_DAILY_CREDITS
+
+  const handleSubmit = async () => {
+    if (!tweetUrl.trim() || !data?.browserosId || atDailyMax) return
+
+    setIsSubmitting(true)
+    setResult(null)
+
+    try {
+      const res = await submitReferral(tweetUrl.trim(), data.browserosId)
+      if (res.success) {
+        setResult({
+          success: true,
+          message: `${res.creditsAdded ?? 200} credits added!`,
+        })
+        setTweetUrl('')
+        invalidateCredits()
+      } else {
+        setResult({
+          success: false,
+          message: res.reason ?? 'Submission failed. Please try again.',
+        })
+      }
+    } catch {
+      setResult({
+        success: false,
+        message: 'Network error. Please try again.',
+      })
+    } finally {
+      setIsSubmitting(false)
+    }
+  }
+
+  if (atDailyMax) {
+    return (
+      <div className={compact ? 'space-y-2' : 'space-y-3'}>
+        <p className={compact ? 'text-muted-foreground text-xs' : 'text-sm'}>
+          You've reached the daily cap of {REFERRAL_LIMITS.MAX_DAILY_CREDITS}{' '}
+          credits. Come back tomorrow to earn more!
+        </p>
+      </div>
+    )
+  }
+
+  return (
+    <div className={compact ? 'space-y-2' : 'space-y-3'}>
+      <p className={compact ? 'text-muted-foreground text-xs' : 'text-sm'}>
+        Share BrowserOS on Twitter to earn{' '}
+        {REFERRAL_LIMITS.CREDITS_PER_REFERRAL} bonus credits!
+      </p>
+
+      <ul className="list-disc space-y-0.5 pl-4 text-muted-foreground text-xs">
+        <li>
+          Tweet must mention <span className="font-medium">@browserOS_ai</span>
+        </li>
+        <li>Tweet must be posted within the last 30 minutes</li>
+        <li>Each tweet can only be submitted once</li>
+        <li>
+          Daily cap of {REFERRAL_LIMITS.MAX_DAILY_CREDITS} credits — resets at
+          midnight UTC
+        </li>
+      </ul>
+
+      <Button variant="outline" size="sm" className="w-full gap-2" asChild>
+        <a
+          href={getShareOnTwitterUrl()}
+          target="_blank"
+          rel="noopener noreferrer"
+          onClick={(e) => {
+            e.currentTarget.href = getShareOnTwitterUrl()
+          }}
+        >
+          <ExternalLink className="h-3.5 w-3.5" />
+          Share on Twitter
+        </a>
+      </Button>
+
+      <p className="text-muted-foreground text-xs">
+        Already shared? Paste your tweet link:
+      </p>
+
+      <div className="flex gap-2">
+        <Input
+          type="url"
+          placeholder="https://x.com/..."
+          value={tweetUrl}
+          onChange={(e) => setTweetUrl(e.target.value)}
+          className="h-8 text-xs"
+          disabled={isSubmitting}
+        />
+        <Button
+          variant="default"
+          size="sm"
+          onClick={handleSubmit}
+          disabled={isSubmitting || !tweetUrl.trim()}
+          className="shrink-0 gap-1.5"
+        >
+          {isSubmitting ? (
+            <Loader2 className="h-3.5 w-3.5 animate-spin" />
+          ) : (
+            <Send className="h-3.5 w-3.5" />
+          )}
+          Submit
+        </Button>
+      </div>
+
+      {result && (
+        <p
+          className={
+            result.success
+              ? 'text-green-600 text-xs dark:text-green-400'
+              : 'text-destructive text-xs'
+          }
+        >
+          {result.message}
+        </p>
+      )}
+    </div>
+  )
+}

packages/browseros-agent/apps/agent/components/sidebar/SettingsSidebar.tsx

@@ -4,7 +4,6 @@ import {
   Bot,
   Compass,
   CreditCard,
-  GitBranch,
   MessageSquare,
   Palette,
   RotateCcw,
@@ -86,12 +85,6 @@ const primarySettingsSections: NavSection[] = [
         icon: CreditCard,
         feature: Feature.CREDITS_SUPPORT,
       },
-      {
-        name: 'Workflows',
-        to: '/workflows',
-        icon: GitBranch,
-        feature: Feature.WORKFLOW_SUPPORT,
-      },
     ],
   },
 ]

packages/browseros-agent/apps/agent/entrypoints/app/App.tsx

@@ -11,7 +11,6 @@ import { Onboarding } from '../onboarding/index/Onboarding'
 import { StepsLayout } from '../onboarding/steps/StepsLayout'
 import { AISettingsPage } from './ai-settings/AISettingsPage'
 import { ConnectMCP } from './connect-mcp/ConnectMCP'
-import { CreateGraphWrapper } from './create-graph/CreateGraphWrapper'
 import { CustomizationPage } from './customization/CustomizationPage'
 import { SurveyPage } from './jtbd-agent/SurveyPage'
 import { AuthLayout } from './layout/AuthLayout'
@@ -29,7 +28,6 @@ import { SearchProviderPage } from './search-provider/SearchProviderPage'
 import { SkillsPage } from './skills/SkillsPage'
 import { SoulPage } from './soul/SoulPage'
 import { UsagePage } from './usage/UsagePage'
-import { WorkflowsPageWrapper } from './workflows/WorkflowsPageWrapper'
 
 function getSurveyParams(): { maxTurns?: number; experimentId?: string } {
   const params = new URLSearchParams(window.location.search)
@@ -53,9 +51,7 @@ const OptionsRedirect: FC = () => {
     soul: '/home/soul',
     skills: '/home/skills',
     'jtbd-agent': '/settings/survey',
-    workflows: '/workflows',
     scheduled: '/scheduled',
-    'create-graph': '/workflows/create-graph',
   }
 
   const newPath = routeMap[path] || '/settings/ai'
@@ -90,7 +86,6 @@ export const App: FC = () => {
 
           {/* Primary nav routes */}
           <Route path="connect-apps" element={<ConnectMCP />} />
-          <Route path="workflows" element={<WorkflowsPageWrapper />} />
           <Route path="scheduled" element={<ScheduledTasksPage />} />
         </Route>
 
@@ -108,9 +103,6 @@ export const App: FC = () => {
           </Route>
         </Route>
 
-        {/* Full-screen without sidebar */}
-        <Route path="workflows/create-graph" element={<CreateGraphWrapper />} />
-
         {/* Onboarding routes - no sidebar, no auth required */}
         <Route path="onboarding">
           <Route index element={<Onboarding />} />

packages/browseros-agent/apps/agent/entrypoints/app/ai-settings/AISettingsPage.tsx

@@ -38,6 +38,7 @@ import {
 } from '@/lib/llm-providers/useOAuthProviderFlow'
 import { track } from '@/lib/metrics/track'
 import { ConfiguredProvidersList } from './ConfiguredProvidersList'
+import { DeviceCodeDialog } from './DeviceCodeDialog'
 import {
   DeleteRemoteLlmProviderDocument,
   GetRemoteLlmProvidersDocument,
@@ -45,6 +46,7 @@ import {
 import type { IncompleteProvider } from './IncompleteProviderCard'
 import { IncompleteProvidersList } from './IncompleteProvidersList'
 import { LlmProvidersHeader } from './LlmProvidersHeader'
+import { McpPromoBanner } from './McpPromoBanner'
 import { NewProviderDialog } from './NewProviderDialog'
 import { ProviderTemplatesSection } from './ProviderTemplatesSection'
 
@@ -173,6 +175,16 @@ export const AISettingsPage: FC = () => {
     saveProvider,
   )
 
+  const activeDeviceCode =
+    chatgptPro.pendingDeviceCode ??
+    copilot.pendingDeviceCode ??
+    qwenCode.pendingDeviceCode
+  const clearActiveDeviceCode = () => {
+    chatgptPro.clearDeviceCode()
+    copilot.clearDeviceCode()
+    qwenCode.clearDeviceCode()
+  }
+
   const oauthFlows: Record<
     string,
     {
@@ -347,6 +359,8 @@ export const AISettingsPage: FC = () => {
         onAddProvider={handleAddProvider}
       />
 
+      <McpPromoBanner />
+
       <ProviderTemplatesSection onUseTemplate={handleUseTemplate} />
 
       <ConfiguredProvidersList
@@ -421,6 +435,11 @@ export const AISettingsPage: FC = () => {
           </AlertDialogFooter>
         </AlertDialogContent>
       </AlertDialog>
+
+      <DeviceCodeDialog
+        deviceCode={activeDeviceCode}
+        onClose={clearActiveDeviceCode}
+      />
     </div>
   )
 }

packages/browseros-agent/apps/agent/entrypoints/app/ai-settings/DeviceCodeDialog.tsx

@@ -0,0 +1,81 @@
+import { Check, Copy, ExternalLink } from 'lucide-react'
+import { type FC, useState } from 'react'
+import { Button } from '@/components/ui/button'
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogHeader,
+  DialogTitle,
+} from '@/components/ui/dialog'
+import type { PendingDeviceCode } from '@/lib/llm-providers/useOAuthProviderFlow'
+
+interface DeviceCodeDialogProps {
+  deviceCode: PendingDeviceCode | null
+  onClose: () => void
+}
+
+export const DeviceCodeDialog: FC<DeviceCodeDialogProps> = ({
+  deviceCode,
+  onClose,
+}) => {
+  const [copied, setCopied] = useState(false)
+
+  const handleCopy = async () => {
+    if (!deviceCode) return
+    try {
+      await navigator.clipboard.writeText(deviceCode.userCode)
+      setCopied(true)
+      setTimeout(() => setCopied(false), 2000)
+    } catch {
+      // Clipboard API failed
+    }
+  }
+
+  return (
+    <Dialog open={!!deviceCode} onOpenChange={(open) => !open && onClose()}>
+      <DialogContent className="sm:max-w-md">
+        <DialogHeader>
+          <DialogTitle>Connect to {deviceCode?.providerName}</DialogTitle>
+          <DialogDescription>
+            Paste this code on the {deviceCode?.providerName} page that just
+            opened in your browser.
+          </DialogDescription>
+        </DialogHeader>
+        <div className="flex flex-col items-center gap-4 py-4">
+          <div className="flex items-center gap-3 rounded-xl border-2 border-[var(--accent-orange)]/40 border-dashed bg-[var(--accent-orange)]/5 px-6 py-4">
+            <code className="font-bold font-mono text-2xl text-foreground tracking-widest">
+              {deviceCode?.userCode}
+            </code>
+            <Button
+              variant="ghost"
+              size="icon"
+              onClick={handleCopy}
+              className="shrink-0"
+            >
+              {copied ? (
+                <Check className="h-4 w-4 text-green-600" />
+              ) : (
+                <Copy className="h-4 w-4" />
+              )}
+            </Button>
+          </div>
+          <p className="text-center text-muted-foreground text-xs">
+            This dialog will close automatically once authentication completes.
+          </p>
+          {deviceCode?.verificationUri && (
+            <a
+              href={deviceCode.verificationUri}
+              target="_blank"
+              rel="noopener noreferrer"
+              className="flex items-center gap-1 text-[var(--accent-orange)] text-xs transition-colors hover:underline"
+            >
+              Open verification page
+              <ExternalLink className="h-3 w-3" />
+            </a>
+          )}
+        </div>
+      </DialogContent>
+    </Dialog>
+  )
+}

packages/browseros-agent/apps/agent/entrypoints/app/ai-settings/McpPromoBanner.tsx

@@ -0,0 +1,57 @@
+import { ArrowRight, Server, X } from 'lucide-react'
+import { type FC, useState } from 'react'
+import { useNavigate } from 'react-router'
+import { Button } from '@/components/ui/button'
+import { MCP_PROMO_BANNER_CLICKED_EVENT } from '@/lib/constants/analyticsEvents'
+import { track } from '@/lib/metrics/track'
+
+export const McpPromoBanner: FC = () => {
+  const [dismissed, setDismissed] = useState(false)
+  const navigate = useNavigate()
+
+  if (dismissed) return null
+
+  const handleClick = () => {
+    track(MCP_PROMO_BANNER_CLICKED_EVENT)
+    navigate('/settings/mcp')
+  }
+
+  return (
+    <div className="flex items-center gap-4 rounded-xl border border-border bg-card p-4 shadow-sm transition-all hover:shadow-md">
+      <div className="flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-[var(--accent-orange)]/10">
+        <Server className="h-5 w-5 text-[var(--accent-orange)]" />
+      </div>
+      <div className="min-w-0 flex-1">
+        <p className="flex items-center gap-2 font-semibold text-sm">
+          Use BrowserOS with Claude Code, Cursor & more
+          <span className="text-[var(--accent-orange)] text-xs">
+            (66+ tools)
+          </span>
+          <span className="inline-flex items-center gap-1 rounded-full bg-[var(--accent-orange)]/10 px-2.5 py-1 font-semibold text-[var(--accent-orange)] text-xs">
+            <span className="h-1.5 w-1.5 rounded-full bg-[var(--accent-orange)]" />
+            New
+          </span>
+        </p>
+        <p className="text-muted-foreground text-xs">
+          Connect your favorite coding tools to BrowserOS as an MCP server
+        </p>
+      </div>
+      <Button
+        variant="outline"
+        size="sm"
+        onClick={handleClick}
+        className="shrink-0 border-[var(--accent-orange)] bg-[var(--accent-orange)]/10 text-[var(--accent-orange)] hover:bg-[var(--accent-orange)]/20 hover:text-[var(--accent-orange)]"
+      >
+        Set up
+        <ArrowRight className="ml-1 h-3 w-3" />
+      </Button>
+      <button
+        type="button"
+        onClick={() => setDismissed(true)}
+        className="shrink-0 rounded-sm p-1 text-muted-foreground opacity-50 transition-opacity hover:opacity-100"
+      >
+        <X className="h-3.5 w-3.5" />
+      </button>
+    </div>
+  )
+}

packages/browseros-agent/apps/agent/entrypoints/app/ai-settings/NewProviderDialog.tsx

@@ -1,10 +1,26 @@
 import { zodResolver } from '@hookform/resolvers/zod'
-import { CheckCircle2, ExternalLink, Loader2, XCircle } from 'lucide-react'
-import { type FC, useEffect, useState } from 'react'
+import Fuse from 'fuse.js'
+import {
+  Check,
+  CheckCircle2,
+  ChevronDown,
+  ExternalLink,
+  Loader2,
+  XCircle,
+} from 'lucide-react'
+import { type FC, useEffect, useMemo, useRef, useState } from 'react'
 import { useForm } from 'react-hook-form'
 import { z } from 'zod/v3'
 import { Button } from '@/components/ui/button'
 import { Checkbox } from '@/components/ui/checkbox'
+import {
+  Command,
+  CommandEmpty,
+  CommandGroup,
+  CommandInput,
+  CommandItem,
+  CommandList,
+} from '@/components/ui/command'
 import {
   Dialog,
   DialogContent,
@@ -23,6 +39,11 @@ import {
   FormMessage,
 } from '@/components/ui/form'
 import { Input } from '@/components/ui/input'
+import {
+  Popover,
+  PopoverContent,
+  PopoverTrigger,
+} from '@/components/ui/popover'
 import {
   Select,
   SelectContent,
@@ -35,19 +56,22 @@ import { useAgentServerUrl } from '@/lib/browseros/useBrowserOSProviders'
 import { useCapabilities } from '@/lib/browseros/useCapabilities'
 import {
   AI_PROVIDER_ADDED_EVENT,
+  AI_PROVIDER_UPDATED_EVENT,
   KIMI_API_KEY_CONFIGURED_EVENT,
   KIMI_API_KEY_GUIDE_CLICKED_EVENT,
+  MODEL_SELECTED_EVENT,
 } from '@/lib/constants/analyticsEvents'
-import { useKimiLaunch } from '@/lib/feature-flags/useKimiLaunch'
 import {
   getDefaultBaseUrlForProviders,
   getProviderTemplate,
+  MINIMAX_REGIONS,
   providerTypeOptions,
 } from '@/lib/llm-providers/providerTemplates'
 import { type TestResult, testProvider } from '@/lib/llm-providers/testProvider'
 import type { LlmProviderConfig, ProviderType } from '@/lib/llm-providers/types'
 import { track } from '@/lib/metrics/track'
-import { getModelContextLength, getModelOptions } from './models'
+import { cn } from '@/lib/utils'
+import { getModelContextLength, getModelsForProvider } from './models'
 
 const providerTypeEnum = z.enum([
   'moonshot',
@@ -64,6 +88,7 @@ const providerTypeEnum = z.enum([
   'chatgpt-pro',
   'github-copilot',
   'qwen-code',
+  'minimax',
 ])
 
 /**
@@ -82,7 +107,7 @@ export const providerFormSchema = z
     temperature: z.number().min(0).max(2),
     // Azure-specific
     resourceName: z.string().optional(),
-    // Bedrock-specific
+    // Bedrock-specific / MiniMax region
     accessKeyId: z.string().optional(),
     secretAccessKey: z.string().optional(),
     region: z.string().optional(),
@@ -141,6 +166,30 @@ export const providerFormSchema = z
     ) {
       // No validation needed — OAuth tokens are on the server
     }
+    // MiniMax: require baseUrl + apiKey
+    else if (data.type === 'minimax') {
+      if (!data.baseUrl) {
+        ctx.addIssue({
+          code: z.ZodIssueCode.custom,
+          message: 'Base URL is required',
+          path: ['baseUrl'],
+        })
+      } else if (!/^https?:\/\/.+/.test(data.baseUrl)) {
+        ctx.addIssue({
+          code: z.ZodIssueCode.custom,
+          message: 'Must be a valid URL',
+          path: ['baseUrl'],
+        })
+      }
+
+      if (!data.apiKey?.trim()) {
+        ctx.addIssue({
+          code: z.ZodIssueCode.custom,
+          message: 'API Key is required',
+          path: ['apiKey'],
+        })
+      }
+    }
     // Other providers: require baseUrl
     else if (!data.baseUrl) {
       ctx.addIssue({
@@ -163,6 +212,13 @@ export const providerFormSchema = z
  */
 export type ProviderFormValues = z.infer<typeof providerFormSchema>
 
+function formatContextWindow(tokens: number): string {
+  if (tokens >= 1000000)
+    return `${(tokens / 1000000).toFixed(tokens % 1000000 === 0 ? 0 : 1)}M`
+  if (tokens >= 1000) return `${Math.round(tokens / 1000)}K`
+  return `${tokens}`
+}
+
 /**
  * Props for NewProviderDialog
  * @public
@@ -188,12 +244,13 @@ export const NewProviderDialog: FC<NewProviderDialogProps> = ({
   initialValues,
   onSave,
 }) => {
-  const [isCustomModel, setIsCustomModel] = useState(false)
   const [isTesting, setIsTesting] = useState(false)
   const [testResult, setTestResult] = useState<TestResult | null>(null)
+  const [modelPickerOpen, setModelPickerOpen] = useState(false)
+  const [modelSearch, setModelSearch] = useState('')
+  const modelListRef = useRef<HTMLDivElement>(null)
   const { supports } = useCapabilities()
   const { baseUrl: agentServerUrl } = useAgentServerUrl()
-  const kimiLaunch = useKimiLaunch()
 
   const filteredProviderTypeOptions = providerTypeOptions.filter((opt) => {
     if (opt.value === 'chatgpt-pro')
@@ -201,8 +258,6 @@ export const NewProviderDialog: FC<NewProviderDialogProps> = ({
     if (opt.value === 'github-copilot')
       return supports(Feature.GITHUB_COPILOT_SUPPORT)
     if (opt.value === 'qwen-code') return supports(Feature.QWEN_CODE_SUPPORT)
-    if (opt.value === 'moonshot')
-      return kimiLaunch || initialValues?.type === 'moonshot'
     if (opt.value === 'openai-compatible') {
       return supports(Feature.OPENAI_COMPATIBLE_SUPPORT)
     }
@@ -261,8 +316,24 @@ export const NewProviderDialog: FC<NewProviderDialogProps> = ({
     watchedSessionToken,
   ])
 
-  // Get model options for current provider type
-  const modelOptions = getModelOptions(watchedType as ProviderType)
+  const modelInfoList = getModelsForProvider(watchedType as ProviderType)
+
+  const modelFuse = useMemo(
+    () =>
+      new Fuse(modelInfoList, {
+        keys: ['modelId'],
+        threshold: 0.4,
+        distance: 100,
+      }),
+    [modelInfoList],
+  )
+
+  const filteredModels = modelSearch
+    ? modelFuse.search(modelSearch).map((r) => r.item)
+    : modelInfoList
+
+  const showCustomEntry =
+    modelSearch && !filteredModels.some((m) => m.modelId === modelSearch)
 
   // Handle provider type change (user-initiated via Select)
   const handleTypeChange = (newType: ProviderType) => {
@@ -271,15 +342,17 @@ export const NewProviderDialog: FC<NewProviderDialogProps> = ({
     if (defaultUrl) {
       form.setValue('baseUrl', defaultUrl)
     }
+    if (newType === 'minimax') {
+      form.setValue('region', 'chinese')
+    }
     form.setValue('modelId', '')
-    setIsCustomModel(false)
   }
 
   // Auto-fill context window when model changes (only for new providers)
   useEffect(() => {
     if (initialValues?.id) return
 
-    if (watchedModelId && watchedModelId !== 'custom') {
+    if (watchedModelId) {
       const contextLength = getModelContextLength(
         watchedType as ProviderType,
         watchedModelId,
@@ -290,17 +363,6 @@ export const NewProviderDialog: FC<NewProviderDialogProps> = ({
     }
   }, [watchedModelId, watchedType, form, initialValues?.id])
 
-  // Handle model selection (including custom option)
-  const handleModelChange = (value: string) => {
-    if (value === 'custom') {
-      setIsCustomModel(true)
-      form.setValue('modelId', '')
-    } else {
-      setIsCustomModel(false)
-      form.setValue('modelId', value)
-    }
-  }
-
   // Reset form when initialValues change
   useEffect(() => {
     if (initialValues) {
@@ -325,7 +387,6 @@ export const NewProviderDialog: FC<NewProviderDialogProps> = ({
         reasoningEffort: initialValues.reasoningEffort || 'high',
         reasoningSummary: initialValues.reasoningSummary || 'auto',
       })
-      setIsCustomModel(false)
     }
   }, [initialValues, form])
 
@@ -352,7 +413,6 @@ export const NewProviderDialog: FC<NewProviderDialogProps> = ({
         reasoningEffort: 'high',
         reasoningSummary: 'auto',
       })
-      setIsCustomModel(false)
     }
     // Clear test result when dialog opens/closes
     setTestResult(null)
@@ -373,6 +433,11 @@ export const NewProviderDialog: FC<NewProviderDialogProps> = ({
         provider_type: values.type,
         model: values.modelId,
       })
+    } else {
+      track(AI_PROVIDER_UPDATED_EVENT, {
+        provider_type: values.type,
+        model: values.modelId,
+      })
     }
     if (values.type === 'moonshot') {
       track(KIMI_API_KEY_CONFIGURED_EVENT, {
@@ -686,6 +751,94 @@ export const NewProviderDialog: FC<NewProviderDialogProps> = ({
       )
     }
 
+    // Minimax: region selector
+    if (watchedType === 'minimax') {
+      return (
+        <>
+          <FormField
+            control={form.control}
+            name="region"
+            render={({ field }) => (
+              <FormItem>
+                <FormLabel>Region *</FormLabel>
+                <Select
+                  onValueChange={(v) => {
+                    field.onChange(v)
+                    form.setValue(
+                      'baseUrl',
+                      MINIMAX_REGIONS[v as keyof typeof MINIMAX_REGIONS].api,
+                    )
+                  }}
+                  value={field.value || 'chinese'}
+                >
+                  <FormControl>
+                    <SelectTrigger className="w-full">
+                      <SelectValue />
+                    </SelectTrigger>
+                  </FormControl>
+                  <SelectContent>
+                    <SelectItem value="chinese">
+                      Chinese (api.minimaxi.com)
+                    </SelectItem>
+                    <SelectItem value="international">
+                      International (api.minimax.io)
+                    </SelectItem>
+                  </SelectContent>
+                </Select>
+                <FormDescription>
+                  Choose the endpoint closest to your location
+                </FormDescription>
+                <FormMessage />
+              </FormItem>
+            )}
+          />
+          <FormField
+            control={form.control}
+            name="baseUrl"
+            render={({ field }) => (
+              <FormItem>
+                <FormLabel>Base URL *</FormLabel>
+                <FormControl>
+                  <Input placeholder="https://api.minimaxi.com/v1" {...field} />
+                </FormControl>
+                <FormMessage />
+              </FormItem>
+            )}
+          />
+          <FormField
+            control={form.control}
+            name="apiKey"
+            render={({ field }) => (
+              <FormItem>
+                <FormLabel>API Key *</FormLabel>
+                <FormControl>
+                  <Input
+                    type="password"
+                    placeholder="Enter your MiniMax API key"
+                    {...field}
+                  />
+                </FormControl>
+                <FormDescription>
+                  Your API key is encrypted and stored locally.{' '}
+                  {setupGuideUrl && (
+                    <a
+                      href={setupGuideUrl}
+                      onClick={handleSetupGuideClick}
+                      className="inline-flex cursor-pointer items-center gap-1 text-primary hover:underline"
+                    >
+                      <ExternalLink className="h-3 w-3" />
+                      {setupGuideText}
+                    </a>
+                  )}
+                </FormDescription>
+                <FormMessage />
+              </FormItem>
+            )}
+          />
+        </>
+      )
+    }
+
     // Standard providers (OpenAI, Anthropic, Google, etc.)
     return (
       <>
@@ -811,52 +964,147 @@ export const NewProviderDialog: FC<NewProviderDialogProps> = ({
               control={form.control}
               name="modelId"
               render={({ field }) => (
-                <FormItem>
+                <FormItem className="flex flex-col">
                   <FormLabel>Model *</FormLabel>
-                  {isCustomModel || modelOptions.length === 1 ? (
-                    <>
-                      <FormControl>
-                        <Input
-                          placeholder={
-                            watchedType === 'azure'
-                              ? 'Enter your deployment name'
-                              : watchedType === 'bedrock'
-                                ? 'e.g., anthropic.claude-3-5-sonnet-20241022-v2:0'
-                                : 'Enter custom model ID'
-                          }
-                          {...field}
-                        />
-                      </FormControl>
-                      {modelOptions.length > 1 && (
-                        <Button
-                          type="button"
-                          variant="link"
-                          size="sm"
-                          className="h-auto p-0 text-xs"
-                          onClick={() => setIsCustomModel(false)}
-                        >
-                          ← Back to model list
-                        </Button>
-                      )}
-                    </>
+                  {modelInfoList.length === 0 ? (
+                    <FormControl>
+                      <Input
+                        placeholder={
+                          watchedType === 'azure'
+                            ? 'Enter your deployment name'
+                            : watchedType === 'bedrock'
+                              ? 'e.g., anthropic.claude-3-5-sonnet-20241022-v2:0'
+                              : 'Enter model ID'
+                        }
+                        {...field}
+                      />
+                    </FormControl>
                   ) : (
-                    <Select
-                      onValueChange={handleModelChange}
-                      value={field.value}
+                    <Popover
+                      open={modelPickerOpen}
+                      onOpenChange={(isOpen) => {
+                        setModelPickerOpen(isOpen)
+                        if (!isOpen) setModelSearch('')
+                      }}
                     >
-                      <FormControl>
-                        <SelectTrigger className="w-full">
-                          <SelectValue placeholder="Select a model" />
-                        </SelectTrigger>
-                      </FormControl>
-                      <SelectContent>
-                        {modelOptions.map((modelId) => (
-                          <SelectItem key={modelId} value={modelId}>
-                            {modelId === 'custom' ? '+ Custom model' : modelId}
-                          </SelectItem>
-                        ))}
-                      </SelectContent>
-                    </Select>
+                      <PopoverTrigger asChild>
+                        <button
+                          type="button"
+                          className={cn(
+                            'flex h-9 w-full items-center justify-between rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-xs',
+                            field.value
+                              ? 'text-foreground'
+                              : 'text-muted-foreground',
+                          )}
+                        >
+                          <span className="truncate">
+                            {field.value || 'Select a model...'}
+                          </span>
+                          <ChevronDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
+                        </button>
+                      </PopoverTrigger>
+                      <PopoverContent
+                        className="w-[var(--radix-popover-trigger-width)] p-0"
+                        align="start"
+                      >
+                        <Command shouldFilter={false}>
+                          <CommandInput
+                            placeholder="Search models..."
+                            value={modelSearch}
+                            onValueChange={(v) => {
+                              setModelSearch(v)
+                              requestAnimationFrame(() => {
+                                modelListRef.current?.scrollTo(0, 0)
+                              })
+                            }}
+                            onKeyDown={(e) => {
+                              if (e.key === 'Enter' && modelSearch) {
+                                e.preventDefault()
+                                e.stopPropagation()
+                                form.setValue('modelId', modelSearch)
+                                track(MODEL_SELECTED_EVENT, {
+                                  provider_type: watchedType,
+                                  model_id: modelSearch,
+                                  is_custom_model: !modelInfoList.some(
+                                    (m) => m.modelId === modelSearch,
+                                  ),
+                                })
+                                setModelPickerOpen(false)
+                                setModelSearch('')
+                              }
+                            }}
+                          />
+                          <CommandList ref={modelListRef}>
+                            <CommandEmpty>
+                              No models found. Press Enter to use &quot;
+                              {modelSearch}&quot;
+                            </CommandEmpty>
+                            {showCustomEntry && (
+                              <CommandGroup forceMount>
+                                <CommandItem
+                                  forceMount
+                                  value={`custom:${modelSearch}`}
+                                  onSelect={() => {
+                                    form.setValue('modelId', modelSearch)
+                                    track(MODEL_SELECTED_EVENT, {
+                                      provider_type: watchedType,
+                                      model_id: modelSearch,
+                                      is_custom_model: true,
+                                    })
+                                    setModelPickerOpen(false)
+                                    setModelSearch('')
+                                  }}
+                                >
+                                  <span className="flex-1 truncate">
+                                    {modelSearch}
+                                  </span>
+                                  {field.value === modelSearch && (
+                                    <Check className="ml-2 h-4 w-4 shrink-0" />
+                                  )}
+                                </CommandItem>
+                              </CommandGroup>
+                            )}
+                            {filteredModels.length > 0 && (
+                              <CommandGroup>
+                                {filteredModels.map((model) => (
+                                  <CommandItem
+                                    key={model.modelId}
+                                    value={model.modelId}
+                                    onSelect={() => {
+                                      form.setValue('modelId', model.modelId)
+                                      track(MODEL_SELECTED_EVENT, {
+                                        provider_type: watchedType,
+                                        model_id: model.modelId,
+                                        context_window: model.contextLength,
+                                        is_custom_model: !modelInfoList.some(
+                                          (m) => m.modelId === model.modelId,
+                                        ),
+                                      })
+                                      setModelPickerOpen(false)
+                                      setModelSearch('')
+                                    }}
+                                  >
+                                    <span className="flex-1 truncate">
+                                      {model.modelId}
+                                    </span>
+                                    {model.contextLength > 0 && (
+                                      <span className="ml-2 shrink-0 rounded-md bg-muted px-1.5 py-0.5 font-mono text-[10px] text-muted-foreground">
+                                        {formatContextWindow(
+                                          model.contextLength,
+                                        )}
+                                      </span>
+                                    )}
+                                    {field.value === model.modelId && (
+                                      <Check className="ml-2 h-4 w-4 shrink-0" />
+                                    )}
+                                  </CommandItem>
+                                ))}
+                              </CommandGroup>
+                            )}
+                          </CommandList>
+                        </Command>
+                      </PopoverContent>
+                    </Popover>
                   )}
                   <FormMessage />
                 </FormItem>

packages/browseros-agent/apps/agent/entrypoints/app/ai-settings/ProviderCard.tsx

@@ -2,7 +2,6 @@ import { Check, Loader2, Trash2 } from 'lucide-react'
 import type { FC } from 'react'
 import { Badge } from '@/components/ui/badge'
 import { Button } from '@/components/ui/button'
-import { useKimiLaunch } from '@/lib/feature-flags/useKimiLaunch'
 import { BrowserOSIcon, ProviderIcon } from '@/lib/llm-providers/providerIcons'
 import type { LlmProviderConfig } from '@/lib/llm-providers/types'
 import { cn } from '@/lib/utils'
@@ -30,7 +29,6 @@ export const ProviderCard: FC<ProviderCardProps> = ({
   isTesting = false,
 }) => {
   const inputId = `provider-${provider.id}`
-  const kimiLaunch = useKimiLaunch()
 
   return (
     <label
@@ -79,30 +77,21 @@ export const ProviderCard: FC<ProviderCardProps> = ({
             </Badge>
           )}
         </div>
-        {isBuiltIn && provider.type === 'browseros' && kimiLaunch && (
-          <span className="mb-1 inline-block rounded-full border border-orange-300/60 bg-orange-100/70 px-3 py-0.5 font-semibold text-orange-700 text-xs dark:border-orange-400/40 dark:bg-orange-500/15 dark:text-orange-300">
-            In partnership with Moonshot AI
-          </span>
-        )}
         <p className="truncate text-muted-foreground text-sm">
           {isBuiltIn ? (
-            kimiLaunch ? (
-              'Extended usage limits for the next 2 weeks!'
-            ) : (
-              <>
-                BrowserOS-hosted model with strict rate limits.{' '}
-                <a
-                  href="https://docs.browseros.com/features/bring-your-own-llm"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="underline hover:text-foreground"
-                  onClick={(e) => e.stopPropagation()}
-                >
-                  Bring your own key
-                </a>{' '}
-                for better performance.
-              </>
-            )
+            <>
+              BrowserOS-hosted model with strict rate limits.{' '}
+              <a
+                href="https://docs.browseros.com/features/bring-your-own-llm"
+                target="_blank"
+                rel="noopener noreferrer"
+                className="underline hover:text-foreground"
+                onClick={(e) => e.stopPropagation()}
+              >
+                Bring your own key
+              </a>{' '}
+              for better performance.
+            </>
           ) : provider.baseUrl ? (
             `${provider.modelId} • ${provider.baseUrl}`
           ) : (

packages/browseros-agent/apps/agent/entrypoints/app/ai-settings/ProviderTemplateCard.tsx

@@ -7,12 +7,14 @@ import { cn } from '@/lib/utils'
 interface ProviderTemplateCardProps {
   template: ProviderTemplate
   highlighted?: boolean
+  isNew?: boolean
   onUseTemplate: (template: ProviderTemplate) => void
 }
 
 export const ProviderTemplateCard: FC<ProviderTemplateCardProps> = ({
   template,
   highlighted = false,
+  isNew = false,
   onUseTemplate,
 }) => {
   return (
@@ -20,12 +22,19 @@ export const ProviderTemplateCard: FC<ProviderTemplateCardProps> = ({
       type="button"
       onClick={() => onUseTemplate(template)}
       className={cn(
-        'group flex w-full items-center gap-3 rounded-lg border bg-background p-4 text-left transition-all hover:border-[var(--accent-orange)] hover:shadow-md',
+        'group relative flex w-full items-center gap-3 rounded-lg border bg-background p-4 text-left transition-all hover:border-[var(--accent-orange)] hover:shadow-md',
         highlighted
           ? 'border-orange-300/80 bg-orange-50/30 shadow-sm ring-1 ring-orange-300/45 dark:bg-orange-500/5'
-          : 'border-border',
+          : isNew
+            ? 'border-2 border-[var(--accent-orange)]/50'
+            : 'border-border',
       )}
     >
+      {isNew && (
+        <span className="absolute -top-2 left-3 rounded-full bg-[var(--accent-orange)] px-2 py-0.5 font-semibold text-[9px] text-white uppercase tracking-wider">
+          New
+        </span>
+      )}
       <div className="flex min-w-0 flex-1 items-center gap-3">
         <ProviderIcon
           type={template.id}

packages/browseros-agent/apps/agent/entrypoints/app/ai-settings/ProviderTemplatesSection.tsx

@@ -7,7 +7,6 @@ import {
 } from '@/components/ui/collapsible'
 import { Feature } from '@/lib/browseros/capabilities'
 import { useCapabilities } from '@/lib/browseros/useCapabilities'
-import { useKimiLaunch } from '@/lib/feature-flags/useKimiLaunch'
 import {
   type ProviderTemplate,
   providerTemplates,
@@ -23,7 +22,6 @@ export const ProviderTemplatesSection: FC<ProviderTemplatesSectionProps> = ({
   onUseTemplate,
 }) => {
   const { supports } = useCapabilities()
-  const kimiLaunch = useKimiLaunch()
 
   const filteredTemplates = providerTemplates.filter((template) => {
     if (template.id === 'chatgpt-pro')
@@ -31,7 +29,6 @@ export const ProviderTemplatesSection: FC<ProviderTemplatesSectionProps> = ({
     if (template.id === 'github-copilot')
       return supports(Feature.GITHUB_COPILOT_SUPPORT)
     if (template.id === 'qwen-code') return supports(Feature.QWEN_CODE_SUPPORT)
-    if (template.id === 'moonshot') return kimiLaunch
     if (template.id === 'openai-compatible') {
       return supports(Feature.OPENAI_COMPATIBLE_SUPPORT)
     }
@@ -58,14 +55,20 @@ export const ProviderTemplatesSection: FC<ProviderTemplatesSectionProps> = ({
 
         <CollapsibleContent>
           <div className="mt-4 grid gap-3 sm:grid-cols-2 lg:grid-cols-3">
-            {filteredTemplates.map((template) => (
-              <ProviderTemplateCard
-                key={template.id}
-                template={template}
-                highlighted={template.id === 'moonshot'}
-                onUseTemplate={onUseTemplate}
-              />
-            ))}
+            {filteredTemplates.map((template) => {
+              const isNew =
+                template.id === 'chatgpt-pro' ||
+                template.id === 'github-copilot' ||
+                template.id === 'qwen-code'
+              return (
+                <ProviderTemplateCard
+                  key={template.id}
+                  template={template}
+                  isNew={isNew}
+                  onUseTemplate={onUseTemplate}
+                />
+              )
+            })}
           </div>
         </CollapsibleContent>
       </div>

packages/browseros-agent/apps/agent/entrypoints/app/ai-settings/models.ts

@@ -1,98 +1,21 @@
+import {
+  getModelsDevModels,
+  type ModelsDevModel,
+} from '@/lib/llm-providers/models-dev'
 import type { ProviderType } from '@/lib/llm-providers/types'
 
-/**
- * Model information with context length
- */
 export interface ModelInfo {
   modelId: string
   contextLength: number
+  supportsImages?: boolean
+  supportsReasoning?: boolean
+  supportsToolCall?: boolean
 }
 
-/**
- * Models data organized by provider type (matches backend AIProvider enum)
- */
-export interface ModelsData {
-  anthropic: ModelInfo[]
-  openai: ModelInfo[]
-  'openai-compatible': ModelInfo[]
-  google: ModelInfo[]
-  openrouter: ModelInfo[]
-  azure: ModelInfo[]
-  ollama: ModelInfo[]
-  lmstudio: ModelInfo[]
-  bedrock: ModelInfo[]
-  browseros: ModelInfo[]
-  moonshot: ModelInfo[]
-  'chatgpt-pro': ModelInfo[]
-  'github-copilot': ModelInfo[]
-  'qwen-code': ModelInfo[]
-}
-
-/**
- * Available models per provider with context lengths
- * Based on: https://github.com/browseros-ai/BrowserOS-agent/blob/main/src/options/data/models.ts
- */
-export const MODELS_DATA: ModelsData = {
-  moonshot: [{ modelId: 'kimi-k2.5', contextLength: 200000 }],
-  anthropic: [
-    { modelId: 'claude-opus-4-5-20251101', contextLength: 200000 },
-    { modelId: 'claude-haiku-4-5-20251001', contextLength: 200000 },
-    { modelId: 'claude-sonnet-4-5-20250929', contextLength: 200000 },
-    { modelId: 'claude-sonnet-4-20250514', contextLength: 200000 },
-    { modelId: 'claude-opus-4-20250514', contextLength: 200000 },
-    { modelId: 'claude-3-7-sonnet-20250219', contextLength: 200000 },
-    { modelId: 'claude-3-5-haiku-20241022', contextLength: 200000 },
-  ],
-  openai: [
-    { modelId: 'gpt-5.2', contextLength: 200000 },
-    { modelId: 'gpt-5.2-pro', contextLength: 200000 },
-    { modelId: 'gpt-5', contextLength: 200000 },
-    { modelId: 'gpt-5-mini', contextLength: 200000 },
-    { modelId: 'gpt-5-nano', contextLength: 200000 },
-    { modelId: 'gpt-4.1', contextLength: 200000 },
-    { modelId: 'gpt-4.1-mini', contextLength: 200000 },
-    { modelId: 'o4-mini', contextLength: 200000 },
-    { modelId: 'o3-mini', contextLength: 200000 },
-    { modelId: 'gpt-4o', contextLength: 128000 },
-    { modelId: 'gpt-4o-mini', contextLength: 128000 },
-  ],
-  'openai-compatible': [],
-  google: [
-    { modelId: 'gemini-3-pro-preview', contextLength: 1048576 },
-    { modelId: 'gemini-3-flash-preview', contextLength: 1048576 },
-    { modelId: 'gemini-2.5-flash', contextLength: 1048576 },
-    { modelId: 'gemini-2.5-pro', contextLength: 1048576 },
-  ],
-  openrouter: [
-    { modelId: 'google/gemini-3-pro-preview', contextLength: 1048576 },
-    { modelId: 'google/gemini-3-flash-preview', contextLength: 1048576 },
-    { modelId: 'google/gemini-2.5-flash', contextLength: 1048576 },
-    { modelId: 'anthropic/claude-opus-4.5', contextLength: 200000 },
-    { modelId: 'anthropic/claude-haiku-4.5', contextLength: 200000 },
-    { modelId: 'anthropic/claude-sonnet-4.5', contextLength: 200000 },
-    { modelId: 'anthropic/claude-sonnet-4', contextLength: 200000 },
-    { modelId: 'anthropic/claude-3.7-sonnet', contextLength: 200000 },
-    { modelId: 'openai/gpt-4o', contextLength: 128000 },
-    { modelId: 'openai/gpt-oss-120b', contextLength: 128000 },
-    { modelId: 'openai/gpt-oss-20b', contextLength: 128000 },
-    { modelId: 'qwen/qwen3-14b', contextLength: 131072 },
-    { modelId: 'qwen/qwen3-8b', contextLength: 131072 },
-  ],
-  azure: [],
-  ollama: [
-    { modelId: 'qwen3:4b', contextLength: 262144 },
-    { modelId: 'qwen3:8b', contextLength: 40960 },
-    { modelId: 'qwen3:14b', contextLength: 40960 },
-    { modelId: 'gpt-oss:20b', contextLength: 128000 },
-    { modelId: 'gpt-oss:120b', contextLength: 128000 },
-  ],
-  lmstudio: [
-    { modelId: 'openai/gpt-oss-20b', contextLength: 128000 },
-    { modelId: 'openai/gpt-oss-120b', contextLength: 128000 },
-    { modelId: 'qwen/qwen3-vl-8b', contextLength: 131072 },
-  ],
-  bedrock: [],
+const CUSTOM_PROVIDER_MODELS: Partial<Record<ProviderType, ModelInfo[]>> = {
   browseros: [{ modelId: 'browseros-auto', contextLength: 200000 }],
+  'openai-compatible': [],
+  ollama: [],
   'chatgpt-pro': [
     { modelId: 'gpt-5.4', contextLength: 400000 },
     { modelId: 'gpt-5.3-codex', contextLength: 400000 },
@@ -103,32 +26,6 @@ export const MODELS_DATA: ModelsData = {
     { modelId: 'gpt-5.1-codex-mini', contextLength: 400000 },
     { modelId: 'gpt-5.1', contextLength: 200000 },
   ],
-  'github-copilot': [
-    // Free tier (unlimited with Pro)
-    { modelId: 'gpt-5-mini', contextLength: 128000 },
-    { modelId: 'claude-haiku-4.5', contextLength: 128000 },
-    { modelId: 'gpt-4o', contextLength: 64000 },
-    { modelId: 'gpt-4.1', contextLength: 64000 },
-    // Premium models (Pro: 300/mo, Pro+: 1500/mo)
-    { modelId: 'claude-sonnet-4.6', contextLength: 128000 },
-    { modelId: 'claude-sonnet-4.5', contextLength: 128000 },
-    { modelId: 'claude-sonnet-4', contextLength: 128000 },
-    { modelId: 'claude-opus-4.6', contextLength: 128000 },
-    { modelId: 'claude-opus-4.5', contextLength: 128000 },
-    { modelId: 'gemini-2.5-pro', contextLength: 128000 },
-    { modelId: 'gemini-3-pro-preview', contextLength: 128000 },
-    { modelId: 'gemini-3-flash-preview', contextLength: 128000 },
-    { modelId: 'gemini-3.1-pro-preview', contextLength: 128000 },
-    { modelId: 'gpt-5.4', contextLength: 272000 },
-    { modelId: 'gpt-5.4-mini', contextLength: 128000 },
-    { modelId: 'gpt-5.3-codex', contextLength: 272000 },
-    { modelId: 'gpt-5.2-codex', contextLength: 272000 },
-    { modelId: 'gpt-5.2', contextLength: 128000 },
-    { modelId: 'gpt-5.1-codex', contextLength: 128000 },
-    { modelId: 'gpt-5.1-codex-max', contextLength: 128000 },
-    { modelId: 'gpt-5.1', contextLength: 128000 },
-    { modelId: 'grok-code-fast-1', contextLength: 128000 },
-  ],
   'qwen-code': [
     { modelId: 'coder-model', contextLength: 1000000 },
     { modelId: 'qwen3-coder-plus', contextLength: 1000000 },
@@ -137,25 +34,23 @@ export const MODELS_DATA: ModelsData = {
   ],
 }
 
-/**
- * Get models for a specific provider type
- */
+function fromModelsDevModel(m: ModelsDevModel): ModelInfo {
+  return {
+    modelId: m.id,
+    contextLength: m.contextWindow,
+    supportsImages: m.supportsImages,
+    supportsReasoning: m.supportsReasoning,
+    supportsToolCall: m.supportsToolCall,
+  }
+}
+
 export function getModelsForProvider(providerType: ProviderType): ModelInfo[] {
-  return MODELS_DATA[providerType] || []
+  const custom = CUSTOM_PROVIDER_MODELS[providerType]
+  if (custom !== undefined) return custom
+
+  return getModelsDevModels(providerType).map(fromModelsDevModel)
 }
 
-/**
- * Get model options for select dropdown (model IDs + custom option)
- */
-export function getModelOptions(providerType: ProviderType): string[] {
-  const models = getModelsForProvider(providerType)
-  const modelIds = models.map((m) => m.modelId)
-  return modelIds.length > 0 ? [...modelIds, 'custom'] : ['custom']
-}
-
-/**
- * Get context length for a specific model
- */
 export function getModelContextLength(
   providerType: ProviderType,
   modelId: string,
@@ -164,14 +59,3 @@ export function getModelContextLength(
   const model = models.find((m) => m.modelId === modelId)
   return model?.contextLength
 }
-
-/**
- * Check if model ID is a custom (user-entered) value
- */
-export function isCustomModel(
-  providerType: ProviderType,
-  modelId: string,
-): boolean {
-  const models = getModelsForProvider(providerType)
-  return !models.some((m) => m.modelId === modelId)
-}

packages/browseros-agent/apps/agent/entrypoints/app/create-graph/CreateGraph.tsx

@@ -1,472 +0,0 @@
-import { useChat } from '@ai-sdk/react'
-import { DefaultChatTransport, type UIMessage } from 'ai'
-import { compact } from 'es-toolkit/array'
-import type { FC, FormEvent } from 'react'
-import { useEffect, useRef, useState } from 'react'
-import { useSearchParams } from 'react-router'
-import useDeepCompareEffect from 'use-deep-compare-effect'
-import type { Provider } from '@/components/chat/chatComponentTypes'
-import {
-  AlertDialog,
-  AlertDialogAction,
-  AlertDialogCancel,
-  AlertDialogContent,
-  AlertDialogDescription,
-  AlertDialogFooter,
-  AlertDialogHeader,
-  AlertDialogTitle,
-} from '@/components/ui/alert-dialog'
-import {
-  ResizableHandle,
-  ResizablePanel,
-  ResizablePanelGroup,
-} from '@/components/ui/resizable'
-import { useChatRefs } from '@/entrypoints/sidepanel/index/useChatRefs'
-import { useAgentServerUrl } from '@/lib/browseros/useBrowserOSProviders'
-import {
-  GRAPH_SAVED_EVENT,
-  GRAPH_UPDATED_EVENT,
-  NEW_GRAPH_CREATED_EVENT,
-} from '@/lib/constants/analyticsEvents'
-import { useLlmProviders } from '@/lib/llm-providers/useLlmProviders'
-import { track } from '@/lib/metrics/track'
-import { useRpcClient } from '@/lib/rpc/RpcClientProvider'
-import { sentry } from '@/lib/sentry/sentry'
-import { useWorkflows } from '@/lib/workflows/workflowStorage'
-import { GraphCanvas } from './GraphCanvas'
-import { GraphChat } from './GraphChat'
-import { WorkflowsChatHeader } from './WorkflowsChatHeader'
-
-type MessageType = 'create-graph' | 'update-graph' | 'run-graph'
-
-type GraphMessageMetadata = {
-  messageType?: MessageType
-  codeId?: string
-  graph?: GraphData
-  window?: chrome.windows.Window
-}
-
-export type GraphData = {
-  nodes: {
-    id: string
-    type: string
-    data: {
-      label: string
-    }
-  }[]
-  edges: {
-    id: string
-    source: string
-    target: string
-  }[]
-}
-
-const getLastMessageText = (messages: UIMessage[]) => {
-  const lastMessage = messages[messages.length - 1]
-  if (!lastMessage) return ''
-  return lastMessage.parts
-    .filter((part) => part.type === 'text')
-    .map((part) => part.text)
-    .join('')
-}
-
-export const CreateGraph: FC = () => {
-  const [searchParams] = useSearchParams()
-  const workflowIdParam = searchParams.get('workflowId')
-
-  const [graphName, setGraphName] = useState('')
-  const [codeId, setCodeId] = useState<string | undefined>(undefined)
-  const [graphData, setGraphData] = useState<GraphData | undefined>(undefined)
-  const [savedWorkflowId, setSavedWorkflowId] = useState<string | undefined>(
-    undefined,
-  )
-  const [savedCodeId, setSavedCodeId] = useState<string | undefined>(undefined)
-  const [isInitialized, setIsInitialized] = useState(!workflowIdParam)
-  const [canvasPanelSize, setCanvasPanelSize] = useState<
-    { asPercentage: number; inPixels: number } | undefined
-  >(undefined)
-
-  const [query, setQuery] = useState('')
-  const [showDiscardDialog, setShowDiscardDialog] = useState(false)
-
-  const { workflows, addWorkflow, editWorkflow } = useWorkflows()
-  const { providers: llmProviders, setDefaultProvider } = useLlmProviders()
-  const rpcClient = useRpcClient()
-
-  // Initialize edit mode when workflowId is provided
-  useDeepCompareEffect(() => {
-    if (!workflowIdParam || isInitialized) return
-
-    const workflow = workflows.find((w) => w.id === workflowIdParam)
-    if (!workflow) return
-
-    const initializeEditMode = async () => {
-      setGraphName(workflow.workflowName)
-      setCodeId(workflow.codeId)
-      setSavedWorkflowId(workflow.id)
-      setSavedCodeId(workflow.codeId)
-
-      try {
-        const response = await rpcClient.graph[':id'].$get({
-          param: { id: workflow.codeId },
-        })
-
-        if (response.ok) {
-          const data = await response.json()
-          if ('graph' in data && data.graph) {
-            setGraphData(data.graph as GraphData)
-          }
-        }
-      } catch (error) {
-        sentry.captureException(error, {
-          extra: {
-            message: 'Failed to fetch graph data from the server',
-            codeId: workflow.codeId,
-          },
-        })
-      }
-
-      setIsInitialized(true)
-    }
-
-    initializeEditMode()
-  }, [workflowIdParam, workflows, isInitialized, rpcClient])
-
-  const updateQuery = (newQuery: string) => {
-    setQuery(newQuery)
-  }
-
-  const onSubmit = (e: FormEvent) => {
-    e.preventDefault()
-    if (codeId) {
-      sendMessage({
-        text: query,
-        metadata: {
-          messageType: 'update-graph' as MessageType,
-          codeId,
-        },
-      })
-      track(GRAPH_UPDATED_EVENT)
-    } else {
-      sendMessage({
-        text: query,
-        metadata: {
-          messageType: 'create-graph' as MessageType,
-        },
-      })
-      track(NEW_GRAPH_CREATED_EVENT)
-    }
-    setQuery('')
-  }
-
-  const {
-    baseUrl: agentServerUrl,
-    isLoading: _isLoadingAgentUrl,
-    error: agentUrlError,
-  } = useAgentServerUrl()
-
-  const {
-    selectedLlmProviderRef,
-    enabledMcpServersRef,
-    enabledCustomServersRef,
-    personalizationRef,
-    selectedLlmProvider,
-    isLoadingProviders,
-  } = useChatRefs()
-
-  const agentUrlRef = useRef(agentServerUrl)
-  const codeIdRef = useRef(codeId)
-
-  useEffect(() => {
-    agentUrlRef.current = agentServerUrl
-    codeIdRef.current = codeId
-  }, [agentServerUrl, codeId])
-
-  const { sendMessage, stop, status, messages, error, setMessages } = useChat({
-    transport: new DefaultChatTransport({
-      prepareSendMessagesRequest: async ({ messages }) => {
-        const lastMessage = messages[messages.length - 1]
-        const lastMessageText = getLastMessageText(messages)
-        const metadata = lastMessage.metadata as
-          | GraphMessageMetadata
-          | undefined
-
-        if (metadata?.messageType === 'create-graph') {
-          return {
-            api: `${agentUrlRef.current}/graph`,
-            body: {
-              query: lastMessageText,
-            },
-          }
-        }
-
-        if (metadata?.messageType === 'update-graph' && codeIdRef.current) {
-          return {
-            api: `${agentUrlRef.current}/graph/${codeIdRef.current}`,
-            body: {
-              query: lastMessageText,
-            },
-          }
-        }
-
-        if (metadata?.messageType === 'run-graph' && codeIdRef.current) {
-          const provider = selectedLlmProviderRef.current
-          const enabledMcpServers = enabledMcpServersRef.current
-          const customMcpServers = enabledCustomServersRef.current
-
-          return {
-            api: `${agentUrlRef.current}/graph/${codeIdRef.current}/run`,
-            body: {
-              provider: provider?.type,
-              providerType: provider?.type,
-              providerName: provider?.name,
-              model: provider?.modelId ?? 'browseros',
-              contextWindowSize: provider?.contextWindow,
-              temperature: provider?.temperature,
-              resourceName: provider?.resourceName,
-              // Bedrock-specific
-              accessKeyId: provider?.accessKeyId,
-              secretAccessKey: provider?.secretAccessKey,
-              region: provider?.region,
-              sessionToken: provider?.sessionToken,
-              apiKey: provider?.apiKey,
-              baseUrl: provider?.baseUrl,
-              browserContext: {
-                windowId: metadata?.window?.id,
-                activeTab: metadata?.window?.tabs?.[0],
-                enabledMcpServers: compact(enabledMcpServers),
-                customMcpServers,
-              },
-              userSystemPrompt: personalizationRef.current,
-            },
-          }
-        }
-
-        return {
-          api: `${agentUrlRef.current}/graph`,
-          body: {
-            query: lastMessageText,
-          },
-        }
-      },
-    }),
-  })
-
-  const lastAssistantMessageWithGraph = messages.findLast((m) => {
-    if (m.role !== 'assistant') return false
-    const metadata = m.metadata as GraphMessageMetadata | undefined
-    return metadata?.graph !== undefined
-  })
-
-  const onClickTest = async () => {
-    const backgroundWindow = await chrome.windows.create({
-      url: 'chrome://newtab',
-      focused: true,
-      type: 'normal',
-    })
-
-    sendMessage({
-      text: 'Run a test of the graph you just created.',
-      metadata: {
-        messageType: 'run-graph' as MessageType,
-        codeId,
-        window: backgroundWindow,
-      },
-    })
-  }
-
-  const hasUnsavedChanges = savedWorkflowId ? codeId !== savedCodeId : true
-  const shouldBlockNavigation = !!codeId && hasUnsavedChanges
-
-  // Handle browser refresh/close
-  useEffect(() => {
-    const handleBeforeUnload = (e: BeforeUnloadEvent) => {
-      if (shouldBlockNavigation) {
-        e.preventDefault()
-      }
-    }
-
-    window.addEventListener('beforeunload', handleBeforeUnload)
-    return () => window.removeEventListener('beforeunload', handleBeforeUnload)
-  }, [shouldBlockNavigation])
-
-  const onClickSave = async () => {
-    if (!graphName || !codeId) return
-
-    if (savedWorkflowId) {
-      await editWorkflow(savedWorkflowId, {
-        workflowName: graphName,
-        codeId,
-      })
-      setSavedCodeId(codeId)
-    } else {
-      const newWorkflow = await addWorkflow({
-        workflowName: graphName,
-        codeId,
-      })
-      setSavedWorkflowId(newWorkflow.id)
-      setSavedCodeId(codeId)
-    }
-    track(GRAPH_SAVED_EVENT)
-  }
-
-  // Provider data for header
-  const providers: Provider[] = llmProviders.map((p) => ({
-    id: p.id,
-    name: p.name,
-    type: p.type,
-  }))
-
-  const selectedProviderForHeader: Provider | undefined = selectedLlmProvider
-    ? {
-        id: selectedLlmProvider.id,
-        name: selectedLlmProvider.name,
-        type: selectedLlmProvider.type,
-      }
-    : providers[0]
-
-  // Has generated code but can't auto-save (no name)
-  const hasUnsavedWork = codeId && !graphName
-
-  const resetToNewWorkflow = () => {
-    setCodeId(undefined)
-    setGraphData(undefined)
-    setGraphName('')
-    setSavedWorkflowId(undefined)
-    setSavedCodeId(undefined)
-    setMessages([])
-  }
-
-  const handleSelectProvider = (provider: Provider) => {
-    setDefaultProvider(provider.id)
-  }
-
-  const handleNewWorkflow = async () => {
-    // Can auto-save: has name AND code
-    if (graphName && codeId) {
-      await onClickSave()
-      resetToNewWorkflow()
-      return
-    }
-
-    // Has unsaved work that can't be auto-saved: show confirmation
-    if (hasUnsavedWork) {
-      setShowDiscardDialog(true)
-      return
-    }
-
-    // Nothing to save, just reset
-    resetToNewWorkflow()
-  }
-
-  const handleConfirmDiscard = () => {
-    setShowDiscardDialog(false)
-    resetToNewWorkflow()
-  }
-
-  const handleSuggestionClick = (prompt: string) => {
-    sendMessage({
-      text: prompt,
-      metadata: {
-        messageType: 'create-graph' as MessageType,
-      },
-    })
-  }
-
-  useDeepCompareEffect(() => {
-    if (status === 'ready' && lastAssistantMessageWithGraph) {
-      const metadata = lastAssistantMessageWithGraph.metadata as
-        | GraphMessageMetadata
-        | undefined
-      setCodeId(metadata?.codeId)
-      setGraphData(metadata?.graph)
-    }
-  }, [status, lastAssistantMessageWithGraph ?? {}])
-
-  if (!isInitialized || isLoadingProviders || !selectedProviderForHeader) {
-    return (
-      <div className="flex h-screen w-screen items-center justify-center bg-background text-foreground">
-        <div className="fade-in animate-in text-muted-foreground duration-200 [animation-delay:300ms] [animation-fill-mode:backwards]">
-          Loading...
-        </div>
-      </div>
-    )
-  }
-
-  return (
-    <div className="h-screen w-screen bg-background text-foreground">
-      <ResizablePanelGroup orientation="horizontal">
-        <ResizablePanel
-          id="graph-canvas"
-          defaultSize={'70%'}
-          minSize={'30%'}
-          maxSize={'70%'}
-          onResize={(size) => setCanvasPanelSize(size)}
-        >
-          <GraphCanvas
-            graphName={graphName}
-            onGraphNameChange={(val) => setGraphName(val)}
-            graphData={graphData}
-            codeId={codeId}
-            onClickTest={onClickTest}
-            onClickSave={onClickSave}
-            isSaved={!!savedWorkflowId}
-            hasUnsavedChanges={hasUnsavedChanges}
-            shouldBlockNavigation={shouldBlockNavigation}
-            panelSize={canvasPanelSize}
-          />
-        </ResizablePanel>
-
-        <ResizableHandle withHandle />
-
-        <ResizablePanel
-          id="graph-chat"
-          defaultSize={'30%'}
-          maxSize={'70%'}
-          minSize={'30%'}
-        >
-          <div className="flex h-full flex-col">
-            <WorkflowsChatHeader
-              selectedProvider={selectedProviderForHeader}
-              providers={providers}
-              onSelectProvider={handleSelectProvider}
-              onNewWorkflow={handleNewWorkflow}
-              hasMessages={messages.length > 0}
-            />
-            <div className="min-h-0 flex-1">
-              <GraphChat
-                messages={messages}
-                onSubmit={onSubmit}
-                onInputChange={updateQuery}
-                onStop={stop}
-                input={query}
-                status={status}
-                agentUrlError={agentUrlError}
-                chatError={error}
-                onSuggestionClick={handleSuggestionClick}
-              />
-            </div>
-          </div>
-        </ResizablePanel>
-      </ResizablePanelGroup>
-
-      <AlertDialog open={showDiscardDialog} onOpenChange={setShowDiscardDialog}>
-        <AlertDialogContent>
-          <AlertDialogHeader>
-            <AlertDialogTitle>Discard unsaved workflow?</AlertDialogTitle>
-            <AlertDialogDescription>
-              You have an unsaved workflow. Creating a new one will discard your
-              current changes.
-            </AlertDialogDescription>
-          </AlertDialogHeader>
-          <AlertDialogFooter>
-            <AlertDialogCancel>Cancel</AlertDialogCancel>
-            <AlertDialogAction onClick={handleConfirmDiscard}>
-              Discard
-            </AlertDialogAction>
-          </AlertDialogFooter>
-        </AlertDialogContent>
-      </AlertDialog>
-    </div>
-  )
-}

packages/browseros-agent/apps/agent/entrypoints/app/create-graph/CreateGraphWrapper.tsx

@@ -1,13 +0,0 @@
-import { type FC, Suspense } from 'react'
-import { RpcClientProvider } from '@/lib/rpc/RpcClientProvider'
-import { CreateGraph } from './CreateGraph'
-
-export const CreateGraphWrapper: FC = () => {
-  return (
-    <RpcClientProvider>
-      <Suspense fallback={<div className="h-screen w-screen bg-background" />}>
-        <CreateGraph />
-      </Suspense>
-    </RpcClientProvider>
-  )
-}

packages/browseros-agent/apps/agent/entrypoints/app/create-graph/CustomNode.tsx

@@ -1,140 +0,0 @@
-import { Handle, type Node, type NodeProps, Position } from '@xyflow/react'
-import {
-  CheckCircle,
-  Download,
-  GitBranch,
-  GitMerge,
-  MousePointer,
-  Navigation,
-  Play,
-  RotateCw,
-  Split,
-  Square,
-} from 'lucide-react'
-import type React from 'react'
-import { memo } from 'react'
-import { cn } from '@/lib/utils'
-
-const nodeConfig: Record<
-  NodeType,
-  { color: string; icon: React.ElementType; label: string }
-> = {
-  start: {
-    color: 'text-green-600 dark:text-green-400',
-    icon: Play,
-    label: 'Start',
-  },
-  end: {
-    color: 'text-red-600 dark:text-red-400',
-    icon: Square,
-    label: 'End',
-  },
-  nav: {
-    color: 'text-blue-600 dark:text-blue-400',
-    icon: Navigation,
-    label: 'Navigate',
-  },
-  act: {
-    color: 'text-purple-600 dark:text-purple-400',
-    icon: MousePointer,
-    label: 'Action',
-  },
-  extract: {
-    color: 'text-amber-600 dark:text-amber-400',
-    icon: Download,
-    label: 'Extract',
-  },
-  verify: {
-    color: 'text-emerald-600 dark:text-emerald-400',
-    icon: CheckCircle,
-    label: 'Verify',
-  },
-  decision: {
-    color: 'text-pink-600 dark:text-pink-400',
-    icon: GitBranch,
-    label: 'Decision',
-  },
-  loop: {
-    color: 'text-cyan-600 dark:text-cyan-400',
-    icon: RotateCw,
-    label: 'Loop',
-  },
-  fork: {
-    color: 'text-indigo-600 dark:text-indigo-400',
-    icon: Split,
-    label: 'Fork',
-  },
-  join: {
-    color: 'text-lime-600 dark:text-lime-400',
-    icon: GitMerge,
-    label: 'Join',
-  },
-}
-
-export type NodeType =
-  | 'start'
-  | 'end'
-  | 'nav'
-  | 'act'
-  | 'extract'
-  | 'verify'
-  | 'decision'
-  | 'loop'
-  | 'fork'
-  | 'join'
-
-type CustomNodeData = Node<{
-  type: NodeType
-  label: string
-}>
-
-export const CustomNode = memo(
-  ({ data: { label, type } }: NodeProps<CustomNodeData>) => {
-    const config = nodeConfig[type || 'start']
-    const Icon = config.icon
-
-    const showSourceHandle = type !== 'end'
-    const showTargetHandle = type !== 'start'
-
-    return (
-      <div className="min-w-45 rounded-lg border border-border bg-card px-4 py-3 shadow-md transition-all">
-        {showTargetHandle && (
-          <Handle
-            type="target"
-            position={Position.Top}
-            className="h-2 w-2 bg-accent-orange!"
-          />
-        )}
-
-        <div className="flex items-center gap-2">
-          <div className={cn('shrink-0', config.color)}>
-            <Icon className="h-5 w-5" />
-          </div>
-          <div className="min-w-0 flex-1">
-            <div
-              className={cn(
-                'mb-0.5 font-semibold text-xs uppercase tracking-wide',
-                config.color,
-              )}
-            >
-              {config.label}
-            </div>
-            <div className="wrap-break-word font-medium text-foreground text-sm">
-              {label}
-            </div>
-          </div>
-        </div>
-
-        {showSourceHandle && (
-          <Handle
-            type="source"
-            position={Position.Bottom}
-            className="h-2 w-2 bg-accent-orange!"
-          />
-        )}
-      </div>
-    )
-  },
-)
-
-CustomNode.displayName = 'CustomNode'

packages/browseros-agent/apps/agent/entrypoints/app/create-graph/GraphCanvas.tsx

@@ -1,514 +0,0 @@
-import cytoscape from 'cytoscape'
-import dagre from 'cytoscape-dagre'
-// @ts-expect-error no types available
-import nodeHtmlLabel from 'cytoscape-node-html-label'
-import DOMPurify from 'dompurify'
-import {
-  ArrowLeft,
-  Maximize,
-  Minus,
-  Pencil,
-  Play,
-  Plus,
-  Save,
-} from 'lucide-react'
-import type { FC } from 'react'
-import { useCallback, useEffect, useRef, useState } from 'react'
-import { useNavigate } from 'react-router'
-import useDeepCompareEffect from 'use-deep-compare-effect'
-import ProductLogo from '@/assets/product_logo.svg'
-import { Button } from '@/components/ui/button'
-import {
-  Tooltip,
-  TooltipContent,
-  TooltipTrigger,
-} from '@/components/ui/tooltip'
-import type { GraphData } from './CreateGraph'
-import type { NodeType } from './CustomNode'
-
-cytoscape.use(dagre)
-nodeHtmlLabel(cytoscape)
-
-const NODE_CONFIG: Record<
-  NodeType,
-  { color: string; bgColor: string; icon: string; label: string }
-> = {
-  start: {
-    color: '#22c55e',
-    bgColor: 'rgba(34, 197, 94, 0.1)',
-    icon: `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="6 3 20 12 6 21 6 3"></polygon></svg>`,
-    label: 'START',
-  },
-  end: {
-    color: '#ef4444',
-    bgColor: 'rgba(239, 68, 68, 0.1)',
-    icon: `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="18" height="18" x="3" y="3" rx="2"></rect></svg>`,
-    label: 'END',
-  },
-  nav: {
-    color: '#3b82f6',
-    bgColor: 'rgba(59, 130, 246, 0.1)',
-    icon: `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="3 11 22 2 13 21 11 13 3 11"></polygon></svg>`,
-    label: 'NAVIGATE',
-  },
-  act: {
-    color: '#8b5cf6',
-    bgColor: 'rgba(139, 92, 246, 0.1)',
-    icon: `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m4 4 7.07 17 2.51-7.39L21 11.07z"></path></svg>`,
-    label: 'ACTION',
-  },
-  extract: {
-    color: '#f59e0b',
-    bgColor: 'rgba(245, 158, 11, 0.1)',
-    icon: `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path><polyline points="7 10 12 15 17 10"></polyline><line x1="12" x2="12" y1="15" y2="3"></line></svg>`,
-    label: 'EXTRACT',
-  },
-  verify: {
-    color: '#10b981',
-    bgColor: 'rgba(16, 185, 129, 0.1)',
-    icon: `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"></path><polyline points="22 4 12 14.01 9 11.01"></polyline></svg>`,
-    label: 'VERIFY',
-  },
-  decision: {
-    color: '#ec4899',
-    bgColor: 'rgba(236, 72, 153, 0.1)',
-    icon: `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="6" x2="6" y1="3" y2="15"></line><circle cx="18" cy="6" r="3"></circle><circle cx="6" cy="18" r="3"></circle><path d="M18 9a9 9 0 0 1-9 9"></path></svg>`,
-    label: 'DECISION',
-  },
-  loop: {
-    color: '#06b6d4',
-    bgColor: 'rgba(6, 182, 212, 0.1)',
-    icon: `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 12a9 9 0 1 1-9-9c2.52 0 4.93 1 6.74 2.74L21 8"></path><path d="M21 3v5h-5"></path></svg>`,
-    label: 'LOOP',
-  },
-  fork: {
-    color: '#6366f1',
-    bgColor: 'rgba(99, 102, 241, 0.1)',
-    icon: `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M16 3h5v5"></path><path d="M8 3H3v5"></path><path d="M12 22v-8.3a4 4 0 0 0-1.172-2.872L3 3"></path><path d="m15 9 6-6"></path></svg>`,
-    label: 'FORK',
-  },
-  join: {
-    color: '#84cc16',
-    bgColor: 'rgba(132, 204, 22, 0.1)',
-    icon: `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="18" cy="18" r="3"></circle><circle cx="6" cy="6" r="3"></circle><path d="M6 21V9a9 9 0 0 0 9 9"></path></svg>`,
-    label: 'JOIN',
-  },
-}
-
-const initialData: GraphData = {
-  nodes: [
-    {
-      id: 'start',
-      type: 'start',
-      data: { label: 'Use the Chat to build your workflow!' },
-    },
-  ],
-  edges: [],
-}
-
-const MIN_NODE_WIDTH = 180
-const MAX_NODE_WIDTH = 240
-const BASE_NODE_HEIGHT = 70
-const CHAR_WIDTH = 7
-const ICON_AND_PADDING = 62
-const MAX_ZOOM = 1.2
-
-const calculateNodeDimensions = (
-  label: string,
-): { width: number; height: number } => {
-  const textWidth = label.length * CHAR_WIDTH + ICON_AND_PADDING
-  const width = Math.max(MIN_NODE_WIDTH, Math.min(MAX_NODE_WIDTH, textWidth))
-
-  const maxCharsPerLine = Math.floor((width - ICON_AND_PADDING) / CHAR_WIDTH)
-  const lines = Math.ceil(label.length / maxCharsPerLine)
-  const extraHeight = Math.max(0, lines - 1) * 18
-  const height = BASE_NODE_HEIGHT + extraHeight
-
-  return { width, height }
-}
-
-const createNodeHtml = (type: NodeType, label: string): string => {
-  const config = NODE_CONFIG[type] || NODE_CONFIG.start
-  const sanitizedLabel = DOMPurify.sanitize(label, { ALLOWED_TAGS: [] })
-  return `
-    <div class="graph-node" style="
-      display: flex;
-      align-items: flex-start;
-      gap: 10px;
-      min-width: 160px;
-      max-width: 220px;
-      padding: 12px 16px;
-      background-color: var(--graph-node-bg);
-      border: 1px solid var(--graph-node-border);
-      border-radius: 10px;
-      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
-      font-family: system-ui, -apple-system, sans-serif;
-    ">
-      <div style="
-        flex-shrink: 0;
-        color: ${config.color};
-        margin-top: 2px;
-      ">
-        ${config.icon}
-      </div>
-      <div style="flex: 1; min-width: 0;">
-        <div style="
-          font-size: 10px;
-          font-weight: 600;
-          letter-spacing: 0.05em;
-          color: ${config.color};
-          margin-bottom: 4px;
-        ">${config.label}</div>
-        <div style="
-          font-size: 13px;
-          font-weight: 500;
-          color: var(--graph-node-text);
-          line-height: 1.4;
-          word-wrap: break-word;
-        ">${sanitizedLabel}</div>
-      </div>
-    </div>
-  `
-}
-
-type GraphCanvasProps = {
-  graphName: string
-  onGraphNameChange: (name: string) => void
-  graphData?: GraphData
-  codeId?: string
-  onClickTest: () => unknown
-  onClickSave: () => unknown
-  isSaved: boolean
-  hasUnsavedChanges: boolean
-  shouldBlockNavigation: boolean
-  panelSize?: { asPercentage: number; inPixels: number }
-}
-
-export const GraphCanvas: FC<GraphCanvasProps> = ({
-  graphName,
-  onGraphNameChange,
-  graphData = initialData,
-  codeId,
-  onClickTest,
-  onClickSave,
-  isSaved,
-  hasUnsavedChanges,
-  shouldBlockNavigation,
-  panelSize,
-}) => {
-  const [isEditingName, setIsEditingName] = useState(false)
-  const navigate = useNavigate()
-  const containerRef = useRef<HTMLDivElement>(null)
-  const cyRef = useRef<cytoscape.Core | null>(null)
-
-  const handleBack = () => {
-    if (shouldBlockNavigation) {
-      const confirmed = window.confirm(
-        'You have unsaved changes. Are you sure you want to leave?',
-      )
-      if (!confirmed) return
-    }
-    navigate(-1)
-  }
-
-  const canTest = !!codeId
-  const canSave = !!graphName && !!codeId && hasUnsavedChanges
-
-  const getTestTooltip = () => {
-    if (!codeId) return 'Create a workflow using the chat first'
-    return 'Run a test of this workflow'
-  }
-
-  const getSaveTooltip = () => {
-    if (!codeId) return 'Create a workflow using the chat first'
-    if (!graphName) return 'Provide a name for the workflow'
-    if (isSaved && !hasUnsavedChanges) return 'Workflow already saved'
-    return isSaved ? 'Save changes to this workflow' : 'Save this workflow'
-  }
-
-  const getSaveButtonLabel = () => {
-    return isSaved ? 'Save Changes' : 'Save Workflow'
-  }
-
-  const zoomIn = useCallback(() => {
-    cyRef.current?.zoom(cyRef.current.zoom() * 1.2)
-    cyRef.current?.center()
-  }, [])
-
-  const zoomOut = useCallback(() => {
-    cyRef.current?.zoom(cyRef.current.zoom() / 1.2)
-    cyRef.current?.center()
-  }, [])
-
-  const fitView = useCallback(() => {
-    cyRef.current?.fit(undefined, 50)
-    cyRef.current?.center()
-  }, [])
-
-  useEffect(() => {
-    if (!containerRef.current) return
-
-    const cy = cytoscape({
-      container: containerRef.current,
-      elements: [],
-      style: [
-        {
-          selector: 'node',
-          style: {
-            width: 'data(nodeWidth)',
-            height: 'data(nodeHeight)',
-            'background-opacity': 0,
-            'border-width': 0,
-          },
-        },
-        {
-          selector: 'edge',
-          style: {
-            width: 2,
-            'line-color': '#f97316',
-            'target-arrow-color': '#f97316',
-            'target-arrow-shape': 'triangle',
-            'curve-style': 'bezier',
-            'arrow-scale': 1.2,
-          },
-        },
-        {
-          selector: 'edge.back-edge',
-          style: {
-            'line-style': 'dashed',
-            'line-dash-pattern': [6, 3],
-            'curve-style': 'unbundled-bezier',
-            'control-point-distances': [100],
-            'control-point-weights': [0.5],
-          },
-        },
-      ],
-      layout: { name: 'preset' },
-      userZoomingEnabled: true,
-      userPanningEnabled: true,
-      boxSelectionEnabled: false,
-      selectionType: 'single',
-      autoungrabify: true,
-      autounselectify: true,
-      maxZoom: MAX_ZOOM,
-      minZoom: 0.2,
-    })
-
-    // @ts-expect-error nodeHtmlLabel extension
-    cy.nodeHtmlLabel([
-      {
-        query: 'node',
-        halign: 'center',
-        valign: 'center',
-        halignBox: 'center',
-        valignBox: 'center',
-        tpl: (data: { type: NodeType; label: string }) => {
-          return createNodeHtml(data.type, data.label)
-        },
-      },
-    ])
-
-    cyRef.current = cy
-
-    return () => {
-      cy.destroy()
-    }
-  }, [])
-
-  const updateGraph = useCallback((data: GraphData) => {
-    const cy = cyRef.current
-    if (!cy) return
-
-    cy.elements().remove()
-
-    const nodes = data.nodes.map((node) => {
-      const dimensions = calculateNodeDimensions(node.data.label)
-      return {
-        data: {
-          id: node.id,
-          label: node.data.label,
-          type: node.type as NodeType,
-          nodeWidth: dimensions.width,
-          nodeHeight: dimensions.height,
-        },
-      }
-    })
-
-    const edges = data.edges.map((edge) => ({
-      data: {
-        id: edge.id,
-        source: edge.source,
-        target: edge.target,
-      },
-    }))
-
-    cy.add([...nodes, ...edges])
-
-    cy.layout({
-      name: 'dagre',
-      rankDir: 'TB',
-      nodeSep: 80,
-      rankSep: 100,
-      padding: 50,
-      animate: true,
-      animationDuration: 300,
-      fit: true,
-    } as cytoscape.LayoutOptions).run()
-
-    setTimeout(() => {
-      cy.edges().forEach((edge) => {
-        const sourceNode = edge.source()
-        const targetNode = edge.target()
-        const sourceY = sourceNode.position('y')
-        const targetY = targetNode.position('y')
-
-        if (sourceY > targetY) {
-          edge.addClass('back-edge')
-        }
-      })
-    }, 350)
-  }, [])
-
-  useDeepCompareEffect(() => {
-    updateGraph(graphData)
-  }, [graphData])
-
-  useEffect(() => {
-    if (panelSize?.inPixels !== undefined) {
-      cyRef.current?.resize()
-      setTimeout(() => fitView(), 100)
-    }
-  }, [panelSize?.inPixels, fitView])
-
-  return (
-    <div className="flex h-full flex-col [--graph-node-bg:rgba(255,255,255,1)] [--graph-node-border:rgba(228,228,231,1)] [--graph-node-text:rgba(24,24,27,1)] dark:[--graph-node-bg:rgba(24,24,27,1)] dark:[--graph-node-border:rgba(63,63,70,1)] dark:[--graph-node-text:rgba(250,250,250,1)]">
-      {/* Graph Header */}
-      <header className="flex h-14 shrink-0 items-center justify-between border-border/40 border-b bg-background/80 px-3 backdrop-blur-md">
-        <div className="flex min-w-0 flex-1 items-center gap-3">
-          <Button
-            variant="ghost"
-            size="icon"
-            className="h-8 w-8 shrink-0"
-            onClick={handleBack}
-          >
-            <ArrowLeft className="h-4 w-4" />
-          </Button>
-          <img src={ProductLogo} alt="BrowserOS" className="h-8 w-8 shrink-0" />
-          {isEditingName ? (
-            <input
-              type="text"
-              value={graphName}
-              onChange={(e) => onGraphNameChange(e.target.value)}
-              onBlur={() => setIsEditingName(false)}
-              onKeyDown={(e) => {
-                if (e.key === 'Enter') setIsEditingName(false)
-              }}
-              // biome-ignore lint/a11y/noAutofocus: needed to autofocus field when edit mode is toggled
-              autoFocus
-              placeholder="Enter workflow name..."
-              className="max-w-64 border-[var(--accent-orange)] border-b bg-transparent font-semibold text-sm outline-none placeholder:font-normal placeholder:text-muted-foreground/60"
-            />
-          ) : (
-            <Button
-              variant="ghost"
-              size="sm"
-              onClick={() => setIsEditingName(true)}
-              className="group min-w-0 gap-2 px-2 py-1"
-            >
-              {graphName ? (
-                <span className="truncate font-semibold text-sm">
-                  {graphName}
-                </span>
-              ) : (
-                <span className="text-muted-foreground/60 text-sm italic">
-                  Untitled workflow
-                </span>
-              )}
-              <Pencil className="h-3.5 w-3.5 shrink-0 text-muted-foreground opacity-0 transition-opacity group-hover:opacity-100" />
-            </Button>
-          )}
-        </div>
-
-        {/* Control Buttons */}
-        <div className="flex items-center gap-2">
-          <Tooltip>
-            <TooltipTrigger asChild>
-              <span>
-                <Button
-                  variant="secondary"
-                  size="sm"
-                  onClick={onClickTest}
-                  disabled={!canTest}
-                >
-                  <Play className="mr-1.5 h-4 w-4" />
-                  Test Workflow
-                </Button>
-              </span>
-            </TooltipTrigger>
-            <TooltipContent>{getTestTooltip()}</TooltipContent>
-          </Tooltip>
-          <Tooltip>
-            <TooltipTrigger asChild>
-              <span>
-                <Button
-                  size="sm"
-                  onClick={onClickSave}
-                  disabled={!canSave}
-                  className="bg-[var(--accent-orange)] shadow-lg shadow-orange-500/20 hover:bg-[var(--accent-orange-bright)] disabled:bg-[var(--accent-orange)]/50"
-                >
-                  <Save className="mr-1.5 h-4 w-4" />
-                  {getSaveButtonLabel()}
-                </Button>
-              </span>
-            </TooltipTrigger>
-            <TooltipContent>{getSaveTooltip()}</TooltipContent>
-          </Tooltip>
-        </div>
-      </header>
-
-      {/* Graph Canvas */}
-      <div className="relative min-h-0 flex-1 overflow-hidden [--dot-color:rgba(0,0,0,0.2)] dark:[--dot-color:rgba(255,255,255,0.15)]">
-        <div
-          ref={containerRef}
-          className="h-full w-full bg-zinc-50 dark:bg-zinc-900"
-          style={{
-            backgroundImage:
-              'radial-gradient(circle, var(--dot-color) 1.5px, transparent 1.5px)',
-            backgroundSize: '20px 20px',
-          }}
-        />
-
-        {/* Zoom Controls */}
-        <div className="absolute bottom-4 left-4 z-10 flex flex-col gap-1 rounded-lg border-2 border-border bg-card p-1">
-          <Button
-            variant="ghost"
-            size="icon"
-            className="h-8 w-8"
-            onClick={zoomIn}
-            title="Zoom in"
-          >
-            <Plus className="h-4 w-4" />
-          </Button>
-          <Button
-            variant="ghost"
-            size="icon"
-            className="h-8 w-8"
-            onClick={zoomOut}
-            title="Zoom out"
-          >
-            <Minus className="h-4 w-4" />
-          </Button>
-          <Button
-            variant="ghost"
-            size="icon"
-            className="h-8 w-8"
-            onClick={fitView}
-            title="Fit view"
-          >
-            <Maximize className="h-4 w-4" />
-          </Button>
-        </div>
-      </div>
-    </div>
-  )
-}

packages/browseros-agent/apps/agent/entrypoints/app/create-graph/GraphChat.tsx

@@ -1,194 +0,0 @@
-import type { UIMessage } from 'ai'
-import { Send, SquareStop } from 'lucide-react'
-import type { FC, FormEventHandler, KeyboardEvent } from 'react'
-import { useEffect, useRef, useState } from 'react'
-import { ChatError } from '@/entrypoints/sidepanel/index/ChatError'
-import { ChatMessages } from '@/entrypoints/sidepanel/index/ChatMessages'
-import { getResponseAndQueryFromMessageId } from '@/entrypoints/sidepanel/index/useChatSession'
-import {
-  GRAPH_MESSAGE_DISLIKE_EVENT,
-  GRAPH_MESSAGE_LIKE_EVENT,
-} from '@/lib/constants/analyticsEvents'
-import { useJtbdPopup } from '@/lib/jtbd-popup/useJtbdPopup'
-import { track } from '@/lib/metrics/track'
-import { cn } from '@/lib/utils'
-import { GraphEmptyState } from './GraphEmptyState'
-import { getWorkflowDisplayMessages } from './workflow-tidbit-messages'
-
-interface GraphChatProps {
-  onSubmit: FormEventHandler<HTMLFormElement>
-  onInputChange: (value: string) => void
-  onStop: () => void
-  input: string
-  status: 'streaming' | 'submitted' | 'ready' | 'error'
-  messages: UIMessage[]
-  chatError?: Error
-  agentUrlError?: Error | null
-  onSuggestionClick: (prompt: string) => void
-}
-
-export const GraphChat: FC<GraphChatProps> = ({
-  onSubmit,
-  onInputChange,
-  onStop,
-  input,
-  status,
-  messages,
-  chatError,
-  agentUrlError,
-  onSuggestionClick,
-}) => {
-  const [liked, setLiked] = useState<Record<string, boolean>>({})
-  const [disliked, setDisliked] = useState<Record<string, boolean>>({})
-  const [mounted, setMounted] = useState(false)
-  const displayMessages = getWorkflowDisplayMessages(messages)
-
-  useEffect(() => {
-    setMounted(true)
-  }, [])
-
-  const {
-    popupVisible,
-    recordMessageSent,
-    triggerIfEligible,
-    onTakeSurvey: onTakeSurveyBase,
-    onDismiss: onDismissJtbdPopup,
-  } = useJtbdPopup()
-
-  const onTakeSurvey = () =>
-    onTakeSurveyBase({ experimentId: 'workflow_survey' })
-
-  // Trigger JTBD popup when AI finishes responding
-  const previousChatStatus = useRef(status)
-  // biome-ignore lint/correctness/useExhaustiveDependencies: intentionally only trigger on status change
-  useEffect(() => {
-    const aiWasProcessing =
-      previousChatStatus.current === 'streaming' ||
-      previousChatStatus.current === 'submitted'
-    const aiJustFinished = aiWasProcessing && status === 'ready'
-
-    if (aiJustFinished && messages.length > 0) {
-      triggerIfEligible()
-    }
-    previousChatStatus.current = status
-  }, [status])
-
-  const onClickLike = (messageId: string) => {
-    const { responseText, queryText } = getResponseAndQueryFromMessageId(
-      messages,
-      messageId,
-    )
-
-    track(GRAPH_MESSAGE_LIKE_EVENT, { responseText, queryText, messageId })
-
-    setLiked((prev) => ({
-      ...prev,
-      [messageId]: !prev[messageId],
-    }))
-  }
-
-  const onClickDislike = (messageId: string, comment?: string) => {
-    const { responseText, queryText } = getResponseAndQueryFromMessageId(
-      messages,
-      messageId,
-    )
-
-    track(GRAPH_MESSAGE_DISLIKE_EVENT, {
-      responseText,
-      queryText,
-      messageId,
-      comment,
-    })
-
-    setDisliked((prev) => ({
-      ...prev,
-      [messageId]: !prev[messageId],
-    }))
-  }
-
-  const handleSubmit: FormEventHandler<HTMLFormElement> = (e) => {
-    recordMessageSent()
-    onSubmit(e)
-  }
-
-  const handleKeyDown = (e: KeyboardEvent<HTMLTextAreaElement>) => {
-    if (
-      e.key === 'Enter' &&
-      !e.shiftKey &&
-      !e.metaKey &&
-      !e.ctrlKey &&
-      !e.nativeEvent.isComposing
-    ) {
-      e.preventDefault()
-      if (input.trim()) {
-        e.currentTarget.form?.requestSubmit()
-      }
-    }
-  }
-
-  return (
-    <div className="flex h-full flex-col overflow-hidden">
-      <div className="styled-scrollbar min-h-0 flex-1 overflow-y-auto pb-2">
-        {displayMessages.length === 0 ? (
-          <GraphEmptyState
-            mounted={mounted}
-            onSuggestionClick={onSuggestionClick}
-          />
-        ) : (
-          <ChatMessages
-            liked={liked}
-            disliked={disliked}
-            onClickDislike={onClickDislike}
-            onClickLike={onClickLike}
-            messages={displayMessages}
-            status={status}
-            showJtbdPopup={popupVisible}
-            showDontShowAgain={false}
-            onTakeSurvey={onTakeSurvey}
-            onDismissJtbdPopup={onDismissJtbdPopup}
-          />
-        )}
-      </div>
-      {agentUrlError && <ChatError error={agentUrlError} />}
-      {chatError && <ChatError error={chatError} />}
-      <div className="shrink-0 border-border/40 border-t bg-background/80 p-2 backdrop-blur-md">
-        <form
-          onSubmit={handleSubmit}
-          className="relative flex w-full items-end gap-2"
-        >
-          <textarea
-            className={cn(
-              'field-sizing-content max-h-60 min-h-[42px] flex-1 resize-none overflow-hidden rounded-2xl border border-border/50 bg-muted/50 px-4 py-2.5 pr-11 text-sm outline-none transition-colors placeholder:text-muted-foreground/70 hover:border-border focus:border-[var(--accent-orange)]',
-            )}
-            value={input}
-            onChange={(e) => onInputChange(e.target.value)}
-            onKeyDown={handleKeyDown}
-            placeholder={
-              'Visit Amazon and add sensodyne toothpaste to the cart.'
-            }
-            rows={1}
-          />
-          {status === 'streaming' ? (
-            <button
-              type="button"
-              onClick={onStop}
-              className="absolute right-1.5 bottom-1.5 cursor-pointer rounded-full bg-red-600 p-2 text-white shadow-sm transition-all duration-200 hover:bg-red-900 disabled:cursor-not-allowed disabled:opacity-50"
-            >
-              <SquareStop className="h-3.5 w-3.5" />
-              <span className="sr-only">Stop</span>
-            </button>
-          ) : (
-            <button
-              type="submit"
-              disabled={!input.trim()}
-              className="absolute right-1.5 bottom-1.5 cursor-pointer rounded-full bg-[var(--accent-orange)] p-2 text-white shadow-sm transition-all duration-200 hover:bg-[var(--accent-orange-bright)] disabled:cursor-not-allowed disabled:opacity-50"
-            >
-              <Send className="h-3.5 w-3.5" />
-              <span className="sr-only">Send</span>
-            </button>
-          )}
-        </form>
-      </div>
-    </div>
-  )
-}

packages/browseros-agent/apps/agent/entrypoints/app/create-graph/GraphEmptyState.tsx

@@ -1,77 +0,0 @@
-import { Workflow } from 'lucide-react'
-import type { FC } from 'react'
-import { cn } from '@/lib/utils'
-
-interface Suggestion {
-  display: string
-  prompt: string
-  icon: string
-}
-
-const WORKFLOW_SUGGESTIONS: Suggestion[] = [
-  {
-    display: 'Search Amazon and add toothpaste to cart',
-    prompt:
-      'Go to Amazon, search for toothpaste, select 1 pack filter and add the first result to cart',
-    icon: '🛒',
-  },
-  {
-    display: 'Accept LinkedIn connection requests',
-    prompt:
-      'Open LinkedIn and go to my connection requests, accept one by one in a loop for 25 times',
-    icon: '🤝',
-  },
-  {
-    display: 'Unsubscribe from Gmail subscriptions',
-    prompt:
-      'Go to Gmail, navigate to manage subscriptions and unsubscribe from all',
-    icon: '📧',
-  },
-]
-
-interface GraphEmptyStateProps {
-  mounted: boolean
-  onSuggestionClick: (prompt: string) => void
-}
-
-export const GraphEmptyState: FC<GraphEmptyStateProps> = ({
-  mounted,
-  onSuggestionClick,
-}) => {
-  return (
-    <div
-      className={cn(
-        'm-0! flex h-full flex-col items-center justify-center space-y-4 text-center opacity-0 transition-all duration-700',
-        mounted ? 'translate-y-0 opacity-100' : 'translate-y-4 opacity-0',
-      )}
-    >
-      <div className="mb-2 flex h-14 w-14 items-center justify-center rounded-2xl bg-muted/50">
-        <Workflow className="h-7 w-7 text-[var(--accent-orange)]" />
-      </div>
-      <div>
-        <h2 className="mb-1 font-semibold text-lg">
-          Create reliable workflows
-        </h2>
-        <p className="max-w-[240px] text-muted-foreground text-xs">
-          Chat with the agent to create and refine browser automation
-        </p>
-      </div>
-
-      <div className="mt-6 grid w-full max-w-[300px] grid-cols-1 gap-2">
-        {WORKFLOW_SUGGESTIONS.map((suggestion) => (
-          <button
-            type="button"
-            key={suggestion.display}
-            onClick={() => onSuggestionClick(suggestion.prompt)}
-            className="group flex items-center justify-between rounded-lg border border-border/50 bg-card px-3 py-2.5 text-left text-xs transition-all duration-200 hover:border-[var(--accent-orange)]/50 hover:bg-[var(--accent-orange)]/5"
-          >
-            {suggestion.display}
-            <span className="opacity-0 transition-opacity duration-200 group-hover:opacity-100">
-              {suggestion.icon}
-            </span>
-          </button>
-        ))}
-      </div>
-    </div>
-  )
-}

packages/browseros-agent/apps/agent/entrypoints/app/create-graph/WorkflowsChatHeader.tsx

@@ -1,92 +0,0 @@
-import { Github, Plus, SettingsIcon } from 'lucide-react'
-import type { FC } from 'react'
-import { ChatProviderSelector } from '@/components/chat/ChatProviderSelector'
-import type { Provider } from '@/components/chat/chatComponentTypes'
-import { ThemeToggle } from '@/components/elements/theme-toggle'
-import { productRepositoryUrl } from '@/lib/constants/productUrls'
-import { BrowserOSIcon, ProviderIcon } from '@/lib/llm-providers/providerIcons'
-import type { ProviderType } from '@/lib/llm-providers/types'
-
-interface WorkflowsChatHeaderProps {
-  selectedProvider: Provider
-  providers: Provider[]
-  onSelectProvider: (provider: Provider) => void
-  onNewWorkflow: () => void
-  hasMessages: boolean
-}
-
-export const WorkflowsChatHeader: FC<WorkflowsChatHeaderProps> = ({
-  selectedProvider,
-  providers,
-  onSelectProvider,
-  onNewWorkflow,
-  hasMessages,
-}) => {
-  return (
-    <header className="flex h-14 shrink-0 items-center justify-between border-border/40 border-b bg-background/80 px-3 backdrop-blur-md">
-      <div className="flex items-center gap-2">
-        <ChatProviderSelector
-          providers={providers}
-          selectedProvider={selectedProvider}
-          onSelectProvider={onSelectProvider}
-        >
-          <button
-            type="button"
-            className="group relative inline-flex cursor-pointer items-center gap-2 rounded-lg p-2 text-muted-foreground transition-colors hover:bg-muted/50 hover:text-foreground data-[state=open]:bg-accent"
-            title="Change AI Provider"
-          >
-            {selectedProvider.type === 'browseros' ? (
-              <BrowserOSIcon size={18} />
-            ) : (
-              <ProviderIcon
-                type={selectedProvider.type as ProviderType}
-                size={18}
-              />
-            )}
-            <span className="font-semibold text-base">
-              {selectedProvider.name}
-            </span>
-          </button>
-        </ChatProviderSelector>
-      </div>
-
-      <div className="flex items-center gap-1">
-        {hasMessages && (
-          <button
-            type="button"
-            onClick={onNewWorkflow}
-            className="cursor-pointer rounded-lg p-2 text-muted-foreground transition-colors hover:bg-muted/50 hover:text-foreground"
-            title="New workflow"
-          >
-            <Plus className="h-4 w-4" />
-          </button>
-        )}
-
-        <a
-          href={productRepositoryUrl}
-          target="_blank"
-          rel="noopener noreferrer"
-          className="cursor-pointer rounded-lg p-2 text-muted-foreground transition-colors hover:bg-muted/50 hover:text-foreground"
-          title="Star on Github"
-        >
-          <Github className="h-4 w-4" />
-        </a>
-
-        <a
-          href="/app.html#/settings"
-          target="_blank"
-          rel="noopener noreferrer"
-          className="cursor-pointer rounded-lg p-2 text-muted-foreground transition-colors hover:bg-muted/50 hover:text-foreground"
-          title="Settings"
-        >
-          <SettingsIcon className="h-4 w-4" />
-        </a>
-
-        <ThemeToggle
-          className="rounded-lg p-2 text-muted-foreground transition-colors hover:bg-muted/50 hover:text-foreground"
-          iconClassName="h-4 w-4"
-        />
-      </div>
-    </header>
-  )
-}

packages/browseros-agent/apps/agent/entrypoints/app/create-graph/workflow-tidbit-messages.ts

@@ -1,111 +0,0 @@
-import type { UIMessage } from 'ai'
-
-type MessagePart = UIMessage['parts'][number]
-
-const TIDBIT_SUFFIXES = ['...', '\u2026'] as const
-
-const isTextPart = (
-  part: MessagePart,
-): part is MessagePart & { type: 'text' } => part.type === 'text'
-
-const isTidbitLine = (line: string): boolean => {
-  const trimmed = line.trim()
-  if (trimmed.length === 0) return false
-  return TIDBIT_SUFFIXES.some((suffix) => trimmed.endsWith(suffix))
-}
-
-const getNonEmptyLines = (text: string): string[] =>
-  text.split('\n').filter((line) => line.trim().length > 0)
-
-const isAllTidbitText = (text: string): boolean => {
-  const lines = getNonEmptyLines(text)
-  return lines.length > 0 && lines.every((line) => isTidbitLine(line))
-}
-
-export const isWorkflowTidbitMessage = (message: UIMessage): boolean => {
-  if (message.role !== 'assistant') return false
-  if (message.parts.length === 0) return false
-  if (message.parts.some((part) => !isTextPart(part))) return false
-
-  const fullText = message.parts
-    .filter((part) => isTextPart(part))
-    .map((part) => part.text)
-    .join('')
-
-  return isAllTidbitText(fullText)
-}
-
-// within a text part that has multiple tidbit lines, keep only the last line
-const compactTidbitLinesInPart = (part: MessagePart): MessagePart => {
-  if (!isTextPart(part)) return part
-
-  const lines = getNonEmptyLines(part.text)
-  if (lines.length <= 1) return part
-  if (!lines.every((line) => isTidbitLine(line))) return part
-
-  return { ...part, text: lines[lines.length - 1] }
-}
-
-// collapse consecutive tidbit text parts within a single message
-const compactTidbitPartsInMessage = (message: UIMessage): UIMessage => {
-  if (message.role !== 'assistant') return message
-
-  // first compact multi-line tidbit text within each part
-  const lineCompactedParts = message.parts.map(compactTidbitLinesInPart)
-
-  // then collapse consecutive tidbit parts to just the last one
-  const compactedParts: UIMessage['parts'] = []
-  let pendingTidbitPart: (MessagePart & { type: 'text' }) | null = null
-
-  const flushPendingTidbitPart = () => {
-    if (!pendingTidbitPart) return
-    compactedParts.push(pendingTidbitPart)
-    pendingTidbitPart = null
-  }
-
-  for (const part of lineCompactedParts) {
-    if (isTextPart(part) && isAllTidbitText(part.text)) {
-      pendingTidbitPart = part
-      continue
-    }
-
-    flushPendingTidbitPart()
-    compactedParts.push(part)
-  }
-
-  flushPendingTidbitPart()
-
-  const partsChanged =
-    compactedParts.length !== message.parts.length ||
-    compactedParts.some((p, i) => p !== message.parts[i])
-
-  if (!partsChanged) return message
-
-  return { ...message, parts: compactedParts }
-}
-
-export const getWorkflowDisplayMessages = (
-  messages: UIMessage[],
-): UIMessage[] => {
-  // first compact tidbit parts within each message
-  const normalizedMessages = messages.map(compactTidbitPartsInMessage)
-  const compactedMessages: UIMessage[] = []
-
-  // then collapse consecutive tidbit-only messages
-  for (const message of normalizedMessages) {
-    const previousMessage = compactedMessages[compactedMessages.length - 1]
-    const shouldReplacePreviousTidbit =
-      previousMessage &&
-      isWorkflowTidbitMessage(previousMessage) &&
-      isWorkflowTidbitMessage(message)
-
-    if (shouldReplacePreviousTidbit) {
-      compactedMessages[compactedMessages.length - 1] = message
-      continue
-    }
-
-    compactedMessages.push(message)
-  }
-
-  return compactedMessages
-}

packages/browseros-agent/apps/agent/entrypoints/app/llm-hub/HubProviderRow.tsx

@@ -2,8 +2,6 @@ import { Globe2, Trash2 } from 'lucide-react'
 import type { FC } from 'react'
 import { useMemo } from 'react'
 import { Button } from '@/components/ui/button'
-import { useKimiLaunch } from '@/lib/feature-flags/useKimiLaunch'
-import { cn } from '@/lib/utils'
 import { getFaviconUrl, type LlmHubProvider } from './models'
 
 interface HubProviderRowProps {
@@ -20,20 +18,9 @@ export const HubProviderRow: FC<HubProviderRowProps> = ({
   onDelete,
 }) => {
   const iconUrl = useMemo(() => getFaviconUrl(provider.url), [provider.url])
-  const kimiLaunch = useKimiLaunch()
-  const normalizedName = provider.name.trim().toLowerCase()
-  const normalizedUrl = provider.url.trim().toLowerCase()
-  const isKimi = normalizedName === 'kimi' || normalizedUrl.includes('kimi.com')
-  const showKimiFlare = isKimi && kimiLaunch
 
   return (
-    <div
-      className={cn(
-        'group flex w-full items-center gap-4 rounded-xl border border-border bg-card p-4 transition-all hover:border-[var(--accent-orange)] hover:shadow-md',
-        showKimiFlare &&
-          'border-orange-300/80 bg-orange-50/20 shadow-sm ring-1 ring-orange-300/45 dark:bg-orange-500/5',
-      )}
-    >
+    <div className="group flex w-full items-center gap-4 rounded-xl border border-border bg-card p-4 transition-all hover:border-[var(--accent-orange)] hover:shadow-md">
       <div className="flex h-10 w-10 shrink-0 items-center justify-center overflow-hidden rounded-lg bg-muted">
         {iconUrl ? (
           <img
@@ -49,16 +36,6 @@ export const HubProviderRow: FC<HubProviderRowProps> = ({
       <div className="min-w-0 flex-1">
         <div className="mb-0.5 flex items-center gap-2">
           <span className="block truncate font-semibold">{provider.name}</span>
-          {showKimiFlare && (
-            <div className="flex flex-wrap items-center gap-1">
-              <span className="rounded-full border border-orange-300/60 bg-orange-100/70 px-2 py-0.5 font-semibold text-[11px] text-orange-700 dark:border-orange-400/40 dark:bg-orange-500/15 dark:text-orange-300">
-                Recommended
-              </span>
-              <span className="rounded-full border border-orange-300/60 bg-orange-100/60 px-2.5 py-0.5 font-medium text-orange-700 text-xs dark:border-orange-400/40 dark:bg-orange-500/15 dark:text-orange-300">
-                Powered by Moonshot AI
-              </span>
-            </div>
-          )}
         </div>
         <p className="truncate text-muted-foreground/70 text-xs">
           {provider.url}

packages/browseros-agent/apps/agent/entrypoints/app/login/LogoutPage.tsx

@@ -1,5 +1,5 @@
 import { useQueryClient } from '@tanstack/react-query'
-import localforage from 'localforage'
+import { clear } from 'idb-keyval'
 import { Loader2 } from 'lucide-react'
 import type { FC } from 'react'
 import { useEffect } from 'react'
@@ -10,6 +10,7 @@ import {
   CardHeader,
   CardTitle,
 } from '@/components/ui/card'
+import { resetIdentity } from '@/lib/analytics/identify'
 import { signOut } from '@/lib/auth/auth-client'
 import { providersStorage } from '@/lib/llm-providers/storage'
 import { scheduledJobStorage } from '@/lib/schedules/scheduleStorage'
@@ -24,8 +25,9 @@ export const LogoutPage: FC = () => {
       await providersStorage.removeValue()
       await scheduledJobStorage.removeValue()
       queryClient.clear()
-      await localforage.clear()
+      await clear()
 
+      resetIdentity()
       await signOut()
       navigate('/home', { replace: true })
     }

packages/browseros-agent/apps/agent/entrypoints/app/mcp-settings/MCPServerHeader.tsx

@@ -1,31 +1,40 @@
-import { Check, Copy, ExternalLink, Globe, Server } from 'lucide-react'
-import { type FC, useState } from 'react'
+import {
+  Check,
+  Copy,
+  ExternalLink,
+  Loader2,
+  RefreshCw,
+  Server,
+} from 'lucide-react'
+import { type FC, useCallback, useState } from 'react'
+import { toast } from 'sonner'
 import { Button } from '@/components/ui/button'
+import { MCP_SERVER_RESTARTED_EVENT } from '@/lib/constants/analyticsEvents'
+import { sendServerMessage } from '@/lib/messaging/server/serverMessages'
+import { track } from '@/lib/metrics/track'
 
 interface MCPServerHeaderProps {
   serverUrl: string | null
   isLoading: boolean
   error: string | null
-  title?: string
-  description?: string
-  remoteAccessEnabled?: boolean
+  onServerRestart?: () => void
 }
 
 const DOCS_URL = 'https://docs.browseros.com/features/use-with-claude-code'
+const HEALTH_CHECK_TIMEOUT_MS = 60_000
+const HEALTH_CHECK_INTERVAL_MS = 2_000
 
 export const MCPServerHeader: FC<MCPServerHeaderProps> = ({
   serverUrl,
   isLoading,
   error,
-  title = 'BrowserOS MCP Server',
-  description = 'Connect BrowserOS to MCP clients like claude code, gemini and others.',
-  remoteAccessEnabled = false,
+  onServerRestart,
 }) => {
   const [isCopied, setIsCopied] = useState(false)
+  const [isRestarting, setIsRestarting] = useState(false)
 
   const handleCopy = async () => {
     if (!serverUrl) return
-
     try {
       await navigator.clipboard.writeText(serverUrl)
       setIsCopied(true)
@@ -35,6 +44,57 @@ export const MCPServerHeader: FC<MCPServerHeaderProps> = ({
     }
   }
 
+  const checkServerHealth = useCallback(async (): Promise<boolean> => {
+    try {
+      const result = await sendServerMessage('checkHealth', undefined)
+      return result.healthy
+    } catch {
+      return false
+    }
+  }, [])
+
+  const handleRestart = async () => {
+    setIsRestarting(true)
+    try {
+      const { getBrowserOSAdapter } = await import('@/lib/browseros/adapter')
+      const { BROWSEROS_PREFS } = await import('@/lib/browseros/prefs')
+      const adapter = getBrowserOSAdapter()
+      await adapter.setPref(BROWSEROS_PREFS.RESTART_SERVER, true)
+
+      const startTime = Date.now()
+      const waitForHealth = (): Promise<boolean> =>
+        new Promise((resolve) => {
+          const check = async () => {
+            if (Date.now() - startTime >= HEALTH_CHECK_TIMEOUT_MS) {
+              resolve(false)
+              return
+            }
+            if (await checkServerHealth()) {
+              resolve(true)
+              return
+            }
+            setTimeout(check, HEALTH_CHECK_INTERVAL_MS)
+          }
+          setTimeout(check, HEALTH_CHECK_INTERVAL_MS)
+        })
+
+      const healthy = await waitForHealth()
+      if (healthy) {
+        track(MCP_SERVER_RESTARTED_EVENT)
+        toast.success('Server restarted successfully')
+        onServerRestart?.()
+      } else {
+        toast.error('Server did not respond. Try restarting the browser.')
+      }
+    } catch (err) {
+      toast.error(
+        err instanceof Error ? err.message : 'Failed to restart server',
+      )
+    } finally {
+      setIsRestarting(false)
+    }
+  }
+
   return (
     <div className="rounded-xl border border-border bg-card p-6 shadow-sm transition-all hover:shadow-md">
       <div className="flex items-start gap-4">
@@ -43,18 +103,21 @@ export const MCPServerHeader: FC<MCPServerHeaderProps> = ({
         </div>
         <div className="flex-1">
           <div className="mb-1 flex items-center justify-between">
-            <h2 className="font-semibold text-xl">{title}</h2>
+            <h2 className="font-semibold text-xl">BrowserOS MCP Server</h2>
             <a
               href={DOCS_URL}
               target="_blank"
               rel="noopener noreferrer"
               className="flex items-center gap-1 text-muted-foreground text-sm transition-colors hover:text-[var(--accent-orange)]"
             >
-              Setup a client
+              Docs
               <ExternalLink className="h-3.5 w-3.5" />
             </a>
           </div>
-          <p className="mb-6 text-muted-foreground text-sm">{description}</p>
+          <p className="mb-6 text-muted-foreground text-sm">
+            Connect BrowserOS to MCP clients like Claude Code, Gemini CLI and
+            others.
+          </p>
 
           <div className="flex flex-col gap-2 sm:flex-row sm:items-center">
             <span className="whitespace-nowrap font-medium text-sm">
@@ -76,6 +139,7 @@ export const MCPServerHeader: FC<MCPServerHeaderProps> = ({
                 onClick={handleCopy}
                 disabled={!serverUrl || isLoading}
                 className="shrink-0"
+                title="Copy URL"
               >
                 {isCopied ? (
                   <Check className="h-4 w-4 text-green-600" />
@@ -83,19 +147,22 @@ export const MCPServerHeader: FC<MCPServerHeaderProps> = ({
                   <Copy className="h-4 w-4" />
                 )}
               </Button>
+              <Button
+                variant="outline"
+                size="icon"
+                onClick={handleRestart}
+                disabled={isLoading || isRestarting}
+                className="shrink-0"
+                title="Restart server"
+              >
+                {isRestarting ? (
+                  <Loader2 className="h-4 w-4 animate-spin" />
+                ) : (
+                  <RefreshCw className="h-4 w-4" />
+                )}
+              </Button>
             </div>
           </div>
-
-          {remoteAccessEnabled && serverUrl && !isLoading && (
-            <div className="mt-3 flex items-start gap-2 rounded-lg bg-muted/50 px-3 py-2">
-              <Globe className="mt-0.5 h-3.5 w-3.5 shrink-0 text-muted-foreground" />
-              <p className="text-muted-foreground text-xs">
-                External access is enabled. To connect from another device,
-                replace <span className="font-mono">127.0.0.1</span> with this
-                machine's IP address.
-              </p>
-            </div>
-          )}
         </div>
       </div>
     </div>

packages/browseros-agent/apps/agent/entrypoints/app/mcp-settings/MCPSettingsPage.tsx

@@ -4,7 +4,7 @@ import type { McpTool } from '@/lib/mcp/client'
 import { sendServerMessage } from '@/lib/messaging/server/serverMessages'
 import { MCPServerHeader } from './MCPServerHeader'
 import { MCPToolsSection } from './MCPToolsSection'
-import { ServerSettingsCard } from './ServerSettingsCard'
+import { QuickSetupSection } from './QuickSetupSection'
 
 /** @public */
 export const MCPSettingsPage: FC = () => {
@@ -12,8 +12,6 @@ export const MCPSettingsPage: FC = () => {
   const [urlLoading, setUrlLoading] = useState(true)
   const [urlError, setUrlError] = useState<string | null>(null)
 
-  const [remoteAccessEnabled, setRemoteAccessEnabled] = useState(false)
-
   const [tools, setTools] = useState<McpTool[]>([])
   const [toolsLoading, setToolsLoading] = useState(false)
   const [toolsError, setToolsError] = useState<string | null>(null)
@@ -82,13 +80,10 @@ export const MCPSettingsPage: FC = () => {
         serverUrl={serverUrl}
         isLoading={urlLoading}
         error={urlError}
-        remoteAccessEnabled={remoteAccessEnabled}
+        onServerRestart={loadServerUrlAndTools}
       />
 
-      <ServerSettingsCard
-        onServerRestart={loadServerUrlAndTools}
-        onRemoteAccessChange={setRemoteAccessEnabled}
-      />
+      <QuickSetupSection serverUrl={serverUrl} />
 
       <MCPToolsSection
         tools={tools}

packages/browseros-agent/apps/agent/entrypoints/app/mcp-settings/QuickSetupSection.tsx

@@ -0,0 +1,162 @@
+import { Check, Copy, Terminal } from 'lucide-react'
+import { type FC, useState } from 'react'
+import { Button } from '@/components/ui/button'
+import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs'
+
+interface QuickSetupSectionProps {
+  serverUrl: string | null
+}
+
+interface ClientConfig {
+  id: string
+  name: string
+  type: 'command' | 'json'
+  getSnippet: (url: string) => string
+  fileName?: string
+}
+
+const clients: ClientConfig[] = [
+  {
+    id: 'claude-code',
+    name: 'Claude Code',
+    type: 'command',
+    getSnippet: (url) =>
+      `claude mcp add --transport http browseros ${url} --scope user`,
+  },
+  {
+    id: 'gemini-cli',
+    name: 'Gemini CLI',
+    type: 'command',
+    getSnippet: (url) =>
+      `gemini mcp add local-server ${url} --transport http --scope user`,
+  },
+  {
+    id: 'codex',
+    name: 'Codex',
+    type: 'command',
+    getSnippet: (url) => `codex mcp add browseros ${url}`,
+  },
+  {
+    id: 'claude-desktop',
+    name: 'Claude Desktop',
+    type: 'json',
+    fileName: 'claude_desktop_config.json',
+    getSnippet: (url) =>
+      JSON.stringify(
+        {
+          mcpServers: {
+            browserOS: {
+              command: 'npx',
+              args: ['mcp-remote', url],
+            },
+          },
+        },
+        null,
+        2,
+      ),
+  },
+  {
+    id: 'openclaw',
+    name: 'OpenClaw',
+    type: 'json',
+    fileName: 'openclaw.json',
+    getSnippet: (url) =>
+      JSON.stringify(
+        {
+          mcpServers: {
+            browseros: { url },
+          },
+        },
+        null,
+        2,
+      ),
+  },
+]
+
+const CopyButton: FC<{ text: string }> = ({ text }) => {
+  const [copied, setCopied] = useState(false)
+
+  const handleCopy = async () => {
+    try {
+      await navigator.clipboard.writeText(text)
+      setCopied(true)
+      setTimeout(() => setCopied(false), 2000)
+    } catch {
+      // Clipboard API failed
+    }
+  }
+
+  return (
+    <Button
+      variant="ghost"
+      size="icon-sm"
+      onClick={handleCopy}
+      className="shrink-0 text-muted-foreground hover:text-foreground"
+    >
+      {copied ? (
+        <Check className="h-3.5 w-3.5 text-green-600" />
+      ) : (
+        <Copy className="h-3.5 w-3.5" />
+      )}
+    </Button>
+  )
+}
+
+export const QuickSetupSection: FC<QuickSetupSectionProps> = ({
+  serverUrl,
+}) => {
+  if (!serverUrl) return null
+
+  return (
+    <div className="rounded-xl border border-border bg-card p-6 shadow-sm transition-all hover:shadow-md">
+      <div className="flex items-start gap-4">
+        <div className="flex h-12 w-12 shrink-0 items-center justify-center rounded-xl bg-[var(--accent-orange)]/10">
+          <Terminal className="h-6 w-6 text-[var(--accent-orange)]" />
+        </div>
+        <div className="flex-1">
+          <h2 className="mb-1 font-semibold text-xl">Quick Setup</h2>
+          <p className="mb-4 text-muted-foreground text-sm">
+            Copy and run the command for your tool
+          </p>
+
+          <Tabs defaultValue="claude-code">
+            <TabsList className="mb-3 flex-wrap">
+              {clients.map((client) => (
+                <TabsTrigger key={client.id} value={client.id}>
+                  {client.name}
+                </TabsTrigger>
+              ))}
+            </TabsList>
+
+            {clients.map((client) => {
+              const snippet = client.getSnippet(serverUrl)
+              return (
+                <TabsContent key={client.id} value={client.id}>
+                  <div className="space-y-3">
+                    {client.fileName && (
+                      <p className="text-muted-foreground text-xs">
+                        Add to{' '}
+                        <code className="rounded bg-muted px-1 py-0.5 font-mono text-xs">
+                          {client.fileName}
+                        </code>
+                      </p>
+                    )}
+                    <div className="flex items-start gap-2 rounded-lg border border-border bg-background px-3 py-2.5">
+                      <pre className="flex-1 overflow-x-auto whitespace-pre-wrap break-all font-mono text-xs">
+                        {client.type === 'command' && (
+                          <span className="mr-1 text-muted-foreground">$</span>
+                        )}
+                        {snippet}
+                      </pre>
+                      <CopyButton text={snippet} />
+                    </div>
+                  </div>
+                </TabsContent>
+              )
+            })}
+          </Tabs>
+        </div>
+      </div>
+    </div>
+  )
+}

packages/browseros-agent/apps/agent/entrypoints/app/scheduled-tasks/ScheduledTasksList.tsx

@@ -28,7 +28,7 @@ export const ScheduledTasksList: FC<ScheduledTasksListProps> = ({
       <div className="rounded-xl border border-border bg-card p-6 shadow-sm">
         <div className="rounded-lg border border-border border-dashed py-8 text-center">
           <p className="text-muted-foreground text-sm">
-            No scheduled tasks yet. Create one to automate recurring workflows.
+            No scheduled tasks yet. Create one to automate recurring tasks.
           </p>
         </div>
       </div>

packages/browseros-agent/apps/agent/entrypoints/app/skills/SkillsPage.tsx

@@ -238,7 +238,7 @@ const EmptyState: FC<{ onCreateClick: () => void }> = ({ onCreateClick }) => (
       <h3 className="mb-1 font-medium text-lg">No skills yet</h3>
       <p className="mb-5 max-w-sm text-muted-foreground text-sm leading-6">
         Skills teach your agent how to handle repeatable tasks like research,
-        extraction, and structured workflows.
+        extraction, and repeatable browser tasks.
       </p>
       <Button onClick={onCreateClick} size="sm">
         <Plus className="mr-1.5 size-4" />

packages/browseros-agent/apps/agent/entrypoints/app/usage/UsagePage.tsx

@@ -1,5 +1,6 @@
-import { AlertCircle, Clock, Coins, CreditCard, Zap } from 'lucide-react'
+import { AlertCircle, Clock, Coins, Gift, Zap } from 'lucide-react'
 import type { FC } from 'react'
+import { ShareForCredits } from '@/components/referral/ShareForCredits'
 import { Button } from '@/components/ui/button'
 import {
   getCreditBarColor,
@@ -43,8 +44,10 @@ export const UsagePage: FC = () => {
   }
 
   const credits = data?.credits ?? 0
-  const total = data?.dailyLimit ?? 100
+  const total = data?.dailyLimit ?? 50
   const percentage = Math.min((credits / total) * 100, 100)
+  const bonusCredits = Math.max(0, credits - total)
+  const creditsUsed = Math.max(0, total - credits)
 
   return (
     <div className="space-y-6 p-6">
@@ -95,28 +98,52 @@ export const UsagePage: FC = () => {
           <div className="flex items-center gap-2.5 rounded-lg bg-muted/50 px-3 py-2.5">
             <Zap className="h-4 w-4 shrink-0 text-muted-foreground" />
             <div>
-              <p className="font-medium text-xs">Credits used today</p>
-              <p className="text-muted-foreground text-xs">
-                {total - credits} of {total}
-              </p>
+              {bonusCredits > 0 ? (
+                <>
+                  <p className="font-medium text-xs">Bonus credits</p>
+                  <p className="text-muted-foreground text-xs">
+                    +{bonusCredits} from referrals
+                  </p>
+                </>
+              ) : (
+                <>
+                  <p className="font-medium text-xs">Credits used today</p>
+                  <p className="text-muted-foreground text-xs">
+                    {creditsUsed} of {total}
+                  </p>
+                </>
+              )}
             </div>
           </div>
         </div>
       </div>
 
       <div className="rounded-xl border p-5">
+        <div className="mb-4 flex items-center gap-2">
+          <Gift className="h-5 w-5 text-muted-foreground" />
+          <span className="font-semibold text-sm">Earn More Credits</span>
+        </div>
+        <ShareForCredits />
+      </div>
+
+      <div className="rounded-xl border border-[var(--accent-orange)]/30 bg-[var(--accent-orange)]/5 p-5">
         <div className="flex items-center justify-between">
           <div className="flex items-center gap-3">
-            <CreditCard className="h-5 w-5 text-muted-foreground" />
+            <Zap className="h-5 w-5 text-[var(--accent-orange)]" />
             <div>
-              <p className="font-semibold text-sm">Need more credits?</p>
+              <p className="font-semibold text-sm">Want unlimited usage?</p>
               <p className="text-muted-foreground text-xs">
-                Additional credit packages coming soon
+                Add your own LLM provider — no credit limits
               </p>
             </div>
           </div>
-          <Button variant="outline" size="sm" disabled className="opacity-50">
-            Add Credits
+          <Button
+            variant="outline"
+            size="sm"
+            className="border-[var(--accent-orange)] bg-[var(--accent-orange)]/10 text-[var(--accent-orange)] hover:bg-[var(--accent-orange)]/20"
+            asChild
+          >
+            <a href="/app.html#/settings/ai">Add Provider</a>
           </Button>
         </div>
       </div>

packages/browseros-agent/apps/agent/entrypoints/app/workflows/RunWorkflowDialog.tsx

@@ -1,123 +0,0 @@
-import type { UIMessage } from 'ai'
-import { Loader2, RotateCcw, Square, X } from 'lucide-react'
-import type { FC } from 'react'
-import { Button } from '@/components/ui/button'
-import {
-  Dialog,
-  DialogContent,
-  DialogHeader,
-  DialogTitle,
-} from '@/components/ui/dialog'
-
-interface RunWorkflowDialogProps {
-  open: boolean
-  workflowName: string
-  messages: UIMessage[]
-  status: 'streaming' | 'submitted' | 'ready' | 'error'
-  wasCancelled: boolean
-  error: Error | undefined
-  onStop: () => void
-  onRetry: () => void
-  onClose: () => void
-}
-
-export const RunWorkflowDialog: FC<RunWorkflowDialogProps> = ({
-  open,
-  workflowName,
-  messages,
-  status,
-  wasCancelled,
-  error,
-  onStop,
-  onRetry,
-  onClose,
-}) => {
-  const isProcessing = status === 'streaming' || status === 'submitted'
-  const _isComplete = !isProcessing
-
-  const getStatusText = () => {
-    if (status === 'submitted') return 'Starting workflow...'
-    if (status === 'streaming') return 'Running...'
-    if (wasCancelled) return 'Execution cancelled'
-    if (status === 'error') return 'Error occurred'
-    return 'Completed'
-  }
-
-  const getMessageContent = (message: UIMessage) => {
-    return message.parts
-      .filter((part) => part.type === 'text')
-      .map((part) => part.text)
-      .join('')
-  }
-
-  const assistantMessages = messages.filter((m) => m.role === 'assistant')
-
-  return (
-    <Dialog open={open} onOpenChange={() => {}}>
-      <DialogContent
-        className="max-h-[80vh] max-w-2xl overflow-hidden [&>button]:hidden"
-        onInteractOutside={(e) => e.preventDefault()}
-        onEscapeKeyDown={(e) => e.preventDefault()}
-      >
-        <DialogHeader className="flex-row items-center justify-between space-y-0">
-          <DialogTitle className="flex items-center gap-2">
-            {isProcessing && (
-              <Loader2 className="h-4 w-4 animate-spin text-[var(--accent-orange)]" />
-            )}
-            Running: {workflowName}
-          </DialogTitle>
-          <div className="flex items-center gap-2">
-            {isProcessing ? (
-              <Button variant="destructive" size="sm" onClick={onStop}>
-                <Square className="mr-1.5 h-3 w-3" />
-                Stop
-              </Button>
-            ) : (
-              <>
-                <Button variant="secondary" size="sm" onClick={onRetry}>
-                  <RotateCcw className="mr-1.5 h-3 w-3" />
-                  Retry
-                </Button>
-                <Button variant="outline" size="sm" onClick={onClose}>
-                  <X className="mr-1.5 h-3 w-3" />
-                  Close
-                </Button>
-              </>
-            )}
-          </div>
-        </DialogHeader>
-
-        <div className="flex flex-col gap-2">
-          <div className="text-muted-foreground text-sm">{getStatusText()}</div>
-
-          {error && (
-            <div className="rounded-lg border border-destructive/50 bg-destructive/10 p-3 text-destructive text-sm">
-              <div className="font-medium">Error Details</div>
-              <div className="mt-1 whitespace-pre-wrap font-mono text-xs">
-                {error.message}
-              </div>
-            </div>
-          )}
-
-          <div className="max-h-[50vh] overflow-y-auto rounded-lg border border-border bg-muted/30 p-4">
-            {assistantMessages.length === 0 ? (
-              <div className="text-muted-foreground text-sm">
-                {isProcessing
-                  ? 'Waiting for response...'
-                  : 'No output available.'}
-              </div>
-            ) : (
-              <div className="space-y-4">
-                {assistantMessages.map((message) => (
-                  <div key={message.id} className="whitespace-pre-wrap text-sm">
-                    {getMessageContent(message)}
-                  </div>
-                ))}
-              </div>
-            )}
-          </div>
-        </div>
-      </DialogContent>
-    </Dialog>
-  )
-}

packages/browseros-agent/apps/agent/entrypoints/app/workflows/WorkflowCard.tsx

@@ -1,51 +0,0 @@
-import { Pencil, Play, Trash2 } from 'lucide-react'
-import type { FC } from 'react'
-import { NavLink } from 'react-router'
-import { Button } from '@/components/ui/button'
-import type { Workflow } from '@/lib/workflows/workflowStorage'
-
-interface WorkflowCardProps {
-  workflow: Workflow
-  onDelete: () => void
-  onRun: () => void
-}
-
-export const WorkflowCard: FC<WorkflowCardProps> = ({
-  workflow,
-  onDelete,
-  onRun,
-}) => {
-  return (
-    <div className="rounded-xl border border-border bg-card p-4 shadow-sm transition-all hover:border-[var(--accent-orange)]/50 hover:shadow-sm">
-      <div className="flex items-center gap-4">
-        <div className="min-w-0 flex-1">
-          <span className="truncate font-semibold">
-            {workflow.workflowName}
-          </span>
-        </div>
-
-        <div className="flex shrink-0 items-center gap-2">
-          <Button variant="outline" size="sm" onClick={onRun}>
-            <Play className="mr-1.5 h-3 w-3" />
-            Run
-          </Button>
-          <Button asChild variant="outline" size="sm">
-            <NavLink to={`/workflows/create-graph?workflowId=${workflow.id}`}>
-              <Pencil className="mr-1.5 h-3 w-3" />
-              Edit
-            </NavLink>
-          </Button>
-          <Button
-            variant="ghost"
-            size="icon-sm"
-            onClick={onDelete}
-            className="text-muted-foreground hover:bg-destructive/10 hover:text-destructive"
-            aria-label={`Delete ${workflow.workflowName}`}
-          >
-            <Trash2 className="h-4 w-4" />
-          </Button>
-        </div>
-      </div>
-    </div>
-  )
-}

packages/browseros-agent/apps/agent/entrypoints/app/workflows/WorkflowsHeader.tsx

@@ -1,56 +0,0 @@
-import { HelpCircle, Plus, Workflow } from 'lucide-react'
-import type { FC } from 'react'
-import { NavLink } from 'react-router'
-import { Button } from '@/components/ui/button'
-import {
-  Tooltip,
-  TooltipContent,
-  TooltipProvider,
-  TooltipTrigger,
-} from '@/components/ui/tooltip'
-import { workflowsHelpUrl } from '@/lib/constants/productUrls'
-
-export const WorkflowsHeader: FC = () => {
-  return (
-    <div className="rounded-xl border border-border bg-card p-6 shadow-sm transition-all hover:shadow-md">
-      <div className="flex items-start gap-4">
-        <div className="flex h-12 w-12 shrink-0 items-center justify-center rounded-xl bg-[var(--accent-orange)]/10">
-          <Workflow className="h-6 w-6 text-[var(--accent-orange)]" />
-        </div>
-        <div className="flex-1">
-          <div className="mb-1 flex items-center gap-2">
-            <h2 className="font-semibold text-xl">Workflows</h2>
-            <TooltipProvider delayDuration={0}>
-              <Tooltip>
-                <TooltipTrigger asChild>
-                  <a
-                    href={workflowsHelpUrl}
-                    target="_blank"
-                    rel="noopener noreferrer"
-                    className="rounded-full p-1 text-muted-foreground transition-colors hover:bg-muted hover:text-foreground"
-                  >
-                    <HelpCircle className="h-4 w-4" />
-                  </a>
-                </TooltipTrigger>
-                <TooltipContent>Learn more about workflows</TooltipContent>
-              </Tooltip>
-            </TooltipProvider>
-          </div>
-          <p className="text-muted-foreground text-sm">
-            Create and manage browser automation workflows
-          </p>
-        </div>
-        <Button
-          asChild
-          className="border-[var(--accent-orange)] bg-[var(--accent-orange)]/10 text-[var(--accent-orange)] hover:bg-[var(--accent-orange)]/20 hover:text-[var(--accent-orange)]"
-          variant="outline"
-        >
-          <NavLink to="/workflows/create-graph">
-            <Plus className="mr-1.5 h-4 w-4" />
-            New Workflow
-          </NavLink>
-        </Button>
-      </div>
-    </div>
-  )
-}

packages/browseros-agent/apps/agent/entrypoints/app/workflows/WorkflowsList.tsx

@@ -1,40 +0,0 @@
-import type { FC } from 'react'
-import type { Workflow } from '@/lib/workflows/workflowStorage'
-import { WorkflowCard } from './WorkflowCard'
-
-interface WorkflowsListProps {
-  workflows: Workflow[]
-  onDelete: (workflowId: string) => void
-  onRun: (workflowId: string) => void
-}
-
-export const WorkflowsList: FC<WorkflowsListProps> = ({
-  workflows,
-  onDelete,
-  onRun,
-}) => {
-  if (workflows.length === 0) {
-    return (
-      <div className="rounded-xl border border-border bg-card p-6 shadow-sm">
-        <div className="rounded-lg border border-border border-dashed py-8 text-center">
-          <p className="text-muted-foreground text-sm">
-            No workflows yet. Create one to automate browser tasks.
-          </p>
-        </div>
-      </div>
-    )
-  }
-
-  return (
-    <div className="space-y-3">
-      {workflows.map((workflow) => (
-        <WorkflowCard
-          key={workflow.id}
-          workflow={workflow}
-          onDelete={() => onDelete(workflow.id)}
-          onRun={() => onRun(workflow.id)}
-        />
-      ))}
-    </div>
-  )
-}

packages/browseros-agent/apps/agent/entrypoints/app/workflows/WorkflowsPage.tsx

@@ -1,127 +0,0 @@
-import { type FC, useState } from 'react'
-import {
-  AlertDialog,
-  AlertDialogAction,
-  AlertDialogCancel,
-  AlertDialogContent,
-  AlertDialogDescription,
-  AlertDialogFooter,
-  AlertDialogHeader,
-  AlertDialogTitle,
-} from '@/components/ui/alert-dialog'
-import {
-  WORKFLOW_DELETED_EVENT,
-  WORKFLOW_RUN_STARTED_EVENT,
-} from '@/lib/constants/analyticsEvents'
-import { track } from '@/lib/metrics/track'
-import { useRpcClient } from '@/lib/rpc/RpcClientProvider'
-import { sentry } from '@/lib/sentry/sentry'
-import { useWorkflows } from '@/lib/workflows/workflowStorage'
-import { RunWorkflowDialog } from './RunWorkflowDialog'
-import { useRunWorkflow } from './useRunWorkflow'
-import { WorkflowsHeader } from './WorkflowsHeader'
-import { WorkflowsList } from './WorkflowsList'
-
-export const WorkflowsPage: FC = () => {
-  const { workflows, removeWorkflow } = useWorkflows()
-  const rpcClient = useRpcClient()
-
-  const [deleteWorkflowId, setDeleteWorkflowId] = useState<string | null>(null)
-
-  const {
-    isRunning,
-    runningWorkflowName,
-    messages,
-    status,
-    wasCancelled,
-    error,
-    runWorkflow,
-    stopRun,
-    retry,
-    closeDialog,
-  } = useRunWorkflow()
-
-  const handleDelete = (workflowId: string) => {
-    setDeleteWorkflowId(workflowId)
-  }
-
-  const confirmDelete = async () => {
-    if (!deleteWorkflowId) return
-
-    const workflow = workflows.find((w) => w.id === deleteWorkflowId)
-    if (!workflow) return
-
-    try {
-      await rpcClient.graph[':id'].$delete({ param: { id: workflow.codeId } })
-    } catch (error) {
-      sentry.captureException(error, {
-        extra: {
-          message: 'Failed to delete graph from server',
-          codeId: workflow.codeId,
-          workflowId: deleteWorkflowId,
-        },
-      })
-    }
-
-    await removeWorkflow(deleteWorkflowId)
-    setDeleteWorkflowId(null)
-    track(WORKFLOW_DELETED_EVENT)
-  }
-
-  const handleRun = (workflowId: string) => {
-    const workflow = workflows.find((w) => w.id === workflowId)
-    if (workflow) {
-      track(WORKFLOW_RUN_STARTED_EVENT)
-      runWorkflow(workflow.codeId, workflow.workflowName)
-    }
-  }
-
-  const workflowToDelete = deleteWorkflowId
-    ? workflows.find((w) => w.id === deleteWorkflowId)
-    : null
-
-  return (
-    <div className="fade-in slide-in-from-bottom-5 animate-in space-y-6 duration-500">
-      <WorkflowsHeader />
-
-      <WorkflowsList
-        workflows={workflows}
-        onDelete={handleDelete}
-        onRun={handleRun}
-      />
-
-      <AlertDialog
-        open={deleteWorkflowId !== null}
-        onOpenChange={(open) => !open && setDeleteWorkflowId(null)}
-      >
-        <AlertDialogContent>
-          <AlertDialogHeader>
-            <AlertDialogTitle>Delete Workflow</AlertDialogTitle>
-            <AlertDialogDescription>
-              Delete "{workflowToDelete?.workflowName}"? This action cannot be
-              undone.
-            </AlertDialogDescription>
-          </AlertDialogHeader>
-          <AlertDialogFooter>
-            <AlertDialogCancel>Cancel</AlertDialogCancel>
-            <AlertDialogAction onClick={confirmDelete}>
-              Delete
-            </AlertDialogAction>
-          </AlertDialogFooter>
-        </AlertDialogContent>
-      </AlertDialog>
-
-      <RunWorkflowDialog
-        open={isRunning}
-        workflowName={runningWorkflowName}
-        messages={messages}
-        status={status}
-        wasCancelled={wasCancelled}
-        error={error}
-        onStop={stopRun}
-        onRetry={retry}
-        onClose={closeDialog}
-      />
-    </div>
-  )
-}

packages/browseros-agent/apps/agent/entrypoints/app/workflows/WorkflowsPageWrapper.tsx

@@ -1,10 +0,0 @@
-import { type FC, Suspense } from 'react'
-import { WorkflowsPage } from './WorkflowsPage'
-
-export const WorkflowsPageWrapper: FC = () => {
-  return (
-    <Suspense fallback={<div className="h-screen w-screen bg-background" />}>
-      <WorkflowsPage />
-    </Suspense>
-  )
-}

packages/browseros-agent/apps/agent/entrypoints/app/workflows/useRunWorkflow.ts

@@ -1,155 +0,0 @@
-import { useChat } from '@ai-sdk/react'
-import { DefaultChatTransport } from 'ai'
-import { compact } from 'es-toolkit/array'
-import { useEffect, useRef, useState } from 'react'
-import { useChatRefs } from '@/entrypoints/sidepanel/index/useChatRefs'
-import { useAgentServerUrl } from '@/lib/browseros/useBrowserOSProviders'
-import {
-  WORKFLOW_RUN_COMPLETED_EVENT,
-  WORKFLOW_RUN_RETRIED_EVENT,
-  WORKFLOW_RUN_STOPPED_EVENT,
-} from '@/lib/constants/analyticsEvents'
-import { track } from '@/lib/metrics/track'
-
-type WorkflowMessageMetadata = {
-  window?: chrome.windows.Window
-}
-
-export const useRunWorkflow = () => {
-  const [isRunning, setIsRunning] = useState(false)
-  const [runningWorkflowName, setRunningWorkflowName] = useState<string>('')
-  const [wasCancelled, setWasCancelled] = useState(false)
-  const codeIdRef = useRef<string | undefined>(undefined)
-
-  const { baseUrl: agentServerUrl } = useAgentServerUrl()
-
-  const {
-    selectedLlmProviderRef,
-    enabledMcpServersRef,
-    enabledCustomServersRef,
-    personalizationRef,
-  } = useChatRefs()
-
-  const agentUrlRef = useRef(agentServerUrl)
-
-  useEffect(() => {
-    agentUrlRef.current = agentServerUrl
-  }, [agentServerUrl])
-
-  const { sendMessage, stop, status, messages, setMessages, error } = useChat({
-    transport: new DefaultChatTransport({
-      prepareSendMessagesRequest: async ({ messages }) => {
-        const lastMessage = messages[messages.length - 1]
-        const metadata = lastMessage.metadata as
-          | WorkflowMessageMetadata
-          | undefined
-        const provider = selectedLlmProviderRef.current
-        const enabledMcpServers = enabledMcpServersRef.current
-        const customMcpServers = enabledCustomServersRef.current
-
-        return {
-          api: `${agentUrlRef.current}/graph/${codeIdRef.current}/run`,
-          body: {
-            provider: provider?.type,
-            providerType: provider?.type,
-            providerName: provider?.name,
-            model: provider?.modelId ?? 'browseros',
-            contextWindowSize: provider?.contextWindow,
-            temperature: provider?.temperature,
-            resourceName: provider?.resourceName,
-            accessKeyId: provider?.accessKeyId,
-            secretAccessKey: provider?.secretAccessKey,
-            region: provider?.region,
-            sessionToken: provider?.sessionToken,
-            apiKey: provider?.apiKey,
-            baseUrl: provider?.baseUrl,
-            browserContext: {
-              windowId: metadata?.window?.id,
-              activeTab: metadata?.window?.tabs?.[0],
-              enabledMcpServers: compact(enabledMcpServers),
-              customMcpServers,
-            },
-            userSystemPrompt: personalizationRef.current,
-            supportsImages: provider?.supportsImages,
-          },
-        }
-      },
-    }),
-  })
-
-  const previousStatus = useRef(status)
-  useEffect(() => {
-    const wasProcessing =
-      previousStatus.current === 'streaming' ||
-      previousStatus.current === 'submitted'
-    const justFinished =
-      wasProcessing && (status === 'ready' || status === 'error')
-
-    if (justFinished && isRunning) {
-      track(WORKFLOW_RUN_COMPLETED_EVENT, {
-        status: wasCancelled
-          ? 'cancelled'
-          : status === 'error'
-            ? 'failed'
-            : 'completed',
-      })
-    }
-    previousStatus.current = status
-  }, [status, isRunning, wasCancelled])
-
-  const startWorkflowRun = async () => {
-    setMessages([])
-    setWasCancelled(false)
-
-    const backgroundWindow = await chrome.windows.create({
-      url: 'chrome://newtab',
-      focused: true,
-      type: 'normal',
-    })
-
-    sendMessage({
-      text: 'Run the workflow.',
-      metadata: {
-        window: backgroundWindow,
-      },
-    })
-  }
-
-  const runWorkflow = async (codeId: string, workflowName: string) => {
-    codeIdRef.current = codeId
-    setRunningWorkflowName(workflowName)
-    setIsRunning(true)
-    await startWorkflowRun()
-  }
-
-  const stopRun = () => {
-    track(WORKFLOW_RUN_STOPPED_EVENT)
-    setWasCancelled(true)
-    stop()
-  }
-
-  const retry = async () => {
-    track(WORKFLOW_RUN_RETRIED_EVENT)
-    await startWorkflowRun()
-  }
-
-  const closeDialog = () => {
-    setIsRunning(false)
-    setRunningWorkflowName('')
-    setWasCancelled(false)
-    setMessages([])
-  }
-
-  return {
-    isRunning,
-    runningWorkflowName,
-    messages,
-    status,
-    wasCancelled,
-    error,
-    runWorkflow,
-    stopRun,
-    retry,
-    closeDialog,
-  }
-}

packages/browseros-agent/apps/agent/entrypoints/newtab/index/NewTabChat.tsx

@@ -169,8 +169,15 @@ export const NewTabChat: FC = () => {
             onDismissJtbdPopup={() => {}}
           />
         )}
-        {agentUrlError && <ChatError error={agentUrlError} />}
-        {chatError && <ChatError error={chatError} />}
+        {agentUrlError && (
+          <ChatError
+            error={agentUrlError}
+            providerType={selectedProvider?.type}
+          />
+        )}
+        {chatError && (
+          <ChatError error={chatError} providerType={selectedProvider?.type} />
+        )}
       </main>
 
       <div className="mx-auto w-full max-w-3xl flex-shrink-0 px-4 pb-2">

packages/browseros-agent/apps/agent/entrypoints/newtab/index/tips.ts

@@ -45,7 +45,7 @@ export const TIPS: Tip[] = [
   },
   {
     id: 'mcp-servers',
-    text: 'Add MCP servers for Google Calendar, Gmail, Notion, and more to build multi-service workflows.',
+    text: 'Add MCP servers for Google Calendar, Gmail, Notion, and more to power multi-service automations.',
   },
   {
     id: 'skills',
@@ -75,10 +75,6 @@ export const TIPS: Tip[] = [
     id: 'at-mention-tabs',
     text: 'Type @ in the search bar to mention and attach open tabs as context for your AI queries.',
   },
-  {
-    id: 'workflows',
-    text: 'For complex repeatable tasks, build visual Workflows instead of one-off prompts for consistent results.',
-  },
   {
     id: 'mode-selection',
     text: 'Use Chat mode for read-only operations like questions and summaries, and Agent mode for multi-step browser tasks.',

packages/browseros-agent/apps/agent/entrypoints/onboarding/features/Features.tsx

@@ -5,7 +5,6 @@ import {
   Bot,
   Code2,
   FolderOpen,
-  GitBranch,
   LinkIcon,
   Plug,
   SplitSquareHorizontal,
@@ -23,7 +22,6 @@ import {
   COWORK_DEMO_URL,
   MCP_SERVER_DEMO_URL,
   SPLIT_VIEW_GIF_URL,
-  WORKFLOWS_DEMO_URL,
 } from '@/lib/constants/mediaUrls'
 import {
   discordUrl,
@@ -44,7 +42,7 @@ const features: Feature[] = [
     description:
       'Describe any task and watch BrowserOS execute it—clicking, typing, and navigating for you.',
     detailedDescription:
-      'The BrowserOS Agent turns your words into browser actions. Describe what you need in plain English—fill out this form, extract data from that page, navigate through these steps—and the agent handles the rest. It clicks buttons, types text, navigates between pages, and completes multi-step workflows automatically. Everything runs locally on your machine with your own API keys, so your data stays private.',
+      'The BrowserOS Agent turns your words into browser actions. Describe what you need in plain English—fill out this form, extract data from that page, navigate through these steps—and the agent handles the rest. It clicks buttons, types text, navigates between pages, and completes multi-step browser tasks automatically. Everything runs locally on your machine with your own API keys, so your data stays private.',
     highlights: [
       'Multi-tab execution — run agents in multiple tabs simultaneously',
       'Smart navigation — automatically finds and interacts with page elements',
@@ -75,24 +73,6 @@ const features: Feature[] = [
     gridClass: 'md:col-span-1',
     videoUrl: MCP_SERVER_DEMO_URL,
   },
-  {
-    id: 'workflows',
-    Icon: GitBranch,
-    tag: 'AUTOMATION',
-    title: 'Visual Workflows',
-    description:
-      'Build reliable, repeatable automations with a visual graph builder.',
-    detailedDescription:
-      'Workflows turn complex browser tasks into reliable, reusable automations. Instead of hoping the agent figures out the right steps each time, you define the exact sequence in a visual graph. Describe what you want in chat, and the workflow agent generates the graph. Add loops, conditionals, and parallel branches. Save workflows and run them on-demand whenever you need.',
-    highlights: [
-      'Chat-to-graph — describe your automation and get a visual workflow',
-      'Parallel execution — run multiple branches simultaneously',
-      'Loops & conditionals — handle complex logic with flow control',
-      'Save & reuse — run saved workflows on-demand, daily, or weekly',
-    ],
-    gridClass: 'md:col-span-1',
-    videoUrl: WORKFLOWS_DEMO_URL || undefined,
-  },
   {
     id: 'cowork',
     Icon: FolderOpen,

packages/browseros-agent/apps/agent/entrypoints/sidepanel/history/ChatHistory.tsx

@@ -32,6 +32,7 @@ const RemoteChatHistory: FC<{ userId: string }> = ({ userId }) => {
   const {
     data: graphqlData,
     isLoading: isLoadingConversations,
+    isFetching,
     hasNextPage,
     isFetchingNextPage,
     fetchNextPage,
@@ -112,6 +113,7 @@ const RemoteChatHistory: FC<{ userId: string }> = ({ userId }) => {
       hasNextPage={hasNextPage}
       isFetchingNextPage={isFetchingNextPage}
       onLoadMore={fetchNextPage}
+      isRefreshing={isFetching && !isLoadingConversations}
     />
   )
 }

packages/browseros-agent/apps/agent/entrypoints/sidepanel/history/components/ConversationList.tsx

@@ -12,6 +12,7 @@ interface ConversationListProps {
   hasNextPage?: boolean
   isFetchingNextPage?: boolean
   onLoadMore?: () => void
+  isRefreshing?: boolean
 }
 
 export const ConversationList: FC<ConversationListProps> = ({
@@ -21,6 +22,7 @@ export const ConversationList: FC<ConversationListProps> = ({
   hasNextPage,
   isFetchingNextPage,
   onLoadMore,
+  isRefreshing,
 }) => {
   const loadMoreRef = useRef<HTMLDivElement>(null)
 
@@ -57,6 +59,12 @@ export const ConversationList: FC<ConversationListProps> = ({
   return (
     <main className="mt-4 flex h-full flex-1 flex-col space-y-4 overflow-y-auto">
       <div className="w-full p-3">
+        {isRefreshing && (
+          <div className="flex items-center justify-center gap-2 pb-3 text-muted-foreground text-xs">
+            <Loader2 className="h-3 w-3 animate-spin" />
+            <span>Fetching latest conversations</span>
+          </div>
+        )}
         {!hasConversations ? (
           <div className="flex flex-col items-center justify-center py-12 text-center">
             <MessageSquare className="mb-3 h-10 w-10 text-muted-foreground/50" />

packages/browseros-agent/apps/agent/entrypoints/sidepanel/history/graphql/chatHistoryDocument.ts

@@ -11,7 +11,7 @@ export const GetConversationsForHistoryDocument = graphql(`
       nodes {
         rowId
         lastMessagedAt
-        conversationMessages(last: 5, orderBy: ORDER_INDEX_ASC) {
+        conversationMessages(first: 2, orderBy: ORDER_INDEX_DESC) {
           nodes {
             message
           }

packages/browseros-agent/apps/agent/entrypoints/sidepanel/index/Chat.tsx

@@ -36,6 +36,7 @@ export const Chat = () => {
     stop,
     agentUrlError,
     chatError,
+    selectedProvider,
     getActionForMessage,
     liked,
     onClickLike,
@@ -223,8 +224,15 @@ export const Chat = () => {
             onDismissJtbdPopup={onDismissJtbdPopup}
           />
         )}
-        {agentUrlError && <ChatError error={agentUrlError} />}
-        {chatError && <ChatError error={chatError} />}
+        {agentUrlError && (
+          <ChatError
+            error={agentUrlError}
+            providerType={selectedProvider?.type}
+          />
+        )}
+        {chatError && (
+          <ChatError error={chatError} providerType={selectedProvider?.type} />
+        )}
       </main>
 
       <ChatFooter

packages/browseros-agent/apps/agent/entrypoints/sidepanel/index/ChatError.tsx

@@ -1,43 +1,83 @@
 import { AlertCircle, RefreshCw } from 'lucide-react'
 import type { FC } from 'react'
-// import { useMemo } from 'react'
+import { useMemo } from 'react'
+import { ShareForCredits } from '@/components/referral/ShareForCredits'
 import { Button } from '@/components/ui/button'
-import {
-  KIMI_RATE_LIMIT_DOCS_CLICKED_EVENT,
-  KIMI_RATE_LIMIT_PLATFORM_CLICKED_EVENT,
-} from '@/lib/constants/analyticsEvents'
-import { track } from '@/lib/metrics/track'
+import type { ProviderType } from '@/lib/llm-providers/types'
 
-// --- Commented out for Kimi partnership launch (restore after) ---
-// const SURVEY_DIRECTIONS = [
-//   'competitor',
-//   'switching',
-//   'workflow',
-//   'activation',
-// ] as const
-//
-// function pickRandomDirection(): string {
-//   return SURVEY_DIRECTIONS[Math.floor(Math.random() * SURVEY_DIRECTIONS.length)]
-// }
-// --- End commented out survey code ---
+const SURVEY_DIRECTIONS = [
+  'competitor',
+  'switching',
+  'workflow',
+  'activation',
+] as const
+
+function pickRandomDirection(): string {
+  return SURVEY_DIRECTIONS[Math.floor(Math.random() * SURVEY_DIRECTIONS.length)]
+}
+
+const PROVIDER_DISPLAY_NAMES: Record<ProviderType, string> = {
+  anthropic: 'Anthropic',
+  openai: 'OpenAI',
+  'openai-compatible': 'OpenAI-compatible',
+  google: 'Google',
+  openrouter: 'OpenRouter',
+  azure: 'Azure OpenAI',
+  ollama: 'Ollama',
+  lmstudio: 'LM Studio',
+  bedrock: 'AWS Bedrock',
+  browseros: 'BrowserOS',
+  moonshot: 'Moonshot',
+  'chatgpt-pro': 'ChatGPT Pro',
+  'github-copilot': 'GitHub Copilot',
+  'qwen-code': 'Qwen Code',
+  minimax: 'MiniMax',
+}
+
+const UPSTREAM_RATE_LIMIT_PATTERNS: Array<string | RegExp> = [
+  'usage limit',
+  'rate limit',
+  'rate-limit',
+  'quota',
+  /\b429\b/,
+  'too many requests',
+  'insufficient_quota',
+]
+
+function getProviderDisplayName(providerType?: string): string {
+  if (providerType && providerType in PROVIDER_DISPLAY_NAMES) {
+    return PROVIDER_DISPLAY_NAMES[providerType as ProviderType]
+  }
+  return 'your provider'
+}
+
+function stripRetryPrefix(message: string): string {
+  return message.replace(/^Failed after \d+ attempts?\.\s*Last error:\s*/i, '')
+}
 
 interface ChatErrorProps {
   error: Error
   onRetry?: () => void
+  providerType?: string
 }
 
-function parseErrorMessage(message: string): {
+function parseErrorMessage(
+  message: string,
+  providerType?: string,
+): {
   text: string
   url?: string
   isRateLimit?: boolean
   isCreditsExhausted?: boolean
   isConnectionError?: boolean
+  isUpstreamRateLimit?: boolean
+  providerName?: string
 } {
-  // Detect MCP server connection failures
-  if (
-    (message.includes('Failed to fetch') || message.includes('fetch failed')) &&
-    message.includes('127.0.0.1')
-  ) {
+  const isBrowserosProvider = providerType === 'browseros'
+
+  // All chat requests go through the local BrowserOS agent server, so any
+  // fetch failure is always a local connection issue.
+  if (message.includes('Failed to fetch') || message.includes('fetch failed')) {
     return {
       text: 'Unable to connect to BrowserOS agent. Follow below instructions.',
       url: 'https://docs.browseros.com/troubleshooting/connection-issues',
@@ -45,10 +85,12 @@ function parseErrorMessage(message: string): {
     }
   }
 
-  // Detect credit exhaustion from gateway
+  // Detect credit exhaustion from gateway (BrowserOS provider only)
   if (
-    message.includes('CREDITS_EXHAUSTED') ||
-    message.includes('Daily credits exhausted')
+    isBrowserosProvider &&
+    (message.includes('CREDITS_EXHAUSTED') ||
+      message.includes('Credits exhausted') ||
+      message.includes('Daily credits exhausted'))
   ) {
     return {
       text: 'Daily credits exhausted. Credits reset at midnight UTC.',
@@ -58,8 +100,11 @@ function parseErrorMessage(message: string): {
     }
   }
 
-  // Detect BrowserOS rate limit (unique pattern, no provider uses this)
-  if (message.includes('BrowserOS LLM daily limit reached')) {
+  // Detect BrowserOS rate limit (BrowserOS provider only)
+  if (
+    isBrowserosProvider &&
+    message.includes('BrowserOS LLM daily limit reached')
+  ) {
     return {
       text: 'Add your own API key for unlimited usage.',
       url: 'https://dub.sh/browseros-usage-limit',
@@ -67,6 +112,28 @@ function parseErrorMessage(message: string): {
     }
   }
 
+  // Detect rate limits from non-BrowserOS upstream providers. Users were
+  // confused that a quota/429 from OpenAI/Anthropic/etc. looked like a
+  // BrowserOS-imposed limit.
+  if (!isBrowserosProvider && providerType) {
+    const lower = message.toLowerCase()
+    const matchesRateLimit = UPSTREAM_RATE_LIMIT_PATTERNS.some((p) =>
+      typeof p === 'string' ? lower.includes(p) : p.test(lower),
+    )
+    if (matchesRateLimit) {
+      let stripped = stripRetryPrefix(message).trim()
+      try {
+        const parsed = JSON.parse(stripped)
+        if (parsed?.error?.message) stripped = parsed.error.message
+      } catch {}
+      return {
+        text: stripped || message,
+        isUpstreamRateLimit: true,
+        providerName: getProviderDisplayName(providerType),
+      }
+    }
+  }
+
   let text = message
   try {
     const parsed = JSON.parse(message)
@@ -83,19 +150,33 @@ function parseErrorMessage(message: string): {
   return { text: text || 'An unexpected error occurred', url }
 }
 
-export const ChatError: FC<ChatErrorProps> = ({ error, onRetry }) => {
-  const { text, url, isRateLimit, isCreditsExhausted, isConnectionError } =
-    parseErrorMessage(error.message)
+export const ChatError: FC<ChatErrorProps> = ({
+  error,
+  onRetry,
+  providerType,
+}) => {
+  const {
+    text,
+    url,
+    isRateLimit,
+    isCreditsExhausted,
+    isConnectionError,
+    isUpstreamRateLimit,
+    providerName,
+  } = parseErrorMessage(error.message, providerType)
 
-  // --- Commented out for Kimi partnership launch (restore after) ---
-  // const surveyUrl = useMemo(
-  //   () =>
-  //     `/app.html?page=survey&maxTurns=20&experimentId=daily_limit_${pickRandomDirection()}#/settings/survey`,
-  //   [],
-  // )
-  // --- End commented out survey code ---
+  const surveyUrl = useMemo(
+    () =>
+      `/app.html?page=survey&maxTurns=20&experimentId=daily_limit_${pickRandomDirection()}#/settings/survey`,
+    [],
+  )
 
   const getTitle = () => {
+    if (isUpstreamRateLimit) {
+      return providerName && providerName !== 'your provider'
+        ? `${providerName} rate limit reached`
+        : 'Upstream rate limit reached'
+    }
     if (isRateLimit) return 'Daily limit reached'
     if (isConnectionError) return 'Connection failed'
     return 'Something went wrong'
@@ -108,6 +189,14 @@ export const ChatError: FC<ChatErrorProps> = ({ error, onRetry }) => {
         <span className="font-medium text-sm">{getTitle()}</span>
       </div>
       <p className="text-center text-destructive text-xs">{text}</p>
+      {isUpstreamRateLimit && (
+        <p className="text-center text-muted-foreground text-xs">
+          This is a limit from{' '}
+          <span className="font-medium">{providerName}</span>
+          {' — your configured model provider — not BrowserOS. Check your '}
+          provider's dashboard for quota, usage, or billing details.
+        </p>
+      )}
       {isConnectionError && url && (
         <a
           href={url}
@@ -118,8 +207,24 @@ export const ChatError: FC<ChatErrorProps> = ({ error, onRetry }) => {
           View troubleshooting guide
         </a>
       )}
-      {/* --- Commented out for Kimi partnership launch (restore after) ---
-      {isRateLimit && (
+      {isCreditsExhausted && (
+        <>
+          <div className="w-full border-border/50 border-t pt-3">
+            <ShareForCredits compact />
+          </div>
+          {url && (
+            <a
+              href={url}
+              target="_blank"
+              rel="noopener noreferrer"
+              className="text-muted-foreground text-xs underline hover:text-foreground"
+            >
+              View Usage & Billing
+            </a>
+          )}
+        </>
+      )}
+      {isRateLimit && !isCreditsExhausted && (
         <p className="text-muted-foreground text-xs">
           <a
             href={url}
@@ -140,43 +245,6 @@ export const ChatError: FC<ChatErrorProps> = ({ error, onRetry }) => {
           </a>
         </p>
       )}
-      --- End commented out survey code --- */}
-      {isCreditsExhausted && url && (
-        <a
-          href={url}
-          target="_blank"
-          rel="noopener noreferrer"
-          className="text-muted-foreground text-xs underline hover:text-foreground"
-        >
-          View Usage & Billing
-        </a>
-      )}
-      {isRateLimit && !isCreditsExhausted && (
-        <div className="flex flex-col items-center gap-1">
-          <p className="text-muted-foreground text-xs">
-            {/* biome-ignore lint/a11y/useValidAnchor: link with click tracking */}
-            <a
-              href="https://docs.browseros.com/features/bring-your-own-llm#kimi-k2-5-%E2%80%94-in-partnership-with-moonshot-ai"
-              target="_blank"
-              rel="noopener noreferrer"
-              className="underline hover:text-foreground"
-              onClick={() => track(KIMI_RATE_LIMIT_DOCS_CLICKED_EVENT)}
-            >
-              Learn how to get a Kimi API key
-            </a>
-            {' or '}
-            <a
-              href="https://platform.moonshot.ai"
-              target="_blank"
-              rel="noopener noreferrer"
-              className="underline hover:text-foreground"
-              onClick={() => track(KIMI_RATE_LIMIT_PLATFORM_CLICKED_EVENT)}
-            >
-              get your API key
-            </a>
-          </p>
-        </div>
-      )}
       {onRetry && (
         <Button
           variant="outline"

packages/browseros-agent/apps/agent/entrypoints/sidepanel/index/useChatSession.ts

@@ -76,8 +76,6 @@ export interface ChatSessionOptions {
   isIntegrationsSynced?: boolean
 }
 
-const NEWTAB_SYSTEM_PROMPT = `IMPORTANT: The user is chatting from the New Tab page. When performing browser actions, ALWAYS open content in a NEW TAB rather than navigating the current tab. The user's new tab page should remain accessible.`
-
 export const useChatSession = (options?: ChatSessionOptions) => {
   const {
     selectedLlmProviderRef,
@@ -344,12 +342,8 @@ export const useChatSession = (options?: ChatSessionOptions) => {
             reasoningEffort: provider?.reasoningEffort,
             reasoningSummary: provider?.reasoningSummary,
             browserContext,
-            userSystemPrompt:
-              options?.origin === 'newtab'
-                ? [personalizationRef.current, NEWTAB_SYSTEM_PROMPT]
-                    .filter(Boolean)
-                    .join('\n\n')
-                : personalizationRef.current,
+            origin: options?.origin ?? 'sidepanel',
+            userSystemPrompt: personalizationRef.current,
             userWorkingDir: workingDirRef.current,
             supportsImages: provider?.supportsImages,
             previousConversation,
@@ -567,9 +561,11 @@ export const useChatSession = (options?: ChatSessionOptions) => {
   }, [])
 
   const handleSelectProvider = (provider: Provider) => {
+    const fullProvider = llmProviders.find((p) => p.id === provider.id)
     track(PROVIDER_SELECTED_EVENT, {
       provider_id: provider.id,
       provider_type: provider.type,
+      model_id: fullProvider?.modelId,
     })
     setDefaultProvider(provider.id)
   }

packages/browseros-agent/apps/agent/lib/analytics/identify.ts

@@ -0,0 +1,23 @@
+import { sentry } from '../sentry/sentry'
+import { posthog } from './posthog'
+
+/**
+ * Identify the current user across all analytics and error tracking services.
+ * Call this when the user logs in or when a stored session is restored.
+ */
+export function identify(user: { id: string; email?: string; name?: string }) {
+  sentry.setUser({ id: user.id, email: user.email })
+  posthog.identify(user.id, {
+    email: user.email,
+    name: user.name,
+  })
+}
+
+/**
+ * Clear user identity across all services.
+ * Call this when the user logs out.
+ */
+export function resetIdentity() {
+  sentry.setUser(null)
+  posthog.reset()
+}

packages/browseros-agent/apps/agent/lib/auth/AuthProvider.tsx

@@ -1,5 +1,6 @@
 import type { FC, PropsWithChildren } from 'react'
 import { useEffect } from 'react'
+import { identify, resetIdentity } from '@/lib/analytics/identify'
 import { useSession } from './auth-client'
 import { useSessionInfo } from './sessionStorage'
 
@@ -14,6 +15,16 @@ export const AuthProvider: FC<PropsWithChildren> = ({ children }) => {
         session: data?.session,
         user: data?.user,
       })
+
+      if (data?.user?.id) {
+        identify({
+          id: data.user.id,
+          email: data.user.email,
+          name: data.user.name || undefined,
+        })
+      } else {
+        resetIdentity()
+      }
     }
   }, [data, isPending])
 

packages/browseros-agent/apps/agent/lib/browseros/capabilities.ts

@@ -31,8 +31,6 @@ export enum Feature {
   WORKSPACE_FOLDER_SUPPORT = 'WORKSPACE_FOLDER_SUPPORT',
   // Proxy server support
   PROXY_SUPPORT = 'PROXY_SUPPORT',
-  // Workflows feature
-  WORKFLOW_SUPPORT = 'WORKFLOW_SUPPORT',
   // previousConversation as structured array (older servers only accept string)
   PREVIOUS_CONVERSATION_ARRAY = 'PREVIOUS_CONVERSATION_ARRAY',
   // Soul page: agent personality viewer and editor
@@ -73,7 +71,6 @@ const FEATURE_CONFIG: { [K in Feature]: FeatureConfig } = {
   [Feature.CUSTOMIZATION_SUPPORT]: { minBrowserOSVersion: '0.36.1.0' },
   [Feature.WORKSPACE_FOLDER_SUPPORT]: { minBrowserOSVersion: '0.36.4.0' },
   [Feature.PROXY_SUPPORT]: { minBrowserOSVersion: '0.39.0.1' },
-  [Feature.WORKFLOW_SUPPORT]: { minServerVersion: '0.0.41' },
   [Feature.PREVIOUS_CONVERSATION_ARRAY]: { minServerVersion: '0.0.64' },
   [Feature.SOUL_SUPPORT]: { minServerVersion: '0.0.67' },
   [Feature.NEWTAB_CHAT_SUPPORT]: { minBrowserOSVersion: '0.40.0.0' },

packages/browseros-agent/apps/agent/lib/constants/analyticsEvents.ts

@@ -1,19 +1,6 @@
 /** @public */
 export const MESSAGE_LIKE_EVENT = 'ui.message.like'
 
-export const GRAPH_MESSAGE_LIKE_EVENT = 'settings.graph.message.like'
-
-export const GRAPH_MESSAGE_DISLIKE_EVENT = 'settings.graph.message.dislike'
-
-/** @public */
-export const NEW_GRAPH_CREATED_EVENT = 'settings.graph.created'
-
-/** @public */
-export const GRAPH_SAVED_EVENT = 'settings.graph.saved'
-
-/** @public */
-export const GRAPH_UPDATED_EVENT = 'settings.graph.updated'
-
 /** @public */
 export const MESSAGE_DISLIKE_EVENT = 'ui.message.dislike'
 
@@ -29,6 +16,12 @@ export const CONVERSATION_RESET_EVENT = 'ui.conversation.reset'
 /** @public */
 export const AI_PROVIDER_ADDED_EVENT = 'settings.ai_provider.added'
 
+/** @public */
+export const AI_PROVIDER_UPDATED_EVENT = 'settings.ai_provider.updated'
+
+/** @public */
+export const MODEL_SELECTED_EVENT = 'settings.model.selected'
+
 /** @public */
 export const CHATGPT_PRO_OAUTH_STARTED_EVENT =
   'settings.chatgpt_pro.oauth_started'
@@ -67,6 +60,10 @@ export const QWEN_CODE_OAUTH_DISCONNECTED_EVENT =
 /** @public */
 export const HUB_PROVIDER_ADDED_EVENT = 'settings.hub_provider.added'
 
+/** @public */
+export const MCP_PROMO_BANNER_CLICKED_EVENT =
+  'settings.mcp_promo_banner.clicked'
+
 /** @public */
 export const MCP_EXTERNAL_ACCESS_ENABLED_EVENT =
   'settings.mcp_external_access.enabled'
@@ -168,21 +165,6 @@ export const NEWTAB_VOICE_TRANSCRIPTION_COMPLETED_EVENT =
 /** @public */
 export const NEWTAB_VOICE_ERROR_EVENT = 'newtab.voice.error'
 
-/** @public */
-export const WORKFLOW_DELETED_EVENT = 'settings.workflow.deleted'
-
-/** @public */
-export const WORKFLOW_RUN_STARTED_EVENT = 'settings.workflow.run_started'
-
-/** @public */
-export const WORKFLOW_RUN_STOPPED_EVENT = 'settings.workflow.run_stopped'
-
-/** @public */
-export const WORKFLOW_RUN_RETRIED_EVENT = 'settings.workflow.run_retried'
-
-/** @public */
-export const WORKFLOW_RUN_COMPLETED_EVENT = 'settings.workflow.run_completed'
-
 /** @public */
 export const SIDEPANEL_AI_TRIGGERED_EVENT = 'sidepanel.ai.triggered'
 
@@ -298,14 +280,6 @@ export const KIMI_API_KEY_CONFIGURED_EVENT = 'settings.kimi.api_key_configured'
 export const KIMI_API_KEY_GUIDE_CLICKED_EVENT =
   'settings.kimi.api_key_guide_clicked'
 
-/** @public */
-export const KIMI_RATE_LIMIT_DOCS_CLICKED_EVENT =
-  'ui.rate_limit.kimi_docs_clicked'
-
-/** @public */
-export const KIMI_RATE_LIMIT_PLATFORM_CLICKED_EVENT =
-  'ui.rate_limit.moonshot_platform_clicked'
-
 /** @public */
 export const SIDEPANEL_VOICE_RECORDING_STARTED_EVENT =
   'sidepanel.voice.recording_started'

packages/browseros-agent/apps/agent/lib/constants/productUrls.ts

@@ -49,11 +49,6 @@ export const productVideoUrl = 'https://youtu.be/J-lFhTP-7is'
  */
 export const productRepositoryShortUrl = 'https://git.new/browseros'
 
-/**
- * @public
- */
-export const workflowsHelpUrl = 'https://docs.browseros.com/features/workflows'
-
 /**
  * @public
  */

packages/browseros-agent/apps/agent/lib/credits/browseros-id.ts

@@ -0,0 +1,15 @@
+import { getBrowserOSAdapter } from '@/lib/browseros/adapter'
+import { BROWSEROS_PREFS } from '@/lib/browseros/prefs'
+
+// TODO(credits-identity): temporary shim — reuses the BrowserOS metrics
+// install_id as the credits/referral identifier. Replace with a dedicated
+// identity module once we have one.
+export async function getBrowserosId(): Promise<string> {
+  const adapter = getBrowserOSAdapter()
+  const pref = await adapter.getPref(BROWSEROS_PREFS.INSTALL_ID)
+  const id = pref.value
+  if (typeof id !== 'string' || id.length === 0) {
+    throw new Error('browseros.metrics_install_id is not set')
+  }
+  return id
+}

packages/browseros-agent/apps/agent/lib/credits/useCredits.ts

@@ -1,20 +1,25 @@
+import { EXTERNAL_URLS } from '@browseros/shared/constants/urls'
 import { useQuery, useQueryClient } from '@tanstack/react-query'
-import { getAgentServerUrl } from '@/lib/browseros/helpers'
+import { getBrowserosId } from './browseros-id'
 
 export interface CreditsInfo {
   credits: number
   dailyLimit: number
   lastResetAt?: string
+  browserosId?: string
 }
 
 const CREDITS_QUERY_KEY = ['credits']
 
 async function fetchCredits(): Promise<CreditsInfo> {
-  const baseUrl = await getAgentServerUrl()
-  const response = await fetch(`${baseUrl}/credits`)
+  const browserosId = await getBrowserosId()
+  const response = await fetch(
+    `${EXTERNAL_URLS.CREDITS_GATEWAY}/credits/${browserosId}`,
+  )
   if (!response.ok)
     throw new Error(`Failed to fetch credits: ${response.status}`)
-  return response.json()
+  const data = (await response.json()) as CreditsInfo
+  return { ...data, browserosId }
 }
 
 export function useCredits() {

packages/browseros-agent/apps/agent/lib/env.ts

@@ -6,7 +6,6 @@ const EnvSchema = z.object({
   VITE_PUBLIC_POSTHOG_HOST: z.string().optional(),
   VITE_PUBLIC_SENTRY_DSN: z.string().optional(),
   VITE_PUBLIC_BROWSEROS_API: z.string().optional(),
-  VITE_PUBLIC_KIMI_LAUNCH: z.string().optional(),
   PROD: z.boolean(),
 })
 

packages/browseros-agent/apps/agent/lib/feature-flags/kimi-launch.ts

@@ -1,14 +0,0 @@
-import { env } from '@/lib/env'
-
-const ENABLED_VALUES = new Set(['1', 'true', 'yes', 'on'])
-
-function parseKimiLaunchFlag(value: string | undefined): boolean {
-  if (!value) return false
-  return ENABLED_VALUES.has(value.trim().toLowerCase())
-}
-
-const kimiLaunchEnabled = parseKimiLaunchFlag(env.VITE_PUBLIC_KIMI_LAUNCH)
-
-export function isKimiLaunchEnabled(): boolean {
-  return kimiLaunchEnabled
-}

packages/browseros-agent/apps/agent/lib/feature-flags/useKimiLaunch.ts

@@ -1,5 +0,0 @@
-import { isKimiLaunchEnabled } from './kimi-launch'
-
-export function useKimiLaunch(): boolean {
-  return isKimiLaunchEnabled()
-}

packages/browseros-agent/apps/agent/lib/graphql/QueryProvider.tsx

@@ -1,7 +1,10 @@
 import { createAsyncStoragePersister } from '@tanstack/query-async-storage-persister'
 import { QueryClient } from '@tanstack/react-query'
-import { PersistQueryClientProvider } from '@tanstack/react-query-persist-client'
-import localforage from 'localforage'
+import {
+  type AsyncStorage,
+  PersistQueryClientProvider,
+} from '@tanstack/react-query-persist-client'
+import { del, get, set } from 'idb-keyval'
 import type { FC, ReactNode } from 'react'
 
 const queryClient = new QueryClient({
@@ -12,8 +15,14 @@ const queryClient = new QueryClient({
   },
 })
 
+const idbStorage: AsyncStorage<string> = {
+  getItem: (key: string) => get<string>(key).then((v) => v ?? null),
+  setItem: (key: string, value: string) => set(key, value),
+  removeItem: (key: string) => del(key),
+}
+
 const asyncStoragePersister = createAsyncStoragePersister({
-  storage: localforage,
+  storage: idbStorage,
 })
 
 export const QueryProvider: FC<{ children: ReactNode }> = ({ children }) => {

packages/browseros-agent/apps/agent/lib/llm-hub/storage.ts

@@ -1,6 +1,5 @@
 import { getBrowserOSAdapter } from '@/lib/browseros/adapter'
 import { BROWSEROS_PREFS } from '@/lib/browseros/prefs'
-import { isKimiLaunchEnabled } from '@/lib/feature-flags/kimi-launch'
 
 /** @public */
 export interface LlmHubProvider {
@@ -8,43 +7,15 @@ export interface LlmHubProvider {
   url: string
 }
 
-const KIMI_PROVIDER: LlmHubProvider = {
-  name: 'Kimi',
-  url: 'https://www.kimi.com',
-}
-
-function ensureKimiFirst(providers: LlmHubProvider[]): LlmHubProvider[] {
-  if (!isKimiLaunchEnabled()) return providers
-  const hasKimi = providers.some(
-    (p) => p.name === 'Kimi' || p.url.includes('kimi.com'),
-  )
-  return hasKimi ? providers : [KIMI_PROVIDER, ...providers]
-}
-
 export async function loadProviders(): Promise<LlmHubProvider[]> {
   try {
     const adapter = getBrowserOSAdapter()
     const providersPref = await adapter.getPref(
       BROWSEROS_PREFS.THIRD_PARTY_LLM_PROVIDERS,
     )
-    const providers = (providersPref?.value as LlmHubProvider[]) || []
-
-    if (providers.length === 0) {
-      if (isKimiLaunchEnabled()) {
-        const defaults = [KIMI_PROVIDER]
-        await saveProviders(defaults)
-        return defaults
-      }
-      return []
-    }
-
-    const normalized = ensureKimiFirst(providers)
-    if (normalized !== providers) {
-      await saveProviders(normalized)
-    }
-    return normalized
+    return (providersPref?.value as LlmHubProvider[]) || []
   } catch {
-    return isKimiLaunchEnabled() ? [KIMI_PROVIDER] : []
+    return []
   }
 }
 

packages/browseros-agent/apps/agent/lib/llm-providers/models-dev.ts

@@ -0,0 +1,35 @@
+import data from './models-dev-data.json'
+
+export interface ModelsDevModel {
+  id: string
+  name: string
+  contextWindow: number
+  maxOutput: number
+  supportsImages: boolean
+  supportsReasoning: boolean
+  supportsToolCall: boolean
+  inputCost?: number
+  outputCost?: number
+}
+
+export interface ModelsDevProvider {
+  name: string
+  api?: string
+  doc: string
+  models: ModelsDevModel[]
+}
+
+const modelsDevData: Record<string, ModelsDevProvider> = data as Record<
+  string,
+  ModelsDevProvider
+>
+
+export function getModelsDevProvider(
+  providerId: string,
+): ModelsDevProvider | undefined {
+  return modelsDevData[providerId]
+}
+
+export function getModelsDevModels(providerId: string): ModelsDevModel[] {
+  return modelsDevData[providerId]?.models ?? []
+}

packages/browseros-agent/apps/agent/lib/llm-providers/providerIcons.tsx

@@ -5,6 +5,7 @@ import {
   Gemini,
   Kimi,
   LmStudio,
+  Minimax,
   Ollama,
   OpenAI,
   OpenRouter,
@@ -36,6 +37,7 @@ const providerIconMap: Record<ProviderType, IconComponent | null> = {
   'chatgpt-pro': OpenAI,
   'github-copilot': Github,
   'qwen-code': Qwen,
+  minimax: Minimax,
 }
 
 interface ProviderIconProps {

packages/browseros-agent/apps/agent/lib/llm-providers/providerTemplates.ts

@@ -1,3 +1,4 @@
+import { getModelsDevProvider } from './models-dev'
 import type { ProviderType } from './types'
 
 /**
@@ -15,6 +16,30 @@ export interface ProviderTemplate {
   apiKeyUrl?: string
 }
 
+function enrichTemplate(
+  providerId: ProviderType,
+  overrides: {
+    defaultModelId: string
+    defaultBaseUrl?: string
+    apiKeyUrl?: string
+    setupGuideUrl?: string
+  },
+): ProviderTemplate {
+  const provider = getModelsDevProvider(providerId)
+  const model = provider?.models.find((m) => m.id === overrides.defaultModelId)
+
+  return {
+    id: providerId,
+    name: provider?.name ?? providerId,
+    defaultBaseUrl: overrides.defaultBaseUrl ?? provider?.api ?? '',
+    defaultModelId: overrides.defaultModelId,
+    supportsImages: model?.supportsImages ?? true,
+    contextWindow: model?.contextWindow ?? 128000,
+    ...(overrides.apiKeyUrl && { apiKeyUrl: overrides.apiKeyUrl }),
+    ...(overrides.setupGuideUrl && { setupGuideUrl: overrides.setupGuideUrl }),
+  }
+}
+
 /**
  * Available provider templates for quick setup
  * @public
@@ -57,17 +82,12 @@ export const providerTemplates: ProviderTemplate[] = [
     apiKeyUrl: 'https://platform.moonshot.ai/console/api-keys',
     setupGuideUrl: 'https://platform.moonshot.ai/console/api-keys',
   },
-  {
-    id: 'openai',
-    name: 'OpenAI',
-    defaultBaseUrl: 'https://api.openai.com/v1',
-    defaultModelId: 'gpt-4',
-    supportsImages: true,
-    contextWindow: 128000,
+  enrichTemplate('openai', {
+    defaultModelId: 'gpt-5',
     apiKeyUrl: 'https://platform.openai.com/api-keys',
     setupGuideUrl:
       'https://docs.browseros.com/features/bring-your-own-llm#openai',
-  },
+  }),
   {
     id: 'openai-compatible',
     name: 'OpenAI Compatible',
@@ -76,28 +96,18 @@ export const providerTemplates: ProviderTemplate[] = [
     supportsImages: true,
     contextWindow: 128000,
   },
-  {
-    id: 'anthropic',
-    name: 'Anthropic',
-    defaultBaseUrl: 'https://api.anthropic.com/v1',
-    defaultModelId: 'claude-3-5-sonnet-20241022',
-    supportsImages: true,
-    contextWindow: 200000,
+  enrichTemplate('anthropic', {
+    defaultModelId: 'claude-sonnet-4-6',
     apiKeyUrl: 'https://console.anthropic.com/settings/keys',
     setupGuideUrl:
       'https://docs.browseros.com/features/bring-your-own-llm#claude',
-  },
-  {
-    id: 'google',
-    name: 'Gemini',
-    defaultBaseUrl: 'https://generativelanguage.googleapis.com/v1beta',
-    defaultModelId: 'gemini-1.5-pro',
-    supportsImages: true,
-    contextWindow: 1000000,
+  }),
+  enrichTemplate('google', {
+    defaultModelId: 'gemini-2.5-flash',
     apiKeyUrl: 'https://aistudio.google.com/app/apikey',
     setupGuideUrl:
       'https://docs.browseros.com/features/bring-your-own-llm#gemini',
-  },
+  }),
   {
     id: 'ollama',
     name: 'Ollama',
@@ -108,49 +118,53 @@ export const providerTemplates: ProviderTemplate[] = [
     setupGuideUrl:
       'https://docs.browseros.com/features/bring-your-own-llm#ollama',
   },
-  {
-    id: 'openrouter',
-    name: 'OpenRouter',
-    defaultBaseUrl: 'https://openrouter.ai/api/v1',
-    defaultModelId: 'openai/gpt-4-turbo',
-    supportsImages: true,
-    contextWindow: 128000,
+  enrichTemplate('openrouter', {
+    defaultModelId: 'anthropic/claude-sonnet-4.5',
     apiKeyUrl: 'https://openrouter.ai/keys',
     setupGuideUrl:
       'https://docs.browseros.com/features/bring-your-own-llm#openrouter',
-  },
-  {
-    id: 'lmstudio',
-    name: 'LM Studio',
+  }),
+  enrichTemplate('lmstudio', {
+    defaultModelId: 'openai/gpt-oss-20b',
     defaultBaseUrl: 'http://localhost:1234/v1',
-    defaultModelId: 'local-model',
-    supportsImages: false,
-    contextWindow: 32000,
     setupGuideUrl:
       'https://docs.browseros.com/features/bring-your-own-llm#lmstudio',
-  },
-  {
-    id: 'azure',
-    name: 'Azure',
-    defaultBaseUrl: '',
+  }),
+  enrichTemplate('azure', {
     defaultModelId: '',
-    supportsImages: true,
-    contextWindow: 128000,
     apiKeyUrl:
       'https://portal.azure.com/#view/Microsoft_Azure_ProjectOxford/CognitiveServicesHub/~/OpenAI',
-  },
-  {
-    id: 'bedrock',
-    name: 'AWS Bedrock',
-    defaultBaseUrl: '',
-    defaultModelId: '',
-    supportsImages: true,
-    contextWindow: 200000,
+  }),
+  enrichTemplate('bedrock', {
+    defaultModelId: 'anthropic.claude-sonnet-4-6',
     setupGuideUrl:
       'https://docs.aws.amazon.com/bedrock/latest/userguide/getting-started.html',
-  },
+  }),
+  enrichTemplate('minimax', {
+    defaultModelId: 'MiniMax-M2.7',
+    apiKeyUrl:
+      'https://platform.minimax.io/user-center/basic-information/interface-key',
+    setupGuideUrl: 'https://platform.minimax.io/docs/guides/models-intro',
+  }),
 ]
 
+export const MINIMAX_REGIONS = {
+  chinese: {
+    api: 'https://api.minimaxi.com/v1',
+    apiKeyUrl:
+      'https://platform.minimaxi.com/user-center/basic-information/interface-key',
+    setupGuideUrl: 'https://platform.minimaxi.com/document',
+  },
+  international: {
+    api: 'https://api.minimax.io/v1',
+    apiKeyUrl:
+      'https://platform.minimax.io/user-center/basic-information/interface-key',
+    setupGuideUrl: 'https://platform.minimax.io/docs/guides/models-intro',
+  },
+} as const
+
+export type MinimaxRegion = keyof typeof MINIMAX_REGIONS
+
 /**
  * Provider type options for select dropdowns
  * @public
@@ -170,6 +184,7 @@ export const providerTypeOptions: { value: ProviderType; label: string }[] = [
   { value: 'lmstudio', label: 'LM Studio' },
   { value: 'bedrock', label: 'AWS Bedrock' },
   { value: 'browseros', label: 'BrowserOS' },
+  { value: 'minimax', label: 'MiniMax' },
 ]
 
 /**
@@ -201,6 +216,7 @@ export const DEFAULT_BASE_URLS: Record<ProviderType, string> = {
   lmstudio: 'http://localhost:1234/v1',
   bedrock: '',
   browseros: '',
+  minimax: MINIMAX_REGIONS.chinese.api,
 }
 
 /**

packages/browseros-agent/apps/agent/lib/llm-providers/storage.ts

@@ -2,14 +2,12 @@ import { storage } from '@wxt-dev/storage'
 import { sessionStorage } from '@/lib/auth/sessionStorage'
 import { getBrowserOSAdapter } from '@/lib/browseros/adapter'
 import { BROWSEROS_PREFS } from '@/lib/browseros/prefs'
-import { isKimiLaunchEnabled } from '@/lib/feature-flags/kimi-launch'
 import type { LlmProviderConfig, LlmProvidersBackup } from './types'
 import { uploadLlmProvidersToGraphql } from './uploadLlmProvidersToGraphql'
 
 /** Default provider ID constant */
 export const DEFAULT_PROVIDER_ID = 'browseros'
 const DEFAULT_PROVIDER_NAME = 'BrowserOS'
-const KIMI_LAUNCH_PROVIDER_NAME = 'Kimi K2.5'
 
 /** Storage key for LLM providers array */
 export const providersStorage = storage.defineItem<LlmProviderConfig[]>(
@@ -91,7 +89,7 @@ export function setupLlmProvidersSyncToBackend(): () => void {
 /** Load providers from storage */
 export async function loadProviders(): Promise<LlmProviderConfig[]> {
   const providers = (await providersStorage.getValue()) || []
-  const normalizedProviders = normalizeProvidersForLaunch(providers)
+  const normalizedProviders = normalizeProviderNames(providers)
 
   // Keep storage consistent so every consumer sees the same provider name.
   if (
@@ -109,7 +107,7 @@ export function createDefaultBrowserOSProvider(): LlmProviderConfig {
   return {
     id: DEFAULT_PROVIDER_ID,
     type: 'browseros',
-    name: getBuiltInProviderName(),
+    name: DEFAULT_PROVIDER_NAME,
     baseUrl: 'https://api.browseros.com/v1',
     modelId: 'browseros-auto',
     supportsImages: true,
@@ -125,26 +123,22 @@ export function createDefaultProvidersConfig(): LlmProviderConfig[] {
   return [createDefaultBrowserOSProvider()]
 }
 
-function getBuiltInProviderName(): string {
-  return isKimiLaunchEnabled()
-    ? KIMI_LAUNCH_PROVIDER_NAME
-    : DEFAULT_PROVIDER_NAME
-}
-
-function normalizeProvidersForLaunch(
+/**
+ * Normalize built-in provider names back to "BrowserOS" (e.g. from "Kimi K2.5"
+ * which was set during a previous partnership launch).
+ */
+function normalizeProviderNames(
   providers: LlmProviderConfig[],
 ): LlmProviderConfig[] {
-  const builtInProviderName = getBuiltInProviderName()
-
   return providers.map((provider) => {
     if (
       provider.id === DEFAULT_PROVIDER_ID &&
       provider.type === 'browseros' &&
-      provider.name !== builtInProviderName
+      provider.name !== DEFAULT_PROVIDER_NAME
     ) {
       return {
         ...provider,
-        name: builtInProviderName,
+        name: DEFAULT_PROVIDER_NAME,
       }
     }
     return provider

packages/browseros-agent/apps/agent/lib/llm-providers/types.ts

@@ -17,6 +17,7 @@ export type ProviderType =
   | 'chatgpt-pro'
   | 'github-copilot'
   | 'qwen-code'
+  | 'minimax'
 
 /**
  * LLM Provider configuration