@swarmclawai/swarmclaw 0.6.3 → 0.6.6

package/src/app/api/wallets/route.ts

@@ -0,0 +1,74 @@
+import { NextResponse } from 'next/server'
+import { genId } from '@/lib/id'
+import { loadWallets, upsertWallet, loadAgents, saveAgents } from '@/lib/server/storage'
+import { generateSolanaKeypair } from '@/lib/server/solana'
+import { notify } from '@/lib/server/ws-hub'
+import type { AgentWallet, WalletChain } from '@/types'
+export const dynamic = 'force-dynamic'
+
+/** Strip encryptedPrivateKey from wallet for safe API responses */
+function stripPrivateKey(wallet: Record<string, unknown>): Record<string, unknown> {
+  return Object.fromEntries(Object.entries(wallet).filter(([k]) => k !== 'encryptedPrivateKey'))
+}
+
+export async function GET() {
+  const wallets = loadWallets() as Record<string, AgentWallet>
+  const safe = Object.fromEntries(
+    Object.entries(wallets).map(([id, w]) => [id, stripPrivateKey(w as unknown as Record<string, unknown>)]),
+  )
+  return NextResponse.json(safe)
+}
+
+export async function POST(req: Request) {
+  const body = await req.json()
+  const agentId = typeof body.agentId === 'string' ? body.agentId.trim() : ''
+  if (!agentId) {
+    return NextResponse.json({ error: 'agentId is required' }, { status: 400 })
+  }
+
+  const agents = loadAgents()
+  if (!agents[agentId]) {
+    return NextResponse.json({ error: 'Agent not found' }, { status: 404 })
+  }
+
+  // Check agent doesn't already have a wallet
+  const existing = loadWallets() as Record<string, AgentWallet>
+  const hasWallet = Object.values(existing).some((w) => w.agentId === agentId)
+  if (hasWallet) {
+    return NextResponse.json({ error: 'Agent already has a wallet' }, { status: 409 })
+  }
+
+  const chain: WalletChain = body.chain === 'solana' ? 'solana' : 'solana' // extensible later
+  const { publicKey, encryptedPrivateKey } = generateSolanaKeypair()
+
+  const id = genId()
+  const now = Date.now()
+
+  const wallet: AgentWallet = {
+    id,
+    agentId,
+    chain,
+    publicKey,
+    encryptedPrivateKey,
+    label: typeof body.label === 'string' ? body.label : undefined,
+    spendingLimitLamports: typeof body.spendingLimitLamports === 'number' ? body.spendingLimitLamports : 100_000_000,
+    dailyLimitLamports: typeof body.dailyLimitLamports === 'number' ? body.dailyLimitLamports : 1_000_000_000,
+    requireApproval: body.requireApproval !== false,
+    createdAt: now,
+    updatedAt: now,
+  }
+
+  upsertWallet(id, wallet)
+
+  // Link wallet to agent
+  const agent = agents[agentId]
+  agent.walletId = id
+  agent.updatedAt = now
+  agents[agentId] = agent
+  saveAgents(agents)
+
+  notify('wallets')
+  notify('agents')
+
+  return NextResponse.json(stripPrivateKey(wallet as unknown as Record<string, unknown>))
+}

package/src/app/globals.css

@@ -215,6 +215,14 @@ textarea:hover::-webkit-scrollbar { width: 6px; }
   to { opacity: 1; transform: translateY(0); }
 }
 @keyframes spin { to { transform: rotate(360deg); } }
