clawport-ui 0.8.2 → 0.8.3

package/README.md

@@ -8,7 +8,7 @@
 
 [![npm version](https://img.shields.io/npm/v/clawport-ui.svg)](https://www.npmjs.com/package/clawport-ui)
 [![license](https://img.shields.io/npm/l/clawport-ui.svg)](LICENSE)
-[![tests](https://img.shields.io/badge/tests-536%20passed-brightgreen)](#testing)
+[![tests](https://img.shields.io/badge/tests-771%20passed-brightgreen)](#testing)
 
 [Website](https://clawport.dev) | [Setup Guide](SETUP.md) | [API Docs](docs/API.md) | [npm](https://www.npmjs.com/package/clawport-ui)
 
@@ -171,7 +171,7 @@ clawport help     # Show usage
 ## Testing
 
 ```bash
-npm test             # 536 tests across 24 suites (Vitest)
+npm test             # 771 tests across 31 suites (Vitest)
 npx tsc --noEmit     # Type-check (zero errors)
 npx next build       # Production build
 ```

package/app/agents/[id]/page.tsx

@@ -490,6 +490,22 @@ export default function AgentDetailPage({
             >
               {agent.title}
             </p>
+            {agent.model && (
+              <span
+                style={{
+                  display: "inline-block",
+                  marginTop: "var(--space-1)",
+                  fontSize: "var(--text-caption2)",
+                  fontFamily: "var(--font-mono)",
+                  color: "var(--text-tertiary)",
+                  background: "var(--fill-secondary)",
+                  padding: "1px 8px",
+                  borderRadius: 6,
+                }}
+              >
+                {agent.model.split("/").pop()}
+              </span>
+            )}
             {/* Color swatch */}
             <div
               style={{

package/app/api/chat/[id]/route.ts

@@ -93,7 +93,7 @@ export async function POST(
 
   try {
     const stream = await openai.chat.completions.create({
-      model: 'claude-sonnet-4-6',
+      model: agent.model || 'claude-sonnet-4-6',
       stream: true,
       messages: [
         { role: 'system' as const, content: systemPrompt },

package/app/api/kanban/chat/[id]/route.ts

@@ -90,7 +90,7 @@ Help the user with this ticket. Stay in character as ${agent.name}, ${agent.titl
 
   try {
     const stream = await openai.chat.completions.create({
-      model: 'claude-sonnet-4-6',
+      model: agent.model || 'claude-sonnet-4-6',
       stream: true,
       messages: [
         { role: 'system' as const, content: systemPrompt },

package/components/AgentNode.tsx

@@ -129,6 +129,24 @@ export function AgentNode({ data, selected }: NodeProps) {
             {reportCount} reports
           </span>
         )}
+        {agent.model && (
+          <span
+            style={{
+              fontSize: "var(--text-caption2)",
+              fontWeight: "var(--weight-medium)",
+              color: "var(--text-tertiary)",
+              background: "var(--fill-tertiary)",
+              padding: "1px 7px",
+              borderRadius: 10,
+              overflow: "hidden",
+              textOverflow: "ellipsis",
+              whiteSpace: "nowrap",
+              maxWidth: 120,
+            }}
+          >
+            {agent.model.split("/").pop()}
+          </span>
+        )}
         {hasCrons && (
           <span
             style={{

package/components/chat/ConversationView.tsx

@@ -725,7 +725,7 @@ export function ConversationView({ agent, conversation, onUpdate, onBack }: Conv
               textOverflow: 'ellipsis',
               whiteSpace: 'nowrap',
             }}>
-              {agent.title}{messages.length > 1 && ' · Synced'}
+              {agent.title}{agent.model && ` · ${agent.model.split('/').pop()}`}{messages.length > 1 && ' · Synced'}
             </div>
           </div>
         </div>

package/lib/agents-registry.ts

@@ -208,6 +208,7 @@ function discoverAgents(workspacePath: string): AgentEntry[] | null {
       color: DISCOVER_COLORS[colorIndex++ % DISCOVER_COLORS.length],
       emoji: rootEmoji,
       tools: ['read', 'write', 'exec', 'message'],
+      model: null,
       memoryPath: null,
       description: 'Top-level orchestrator.',
     })
@@ -252,6 +253,7 @@ function discoverAgents(workspacePath: string): AgentEntry[] | null {
           color: DISCOVER_COLORS[colorIndex++ % DISCOVER_COLORS.length],
           emoji: subName.charAt(0).toUpperCase(),
           tools: ['read', 'write'],
+          model: null,
           memoryPath: null,
           description: `${subName} agent.`,
         })
@@ -275,6 +277,7 @@ function discoverAgents(workspacePath: string): AgentEntry[] | null {
           color: DISCOVER_COLORS[colorIndex++ % DISCOVER_COLORS.length],
           emoji: subName.charAt(0).toUpperCase(),
           tools: ['read', 'write'],
+          model: null,
           memoryPath: null,
           description: `${subName} agent.`,
         })
@@ -343,6 +346,7 @@ function discoverAgents(workspacePath: string): AgentEntry[] | null {
         color: DISCOVER_COLORS[colorIndex++ % DISCOVER_COLORS.length],
         emoji: subName.charAt(0).toUpperCase(),
         tools: ['read', 'write'],
+        model: null,
         memoryPath: null,
         description: `${subName} agent.`,
       })
@@ -369,6 +373,7 @@ function discoverAgents(workspacePath: string): AgentEntry[] | null {
         color: DISCOVER_COLORS[colorIndex++ % DISCOVER_COLORS.length],
         emoji: subName.charAt(0).toUpperCase(),
         tools: ['read', 'write'],
+        model: null,
         memoryPath: null,
         description: `${subName} agent.`,
       })
@@ -385,6 +390,7 @@ function discoverAgents(workspacePath: string): AgentEntry[] | null {
       color: DISCOVER_COLORS[colorIndex++ % DISCOVER_COLORS.length],
       emoji: name.charAt(0).toUpperCase(),
       tools: ['read', 'write'],
+      model: null,
       memoryPath: null,
       description: `${name} agent.`,
     })
@@ -408,6 +414,7 @@ interface CliAgentEntry {
   id: string
   identityName?: string
   identityEmoji?: string
+  model?: string
   workspace?: string
   isDefault?: boolean
 }
@@ -457,6 +464,12 @@ function mergeExtraWorkspaces(
     // Try discovering agents from this workspace's filesystem
     const discovered = discoverAgents(ws)
     if (discovered) {
+      // Enrich with model from this CLI agent
+      if (cli.model) {
+        for (const d of discovered) {
+          if (!d.model) d.model = cli.model
+        }
+      }
       for (const agent of discovered) {
         if (existingIds.has(agent.id)) continue
         // Agents from other workspaces are top-level peers (no cross-workspace hierarchy)
@@ -482,6 +495,7 @@ function mergeExtraWorkspaces(
         color: DISCOVER_COLORS[colorIndex++ % DISCOVER_COLORS.length],
         emoji: cli.identityEmoji || name.charAt(0).toUpperCase(),
         tools: ['read', 'write'],
+        model: cli.model || null,
         memoryPath: null,
         description: `${name} agent.`,
       })
@@ -492,6 +506,29 @@ function mergeExtraWorkspaces(
   return [...existing, ...added]
 }
 
+/**
+ * Enrich filesystem-discovered agents with model data from CLI output.
+ *
+ * All agents in a workspace share the CLI agent's configured model.
+ * CLI agents are matched to discovered agents by workspace path.
+ */
+function enrichModelsFromCli(
+  agents: AgentEntry[],
+  cliAgents: CliAgentEntry[],
+  primaryWorkspace: string,
+): void {
+  // Find CLI agent(s) for the primary workspace — take the default or first match
+  const primaryCli = cliAgents.find(c => c.workspace === primaryWorkspace && c.isDefault)
+    || cliAgents.find(c => c.workspace === primaryWorkspace)
+  if (primaryCli?.model) {
+    for (const agent of agents) {
+      if (!agent.model) {
+        agent.model = primaryCli.model
+      }
+    }
+  }
+}
+
 /**
  * Load the agent registry.
  *
@@ -521,11 +558,14 @@ export function loadRegistry(): AgentEntry[] {
     // 2. Auto-discover from primary workspace filesystem
     const discovered = discoverAgents(workspacePath)
 
-    // 2b. Merge agents from other workspaces known to the CLI
+    // 2b. Enrich with CLI model data + merge other workspaces
     if (discovered && openclawBin) {
       const cliAgents = listCliAgents(openclawBin)
-      if (cliAgents && cliAgents.length > 1) {
-        return mergeExtraWorkspaces(discovered, cliAgents, workspacePath)
+      if (cliAgents) {
+        enrichModelsFromCli(discovered, cliAgents, workspacePath)
+        if (cliAgents.length > 1) {
+          return mergeExtraWorkspaces(discovered, cliAgents, workspacePath)
+        }
       }
       return discovered
     }

package/lib/agents.json

@@ -10,6 +10,7 @@
     "color": "#f5c518",
     "emoji": "\ud83e\udd16",
     "tools": ["exec", "read", "write", "edit", "web_search", "tts", "message", "sessions_spawn", "memory_search"],
+    "model": null,
     "memoryPath": null,
     "description": "Top-level orchestrator. Manages the team, holds memory, delivers briefings."
   },
@@ -24,6 +25,7 @@
     "color": "#a855f7",
     "emoji": "\u265f\ufe0f",
     "tools": ["web_search", "web_fetch", "read", "write", "sessions_spawn"],
+    "model": null,
     "memoryPath": null,
     "description": "CSO. Manages validation team. Decides what gets built and what gets killed."
   },
@@ -38,6 +40,7 @@
     "color": "#3b82f6",
     "emoji": "\ud83e\udd85",
     "tools": ["web_search", "web_fetch", "read", "write", "message"],
+    "model": null,
     "memoryPath": null,
     "description": "Field operator. Competitive intel, opportunity scouting, lead signals."
   },
@@ -52,6 +55,7 @@
     "color": "#06b6d4",
     "emoji": "\ud83d\udd0d",
     "tools": ["web_search", "web_fetch", "read", "write"],
+    "model": null,
     "memoryPath": null,
     "description": "Market research. TAM, competitors, pricing benchmarks. Returns Market Briefs."
   },
@@ -66,6 +70,7 @@
     "color": "#06b6d4",
     "emoji": "\u2705",
     "tools": ["web_search", "web_fetch", "read", "write"],
+    "model": null,
     "memoryPath": null,
     "description": "Designs minimum viable tests. Writes outreach copy. Calls BUILD/KILL/PIVOT."
   },
@@ -80,6 +85,7 @@
     "color": "#22c55e",
     "emoji": "\ud83d\udd26",
     "tools": ["web_search", "web_fetch", "read", "write", "exec"],
+    "model": null,
     "memoryPath": null,
     "description": "SEO Team Director. Runs SCOUT\u2192ANALYST\u2192STRATEGIST\u2192WRITER pipeline."
   },
@@ -94,6 +100,7 @@
     "color": "#86efac",
     "emoji": "\ud83d\uddfa\ufe0f",
     "tools": ["web_search", "web_fetch", "read"],
+    "model": null,
     "memoryPath": null,
     "description": "Scouts trending topics, pulls RSS feeds, identifies content opportunities."
   },
@@ -108,6 +115,7 @@
     "color": "#86efac",
     "emoji": "\ud83d\udcca",
     "tools": ["web_search", "web_fetch", "read", "write"],
+    "model": null,
     "memoryPath": null,
     "description": "Keyword research, GSC data analysis, competitive gap identification."
   },
@@ -122,6 +130,7 @@
     "color": "#86efac",
     "emoji": "\ud83c\udfaf",
     "tools": ["read", "write"],
+    "model": null,
     "memoryPath": null,
     "description": "Topic angle selection using SAGE and ECHO briefs."
   },
@@ -136,6 +145,7 @@
     "color": "#86efac",
     "emoji": "\u270d\ufe0f",
     "tools": ["read", "write"],
+    "model": null,
     "memoryPath": null,
     "description": "1500-2000 word posts in the operator's voice."
   },
@@ -150,6 +160,7 @@
     "color": "#86efac",
     "emoji": "\ud83d\udee1\ufe0f",
     "tools": ["read", "write"],
+    "model": null,
     "memoryPath": null,
     "description": "Pre-ship quality gate. 6-item checklist before publishing."
   },
@@ -164,6 +175,7 @@
     "color": "#f97316",
     "emoji": "\ud83d\udce3",
     "tools": ["web_search", "web_fetch", "read", "write", "message", "exec"],
+    "model": null,
     "memoryPath": null,
     "description": "LinkedIn content pipeline. Reads Pulse feed, picks angles, briefs QUILL."
   },
@@ -178,6 +190,7 @@
     "color": "#fdba74",
     "emoji": "\ud83d\udd8a\ufe0f",
     "tools": ["read", "write"],
+    "model": null,
     "memoryPath": null,
     "description": "Writes LinkedIn posts in the operator's voice."
   },
@@ -192,6 +205,7 @@
     "color": "#fdba74",
     "emoji": "\ud83e\udded",
     "tools": ["web_search", "read", "write"],
+    "model": null,
     "memoryPath": null,
     "description": "Weekly LinkedIn strategy and content calendar."
   },
@@ -206,6 +220,7 @@
     "color": "#eab308",
     "emoji": "\ud83c\udf0a",
     "tools": ["web_search", "web_fetch", "read", "write", "message"],
+    "model": null,
     "memoryPath": null,
     "description": "Hype radar. Monitors trending signals. Feeds hot topics to LUMEN."
   },
@@ -220,6 +235,7 @@
     "color": "#14b8a6",
     "emoji": "\ud83d\udce1",
     "tools": ["web_fetch", "read", "write"],
+    "model": null,
     "memoryPath": null,
     "description": "Scans ICP subreddits weekly. Extracts verbatim customer language."
   },
@@ -234,6 +250,7 @@
     "color": "#14b8a6",
     "emoji": "\ud83e\uddd9",
     "tools": ["read"],
+    "model": null,
     "memoryPath": null,
     "description": "Deep ICP and market knowledge. Injected into STRATEGIST and WRITER."
   },
@@ -248,6 +265,7 @@
     "color": "#60a5fa",
     "emoji": "\u2708\ufe0f",
     "tools": ["web_fetch", "message"],
+    "model": null,
     "memoryPath": null,
     "description": "Monitors MSP to Tokyo flights. Alerts on deals under $1400."
   },
@@ -262,6 +280,7 @@
     "color": "#f59e0b",
     "emoji": "\u26a1",
     "tools": ["web_fetch", "web_search", "message"],
+    "model": null,
     "memoryPath": null,
     "description": "Finds cool OpenClaw builds. Reports every other day."
   },
@@ -276,6 +295,7 @@
     "color": "#94a3b8",
     "emoji": "\ud83d\udcda",
     "tools": ["read", "write", "exec"],
+    "model": null,
     "memoryPath": null,
     "description": "Weekly memory compression. Silent worker."
   }

package/lib/agents.test.ts

@@ -18,6 +18,7 @@ const { mockReadFileSync, mockExistsSync, mockReaddirSync, mockExecSync, bundled
       color: '#f5c518',
       emoji: 'R',
       tools: ['exec', 'read', 'write'],
+      model: null,
       memoryPath: null,
       description: 'Top-level orchestrator.',
     },
@@ -32,6 +33,7 @@ const { mockReadFileSync, mockExistsSync, mockReaddirSync, mockExecSync, bundled
       color: '#a855f7',
       emoji: 'P',
       tools: ['web_search', 'read'],
+      model: null,
       memoryPath: null,
       description: 'CSO. Decides what gets built.',
     },
@@ -46,6 +48,7 @@ const { mockReadFileSync, mockExistsSync, mockReaddirSync, mockExecSync, bundled
       color: '#3b82f6',
       emoji: 'E',
       tools: ['web_search'],
+      model: null,
       memoryPath: null,
       description: 'Field operator.',
     },
@@ -60,6 +63,7 @@ const { mockReadFileSync, mockExistsSync, mockReaddirSync, mockExecSync, bundled
       color: '#22c55e',
       emoji: 'L',
       tools: ['web_search', 'read'],
+      model: null,
       memoryPath: null,
       description: 'SEO Team Director.',
     },
@@ -74,6 +78,7 @@ const { mockReadFileSync, mockExistsSync, mockReaddirSync, mockExecSync, bundled
       color: '#86efac',
       emoji: 'S',
       tools: ['web_search'],
+      model: null,
       memoryPath: null,
       description: 'Scouts trending topics.',
     },
@@ -88,6 +93,7 @@ const { mockReadFileSync, mockExistsSync, mockReaddirSync, mockExecSync, bundled
       color: '#eab308',
       emoji: 'W',
       tools: ['web_search'],
+      model: null,
       memoryPath: null,
       description: 'Hype radar.',
     },
@@ -102,6 +108,7 @@ const { mockReadFileSync, mockExistsSync, mockReaddirSync, mockExecSync, bundled
       color: '#60a5fa',
       emoji: 'A',
       tools: ['web_fetch'],
+      model: null,
       memoryPath: null,
       description: 'Monitors flights.',
     },
@@ -1115,6 +1122,7 @@ describe('CLI agent discovery (multi-workspace)', () => {
     id: string
     identityName?: string
     identityEmoji?: string
+    model?: string
     workspace?: string
     isDefault?: boolean
   }>) {
@@ -1125,7 +1133,7 @@ describe('CLI agent discovery (multi-workspace)', () => {
       identitySource: 'identity',
       workspace: e.workspace ?? '/tmp/ws',
       agentDir: `/home/.openclaw/agents/${e.id}/agent`,
-      model: 'anthropic/claude-sonnet-4-6',
+      model: e.model ?? 'anthropic/claude-sonnet-4-6',
       bindings: 0,
       isDefault: e.isDefault ?? false,
       routes: ['default (no explicit rules)'],
@@ -1251,6 +1259,51 @@ describe('CLI agent discovery (multi-workspace)', () => {
     expect(emptyBot!.tools).toEqual(['read', 'write'])
   })
 
+  it('flows CLI model through to minimal entry', async () => {
+    setupPrimaryWorkspace()
+
+    const origExists = mockExistsSync.getMockImplementation()!
+    mockExistsSync.mockImplementation((p: string) => {
+      if (p.startsWith('/tmp/ws-model')) return false
+      return origExists(p)
+    })
+
+    mockExecSync.mockReturnValue(cliOutput([
+      { id: 'main', workspace: '/tmp/ws', isDefault: true },
+      { id: 'opus-bot', identityName: 'OpusBot', model: 'anthropic/claude-opus-4-6', workspace: '/tmp/ws-model' },
+    ]))
+
+    const agents = await getAgents()
+    const opusBot = agents.find(a => a.id === 'opus-bot')
+    expect(opusBot).toBeDefined()
+    expect(opusBot!.model).toBe('anthropic/claude-opus-4-6')
+  })
+
+  it('enriches primary workspace agents with CLI model', async () => {
+    setupPrimaryWorkspace()
+    mockExecSync.mockReturnValue(cliOutput([
+      { id: 'main', identityName: 'Jarvis', model: 'anthropic/claude-opus-4-6', workspace: '/tmp/ws', isDefault: true },
+    ]))
+
+    const agents = await getAgents()
+    const jarvis = agents.find(a => a.id === 'jarvis')
+    expect(jarvis).toBeDefined()
+    expect(jarvis!.model).toBe('anthropic/claude-opus-4-6')
+    // Sub-agents in the same workspace also get the model
+    const echo = agents.find(a => a.id === 'echo')
+    expect(echo!.model).toBe('anthropic/claude-opus-4-6')
+  })
+
+  it('agents stay model: null when CLI is unavailable', async () => {
+    setupPrimaryWorkspace()
+    mockExecSync.mockImplementation(() => { throw new Error('not found') })
+
+    const agents = await getAgents()
+    const jarvis = agents.find(a => a.id === 'jarvis')
+    expect(jarvis).toBeDefined()
+    expect(jarvis!.model).toBeNull()
+  })
+
   it('does not duplicate agents already found in primary workspace', async () => {
     setupPrimaryWorkspace()
 

package/lib/conversations.test.ts

@@ -55,6 +55,7 @@ const fakeAgent: Agent = {
   emoji: '?',
   tools: [],
   crons: [],
+  model: null,
   memoryPath: null,
   description: 'CSO. Decides what gets built.',
 }

package/lib/slash-commands.test.ts

@@ -22,6 +22,7 @@ function makeAgent(overrides: Partial<Agent> = {}): Agent {
     emoji: '🤖',
     tools: [],
     crons: [],
+    model: null,
     memoryPath: null,
     description: 'A test agent for unit tests.',
     ...overrides,

package/lib/teams.test.ts

@@ -17,6 +17,7 @@ function agent(overrides: Partial<Agent> & { id: string }): Agent {
     emoji: 'A',
     tools: [],
     crons: [],
+    model: null,
     memoryPath: null,
     description: '',
     ...overrides,

package/lib/types.ts

@@ -11,6 +11,7 @@ export interface Agent {
   voiceId: string | null   // ElevenLabs voice ID
   color: string            // hex color for node
   emoji: string            // emoji identifier
+  model: string | null     // LLM model identifier (e.g. "anthropic/claude-sonnet-4-6")
   tools: string[]          // list of tools this agent has access to
   crons: CronJob[]         // associated cron jobs
   memoryPath: string | null

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "clawport-ui",
-  "version": "0.8.2",
+  "version": "0.8.3",
   "description": "Open-source dashboard for managing, monitoring, and chatting with your OpenClaw AI agents.",
   "homepage": "https://clawport.dev",
   "repository": {