arkaos 2.84.0 → 2.86.0

package/VERSION

@@ -1 +1 @@
-2.84.0
+2.86.0

package/dashboard/app/pages/agents/index.vue

@@ -2,12 +2,73 @@
 import type { TableColumn } from '@nuxt/ui'
 import type { Agent } from '~/types'
 
-const { fetchApi } = useApi()
+const { fetchApi, apiBase } = useApi()
+const toast = useToast()
 
 const { data, status, error, refresh } = await fetchApi<{ agents: Agent[], total: number }>('/api/agents')
 
+// PR69 v2.86.0 — per-department activity from PR47 telemetry.
+// Used to badge agents whose department has run recently and to
+// surface "no activity yet" hint when a department's never been
+// invoked. Failure-tolerant — returns empty if telemetry unavailable.
+interface ActivityRow {
+  call_count: number
+  total_cost_usd: number | null
+  total_tokens_in: number
+  total_tokens_out: number
+}
+
+const {
+  data: activityData,
+  refresh: refreshActivity,
+} = fetchApi<{ by_department: Record<string, ActivityRow>, period: string }>(
+  '/api/agents/activity?period=week',
+)
+
 const agents = computed(() => data.value?.agents ?? [])
 
+function deptActivity(dept: string): ActivityRow | undefined {
+  return activityData.value?.by_department?.[dept]
+}
+
+const copied = ref<string | null>(null)
+let copyTimer: ReturnType<typeof setTimeout> | null = null
+
+async function copyAgentMention(agent: Agent) {
+  if (typeof navigator === 'undefined' || !navigator.clipboard) {
+    toast.add({ title: 'Clipboard unavailable', color: 'warning' })
+    return
+  }
+  // The most useful copy for an operator: a ready-to-paste mention
+  // that names the agent + their role so the orchestrator can dispatch.
+  const text = `Use ${agent.name} (${agent.role}, dept ${agent.department}, tier ${agent.tier}) for this task.`
+  try {
+    await navigator.clipboard.writeText(text)
+    copied.value = agent.id
+    if (copyTimer) clearTimeout(copyTimer)
+    copyTimer = setTimeout(() => { copied.value = null; copyTimer = null }, 1500)
+    toast.add({
+      title: 'Copied',
+      description: `${agent.name} mention ready to paste.`,
+      color: 'success',
+    })
+  } catch (err) {
+    toast.add({
+      title: 'Copy failed',
+      description: err instanceof Error ? err.message : 'unknown error',
+      color: 'error',
+    })
+  }
+}
+
+onBeforeUnmount(() => {
+  if (copyTimer) clearTimeout(copyTimer)
+})
+
+async function refreshAll() {
+  await Promise.all([refresh(), refreshActivity()])
+}
+
 const search = ref('')
 const departmentFilter = ref('all')
 const tierFilter = ref('all')