+@keyframes pulse-glow {
+  0%, 100% { transform: scale(1); opacity: 0.45; }
+  50% { transform: scale(1.2); opacity: 0.85; }
+}
+@keyframes avatar-pulse {
+  0%, 100% { transform: scale(1); }
+  50% { transform: scale(1.1); }
+}
 @keyframes slide-in-left {
   from { transform: translateX(-100%); }
   to { transform: translateX(0); }

package/src/app/page.tsx

@@ -5,6 +5,7 @@ import { useAppStore } from '@/stores/use-app-store'
 import { initAudioContext } from '@/lib/tts'
 import { getStoredAccessKey, clearStoredAccessKey, api } from '@/lib/api-client'
 import { connectWs, disconnectWs } from '@/lib/ws-client'
+import { fetchWithTimeout } from '@/lib/fetch-timeout'
 import { useWs } from '@/hooks/use-ws'
 import { AccessKeyGate } from '@/components/auth/access-key-gate'
 import { UserPicker } from '@/components/auth/user-picker'
@@ -12,6 +13,8 @@ import { SetupWizard } from '@/components/auth/setup-wizard'
 import { AppLayout } from '@/components/layout/app-layout'
 import { useViewRouter } from '@/hooks/use-view-router'
 
+const AUTH_CHECK_TIMEOUT_MS = 8_000
+
 function FullScreenLoader() {
   return (
     <div className="h-full flex flex-col items-center justify-center bg-bg overflow-hidden select-none">
@@ -158,11 +161,11 @@ export default function Home() {
     }
 
     try {
-      const res = await fetch('/api/auth', {
+      const res = await fetchWithTimeout('/api/auth', {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
         body: JSON.stringify({ key }),
-      })
+      }, AUTH_CHECK_TIMEOUT_MS)
       if (res.ok) {
         setAuthenticated(true)
       } else {
@@ -171,8 +174,9 @@ export default function Home() {
       }
     } catch {
       setAuthenticated(true)
+    } finally {
+      setAuthChecked(true)
     }
-    setAuthChecked(true)
   }, [])
 
   // After auth, try to restore username from server settings

package/src/cli/index.js

@@ -485,6 +485,21 @@ const COMMAND_GROUPS = [
       }),
     ],
   },
+  {
+    name: 'wallets',
+    description: 'Manage agent wallets and wallet transactions',
+    commands: [
+      cmd('list', 'GET', '/wallets', 'List wallets'),
+      cmd('get', 'GET', '/wallets/:id', 'Get wallet by id'),
+      cmd('create', 'POST', '/wallets', 'Create wallet', { expectsJsonBody: true }),
+      cmd('update', 'PATCH', '/wallets/:id', 'Update wallet settings', { expectsJsonBody: true }),
+      cmd('delete', 'DELETE', '/wallets/:id', 'Delete wallet'),
+      cmd('send', 'POST', '/wallets/:id/send', 'Send funds from wallet', { expectsJsonBody: true }),
+      cmd('approve', 'POST', '/wallets/:id/approve', 'Approve or deny a pending wallet transaction', { expectsJsonBody: true }),
+      cmd('transactions', 'GET', '/wallets/:id/transactions', 'List wallet transactions'),
+      cmd('balance-history', 'GET', '/wallets/:id/balance-history', 'Get wallet balance history'),
+    ],
+  },
   {
     name: 'upload',
     description: 'Upload raw file/blob',

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

@@ -157,6 +157,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}

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

