@swarmclawai/swarmclaw 0.6.4 → 0.6.7

package/src/cli/index.ts

@@ -2,6 +2,12 @@
 
 import { Command } from 'commander'
 import { pathToFileURL } from 'node:url'
+import {
+  SETUP_PROVIDERS,
+  DEFAULT_AGENTS,
+  STARTER_AGENT_TOOLS,
+  type SetupProvider,
+} from '../lib/setup-defaults.ts'
 
 interface CliContext {
   baseUrl: string
@@ -9,8 +15,6 @@ interface CliContext {
   rawOutput: boolean
 }
 
-type SetupProvider = 'openai' | 'anthropic' | 'ollama' | 'openclaw'
-
 interface SetupAuthStatus {
   firstTime?: boolean
   key?: string
@@ -23,34 +27,7 @@ interface SetupProviderCheckResponse {
   recommendedModel?: string
 }
 
-const SUPPORTED_SETUP_PROVIDERS = new Set<SetupProvider>(['openai', 'anthropic', 'ollama', 'openclaw'])
-
-const DEFAULT_SETUP_AGENTS: Record<SetupProvider, { name: string; description: string; systemPrompt: string; model: string }> = {
-  openai: {
-    name: 'Assistant',
-    description: 'A helpful GPT-powered assistant.',
-    systemPrompt: 'You are a helpful, pragmatic assistant. Be concise, concrete, and action-oriented.',
-    model: 'gpt-4o',
-  },
-  anthropic: {
-    name: 'Assistant',
-    description: 'A helpful Claude-powered assistant.',
-    systemPrompt: 'You are a helpful, pragmatic assistant. Be concise, concrete, and action-oriented.',
-    model: 'claude-sonnet-4-6',
-  },
-  ollama: {
-    name: 'Assistant',
-    description: 'A local assistant running through Ollama.',
-    systemPrompt: 'You are a helpful, pragmatic assistant. Be concise, concrete, and action-oriented.',
-    model: 'llama3',
-  },
-  openclaw: {
-    name: 'OpenClaw Operator',
-    description: 'A manager agent for talking to and coordinating OpenClaw instances.',
-    systemPrompt: 'You are an operator focused on reliable execution, clear status updates, and task completion.',
-    model: 'default',
-  },
-}
+const SUPPORTED_SETUP_PROVIDERS = new Set<SetupProvider>(SETUP_PROVIDERS.map((p) => p.id))
 
 const DEFAULT_BASE_URL =
   process.env.SWARMCLAW_URL
@@ -206,7 +183,8 @@ async function apiRequestWithAccessKey<T = unknown>(
 function normalizeSetupProvider(value: string | undefined): SetupProvider {
   const lower = (value || '').trim().toLowerCase()
   if (SUPPORTED_SETUP_PROVIDERS.has(lower as SetupProvider)) return lower as SetupProvider
-  throw new Error(`Unsupported provider "${value}". Supported: openai, anthropic, ollama, openclaw`)
+  const supported = SETUP_PROVIDERS.map((p) => p.id).join(', ')
+  throw new Error(`Unsupported provider "${value}". Supported: ${supported}`)
 }
 
 function maskToken(value: string): string {
@@ -288,6 +266,201 @@ async function runWithHandler(command: Command, task: (ctx: CliContext) => Promi
   }
 }
 
+async function readSecret(prompt: string): Promise<string> {
+  const { stdin, stdout } = process
+  stdout.write(prompt)
+  return new Promise((resolve) => {
+    let buf = ''
+    const wasRaw = stdin.isRaw
+    stdin.setRawMode?.(true)
+    stdin.resume()
+    stdin.setEncoding('utf8')
+    const onData = (ch: string) => {
+      if (ch === '\n' || ch === '\r') {
+        stdin.setRawMode?.(wasRaw ?? false)
+        stdin.pause()
+        stdin.removeListener('data', onData)
+        stdout.write('\n')
+        resolve(buf)
+      } else if (ch === '\u0003') {
+        // Ctrl+C
+        process.exit(130)
+      } else if (ch === '\u007f' || ch === '\b') {
+        buf = buf.slice(0, -1)
+      } else {
+        buf += ch
+      }
+    }
+    stdin.on('data', onData)
+  })
+}
+
+async function runInteractiveSetup(ctx: CliContext): Promise<unknown> {
+  const { createInterface } = await import('node:readline/promises')
+
+  const auth = await resolveSetupAccessKey(ctx)
+  const configuredProviders: string[] = []
+  const createdAgents: Array<{ name: string; provider: string; model: string }> = []
+
+  // Wraps readline so we can destroy/recreate after raw-mode readSecret
+  let rl = createInterface({ input: process.stdin, output: process.stdout })
+
+  const freshRl = () => {
+    try { rl.close() } catch { /* already closed */ }
+    rl = createInterface({ input: process.stdin, output: process.stdout })
+  }
+
+  const ask = async (question: string, defaultValue?: string): Promise<string> => {
+    const suffix = defaultValue ? ` (${defaultValue})` : ''
+    const answer = (await rl.question(`${question}${suffix}: `)).trim()
+    return answer || defaultValue || ''
+  }
+
+  const askYN = async (question: string, defaultYes: boolean): Promise<boolean> => {
+    const hint = defaultYes ? 'Y/n' : 'y/N'
+    const answer = (await rl.question(`${question} [${hint}]: `)).trim().toLowerCase()
+    if (!answer) return defaultYes
+    return answer.startsWith('y')
+  }
+
+  const askSecret = async (prompt: string): Promise<string> => {
+    rl.close()
+    const value = await readSecret(prompt)
+    freshRl()
+    return value
+  }
+
+  console.log('\n  SwarmClaw Interactive Setup\n')
+
+  let addMore = true
+  while (addMore) {
+    console.log('  Available providers:\n')
+    const available = SETUP_PROVIDERS.filter((p) => !configuredProviders.includes(p.id))
+    if (available.length === 0) {
+      console.log('  All providers configured!\n')
+      break
+    }
+    available.forEach((p, i) => {
+      const badge = p.badge ? ` (${p.badge})` : ''
+      console.log(`  ${i + 1}. ${p.name}${badge}`)
+    })
+    console.log()
+
+    const choiceStr = await ask('Pick a provider', '1')
+    const choiceNum = parseInt(choiceStr, 10)
+    const selected = (choiceNum >= 1 && choiceNum <= available.length)
+      ? available[choiceNum - 1]
+      : available.find((p) => p.id === choiceStr.toLowerCase() || p.name.toLowerCase() === choiceStr.toLowerCase())
+
+    if (!selected) {
+      console.log(`  Invalid choice "${choiceStr}". Try again.\n`)
+      continue
+    }
+
+    const provider = selected.id
+    const defaults = DEFAULT_AGENTS[provider]
+    console.log(`\n  Setting up ${selected.name}...\n`)
+
+    // Collect inputs
+    let inputApiKey = ''
+    if (selected.requiresKey) {
+      inputApiKey = await askSecret('  API key: ')
+      if (!inputApiKey) {
+        console.log('  API key is required for this provider.\n')
+        continue
+      }
+    } else if (selected.optionalKey) {
+      inputApiKey = await askSecret('  Token (optional, press Enter to skip): ')
+    }
+
+    let inputEndpoint = ''
+    if (selected.supportsEndpoint) {
+      inputEndpoint = await ask('  Endpoint', selected.defaultEndpoint)
+    }
+
+    const agentName = await ask('  Agent name', defaults.name)
+    const runCheck = await askYN('  Run connection check?', true)
+
+    // Connection check
+    let normalizedEndpoint = inputEndpoint || undefined
+    let selectedModel: string | undefined
+
+    if (runCheck) {
+      process.stdout.write('  Checking connection...')
+      try {
+        const check = await apiRequestWithAccessKey<SetupProviderCheckResponse>(
+          ctx, 'POST', '/setup/check-provider', auth.accessKey,
+          compactObject({
+            provider,
+            apiKey: inputApiKey || undefined,
+            endpoint: selected.supportsEndpoint ? normalizedEndpoint : undefined,
+          }),
+        )
+        if (check?.ok) {
+          console.log(' OK')
+          if (check.normalizedEndpoint) normalizedEndpoint = check.normalizedEndpoint
+          if (check.recommendedModel) selectedModel = check.recommendedModel
+        } else {
+          console.log(` FAILED: ${check?.message || 'Unknown error'}`)
+        }
+      } catch (err: unknown) {
+        console.log(` FAILED: ${err instanceof Error ? err.message : String(err)}`)
+      }
+    }
+
+    // Save credential
+    let credentialId: string | null = null
+    if (inputApiKey) {
+      const credential = await apiRequestWithAccessKey<{ id?: string }>(
+        ctx, 'POST', '/credentials', auth.accessKey,
+        { provider, name: `${selected.name} key`, apiKey: inputApiKey },
+      )
+      credentialId = typeof credential?.id === 'string' ? credential.id : null
+    }
+
+    // Create agent
+    await apiRequestWithAccessKey<Record<string, unknown>>(
+      ctx, 'POST', '/agents', auth.accessKey,
+      compactObject({
+        name: agentName || defaults.name,
+        description: defaults.description,
+        systemPrompt: defaults.systemPrompt,
+        provider,
+        model: selectedModel || defaults.model,
+        credentialId: credentialId || null,
+        apiEndpoint: selected.supportsEndpoint ? (normalizedEndpoint || undefined) : undefined,
+        tools: STARTER_AGENT_TOOLS,
+      }),
+    )
+
+    configuredProviders.push(provider)
+    createdAgents.push({ name: agentName || defaults.name, provider, model: selectedModel || defaults.model })
+    console.log(`  Agent "${agentName || defaults.name}" created.\n`)
+
+    addMore = await askYN('  Add another provider?', false)
+  }
+
+  rl.close()
+
+  await apiRequestWithAccessKey(ctx, 'PUT', '/settings', auth.accessKey, { setupCompleted: true })
+
+  console.log('\n  Setup complete!\n')
+  console.log('  Created agents:')
+  for (const a of createdAgents) {
+    console.log(`    - ${a.name} (${a.provider}, ${a.model})`)
+  }
+  console.log()
+
+  return {
+    ok: true,
+    interactive: true,
+    providers: configuredProviders,
+    agents: createdAgents,
+    accessKeyMasked: maskToken(auth.accessKey),
+    firstTimeSetup: auth.firstTime,
+  }
+}
+
 export function buildProgram(): Command {
   const program = new Command()
 
@@ -743,8 +916,8 @@ export function buildProgram(): Command {
   setup
     .command('init')
     .description('Run command-line first-time setup (provider check, credential, starter agent)')
-    .option('--provider <provider>', 'Provider id (openai|anthropic|ollama|openclaw)', 'openai')
-    .option('--api-key <apiKey>', 'API key or token (required for openai/anthropic)')
+    .option('--provider <provider>', 'Provider id (e.g. openai, anthropic, ollama, google)')
+    .option('--api-key <apiKey>', 'API key or token')
     .option('--endpoint <endpoint>', 'Provider endpoint override')
     .option('--model <model>', 'Model override')
     .option('--agent-name <name>', 'Starter agent name')
@@ -752,6 +925,7 @@ export function buildProgram(): Command {
     .option('--system-prompt <systemPrompt>', 'Starter agent system prompt')
     .option('--skip-check', 'Skip provider connection check')
     .option('--no-create-agent', 'Do not create a starter agent')
+    .option('--no-interactive', 'Disable interactive prompts (flag-only mode)')
     .action(async function (opts: {
       provider?: string
       apiKey?: string
@@ -762,12 +936,21 @@ export function buildProgram(): Command {
       systemPrompt?: string
       skipCheck?: boolean
       createAgent?: boolean
+      interactive?: boolean
     }) {
       await runWithHandler(this as Command, async (ctx) => {
-        const provider = normalizeSetupProvider(opts.provider)
-        const defaults = DEFAULT_SETUP_AGENTS[provider]
-        const requiresApiKey = provider === 'openai' || provider === 'anthropic'
-        const supportsEndpoint = provider === 'openai' || provider === 'ollama' || provider === 'openclaw'
+        const hasFlags = !!(opts.provider && opts.provider !== 'openai') || !!opts.apiKey || !!opts.endpoint
+        const wantInteractive = opts.interactive !== false && !hasFlags && process.stdin.isTTY
+
+        if (wantInteractive) {
+          return runInteractiveSetup(ctx)
+        }
+
+        const provider = normalizeSetupProvider(opts.provider || 'openai')
+        const defaults = DEFAULT_AGENTS[provider]
+        const meta = SETUP_PROVIDERS.find((p) => p.id === provider)
+        const requiresApiKey = meta?.requiresKey ?? false
+        const supportsEndpoint = meta?.supportsEndpoint ?? false
 
         const inputApiKey = (opts.apiKey || '').trim()
         const inputEndpoint = (opts.endpoint || '').trim()
@@ -807,7 +990,7 @@ export function buildProgram(): Command {
         }
 
         let credentialId: string | null = null
-        if (inputApiKey && (provider === 'openai' || provider === 'anthropic' || provider === 'openclaw')) {
+        if (inputApiKey && (requiresApiKey || meta?.optionalKey)) {
           const credential = await apiRequestWithAccessKey<{ id?: string; name?: string }>(
             ctx,
             'POST',
@@ -815,7 +998,7 @@ export function buildProgram(): Command {
             auth.accessKey,
             {
               provider,
-              name: `${provider} key`,
+              name: `${meta?.name || provider} key`,
               apiKey: inputApiKey,
             },
           )
@@ -837,6 +1020,7 @@ export function buildProgram(): Command {
               model: selectedModel || defaults.model,
               credentialId: credentialId || null,
               apiEndpoint: supportsEndpoint ? (normalizedEndpoint || undefined) : undefined,
+              tools: STARTER_AGENT_TOOLS,
             }),
           )
         }

package/src/cli/spec.js

@@ -351,6 +351,20 @@ const COMMAND_GROUPS = {
       metrics: { description: 'Get task board metrics (supports --query range=24h|7d|30d)', method: 'GET', path: '/tasks/metrics' },
     },
   },
+  wallets: {
+    description: 'Agent wallet operations',
+    commands: {
+      list: { description: 'List wallets', method: 'GET', path: '/wallets' },
+      get: { description: 'Get wallet by id', method: 'GET', path: '/wallets/:id', params: ['id'] },
+      create: { description: 'Create wallet', method: 'POST', path: '/wallets' },
+      update: { description: 'Update wallet settings', method: 'PATCH', path: '/wallets/:id', params: ['id'] },
+      delete: { description: 'Delete wallet', method: 'DELETE', path: '/wallets/:id', params: ['id'] },
+      send: { description: 'Send funds from wallet', method: 'POST', path: '/wallets/:id/send', params: ['id'] },
+      approve: { description: 'Approve or deny pending wallet transaction', method: 'POST', path: '/wallets/:id/approve', params: ['id'] },
+      transactions: { description: 'List wallet transactions', method: 'GET', path: '/wallets/:id/transactions', params: ['id'] },
+      'balance-history': { description: 'Get wallet balance history', method: 'GET', path: '/wallets/:id/balance-history', params: ['id'] },
+    },
+  },
   webhooks: {
     description: 'Inbound webhook triggers',
     commands: {

package/src/components/agents/agent-avatar.tsx

@@ -13,6 +13,7 @@ function sanitizeSvg(svg: string): string {
 
 interface Props {
   seed?: string | null
+  avatarUrl?: string | null
   name: string
   size?: number
   className?: string
@@ -27,7 +28,7 @@ const STATUS_COLORS: Record<string, string> = {
 
 const HEART_PATH = 'M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z'
 
-export function AgentAvatar({ seed, name, size = 32, className = '', status, heartbeatPulse }: Props) {
+export function AgentAvatar({ seed, avatarUrl, name, size = 32, className = '', status, heartbeatPulse }: Props) {
   const svgHtml = useMemo(() => {
     if (!seed) return null
     return sanitizeSvg(multiavatar(seed))
@@ -53,6 +54,19 @@ export function AgentAvatar({ seed, name, size = 32, className = '', status, hea
     </svg>
   ) : null
 
+  if (avatarUrl) {
+    return (
+      <div className={`relative shrink-0 ${className}`} style={{ width: size, height: size }}>
+        <div className="rounded-full overflow-hidden w-full h-full">
+          {/* eslint-disable-next-line @next/next/no-img-element */}
+          <img src={avatarUrl} alt={name} className="w-full h-full object-cover" draggable={false} />
+        </div>
+        {heartEl}
+        {dot}
+      </div>
+    )
+  }
+
   if (svgHtml) {
     return (
       <div className={`relative shrink-0 ${className}`} style={{ width: size, height: size }}>

package/src/components/agents/agent-card.tsx

@@ -6,7 +6,7 @@ import { useAppStore } from '@/stores/use-app-store'
 import { useChatStore } from '@/stores/use-chat-store'
 import { useWs } from '@/hooks/use-ws'
 import { api } from '@/lib/api-client'
-import { createAgent, deleteAgent } from '@/lib/agents'
+import { deleteAgent } from '@/lib/agents'
 import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter } from '@/components/ui/dialog'
 import {
   DropdownMenu,
@@ -79,11 +79,18 @@ export function AgentCard({ agent, isDefault, isRunning, isOnline, isSelected, o
     setRunning(false)
   }
 
+  const [cloning, setCloning] = useState(false)
   const handleDuplicate = async () => {
-    const { id: _id, createdAt: _ca, updatedAt: _ua, ...rest } = agent
-    await createAgent({ ...rest, name: agent.name + ' (Copy)' })
-    await loadAgents()
-    toast.success('Agent duplicated')
+    setCloning(true)
+    try {
+      await api('POST', `/agents/${agent.id}/clone`)
+      await loadAgents()
+      toast.success('Agent duplicated')
+    } catch (err: unknown) {
+      toast.error(err instanceof Error ? err.message : String(err))
+    } finally {
+      setCloning(false)
+    }
   }
 
   const handleDelete = async () => {
@@ -140,7 +147,9 @@ export function AgentCard({ agent, isDefault, isRunning, isOnline, isSelected, o
             <DropdownMenuItem onClick={() => { togglePinAgent(agent.id); toast.success(agent.pinned ? 'Agent unpinned' : 'Agent pinned') }}>
               {agent.pinned ? 'Unpin' : 'Pin'}
             </DropdownMenuItem>
-            <DropdownMenuItem onClick={handleDuplicate}>Duplicate</DropdownMenuItem>
+            <DropdownMenuItem onClick={handleDuplicate} disabled={cloning}>
+              {cloning ? 'Duplicating...' : 'Duplicate'}
+            </DropdownMenuItem>
             {!isDefault && onSetDefault && (
               <DropdownMenuItem onClick={() => { onSetDefault(agent.id); toast.success(`${agent.name} set as default`) }}>Set Default</DropdownMenuItem>
             )}
@@ -157,6 +166,7 @@ export function AgentCard({ agent, isDefault, isRunning, isOnline, isSelected, o
         <div className="flex items-center gap-2.5">
           <AgentAvatar
             seed={agent.avatarSeed}
+            avatarUrl={agent.avatarUrl}
             name={agent.name}
             size={28}
             status={isRunning ? 'busy' : isOnline ? 'online' : undefined}
@@ -216,6 +226,28 @@ export function AgentCard({ agent, isDefault, isRunning, isOnline, isSelected, o
             <span>Cost: ${agent.totalCost.toFixed(2)}</span>
           )}
         </div>
+        {typeof agent.monthlyBudget === 'number' && agent.monthlyBudget > 0 && (
+          <div className="mt-2">
+            <div className="flex items-center justify-between text-[10px] text-text-3/60 mb-1">
+              <span>${(agent.monthlySpend ?? 0).toFixed(2)} / ${agent.monthlyBudget.toFixed(2)}</span>
+              <span className={`font-600 ${(agent.monthlySpend ?? 0) >= agent.monthlyBudget ? 'text-red-400' : 'text-text-3/50'}`}>
+                {agent.budgetAction === 'block' ? 'hard cap' : 'soft cap'}
+              </span>
+            </div>
+            <div className="h-1 rounded-full bg-white/[0.06] overflow-hidden">
+              <div
+                className={`h-full rounded-full transition-all duration-300 ${
+                  (agent.monthlySpend ?? 0) >= agent.monthlyBudget
+                    ? 'bg-red-400'
+                    : (agent.monthlySpend ?? 0) >= agent.monthlyBudget * 0.8
+                      ? 'bg-amber-400'
+                      : 'bg-accent'
+                }`}
+                style={{ width: `${Math.min(100, ((agent.monthlySpend ?? 0) / agent.monthlyBudget) * 100)}%` }}
+              />
+            </div>
+          </div>
+        )}
       </div>
 
       <Dialog open={dialogOpen} onOpenChange={setDialogOpen}>

package/src/components/agents/agent-chat-list.tsx

@@ -5,6 +5,8 @@ import { useAppStore } from '@/stores/use-app-store'
 import { useChatStore } from '@/stores/use-chat-store'
 import { useChatroomStore } from '@/stores/use-chatroom-store'
 import { fetchMessages } from '@/lib/sessions'
+import { api } from '@/lib/api-client'
+import { ConfirmDialog } from '@/components/shared/confirm-dialog'
 import type { Agent, Session } from '@/types'
 import { AgentAvatar } from './agent-avatar'
 import { toast } from 'sonner'
@@ -32,6 +34,39 @@ export function AgentChatList({ inSidebar, onSelect }: Props) {
   const chatrooms = useChatroomStore((s) => s.chatrooms)
   const chatroomStreaming = useChatroomStore((s) => s.streamingAgents)
   const [search, setSearch] = useState('')
+  const [bulkMode, setBulkMode] = useState(false)
+  const [selectedIds, setSelectedIds] = useState<Set<string>>(new Set())
+  const [confirmBulkDelete, setConfirmBulkDelete] = useState(false)
+  const loadSessions = useAppStore((s) => s.loadSessions)
+
+  const toggleSelected = useCallback((id: string) => {
+    setSelectedIds((prev) => {
+      const next = new Set(prev)
+      if (next.has(id)) next.delete(id)
+      else next.add(id)
+      return next
+    })
+  }, [])
+
+  const handleBulkDelete = useCallback(async () => {
+    // Collect session IDs for selected agents
+    const sessionIds = [...selectedIds]
+      .map((agentId) => {
+        const agent = agents[agentId]
+        return agent?.threadSessionId
+      })
+      .filter(Boolean) as string[]
+    if (!sessionIds.length) { toast.error('No chats to delete'); return }
+    try {
+      await api('DELETE', '/sessions', { ids: sessionIds })
+      await loadSessions()
+      toast.success(`Deleted ${sessionIds.length} chat(s)`)
+      setBulkMode(false)
+      setSelectedIds(new Set())
+    } catch {
+      toast.error('Failed to delete chats')
+    }
+  }, [selectedIds, agents, loadSessions])
 
   // FLIP animation refs
   const rowRefs = useRef<Map<string, HTMLElement>>(new Map())
@@ -169,7 +204,7 @@ export function AgentChatList({ inSidebar, onSelect }: Props) {
 
   return (
     <div className="flex-1 overflow-y-auto">
-      {/* Filter control */}
+      {/* Filter control + bulk mode toggle */}
       {sortedAgents.length > 2 && (
         <div className="flex items-center gap-1 px-4 pt-2.5 pb-1">
           {(['all', 'active', 'recent'] as const).map((f) => (
@@ -185,6 +220,28 @@ export function AgentChatList({ inSidebar, onSelect }: Props) {
               {f}
             </button>
           ))}
+          <button
+            type="button"
+            onClick={() => { setBulkMode(!bulkMode); setSelectedIds(new Set()) }}
+            aria-label={bulkMode ? 'Exit selection mode' : 'Select chats'}
+            className={`ml-auto label-mono px-2.5 py-1 rounded-[6px] border-none cursor-pointer transition-colors
+              ${bulkMode ? 'bg-accent-soft text-accent-bright' : 'bg-transparent text-text-3 hover:text-text-2 hover:bg-white/[0.04]'}`}
+          >
+            {bulkMode ? 'Cancel' : 'Select'}
+          </button>
+        </div>
+      )}
+      {/* Bulk action bar */}
+      {bulkMode && selectedIds.size > 0 && (
+        <div className="flex items-center gap-2 px-4 py-2 bg-white/[0.02] border-b border-white/[0.04]">
+          <span className="text-[12px] text-text-2 font-500 flex-1">{selectedIds.size} selected</span>
+          <button
+            onClick={() => setConfirmBulkDelete(true)}
+            className="px-3 py-1.5 rounded-[8px] border-none bg-red-500/10 text-red-400 text-[12px] font-600 cursor-pointer hover:bg-red-500/20 transition-colors"
+            style={{ fontFamily: 'inherit' }}
+          >
+            Delete
+          </button>
         </div>
       )}
       {(sortedAgents.length > 5 || search) && (
@@ -219,11 +276,21 @@ export function AgentChatList({ inSidebar, onSelect }: Props) {
                 ${isActive
                   ? 'bg-accent-soft/80 border border-accent-bright/20'
                   : 'bg-transparent hover:bg-white/[0.02]'}`}
-              onClick={() => handleSelect(agent)}
+              onClick={() => bulkMode ? toggleSelected(agent.id) : handleSelect(agent)}
             >
               <div className="flex items-center gap-2.5">
+                {bulkMode && (
+                  <div className={`w-5 h-5 rounded-[6px] border-2 flex items-center justify-center shrink-0 transition-colors
+                    ${selectedIds.has(agent.id) ? 'bg-accent-bright border-accent-bright' : 'border-white/20 bg-transparent'}`}>
+                    {selectedIds.has(agent.id) && (
+                      <svg width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="white" strokeWidth="3" strokeLinecap="round" strokeLinejoin="round">
+                        <polyline points="20 6 9 17 4 12" />
+                      </svg>
+                    )}
+                  </div>
+                )}
                 <div className="relative shrink-0">
-                  <AgentAvatar seed={agent.avatarSeed || null} name={agent.name} size={36} />
+                  <AgentAvatar seed={agent.avatarSeed || null} avatarUrl={agent.avatarUrl} name={agent.name} size={36} />
                   <div className={`absolute -bottom-0.5 -right-0.5 w-2.5 h-2.5 rounded-full border-2 border-bg ${
                     isWorking ? 'bg-emerald-400 shadow-[0_0_6px_rgba(52,211,153,0.4)]' : 'bg-text-3/30'
                   }`} />
@@ -303,6 +370,15 @@ export function AgentChatList({ inSidebar, onSelect }: Props) {
           )
         })}
       </div>
+      <ConfirmDialog
+        open={confirmBulkDelete}
+        title="Delete Chats"
+        message={`Delete ${selectedIds.size} chat(s)? This cannot be undone.`}
+        confirmLabel="Delete"
+        danger
+        onConfirm={() => { setConfirmBulkDelete(false); handleBulkDelete() }}
+        onCancel={() => setConfirmBulkDelete(false)}
+      />
     </div>
   )
 }