@swarmclawai/swarmclaw 0.5.1 → 0.5.2

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 SwarmClaw Contributors
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -81,7 +81,7 @@ curl -fsSL https://raw.githubusercontent.com/swarmclawai/swarmclaw/main/install.
 ```
 
 The installer resolves the latest stable release tag and installs that version by default.
-To pin a version: `SWARMCLAW_VERSION=v0.5.1 curl ... | bash`
+To pin a version: `SWARMCLAW_VERSION=v0.5.2 curl ... | bash`
 
 Or run locally from the repo (friendly for non-technical users):
 
@@ -600,4 +600,4 @@ swarmclaw memory maintenance
 
 ## License
 
-MIT
+[MIT](./LICENSE)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@swarmclawai/swarmclaw",
-  "version": "0.5.1",
+  "version": "0.5.2",
   "description": "Self-hosted AI agent orchestration dashboard — manage LLM providers, orchestrate agent swarms, schedule tasks, and bridge agents to chat platforms.",
   "license": "MIT",
   "repository": {
@@ -84,6 +84,7 @@
     "react-dom": "19.2.3",
     "react-icons": "^5.5.0",
     "react-markdown": "^10.1.0",
+    "recharts": "^3.7.0",
     "rehype-highlight": "^7.0.2",
     "remark-gfm": "^4.0.1",
     "sonner": "^2.0.7",

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

@@ -0,0 +1,30 @@
+import { NextResponse } from 'next/server'
+import { loadActivity } from '@/lib/server/storage'
+export const dynamic = 'force-dynamic'
+
+export async function GET(req: Request) {
+  const { searchParams } = new URL(req.url)
+  const entityType = searchParams.get('entityType')
+  const entityId = searchParams.get('entityId')
+  const action = searchParams.get('action')
+  const since = searchParams.get('since')
+  const limit = Math.min(200, Math.max(1, Number(searchParams.get('limit')) || 50))
+
+  const all = loadActivity()
+  let entries = Object.values(all) as Array<Record<string, unknown>>
+
+  if (entityType) entries = entries.filter((e) => e.entityType === entityType)
+  if (entityId) entries = entries.filter((e) => e.entityId === entityId)
+  if (action) entries = entries.filter((e) => e.action === action)
+  if (since) {
+    const sinceMs = Number(since)
+    if (Number.isFinite(sinceMs)) {
+      entries = entries.filter((e) => typeof e.timestamp === 'number' && e.timestamp >= sinceMs)
+    }
+  }
+
+  entries.sort((a, b) => (b.timestamp as number) - (a.timestamp as number))
+  entries = entries.slice(0, limit)
+
+  return NextResponse.json(entries)
+}

package/src/app/api/agents/[id]/route.ts

@@ -1,5 +1,5 @@
 import { NextResponse } from 'next/server'
-import { loadAgents, saveAgents, loadSessions, saveSessions } from '@/lib/server/storage'
+import { loadAgents, saveAgents, loadSessions, saveSessions, logActivity } from '@/lib/server/storage'
 import { normalizeProviderEndpoint } from '@/lib/openclaw-endpoint'
 import { mutateItem, notFound, type CollectionOps } from '@/lib/server/collection-helpers'
 
@@ -22,6 +22,7 @@ export async function PUT(req: Request, { params }: { params: Promise<{ id: stri
     return agent
   })
   if (!result) return notFound()
+  logActivity({ entityType: 'agent', entityId: id, action: 'updated', actor: 'user', summary: `Agent updated: "${result.name}"` })
   return NextResponse.json(result)
 }
 
@@ -33,6 +34,7 @@ export async function DELETE(_req: Request, { params }: { params: Promise<{ id:
     return agent
   })
   if (!result) return notFound()
+  logActivity({ entityType: 'agent', entityId: id, action: 'deleted', actor: 'user', summary: `Agent trashed: "${result.name}"` })
 
   // Detach sessions from the trashed agent
   const sessions = loadSessions()

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

@@ -1,6 +1,6 @@
 import { NextResponse } from 'next/server'
 import { genId } from '@/lib/id'
-import { loadAgents, saveAgents } from '@/lib/server/storage'
+import { loadAgents, saveAgents, logActivity } from '@/lib/server/storage'
 import { normalizeProviderEndpoint } from '@/lib/openclaw-endpoint'
 import { notify } from '@/lib/server/ws-hub'
 export const dynamic = 'force-dynamic'
@@ -33,6 +33,7 @@ export async function POST(req: Request) {
     updatedAt: now,
   }
   saveAgents(agents)
+  logActivity({ entityType: 'agent', entityId: id, action: 'created', actor: 'user', summary: `Agent created: "${agents[id].name}"` })
   notify('agents')
   return NextResponse.json(agents[id])
 }

package/src/app/api/connectors/[id]/route.ts

@@ -1,5 +1,5 @@
 import { NextResponse } from 'next/server'
-import { loadConnectors, saveConnectors } from '@/lib/server/storage'
+import { loadConnectors, saveConnectors, logActivity } from '@/lib/server/storage'
 import { notify } from '@/lib/server/ws-hub'
 import { notFound } from '@/lib/server/collection-helpers'
 
@@ -39,10 +39,13 @@ export async function PUT(req: Request, { params }: { params: Promise<{ id: stri
       const manager = await import('@/lib/server/connectors/manager')
       if (body.action === 'start') {
         await manager.startConnector(id)
+        logActivity({ entityType: 'connector', entityId: id, action: 'started', actor: 'user', summary: `Connector started: "${connector.name}"` })
       } else if (body.action === 'stop') {
         await manager.stopConnector(id)
+        logActivity({ entityType: 'connector', entityId: id, action: 'stopped', actor: 'user', summary: `Connector stopped: "${connector.name}"` })
       } else {
         await manager.repairConnector(id)
+        logActivity({ entityType: 'connector', entityId: id, action: 'started', actor: 'user', summary: `Connector repaired: "${connector.name}"` })
       }
     } catch (err: unknown) {
       // Re-read to get the error state saved by startConnector

package/src/app/api/openclaw/approvals/route.ts

@@ -17,6 +17,19 @@ export async function GET() {
   }
 }
 
+/* ── Conflict-detection: track recently resolved approval IDs in-process ── */
+const resolvedKey = '__swarmclaw_resolved_approvals__'
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const resolved: Map<string, number> = (globalThis as any)[resolvedKey] ?? ((globalThis as any)[resolvedKey] = new Map<string, number>())
+const RESOLVED_TTL_MS = 5 * 60 * 1000
+
+function pruneResolved() {
+  const cutoff = Date.now() - RESOLVED_TTL_MS
+  for (const [k, ts] of resolved) {
+    if (ts < cutoff) resolved.delete(k)
+  }
+}
+
 /** POST { id, decision } — resolve an execution approval */
 export async function POST(req: Request) {
   const body = await req.json()
@@ -31,6 +44,12 @@ export async function POST(req: Request) {
     return NextResponse.json({ error: 'Invalid decision' }, { status: 400 })
   }
 
+  // Conflict detection — prevent duplicate resolution
+  pruneResolved()
+  if (resolved.has(id)) {
+    return NextResponse.json({ error: 'Already resolved' }, { status: 409 })
+  }
+
   const gw = await ensureGatewayConnected()
   if (!gw) {
     return NextResponse.json({ error: 'OpenClaw gateway not connected' }, { status: 503 })
@@ -38,6 +57,7 @@ export async function POST(req: Request) {
 
   try {
     await gw.rpc('exec.approvals.resolve', { id, decision })
+    resolved.set(id, Date.now())
     return NextResponse.json({ ok: true })
   } catch (err: unknown) {
     const message = err instanceof Error ? err.message : String(err)

package/src/app/api/tasks/[id]/route.ts

@@ -1,6 +1,6 @@
 import { genId } from '@/lib/id'
 import { NextResponse } from 'next/server'
-import { loadTasks, saveTasks } from '@/lib/server/storage'
+import { loadTasks, saveTasks, logActivity } from '@/lib/server/storage'
 import { notFound } from '@/lib/server/collection-helpers'
 import { disableSessionHeartbeat, enqueueTask, validateCompletedTasksQueue } from '@/lib/server/queue'
 import { ensureTaskCompletionReport } from '@/lib/server/task-reports'
@@ -65,6 +65,7 @@ export async function PUT(req: Request, { params }: { params: Promise<{ id: stri
   }
 
   saveTasks(tasks)
+  logActivity({ entityType: 'task', entityId: id, action: 'updated', actor: 'user', summary: `Task updated: "${tasks[id].title}" (${prevStatus} → ${tasks[id].status})` })
   if (prevStatus !== tasks[id].status) {
     pushMainLoopEventToMainSessions({
       type: 'task_status_changed',
@@ -77,6 +78,40 @@ export async function PUT(req: Request, { params }: { params: Promise<{ id: stri
     disableSessionHeartbeat(tasks[id].sessionId)
   }
 
+  // Dependency check: cannot queue a task if any blocker is incomplete
+  if (tasks[id].status === 'queued') {
+    const blockers = Array.isArray(tasks[id].blockedBy) ? tasks[id].blockedBy : []
+    const incompleteBlocker = blockers.find((bid: string) => tasks[bid] && tasks[bid].status !== 'completed')
+    if (incompleteBlocker) {
+      // Revert status change and reject
+      tasks[id].status = prevStatus
+      tasks[id].updatedAt = Date.now()
+      saveTasks(tasks)
+      return NextResponse.json(
+        { error: 'Cannot queue: blocked by incomplete tasks', blockedBy: incompleteBlocker },
+        { status: 409 },
+      )
+    }
+  }
+
+  // When a task is completed, auto-unblock dependent tasks
+  if (tasks[id].status === 'completed') {
+    const blockedIds = Array.isArray(tasks[id].blocks) ? tasks[id].blocks as string[] : []
+    for (const blockedId of blockedIds) {
+      const blocked = tasks[blockedId]
+      if (!blocked) continue
+      const deps = Array.isArray(blocked.blockedBy) ? blocked.blockedBy as string[] : []
+      const allDone = deps.every((depId: string) => tasks[depId]?.status === 'completed')
+      if (allDone && (blocked.status === 'backlog' || blocked.status === 'todo')) {
+        blocked.status = 'queued'
+        blocked.queuedAt = Date.now()
+        blocked.updatedAt = Date.now()
+        saveTasks(tasks)
+        enqueueTask(blockedId)
+      }
+    }
+  }
+
   // If status changed to 'queued', enqueue it
   if (prevStatus !== 'queued' && tasks[id].status === 'queued') {
     enqueueTask(id)
@@ -96,6 +131,7 @@ export async function DELETE(_req: Request, { params }: { params: Promise<{ id:
   tasks[id].archivedAt = Date.now()
   tasks[id].updatedAt = Date.now()
   saveTasks(tasks)
+  logActivity({ entityType: 'task', entityId: id, action: 'deleted', actor: 'user', summary: `Task archived: "${tasks[id].title}"` })
   pushMainLoopEventToMainSessions({
     type: 'task_archived',
     text: `Task archived: "${tasks[id].title}" (${id}).`,

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

@@ -1,6 +1,6 @@
 import { NextResponse } from 'next/server'
 import { genId } from '@/lib/id'
-import { loadTasks, saveTasks, loadSettings } from '@/lib/server/storage'
+import { loadTasks, saveTasks, loadSettings, logActivity } from '@/lib/server/storage'
 import { enqueueTask, validateCompletedTasksQueue } from '@/lib/server/queue'
 import { ensureTaskCompletionReport } from '@/lib/server/task-reports'
 import { formatValidationFailure, validateTaskCompletion } from '@/lib/server/task-validation'
@@ -88,6 +88,11 @@ export async function POST(req: Request) {
     retryScheduledAt: null,
     deadLetteredAt: null,
     checkpoint: null,
+    blockedBy: Array.isArray(body.blockedBy) ? body.blockedBy.filter((s: unknown) => typeof s === 'string') : [],
+    blocks: Array.isArray(body.blocks) ? body.blocks.filter((s: unknown) => typeof s === 'string') : [],
+    tags: Array.isArray(body.tags) ? body.tags.filter((s: unknown) => typeof s === 'string') : [],
+    dueAt: typeof body.dueAt === 'number' ? body.dueAt : null,
+    customFields: body.customFields && typeof body.customFields === 'object' ? body.customFields : undefined,
   }
 
   if (tasks[id].status === 'completed') {
@@ -106,6 +111,7 @@ export async function POST(req: Request) {
   }
 
   saveTasks(tasks)
+  logActivity({ entityType: 'task', entityId: id, action: 'created', actor: 'user', summary: `Task created: "${tasks[id].title}"` })
   pushMainLoopEventToMainSessions({
     type: 'task_created',
     text: `Task created: "${tasks[id].title}" (${id}) with status ${tasks[id].status}.`,

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

@@ -1,37 +1,89 @@
 import { NextResponse } from 'next/server'
 import { loadUsage } from '@/lib/server/storage'
+import type { UsageRecord } from '@/types'
 export const dynamic = 'force-dynamic'
 
+type Range = '24h' | '7d' | '30d'
 
-export async function GET(_req: Request) {
-  const usage = loadUsage()
-  // Compute summary
+const RANGE_MS: Record<Range, number> = {
+  '24h': 24 * 60 * 60 * 1000,
+  '7d': 7 * 24 * 60 * 60 * 1000,
+  '30d': 30 * 24 * 60 * 60 * 1000,
+}
+
+function bucketKey(ts: number, range: Range): string {
+  const d = new Date(ts)
+  if (range === '24h') {
+    // hourly buckets: "2026-03-01T14"
+    return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}T${String(d.getHours()).padStart(2, '0')}`
+  }
+  // daily buckets: "2026-03-01"
+  return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`
+}
+
+export async function GET(req: Request) {
+  const { searchParams } = new URL(req.url)
+  const rangeParam = searchParams.get('range') ?? '24h'
+  const range: Range = rangeParam === '7d' || rangeParam === '30d' ? rangeParam : '24h'
+
+  const now = Date.now()
+  const cutoff = now - RANGE_MS[range]
+
+  const usage = loadUsage() as Record<string, UsageRecord[]>
+
+  // Flatten and filter by time range
+  const records: UsageRecord[] = []
+  for (const sessionRecords of Object.values(usage)) {
+    for (const r of sessionRecords) {
+      if ((r.timestamp || 0) >= cutoff) {
+        records.push(r)
+      }
+    }
+  }
+
+  // Compute summaries
   let totalTokens = 0
   let totalCost = 0
-  const bySession: Record<string, { tokens: number; cost: number; count: number }> = {}
-  const byProvider: Record<string, { tokens: number; cost: number; count: number }> = {}
-
-  for (const [sessionId, records] of Object.entries(usage)) {
-    for (const r of records) {
-      totalTokens += r.totalTokens || 0
-      totalCost += r.estimatedCost || 0
-      if (!bySession[sessionId]) bySession[sessionId] = { tokens: 0, cost: 0, count: 0 }
-      bySession[sessionId].tokens += r.totalTokens || 0
-      bySession[sessionId].cost += r.estimatedCost || 0
-      bySession[sessionId].count++
-      const prov = r.provider || 'unknown'
-      if (!byProvider[prov]) byProvider[prov] = { tokens: 0, cost: 0, count: 0 }
-      byProvider[prov].tokens += r.totalTokens || 0
-      byProvider[prov].cost += r.estimatedCost || 0
-      byProvider[prov].count++
-    }
+  const byAgent: Record<string, { tokens: number; cost: number }> = {}
+  const byProvider: Record<string, { tokens: number; cost: number }> = {}
+  const bucketMap: Record<string, { tokens: number; cost: number }> = {}
+
+  for (const r of records) {
+    const tokens = r.totalTokens || 0
+    const cost = r.estimatedCost || 0
+    totalTokens += tokens
+    totalCost += cost
+
+    // by provider
+    const prov = r.provider || 'unknown'
+    if (!byProvider[prov]) byProvider[prov] = { tokens: 0, cost: 0 }
+    byProvider[prov].tokens += tokens
+    byProvider[prov].cost += cost
+
+    // by agent (using sessionId as proxy — agents map to sessions)
+    const agentKey = r.sessionId || 'unknown'
+    if (!byAgent[agentKey]) byAgent[agentKey] = { tokens: 0, cost: 0 }
+    byAgent[agentKey].tokens += tokens
+    byAgent[agentKey].cost += cost
+
+    // time series bucketing
+    const bk = bucketKey(r.timestamp || now, range)
+    if (!bucketMap[bk]) bucketMap[bk] = { tokens: 0, cost: 0 }
+    bucketMap[bk].tokens += tokens
+    bucketMap[bk].cost += cost
   }
 
+  // Sort time series
+  const timeSeries = Object.entries(bucketMap)
+    .sort(([a], [b]) => a.localeCompare(b))
+    .map(([bucket, data]) => ({ bucket, tokens: data.tokens, cost: Math.round(data.cost * 10000) / 10000 }))
+
   return NextResponse.json({
+    records,
     totalTokens,
     totalCost: Math.round(totalCost * 10000) / 10000,
-    bySession,
+    byAgent,
     byProvider,
-    raw: usage,
+    timeSeries,
   })
 }

package/src/app/api/webhooks/[id]/route.ts

@@ -1,9 +1,10 @@
 import { genId } from '@/lib/id'
 import { NextResponse } from 'next/server'
-import { loadAgents, loadSessions, loadWebhooks, saveSessions, saveWebhooks, appendWebhookLog } from '@/lib/server/storage'
+import { loadAgents, loadSessions, loadWebhooks, saveSessions, saveWebhooks, appendWebhookLog, upsertWebhookRetry } from '@/lib/server/storage'
 import { WORKSPACE_DIR } from '@/lib/server/data-dir'
 import { enqueueSessionRun } from '@/lib/server/session-run-manager'
 import { mutateItem, deleteItem, notFound, type CollectionOps } from '@/lib/server/collection-helpers'
+import type { WebhookRetryEntry } from '@/types'
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 const ops: CollectionOps<any> = { load: loadWebhooks, save: saveWebhooks }
@@ -129,7 +130,10 @@ export async function POST(req: Request, { params }: { params: Promise<{ id: str
 
   const sessions = loadSessions()
   const sessionName = `webhook:${id}`
-  let session = Object.values(sessions).find((s: any) => s.name === sessionName && s.agentId === agent.id) as any
+  let session = Object.values(sessions).find((s: unknown) => {
+    const rec = s as Record<string, unknown>
+    return rec.name === sessionName && rec.agentId === agent.id
+  }) as Record<string, unknown> | undefined
   if (!session) {
     const sessionId = genId()
     const now = Date.now()
@@ -160,10 +164,11 @@ export async function POST(req: Request, { params }: { params: Promise<{ id: str
       heartbeatEnabled: agent.heartbeatEnabled ?? true,
       heartbeatIntervalSec: agent.heartbeatIntervalSec ?? null,
     }
-    sessions[session.id] = session
+    sessions[session.id as string] = session
     saveSessions(sessions)
   }
 
+  const sid = session.id as string
   const payloadPreview = (rawBody || '').slice(0, 12_000)
   const prompt = [
     'Webhook event received.',
@@ -179,25 +184,60 @@ export async function POST(req: Request, { params }: { params: Promise<{ id: str
     'Handle this event now. If this requires notifying the user, use configured connector tools.',
   ].join('\n')
 
-  const run = enqueueSessionRun({
-    sessionId: session.id,
-    message: prompt,
-    source: 'webhook',
-    internal: false,
-    mode: 'followup',
-  })
+  try {
+    const run = enqueueSessionRun({
+      sessionId: sid,
+      message: prompt,
+      source: 'webhook',
+      internal: false,
+      mode: 'followup',
+    })
 
-  appendWebhookLog(genId(8), {
-    id: genId(8), webhookId: id, event: incomingEvent,
-    payload: (rawBody || '').slice(0, 2000), status: 'success',
-    sessionId: session.id, runId: run.runId, timestamp: Date.now(),
-  })
+    appendWebhookLog(genId(8), {
+      id: genId(8), webhookId: id, event: incomingEvent,
+      payload: (rawBody || '').slice(0, 2000), status: 'success',
+      sessionId: sid, runId: run.runId, timestamp: Date.now(),
+    })
 
-  return NextResponse.json({
-    ok: true,
-    webhookId: id,
-    event: incomingEvent,
-    sessionId: session.id,
-    runId: run.runId,
-  })
+    return NextResponse.json({
+      ok: true,
+      webhookId: id,
+      event: incomingEvent,
+      sessionId: sid,
+      runId: run.runId,
+    })
+  } catch (err: unknown) {
+    const errorMsg = err instanceof Error ? err.message : String(err)
+
+    // Enqueue for retry with exponential backoff
+    const retryId = genId()
+    const now = Date.now()
+    const retryEntry: WebhookRetryEntry = {
+      id: retryId,
+      webhookId: id,
+      event: incomingEvent,
+      payload: (rawBody || '').slice(0, 12_000),
+      attempts: 1,
+      maxAttempts: 3,
+      nextRetryAt: now + 30_000,
+      deadLettered: false,
+      createdAt: now,
+    }
+    upsertWebhookRetry(retryId, retryEntry)
+
+    appendWebhookLog(genId(8), {
+      id: genId(8), webhookId: id, event: incomingEvent,
+      payload: (rawBody || '').slice(0, 2000), status: 'error',
+      error: `Dispatch failed, queued for retry: ${errorMsg}`, timestamp: Date.now(),
+    })
+
+    return NextResponse.json({
+      ok: true,
+      webhookId: id,
+      event: incomingEvent,
+      retryQueued: true,
+      retryId,
+      error: errorMsg,
+    })
+  }
 }

package/src/cli/index.js

@@ -23,6 +23,13 @@ const COMMAND_GROUPS = [
       cmd('thread', 'POST', '/agents/:id/thread', 'Get or create agent thread session'),
     ],
   },
+  {
+    name: 'activity',
+    description: 'Query activity feed events',
+    commands: [
+      cmd('list', 'GET', '/activity', 'List activity events (use --query limit=50, --query entityType=task, --query action=updated)'),
+    ],
+  },
   {
     name: 'auth',
     description: 'Access key auth helpers',

package/src/cli/spec.js

@@ -12,6 +12,12 @@ const COMMAND_GROUPS = {
       purge: { description: 'Permanently delete a trashed agent', method: 'DELETE', path: '/agents/trash' },
     },
   },
+  activity: {
+    description: 'Query activity feed events',
+    commands: {
+      list: { description: 'List activity events (supports --query limit=50,entityType=task,action=updated)', method: 'GET', path: '/activity' },
+    },
+  },
   auth: {
     description: 'Access-key auth checks',
     commands: {

package/src/components/activity/activity-feed.tsx

@@ -0,0 +1,91 @@
+'use client'
+
+import { useEffect, useState } from 'react'
+import { useAppStore } from '@/stores/use-app-store'
+import { useWs } from '@/hooks/use-ws'
+import type { ActivityEntry } from '@/types'
+
+const ENTITY_ICONS: Record<string, string> = {
+  agent: 'A', task: 'T', connector: 'C', session: 'S', webhook: 'W', schedule: 'R',
+}
+
+const ACTION_COLORS: Record<string, string> = {
+  created: 'bg-emerald-500/15 text-emerald-400',
+  updated: 'bg-blue-500/15 text-blue-400',
+  deleted: 'bg-red-500/15 text-red-400',
+  started: 'bg-green-500/15 text-green-400',
+  stopped: 'bg-gray-500/15 text-gray-400',
+  queued: 'bg-amber-500/15 text-amber-400',
+  completed: 'bg-emerald-500/15 text-emerald-400',
+  failed: 'bg-red-500/15 text-red-400',
+  approved: 'bg-green-500/15 text-green-400',
+  rejected: 'bg-red-500/15 text-red-400',
+}
+
+function timeAgo(ts: number) {
+  const diff = Date.now() - ts
+  if (diff < 60_000) return 'just now'
+  if (diff < 3600_000) return `${Math.floor(diff / 60_000)}m ago`
+  if (diff < 86400_000) return `${Math.floor(diff / 3600_000)}h ago`
+  return `${Math.floor(diff / 86400_000)}d ago`
+}
+
+const ENTITY_TYPES = ['', 'agent', 'task', 'connector', 'session', 'webhook', 'schedule'] as const
+
+export function ActivityFeed() {
+  const entries = useAppStore((s) => s.activityEntries)
+  const loadActivity = useAppStore((s) => s.loadActivity)
+  const [filterType, setFilterType] = useState('')
+
+  useEffect(() => { loadActivity({ entityType: filterType || undefined, limit: 100 }) }, [filterType])
+  useWs('activity', () => loadActivity({ entityType: filterType || undefined, limit: 100 }), 10_000)
+
+  return (
+    <div className="flex-1 flex flex-col h-full overflow-hidden">
+      <div className="flex items-center justify-between px-8 pt-6 pb-4 shrink-0">
+        <div>
+          <h1 className="font-display text-[28px] font-800 tracking-[-0.03em]">Activity</h1>
+          <p className="text-[13px] text-text-3 mt-1">Audit trail of all entity mutations</p>
+        </div>
+        <select
+          value={filterType}
+          onChange={(e) => setFilterType(e.target.value)}
+          className="px-3 py-2 rounded-[10px] text-[13px] font-600 cursor-pointer transition-all border bg-transparent border-white/[0.06] text-text-3 hover:bg-white/[0.03] appearance-none"
+          style={{ fontFamily: 'inherit', minWidth: 130 }}
+        >
+          <option value="">All Types</option>
+          {ENTITY_TYPES.filter(Boolean).map((t) => (
+            <option key={t} value={t}>{t.charAt(0).toUpperCase() + t.slice(1)}s</option>
+          ))}
+        </select>
+      </div>
+
+      <div className="flex-1 overflow-y-auto px-8 pb-6">
+        {entries.length === 0 ? (
+          <div className="text-center text-text-3 text-[14px] mt-16">No activity yet</div>
+        ) : (
+          <div className="space-y-1">
+            {entries.map((entry: ActivityEntry) => (
+              <div key={entry.id} className="flex items-start gap-3 py-3 border-b border-white/[0.04]">
+                <div className="w-8 h-8 rounded-[8px] bg-surface-2 flex items-center justify-center text-[12px] font-700 text-text-3 shrink-0">
+                  {ENTITY_ICONS[entry.entityType] || '?'}
+                </div>
+                <div className="flex-1 min-w-0">
+                  <div className="flex items-center gap-2 mb-1">
+                    <span className={`px-1.5 py-0.5 rounded-[5px] text-[10px] font-600 ${ACTION_COLORS[entry.action] || 'bg-white/[0.06] text-text-3'}`}>
+                      {entry.action}
+                    </span>
+                    <span className="text-[10px] text-text-3/50 font-mono">{entry.entityType}</span>
+                    <span className="text-[10px] text-text-3/40">{entry.actor}</span>
+                  </div>
+                  <p className="text-[13px] text-text-2 leading-[1.4] truncate">{entry.summary}</p>
+                </div>
+                <span className="text-[11px] text-text-3/50 shrink-0 pt-1">{timeAgo(entry.timestamp)}</span>
+              </div>
+            ))}
+          </div>
+        )}
+      </div>
+    </div>
+  )
+}