@@ -223,7 +223,7 @@ export function AgentChatList({ inSidebar, onSelect }: Props) {
             >
               <div className="flex items-center gap-2.5">
                 <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'
                   }`} />

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

@@ -7,7 +7,8 @@ import { api } from '@/lib/api-client'
 import { BottomSheet } from '@/components/shared/bottom-sheet'
 import { toast } from 'sonner'
 import { ModelCombobox } from '@/components/shared/model-combobox'
-import type { ProviderType, ClaudeSkill } from '@/types'
+import type { ProviderType, ClaudeSkill, AgentWallet } from '@/types'
+import { WalletSection } from '@/components/wallets/wallet-section'
 import { AVAILABLE_TOOLS, PLATFORM_TOOLS } from '@/lib/tool-definitions'
 import { NATIVE_CAPABILITY_PROVIDER_IDS, NON_LANGGRAPH_PROVIDER_IDS } from '@/lib/provider-sets'
 import { AgentAvatar } from './agent-avatar'
@@ -105,12 +106,15 @@ export function AgentSheet() {
   const [openclawEnabled, setOpenclawEnabled] = useState(false)
   const [projectId, setProjectId] = useState<string | undefined>(undefined)
   const [avatarSeed, setAvatarSeed] = useState('')
+  const [avatarUrl, setAvatarUrl] = useState<string | null>(null)
+  const [uploading, setUploading] = useState(false)
   const [thinkingLevel, setThinkingLevel] = useState<'' | 'minimal' | 'low' | 'medium' | 'high'>('')
   const [voiceId, setVoiceId] = useState('')
   const [heartbeatEnabled, setHeartbeatEnabled] = useState(false)
   const [heartbeatIntervalSec, setHeartbeatIntervalSec] = useState('')  // '' = default (30m)
   const [heartbeatModel, setHeartbeatModel] = useState('')
   const [heartbeatPrompt, setHeartbeatPrompt] = useState('')
+  const [agentWallet, setAgentWallet] = useState<(Omit<AgentWallet, 'encryptedPrivateKey'> & { balanceLamports?: number; balanceSol?: number }) | null>(null)
   const [addingKey, setAddingKey] = useState(false)
   const [newKeyName, setNewKeyName] = useState('')
   const [newKeyValue, setNewKeyValue] = useState('')
@@ -178,18 +182,27 @@ export function AgentSheet() {
         setMcpDisabledTools(editing.mcpDisabledTools || [])
         setFallbackCredentialIds(editing.fallbackCredentialIds || [])
         // platformAssignScope derived from isOrchestrator — no separate state
-        setCapabilities(editing.capabilities || [])
+        setCapabilities(Array.isArray(editing.capabilities) ? editing.capabilities : [])
         setCapInput('')
         setOllamaMode(editing.credentialId && editing.provider === 'ollama' ? 'cloud' : 'local')
         setOpenclawEnabled(editing.provider === 'openclaw')
         setProjectId(editing.projectId)
         setAvatarSeed(editing.avatarSeed || crypto.randomUUID().slice(0, 8))
+        setAvatarUrl(editing.avatarUrl || null)
         setThinkingLevel(editing.thinkingLevel || '')
         setVoiceId(editing.elevenLabsVoiceId || '')
         setHeartbeatEnabled(editing.heartbeatEnabled || false)
         setHeartbeatIntervalSec(parseDurationToSec(editing.heartbeatInterval, editing.heartbeatIntervalSec))
         setHeartbeatModel(editing.heartbeatModel || '')
         setHeartbeatPrompt(editing.heartbeatPrompt || '')
+        // Load wallet if agent has one
+        if (editing.walletId) {
+          api<Omit<AgentWallet, 'encryptedPrivateKey'> & { balanceLamports?: number; balanceSol?: number }>('GET', `/wallets/${editing.walletId}`)
+            .then(setAgentWallet)
+            .catch(() => setAgentWallet(null))
+        } else {
+          setAgentWallet(null)
+        }
       } else {
         setName('')
         setDescription('')
@@ -310,6 +323,7 @@ export function AgentSheet() {
       capabilities,
       projectId: projectId || undefined,
       avatarSeed: avatarSeed.trim() || undefined,
+      avatarUrl: avatarUrl || null,
       thinkingLevel: thinkingLevel || undefined,
       elevenLabsVoiceId: voiceId.trim() || null,
       heartbeatEnabled,
@@ -480,30 +494,82 @@ export function AgentSheet() {
 
       <div className="mb-8">
         <SectionLabel>Avatar</SectionLabel>
-        <div className="flex items-center gap-3">
-          <AgentAvatar seed={avatarSeed || null} name={name || 'A'} size={40} />
-          <input
-            type="text"
-            value={avatarSeed}
-            onChange={(e) => setAvatarSeed(e.target.value)}
-            placeholder="Avatar seed (any text)"
-            className={inputClass}
-            style={{ fontFamily: 'inherit', flex: 1 }}
-          />
-          <button
-            type="button"
-            onClick={() => setAvatarSeed(crypto.randomUUID().slice(0, 8))}
-            className="inline-flex items-center gap-1.5 px-3 py-2 rounded-[10px] border border-white/[0.08] bg-transparent text-text-3 text-[12px] font-600 cursor-pointer transition-all hover:bg-white/[0.04] hover:text-text-2 active:scale-95 shrink-0"
-            style={{ fontFamily: 'inherit' }}
-            title="Shuffle avatar"
-          >
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round">
-              <rect x="4" y="4" width="16" height="16" rx="2" />
-              <circle cx="9" cy="9" r="1" fill="currentColor" />
-              <circle cx="15" cy="15" r="1" fill="currentColor" />
-            </svg>
-            Shuffle
-          </button>
+        <div className="flex flex-col gap-3">
+          <div className="flex items-center gap-4">
+            <div className="relative group shrink-0">
+              <AgentAvatar seed={avatarUrl ? null : (avatarSeed || null)} avatarUrl={avatarUrl} name={name || 'A'} size={64} />
+              <label className="absolute inset-0 rounded-full flex items-center justify-center bg-black/50 opacity-0 group-hover:opacity-100 transition-opacity cursor-pointer">
+                <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="white" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+                  <path d="M23 19a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h4l2-3h6l2 3h4a2 2 0 0 1 2 2z" />
+                  <circle cx="12" cy="13" r="4" />
+                </svg>
+                <input
+                  type="file"
+                  accept="image/*"
+                  className="hidden"
+                  onChange={async (e) => {
+                    const file = e.target.files?.[0]
+                    if (!file) return
+                    setUploading(true)
+                    try {
+                      const res = await fetch('/api/upload', {
+                        method: 'POST',
+                        headers: { 'x-filename': file.name },
+                        body: await file.arrayBuffer(),
+                      })
+                      const data = await res.json()
+                      if (data.url) {
+                        setAvatarUrl(data.url)
+                        setAvatarSeed('')
+                      }
+                    } finally {
+                      setUploading(false)
+                      e.target.value = ''
+                    }
+                  }}
+                />
+              </label>
+            </div>
+            <div className="flex flex-col gap-1.5 flex-1 min-w-0">
+              {avatarUrl && (
+                <button
+                  type="button"
+                  onClick={() => {
+                    setAvatarUrl(null)
+                    if (!avatarSeed) setAvatarSeed(crypto.randomUUID().slice(0, 8))
+                  }}
+                  className="text-[11px] text-text-3 hover:text-red-400 transition-colors self-start cursor-pointer"
+                >
+                  Remove custom image
+                </button>
+              )}
+              {uploading && <span className="text-[11px] text-text-3">Uploading...</span>}
+            </div>
+          </div>
+          <div className="flex items-center gap-3">
+            <input
+              type="text"
+              value={avatarSeed}
+              onChange={(e) => { setAvatarSeed(e.target.value); setAvatarUrl(null) }}
+              placeholder="Avatar seed (any text)"
+              className={inputClass}
+              style={{ fontFamily: 'inherit', flex: 1 }}
+            />
+            <button
+              type="button"
+              onClick={() => { setAvatarSeed(crypto.randomUUID().slice(0, 8)); setAvatarUrl(null) }}
+              className="inline-flex items-center gap-1.5 px-3 py-2 rounded-[10px] border border-white/[0.08] bg-transparent text-text-3 text-[12px] font-600 cursor-pointer transition-all hover:bg-white/[0.04] hover:text-text-2 active:scale-95 shrink-0"
+              style={{ fontFamily: 'inherit' }}
+              title="Shuffle avatar"
+            >
+              <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round">
+                <rect x="4" y="4" width="16" height="16" rx="2" />
+                <circle cx="9" cy="9" r="1" fill="currentColor" />
+                <circle cx="15" cy="15" r="1" fill="currentColor" />
+              </svg>
+              Shuffle
+            </button>
+          </div>
         </div>
       </div>
 
@@ -666,6 +732,26 @@ export function AgentSheet() {
         <p className="text-[11px] text-text-3/70 mt-1.5">Periodic check-in runs on idle sessions using this agent. Processes pending events and monitors status.</p>
       </div>
 
+      {/* Wallet Section */}
+      {editingId && (
+        <WalletSection
+          agentId={editingId}
+          wallet={agentWallet}
+          onWalletCreated={async () => {
+            await loadAgents()
+            // Fetch the wallet for this agent
+            try {
+              const wallets = await api<Record<string, Omit<AgentWallet, 'encryptedPrivateKey'>>>('GET', '/wallets')
+              const match = Object.values(wallets).find((w) => w.agentId === editingId)
+              if (match) {
+                const detail = await api<Omit<AgentWallet, 'encryptedPrivateKey'> & { balanceLamports?: number; balanceSol?: number }>('GET', `/wallets/${match.id}`)
+                setAgentWallet(detail)
+              }
+            } catch { /* ignore */ }
+          }}
+        />
+      )}
+
       {provider !== 'openclaw' && (
         <div className="mb-8">
           <label className="flex items-center gap-2 font-display text-[12px] font-600 text-text-2 uppercase tracking-[0.08em] mb-2">

package/src/components/auth/access-key-gate.tsx

@@ -2,11 +2,14 @@
 
 import { useState, useEffect } from 'react'
 import { setStoredAccessKey } from '@/lib/api-client'
+import { fetchWithTimeout } from '@/lib/fetch-timeout'
 
 interface AccessKeyGateProps {
   onAuthenticated: () => void
 }
 
+const AUTH_CHECK_TIMEOUT_MS = 8_000
+
 export function AccessKeyGate({ onAuthenticated }: AccessKeyGateProps) {
   const [key, setKey] = useState('')
   const [error, setError] = useState('')
@@ -19,16 +22,22 @@ export function AccessKeyGate({ onAuthenticated }: AccessKeyGateProps) {
   const [copied, setCopied] = useState(false)
 
   useEffect(() => {
-    fetch('/api/auth')
-      .then((r) => r.json())
-      .then((data) => {
-        if (data.firstTime && data.key) {
+    let cancelled = false
+    ;(async () => {
+      try {
+        const res = await fetchWithTimeout('/api/auth', {}, AUTH_CHECK_TIMEOUT_MS)
+        const data = await res.json().catch(() => ({}))
+        if (!cancelled && data.firstTime && data.key) {
           setFirstTime(true)
           setGeneratedKey(data.key)
         }
-      })
-      .catch((err) => console.error('Auth check failed:', err))
-      .finally(() => setChecking(false))
+      } catch (err) {
+        console.error('Auth check failed:', err)
+      } finally {
+        if (!cancelled) setChecking(false)
+      }
+    })()
+    return () => { cancelled = true }
   }, [])
 
   const handleCopyKey = async () => {
@@ -44,14 +53,16 @@ export function AccessKeyGate({ onAuthenticated }: AccessKeyGateProps) {
   const handleClaimKey = async () => {
     setLoading(true)
     try {
-      const res = await fetch('/api/auth', {
+      const res = await fetchWithTimeout('/api/auth', {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
         body: JSON.stringify({ key: generatedKey }),
-      })
+      }, AUTH_CHECK_TIMEOUT_MS)
       if (res.ok) {
         setStoredAccessKey(generatedKey)
         onAuthenticated()
+      } else {
+        setError('Invalid access key')
       }
     } catch {
       setError('Connection failed')
@@ -69,11 +80,11 @@ export function AccessKeyGate({ onAuthenticated }: AccessKeyGateProps) {
     setError('')
 
     try {
-      const res = await fetch('/api/auth', {
+      const res = await fetchWithTimeout('/api/auth', {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
         body: JSON.stringify({ key: trimmed }),
-      })
+      }, AUTH_CHECK_TIMEOUT_MS)
       if (res.ok) {
         setStoredAccessKey(trimmed)
         onAuthenticated()

package/src/components/chat/chat-area.tsx

@@ -146,8 +146,8 @@ export function ChatArea() {
     if (!sessionId) return
     try {
       const msgs = await fetchMessages(sessionId)
-      if (msgs.length > messagesLenRef.current) {
-        const newMsgs = msgs.slice(messagesLenRef.current)
+      if (msgs.length !== messagesLenRef.current) {
+        const newMsgs = msgs.length > messagesLenRef.current ? msgs.slice(messagesLenRef.current) : []
         setMessages(msgs)
         if (ttsEnabledRef.current && typeof document !== 'undefined' && document.visibilityState === 'visible') {
           const latestAssistant = [...newMsgs].reverse().find((m) => {