@@ -77,35 +138,18 @@ const tierColor = (tier: number) => {
 }
 
 const columns: TableColumn<Agent>[] = [
-  {
-    accessorKey: 'name',
-    header: 'Name'
-  },
-  {
-    accessorKey: 'role',
-    header: 'Role'
-  },
-  {
-    accessorKey: 'department',
-    header: 'Department'
-  },
-  {
-    accessorKey: 'tier',
-    header: 'Tier'
-  },
+  { accessorKey: 'name',       header: 'Name' },
+  { accessorKey: 'role',       header: 'Role' },
+  { accessorKey: 'department', header: 'Department' },
+  { accessorKey: 'tier',       header: 'Tier' },
   {
     accessorFn: (row: Agent) => row.disc?.primary ?? '-',
     id: 'disc',
-    header: 'DISC'
-  },
-  {
-    accessorKey: 'mbti',
-    header: 'MBTI'
+    header: 'DISC',
   },
-  {
-    id: 'actions',
-    header: ''
-  }
+  { accessorKey: 'mbti',       header: 'MBTI' },
+  { id: 'activity',            header: 'Activity (7d)' },
+  { id: 'actions',             header: '' },
 ]
 
 function goToAgent(id: string) {
@@ -134,7 +178,7 @@ function goToAgent(id: string) {
         empty-title="No agents found"
         empty-icon="i-lucide-users"
         loading-label="Loading agents"
-        :on-retry="() => refresh()"
+        :on-retry="() => refreshAll()"
       >
         <div class="flex flex-wrap items-center gap-3 mb-4">
           <UInput
@@ -195,8 +239,33 @@ function goToAgent(id: string) {
           <template #mbti-cell="{ row }">
             <span class="font-mono text-sm">{{ row.original.mbti || '-' }}</span>
           </template>
+          <template #activity-cell="{ row }">
+            <template v-if="deptActivity(row.original.department)">
+              <div class="flex items-center gap-2">
+                <span class="inline-block size-2 rounded-full bg-green-500" />
+                <span class="text-xs font-mono">
+                  {{ deptActivity(row.original.department)?.call_count ?? 0 }} calls
+                </span>
+              </div>
+            </template>
+            <span v-else class="text-xs text-muted">—</span>
+          </template>
           <template #actions-cell="{ row }">
-            <UButton size="xs" variant="ghost" icon="i-lucide-arrow-right" @click="goToAgent(row.original.id)" />
+            <UButton
+              :icon="copied === row.original.id ? 'i-lucide-check' : 'i-lucide-copy'"
+              :color="copied === row.original.id ? 'success' : 'neutral'"
+              variant="ghost"
+              size="xs"
+              aria-label="Copy agent mention"
+              @click.stop="copyAgentMention(row.original)"
+            />
+            <UButton
+              size="xs"
+              variant="ghost"
+              icon="i-lucide-arrow-right"
+              aria-label="Open agent detail"
+              @click="goToAgent(row.original.id)"
+            />
           </template>
         </UTable>
 

package/dashboard/app/pages/commands.vue

@@ -1,76 +1,194 @@
 <script setup lang="ts">
+// PR68 v2.85.0 — Commands page: ▶ Copy + ★ Favorites.
+//
+// The previous Commands page was a read-only catalogue (135 rows,
+// search, filter, expand for keywords). Daniel Ek's audit question
+// landed: "what is the job-to-be-done here vs the CLI?" The answer:
+// fast lookup → copy to clipboard → paste back into Claude Code.
+// PR68 makes that flow one-click + adds operator-curated favorites
+// stored locally so the top-of-list is the operator's actual
+// muscle-memory commands.
+
 import type { TableColumn } from '@nuxt/ui'
 import type { Command } from '~/types'
 
 const { fetchApi } = useApi()
+const toast = useToast()
 
-const { data, status, error, refresh } = await fetchApi<{ commands: Command[], total: number }>('/api/commands')
+const {
+  data,
+  status,
+  error,
+  refresh,
+} = await fetchApi<{ commands: Command[], total: number }>('/api/commands')
 
-const commands = computed(() => data.value?.commands ?? [])
+// ─── Favorites (persisted in localStorage) ───────────────────────────────
+
+const FAVORITES_KEY = 'arkaos_command_favorites'
+const favorites = ref<Set<string>>(new Set())
+
+function loadFavorites() {
+  if (typeof window === 'undefined') return
+  try {
+    const raw = window.localStorage.getItem(FAVORITES_KEY)
+    if (!raw) return
+    const parsed = JSON.parse(raw)
+    if (Array.isArray(parsed)) {
+      favorites.value = new Set(parsed.filter((v): v is string => typeof v === 'string'))
+    }
+  } catch { /* corrupt JSON — ignore, start fresh */ }
+}
+
+function persistFavorites() {
+  if (typeof window === 'undefined') return
+  try {
+    window.localStorage.setItem(
+      FAVORITES_KEY,
+      JSON.stringify(Array.from(favorites.value)),
+    )
+  } catch { /* quota / disabled storage — silent */ }
+}
+
+function toggleFavorite(commandId: string) {
+  if (favorites.value.has(commandId)) {
+    favorites.value.delete(commandId)
+  } else {
+    favorites.value.add(commandId)
+  }
+  persistFavorites()
+}
+
+onMounted(() => {
+  loadFavorites()
+})
+
+// ─── Filters + view ─────────────────────────────────────────────────────
 
 const search = ref('')
 const departmentFilter = ref('all')
+const view = ref<'all' | 'favorites'>('all')
 const page = ref(1)
 const pageSize = 20
 const expandedRow = ref<string | null>(null)
 
+const commands = computed(() => data.value?.commands ?? [])
+
 const departments = computed(() => {
-  const depts = new Set(commands.value.map(c => c.department))
+  const depts = new Set(commands.value.map((c) => c.department))
   return [
     { label: 'All Departments', value: 'all' },
-    ...Array.from(depts).sort().map(d => ({ label: d, value: d }))
+    ...Array.from(depts).sort().map((d) => ({ label: d, value: d })),
   ]
 })
 
-const filteredCommands = computed(() => {
-  let result = commands.value
-  const query = search.value.toLowerCase()
+const baseList = computed<Command[]>(() => {
+  if (view.value === 'favorites') {
+    return commands.value.filter((c) => favorites.value.has(c.id))
+  }
+  return commands.value
+})
 
+const filteredCommands = computed<Command[]>(() => {
+  let result = baseList.value
+  const query = search.value.toLowerCase().trim()
   if (query) {
-    result = result.filter(cmd =>
+    result = result.filter((cmd) =>
       cmd.command.toLowerCase().includes(query)
-      || cmd.description.toLowerCase().includes(query)
+      || cmd.description.toLowerCase().includes(query),
     )
   }
-
   if (departmentFilter.value !== 'all') {
-    result = result.filter(cmd => cmd.department === departmentFilter.value)
+    result = result.filter((cmd) => cmd.department === departmentFilter.value)
+  }
+  // Favorites pinned on top in the "all" view; the favorites-only
+  // view doesn't need re-sorting.
+  if (view.value === 'all') {
+    result = [...result].sort((a, b) => {
+      const aFav = favorites.value.has(a.id) ? 0 : 1
+      const bFav = favorites.value.has(b.id) ? 0 : 1
+      return aFav - bFav
+    })
   }
-
   return result
 })
 
 const totalFiltered = computed(() => filteredCommands.value.length)
 
-const paginatedCommands = computed(() => {
-  const start = (page.value - 1) * pageSize
-  return filteredCommands.value.slice(start, start + pageSize)
-})
+const paginatedCommands = computed(() =>
+  filteredCommands.value.slice(
+    (page.value - 1) * pageSize,
+    page.value * pageSize,
+  ),
+)
 
-const totalPages = computed(() => Math.max(1, Math.ceil(totalFiltered.value / pageSize)))
+const totalPages = computed(() =>
+  Math.max(1, Math.ceil(totalFiltered.value / pageSize)),
+)
 
-watch([search, departmentFilter], () => {
+watch([search, departmentFilter, view], () => {
   page.value = 1
 })
 
+// ─── Copy command to clipboard ──────────────────────────────────────────
+
+const copied = ref<string | null>(null)
+let copyTimer: ReturnType<typeof setTimeout> | null = null
+
+async function copyCommand(cmd: Command) {
+  if (typeof navigator === 'undefined' || !navigator.clipboard) {
+    toast.add({
+      title: 'Clipboard unavailable',
+      description: 'Your browser blocked navigator.clipboard.',
+      color: 'warning',
+    })
+    return
+  }
+  try {
+    await navigator.clipboard.writeText(cmd.command)
+    copied.value = cmd.id
+    if (copyTimer) clearTimeout(copyTimer)
+    copyTimer = setTimeout(() => {
+      copied.value = null
+      copyTimer = null
+    }, 1500)
+    toast.add({
+      title: 'Copied',
+      description: cmd.command,
+      color: 'success',
+    })
+  } catch (err) {
+    toast.add({
+      title: 'Copy failed',
+      description: err instanceof Error ? err.message : 'unknown error',
+      color: 'error',
+    })
+  }
+}
+
+onBeforeUnmount(() => {
+  if (copyTimer) clearTimeout(copyTimer)
+})
+
+// ─── Expansion + table ──────────────────────────────────────────────────
+
 function toggleExpand(commandId: string) {
   expandedRow.value = expandedRow.value === commandId ? null : commandId
 }
 
 const columns: TableColumn<Command>[] = [
-  {
-    accessorKey: 'command',
-    header: 'Command'
-  },
-  {
-    accessorKey: 'department',
-    header: 'Department'
-  },
-  {
-    accessorKey: 'description',
-    header: 'Description'
-  }
+  { accessorKey: 'star',        header: '' },
+  { accessorKey: 'command',     header: 'Command' },
+  { accessorKey: 'department',  header: 'Department' },
+  { accessorKey: 'description', header: 'Description' },
+  { accessorKey: 'actions',     header: '' },
+]
+
+const viewTabs = [
+  { label: 'All', value: 'all' as const },
+  { label: 'Favorites', value: 'favorites' as const },
 ]
+
+const favoritesCount = computed(() => favorites.value.size)
 </script>
 
 <template>
@@ -81,33 +199,43 @@ const columns: TableColumn<Command>[] = [
           <UDashboardSidebarCollapse />
         </template>
         <template #trailing>
-          <UBadge v-if="data?.total" :label="data.total" variant="subtle" />
+          <UBadge
+            v-if="data?.total"
+            :label="`${data.total} total`"
+            variant="subtle"
+            size="xs"
+          />
+          <UBadge
+            v-if="favoritesCount"
+            :label="`★ ${favoritesCount}`"
+            variant="subtle"
+            color="warning"
+            size="xs"
+            class="ml-2"
+          />
         </template>
       </UDashboardNavbar>
     </template>
 
     <template #body>
-      <!-- Loading -->
-      <div v-if="status === 'pending'" class="flex items-center justify-center py-12">
-        <UIcon name="i-lucide-loader-2" class="size-8 animate-spin text-muted" />
-      </div>
-
-      <!-- Error -->
-      <div v-else-if="error" class="flex flex-col items-center justify-center gap-4 py-12" role="alert">
-        <UIcon name="i-lucide-alert-triangle" class="size-12 text-red-500" />
-        <p class="text-sm text-muted">Failed to load commands.</p>
-        <UButton label="Retry" variant="outline" color="primary" icon="i-lucide-refresh-cw" @click="refresh()" />
-      </div>
-
-      <!-- Empty -->
-      <div v-else-if="!commands.length" class="flex flex-col items-center justify-center gap-4 py-12">
-        <UIcon name="i-lucide-terminal" class="size-12 text-muted" />
-        <p class="text-sm text-muted">No commands found.</p>
-      </div>
-
-      <!-- Content -->
-      <template v-else>
+      <DashboardState
+        :status="status"
+        :error="error"
+        :empty="!commands.length"
+        empty-title="No commands found"
+        empty-icon="i-lucide-terminal"
+        loading-label="Loading commands"
+        :on-retry="() => refresh()"
+      >
+        <!-- View tabs + filters -->
         <div class="flex flex-wrap items-center gap-3 mb-4">
+          <UTabs
+            :items="viewTabs"
+            :model-value="view"
+            class="shrink-0"
+            @update:model-value="view = $event as 'all' | 'favorites'"
+          />
+
           <UInput
             v-model="search"
             class="max-w-sm"
@@ -130,51 +258,98 @@ const columns: TableColumn<Command>[] = [
           </span>
         </div>
 
-        <UTable
-          :data="paginatedCommands"
-          :columns="columns"
-          :loading="status === 'pending'"
-          class="shrink-0"
-          :ui="{
-            base: 'table-fixed border-separate border-spacing-0',
-            thead: '[&>tr]:bg-elevated/50 [&>tr]:after:content-none',
-            tbody: '[&>tr]:last:[&>td]:border-b-0 [&>tr]:cursor-pointer [&>tr]:hover:bg-elevated/50 [&>tr]:transition-colors',
-            th: 'py-2 first:rounded-l-lg last:rounded-r-lg border-y border-default first:border-l last:border-r',
-            td: 'border-b border-default'
-          }"
-          @select="(row: Command) => toggleExpand(row.id)"
+        <!-- Favorites empty state -->
+        <div
+          v-if="view === 'favorites' && favoritesCount === 0"
+          class="flex flex-col items-center justify-center gap-3 py-16 rounded-lg border border-default"
         >
-          <template #command-cell="{ row }">
-            <code class="font-mono text-sm text-primary">{{ row.original.command }}</code>
-          </template>
-          <template #department-cell="{ row }">
-            <UBadge :label="row.original.department" variant="subtle" size="sm" />
-          </template>
-          <template #expanded="{ row }">
-            <div v-if="expandedRow === row.original.id && row.original.keywords?.length" class="px-4 py-3 bg-elevated/30">
-              <p class="text-xs font-semibold text-muted uppercase tracking-wider mb-2">Keywords</p>
-              <div class="flex flex-wrap gap-1.5">
-                <UBadge
-                  v-for="kw in row.original.keywords"
-                  :key="kw"
-                  :label="kw"
-                  variant="outline"
-                  size="xs"
-                />
-              </div>
-            </div>
-          </template>
-        </UTable>
-
-        <div v-if="totalPages > 1" class="flex items-center justify-center mt-6">
-          <UPagination
-            :page="page"
-            :total="totalFiltered"
-            :items-per-page="pageSize"
-            @update:page="(val) => page = val"
-          />
+          <UIcon name="i-lucide-star" class="size-12 text-muted" />
+          <p class="text-sm text-muted">No favorites yet.</p>
+          <p class="text-xs text-muted text-center max-w-sm">
+            Click the ★ next to any command to pin it here for one-click access.
+          </p>
         </div>
-      </template>
+
+        <!-- Table -->
+        <template v-else>
+          <UTable
+            :data="paginatedCommands"
+            :columns="columns"
+            :loading="status === 'pending'"
+            class="shrink-0"
+            :ui="{
+              base: 'table-fixed border-separate border-spacing-0',
+              thead: '[&>tr]:bg-elevated/50 [&>tr]:after:content-none',
+              tbody: '[&>tr]:last:[&>td]:border-b-0 [&>tr]:hover:bg-elevated/50 [&>tr]:transition-colors',
+              th: 'py-2 first:rounded-l-lg last:rounded-r-lg border-y border-default first:border-l last:border-r',
+              td: 'border-b border-default',
+            }"
+          >
+            <template #star-cell="{ row }">
+              <UButton
+                :icon="favorites.has(row.original.id) ? 'i-lucide-star' : 'i-lucide-star'"
+                :color="favorites.has(row.original.id) ? 'warning' : 'neutral'"
+                variant="ghost"
+                size="xs"
+                :aria-label="favorites.has(row.original.id) ? 'Unfavorite' : 'Favorite'"
+                :class="favorites.has(row.original.id) ? '' : 'opacity-30 hover:opacity-100'"
+                @click.stop="toggleFavorite(row.original.id)"
+              />
+            </template>
+            <template #command-cell="{ row }">
+              <button
+                type="button"
+                class="text-left w-full"
+                @click="toggleExpand(row.original.id)"
+              >
+                <code class="font-mono text-sm text-primary">{{ row.original.command }}</code>
+              </button>
+            </template>
+            <template #department-cell="{ row }">
+              <UBadge :label="row.original.department" variant="subtle" size="sm" />
+            </template>
+            <template #description-cell="{ row }">
+              <span class="text-sm text-muted">{{ row.original.description }}</span>
+            </template>
+            <template #actions-cell="{ row }">
+              <UButton
+                :icon="copied === row.original.id ? 'i-lucide-check' : 'i-lucide-copy'"
+                :color="copied === row.original.id ? 'success' : 'neutral'"
+                variant="ghost"
+                size="xs"
+                aria-label="Copy command to clipboard"
+                @click.stop="copyCommand(row.original)"
+              />
+            </template>
+            <template #expanded="{ row }">
+              <div
+                v-if="expandedRow === row.original.id && row.original.keywords?.length"
+                class="px-4 py-3 bg-elevated/30"
+              >
+                <p class="text-xs font-semibold text-muted uppercase tracking-wider mb-2">Keywords</p>
+                <div class="flex flex-wrap gap-1.5">
+                  <UBadge
+                    v-for="kw in row.original.keywords"
+                    :key="kw"
+                    :label="kw"
+                    variant="outline"
+                    size="xs"
+                  />
+                </div>
+              </div>
+            </template>
+          </UTable>
+
+          <div v-if="totalPages > 1" class="flex items-center justify-center mt-6">
+            <UPagination
+              :page="page"
+              :total="totalFiltered"
+              :items-per-page="pageSize"
+              @update:page="(val) => page = val"
+            />
+          </div>
+        </template>
+      </DashboardState>
     </template>
   </UDashboardPanel>
 </template>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "arkaos",
-  "version": "2.84.0",
+  "version": "2.86.0",
   "description": "The Operating System for AI Agent Teams",
   "type": "module",
   "bin": {

package/pyproject.toml

@@ -1,6 +1,6 @@
 [project]
 name = "arkaos-core"
-version = "2.84.0"
+version = "2.86.0"
 description = "Core engine for ArkaOS — The Operating System for AI Agent Teams"
 readme = "README.md"
 license = {text = "MIT"}

package/scripts/dashboard-api.py

@@ -173,6 +173,51 @@ def agents(dept: Optional[str] = Query(None)):
     return {"agents": data, "total": len(data)}
 
 
+@app.get("/api/agents/activity")
+def agents_activity(period: str = "week"):
+    """Per-department activity from the PR47 LLM cost telemetry.
+
+    Returns ``{by_department: {dev: {call_count, total_cost_usd,
+    total_tokens_in, total_tokens_out}}}`` derived from rows whose
+    ``category`` field starts with ``subagent:``. Each agent's
+    dispatch is currently tagged at the department level — finer
+    per-agent attribution will land when orchestrators set
+    ``ARKA_CALL_CATEGORY=subagent:<dept>:<agent>``.
+    """
+    try:
+        from core.runtime.llm_cost_telemetry import summarise, VALID_PERIODS
+    except Exception:  # pragma: no cover - import guard
+        return {"by_department": {}, "period": period}
+    if period not in VALID_PERIODS:
+        period = "week"
+    summary = summarise(period=period)
+    out: dict[str, dict] = {}
+    for category, row in (summary.by_category or {}).items():
+        if not isinstance(category, str) or not category.startswith("subagent:"):
+            continue
+        dept = category.split(":", 1)[1] or "unknown"
+        bucket = out.setdefault(dept, {
+            "call_count": 0,
+            "total_cost_usd": 0.0,
+            "any_cost_known": False,
+            "total_tokens_in": 0,
+            "total_tokens_out": 0,
+        })
+        bucket["call_count"] += row.get("call_count", 0)
+        bucket["total_tokens_in"] += row.get("total_tokens_in", 0)
+        bucket["total_tokens_out"] += row.get("total_tokens_out", 0)
+        cost = row.get("total_cost_usd")
+        if isinstance(cost, (int, float)):
+            bucket["total_cost_usd"] += float(cost)
+            bucket["any_cost_known"] = True
+    for dept, b in out.items():
+        if not b.pop("any_cost_known"):
+            b["total_cost_usd"] = None
+        else:
+            b["total_cost_usd"] = round(b["total_cost_usd"], 6)
+    return {"by_department": out, "period": period}
+
+
 @app.get("/api/agents/{agent_id}")
 def agent_detail(agent_id: str):
     """Get full agent detail including YAML data."""