arkaos 3.20.0 → 3.22.0

package/VERSION

@@ -1 +1 @@
-3.20.0
+3.22.0

package/dashboard/app/components/SidebarStatsWidget.vue

@@ -0,0 +1,61 @@
+<script setup lang="ts">
+// PR87d v3.22.0 — compact stats card mounted at the bottom of the
+// sidebar. Polls /api/sidebar-stats every 60s.
+
+interface SidebarStats {
+  agents: number
+  personas: number
+  departments: number
+  today_cost_usd: number | null
+  today_calls: number
+}
+
+const { fetchApi } = useApi()
+const { data, refresh } = fetchApi<SidebarStats>('/api/sidebar-stats')
+
+let timer: ReturnType<typeof setInterval> | null = null
+onMounted(() => {
+  timer = setInterval(() => { refresh() }, 60_000)
+})
+onBeforeUnmount(() => {
+  if (timer) clearInterval(timer)
+})
+
+function formatCost(cost: number | null): string {
+  if (cost === null || cost === undefined) return '—'
+  if (cost < 0.01) return '<$0.01'
+  if (cost < 1) return `$${cost.toFixed(3)}`
+  return `$${cost.toFixed(2)}`
+}
+</script>
+
+<template>
+  <div
+    v-if="data"
+    class="rounded-lg border border-default bg-elevated/20 p-3 mx-2 mb-2 text-xs space-y-1.5"
+    aria-label="Workspace quick stats"
+  >
+    <div class="flex items-center justify-between">
+      <span class="text-muted">Agents</span>
+      <span class="font-mono font-semibold">{{ data.agents }}</span>
+    </div>
+    <div class="flex items-center justify-between">
+      <span class="text-muted">Personas</span>
+      <span class="font-mono font-semibold">{{ data.personas }}</span>
+    </div>
+    <div class="flex items-center justify-between">
+      <span class="text-muted">Departments</span>
+      <span class="font-mono font-semibold">{{ data.departments }}</span>
+    </div>
+    <div class="border-t border-default/60 mt-2 pt-1.5 flex items-center justify-between">
+      <span class="text-muted">Today</span>
+      <span class="font-mono font-semibold text-primary">
+        {{ formatCost(data.today_cost_usd) }}
+      </span>
+    </div>
+    <div class="flex items-center justify-between text-[10px] text-muted/70">
+      <span>{{ data.today_calls }} call{{ data.today_calls === 1 ? '' : 's' }}</span>
+      <span>auto · 60s</span>
+    </div>
+  </div>
+</template>

package/dashboard/app/layouts/default.vue

@@ -121,12 +121,15 @@ const links = [[{
           popover
         />
 
+        <!-- PR87d v3.22.0 — quick stats widget above the bottom nav. -->
+        <SidebarStatsWidget v-if="!collapsed" class="mt-auto" />
+
         <UNavigationMenu
           :collapsed="collapsed"
           :items="links[1]"
           orientation="vertical"
           tooltip
-          class="mt-auto"
+          :class="collapsed ? 'mt-auto' : ''"
         />
       </template>
     </UDashboardSidebar>

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

@@ -0,0 +1,225 @@
+<script setup lang="ts">
+// PR87c v3.21.0 — Compare two agents side-by-side.
+//
+// Driven by `?ids=a,b` query string. Reads both agent payloads via
+// /api/agents/{id} and renders identity / DNA / knowledge / comms in
+// two columns. Cells where the values differ get a subtle warning
+// tint so the operator can spot deltas quickly.
+
+const route = useRoute()
+const { fetchApi } = useApi()
+
+const ids = computed<string[]>(() => {
+  const raw = route.query.ids
+  const str = Array.isArray(raw) ? raw.join(',') : (raw ?? '')
+  return String(str).split(',').map((s) => s.trim()).filter(Boolean).slice(0, 2)
+})
+
+interface AgentDetail {
+  id: string
+  name?: string
+  role?: string
+  department?: string
+  tier?: number
+  model?: string
+  mbti?: string
+  disc?: { primary?: string, secondary?: string }
+  enneagram?: { type?: number, wing?: number }
+  big_five?: {
+    openness?: number
+    conscientiousness?: number
+    extraversion?: number
+    agreeableness?: number
+    neuroticism?: number
+  }
+  expertise?: { domains?: string[], frameworks?: string[], depth?: string, years_equivalent?: number }
+  mental_models?: { primary?: string[], secondary?: string[] }
+  communication?: {
+    tone?: string
+    vocabulary_level?: string
+    preferred_format?: string
+    language?: string
+  }
+}
+
+const { data: a, status: aStatus } = fetchApi<AgentDetail>(
+  () => ids.value[0] ? `/api/agents/${ids.value[0]}` : '',
+)
+const { data: b, status: bStatus } = fetchApi<AgentDetail>(
+  () => ids.value[1] ? `/api/agents/${ids.value[1]}` : '',
+)
+
+const loading = computed(() => aStatus.value === 'pending' || bStatus.value === 'pending')
+const errorMsg = computed(() => {
+  if (ids.value.length < 2) return 'Pass two agent ids via ?ids=a,b'
+  if (a.value && (a.value as any).error) return `Left agent: ${(a.value as any).error}`
+  if (b.value && (b.value as any).error) return `Right agent: ${(b.value as any).error}`
+  return null
+})
+
+function diffClass(left: unknown, right: unknown): string {
+  return left !== right
+    ? 'bg-yellow-500/10 border-yellow-500/30'
+    : ''
+}
+
+function listDiffClass(left: unknown[] | undefined, right: unknown[] | undefined): string {
+  const a = JSON.stringify([...(left ?? [])].sort())
+  const b = JSON.stringify([...(right ?? [])].sort())
+  return a !== b ? 'bg-yellow-500/10 border-yellow-500/30' : ''
+}
+
+const bigFiveKeys = ['openness', 'conscientiousness', 'extraversion', 'agreeableness', 'neuroticism'] as const
+</script>
+
+<template>
+  <UDashboardPanel id="agents-compare">
+    <template #header>
+      <UDashboardNavbar title="Compare agents">
+        <template #leading>
+          <UButton icon="i-lucide-arrow-left" variant="ghost" size="sm" to="/agents" aria-label="Back" />
+        </template>
+        <template #trailing>
+          <UBadge label="2-way" variant="subtle" size="sm" />
+        </template>
+      </UDashboardNavbar>
+    </template>
+
+    <template #body>
+      <div v-if="errorMsg" class="p-6 text-center text-sm text-error">
+        {{ errorMsg }}
+      </div>
+      <div v-else-if="loading" class="p-6 text-center text-sm text-muted">
+        <UIcon name="i-lucide-loader-2" class="size-4 animate-spin inline" /> Loading…
+      </div>
+      <div v-else-if="a && b" class="space-y-4 max-w-6xl">
+        <section class="grid grid-cols-2 gap-3">
+          <div class="rounded-lg border border-default p-4">
+            <p class="text-xs text-muted">Left</p>
+            <h2 class="text-xl font-bold">{{ a.name }}</h2>
+            <p class="text-sm text-muted">{{ a.role }} · {{ a.department }}</p>
+          </div>
+          <div class="rounded-lg border border-default p-4">
+            <p class="text-xs text-muted">Right</p>
+            <h2 class="text-xl font-bold">{{ b.name }}</h2>
+            <p class="text-sm text-muted">{{ b.role }} · {{ b.department }}</p>
+          </div>
+        </section>
+
+        <h3 class="text-sm font-semibold uppercase tracking-wide text-muted pt-2">Identity</h3>
+        <div class="grid grid-cols-2 gap-3">
+          <div :class="['rounded-lg border p-3', diffClass(a.tier, b.tier)]">
+            <p class="text-xs text-muted">Tier</p>
+            <p class="text-sm font-mono">{{ a.tier ?? '—' }}</p>
+          </div>
+          <div :class="['rounded-lg border p-3', diffClass(a.tier, b.tier)]">
+            <p class="text-xs text-muted">Tier</p>
+            <p class="text-sm font-mono">{{ b.tier ?? '—' }}</p>
+          </div>
+          <div :class="['rounded-lg border p-3', diffClass(a.model, b.model)]">
+            <p class="text-xs text-muted">Model</p>
+            <p class="text-sm font-mono">{{ a.model ?? '—' }}</p>
+          </div>
+          <div :class="['rounded-lg border p-3', diffClass(a.model, b.model)]">
+            <p class="text-xs text-muted">Model</p>
+            <p class="text-sm font-mono">{{ b.model ?? '—' }}</p>
+          </div>
+        </div>
+
+        <h3 class="text-sm font-semibold uppercase tracking-wide text-muted pt-2">Behavioural DNA</h3>
+        <div class="grid grid-cols-2 gap-3">
+          <div :class="['rounded-lg border p-3', diffClass(a.mbti, b.mbti)]">
+            <p class="text-xs text-muted">MBTI</p>
+            <p class="text-lg font-mono font-bold">{{ a.mbti ?? '—' }}</p>
+          </div>
+          <div :class="['rounded-lg border p-3', diffClass(a.mbti, b.mbti)]">
+            <p class="text-xs text-muted">MBTI</p>
+            <p class="text-lg font-mono font-bold">{{ b.mbti ?? '—' }}</p>
+          </div>
+          <div :class="['rounded-lg border p-3', diffClass(`${a.disc?.primary}/${a.disc?.secondary}`, `${b.disc?.primary}/${b.disc?.secondary}`)]">
+            <p class="text-xs text-muted">DISC</p>
+            <p class="text-lg font-mono font-bold">{{ a.disc?.primary ?? '?' }}/{{ a.disc?.secondary ?? '?' }}</p>
+          </div>
+          <div :class="['rounded-lg border p-3', diffClass(`${a.disc?.primary}/${a.disc?.secondary}`, `${b.disc?.primary}/${b.disc?.secondary}`)]">
+            <p class="text-xs text-muted">DISC</p>
+            <p class="text-lg font-mono font-bold">{{ b.disc?.primary ?? '?' }}/{{ b.disc?.secondary ?? '?' }}</p>
+          </div>
+          <div :class="['rounded-lg border p-3', diffClass(`${a.enneagram?.type}w${a.enneagram?.wing}`, `${b.enneagram?.type}w${b.enneagram?.wing}`)]">
+            <p class="text-xs text-muted">Enneagram</p>
+            <p class="text-lg font-mono font-bold">{{ a.enneagram?.type ?? '?' }}w{{ a.enneagram?.wing ?? '?' }}</p>
+          </div>
+          <div :class="['rounded-lg border p-3', diffClass(`${a.enneagram?.type}w${a.enneagram?.wing}`, `${b.enneagram?.type}w${b.enneagram?.wing}`)]">
+            <p class="text-xs text-muted">Enneagram</p>
+            <p class="text-lg font-mono font-bold">{{ b.enneagram?.type ?? '?' }}w{{ b.enneagram?.wing ?? '?' }}</p>
+          </div>
+        </div>
+
+        <h3 class="text-sm font-semibold uppercase tracking-wide text-muted pt-2">Big Five (OCEAN)</h3>
+        <div class="space-y-1">
+          <div v-for="k in bigFiveKeys" :key="k" class="grid grid-cols-2 gap-3">
+            <div :class="['rounded-lg border p-2 flex items-center gap-3', diffClass(a.big_five?.[k], b.big_five?.[k])]">
+              <span class="text-xs text-muted w-36 shrink-0 capitalize">{{ k }}</span>
+              <span class="font-mono text-sm">{{ a.big_five?.[k] ?? '—' }}</span>
+            </div>
+            <div :class="['rounded-lg border p-2 flex items-center gap-3', diffClass(a.big_five?.[k], b.big_five?.[k])]">
+              <span class="text-xs text-muted w-36 shrink-0 capitalize">{{ k }}</span>
+              <span class="font-mono text-sm">{{ b.big_five?.[k] ?? '—' }}</span>
+            </div>
+          </div>
+        </div>
+
+        <h3 class="text-sm font-semibold uppercase tracking-wide text-muted pt-2">Expertise domains</h3>
+        <div class="grid grid-cols-2 gap-3">
+          <div :class="['rounded-lg border p-3', listDiffClass(a.expertise?.domains, b.expertise?.domains)]">
+            <ul class="list-disc list-inside text-sm space-y-1">
+              <li v-for="d in a.expertise?.domains" :key="d">{{ d }}</li>
+              <li v-if="!a.expertise?.domains?.length" class="list-none text-muted italic">none</li>
+            </ul>
+          </div>
+          <div :class="['rounded-lg border p-3', listDiffClass(a.expertise?.domains, b.expertise?.domains)]">
+            <ul class="list-disc list-inside text-sm space-y-1">
+              <li v-for="d in b.expertise?.domains" :key="d">{{ d }}</li>
+              <li v-if="!b.expertise?.domains?.length" class="list-none text-muted italic">none</li>
+            </ul>
+          </div>
+        </div>
+
+        <h3 class="text-sm font-semibold uppercase tracking-wide text-muted pt-2">Frameworks</h3>
+        <div class="grid grid-cols-2 gap-3">
+          <div :class="['rounded-lg border p-3', listDiffClass(a.expertise?.frameworks, b.expertise?.frameworks)]">
+            <ul class="list-disc list-inside text-sm space-y-1">
+              <li v-for="f in a.expertise?.frameworks" :key="f">{{ f }}</li>
+              <li v-if="!a.expertise?.frameworks?.length" class="list-none text-muted italic">none</li>
+            </ul>
+          </div>
+          <div :class="['rounded-lg border p-3', listDiffClass(a.expertise?.frameworks, b.expertise?.frameworks)]">
+            <ul class="list-disc list-inside text-sm space-y-1">
+              <li v-for="f in b.expertise?.frameworks" :key="f">{{ f }}</li>
+              <li v-if="!b.expertise?.frameworks?.length" class="list-none text-muted italic">none</li>
+            </ul>
+          </div>
+        </div>
+
+        <h3 class="text-sm font-semibold uppercase tracking-wide text-muted pt-2">Mental models (primary)</h3>
+        <div class="grid grid-cols-2 gap-3">
+          <div :class="['rounded-lg border p-3', listDiffClass(a.mental_models?.primary, b.mental_models?.primary)]">
+            <ul class="list-disc list-inside text-sm space-y-1">
+              <li v-for="m in a.mental_models?.primary" :key="m">{{ m }}</li>
+              <li v-if="!a.mental_models?.primary?.length" class="list-none text-muted italic">none</li>
+            </ul>
+          </div>
+          <div :class="['rounded-lg border p-3', listDiffClass(a.mental_models?.primary, b.mental_models?.primary)]">
+            <ul class="list-disc list-inside text-sm space-y-1">
+              <li v-for="m in b.mental_models?.primary" :key="m">{{ m }}</li>
+              <li v-if="!b.mental_models?.primary?.length" class="list-none text-muted italic">none</li>
+            </ul>
+          </div>
+        </div>
+
+        <p class="text-xs text-muted pt-4 italic">
+          Cells with a yellow tint differ between the two agents.
+        </p>
+      </div>
+    </template>
+  </UDashboardPanel>
+</template>

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

@@ -220,6 +220,12 @@ const departmentMoveOptions = [
   onSelect: () => bulkMove(d),
 }))
 
+function openCompare() {
+  if (selected.value.size !== 2) return
+  const ids = Array.from(selected.value).slice(0, 2).join(',')
+  navigateTo(`/agents/compare?ids=${ids}`)
+}
+
 async function bulkMove(targetDept: string) {
   if (selected.value.size === 0) return
   const ids = Array.from(selected.value)
@@ -552,6 +558,14 @@ async function undoTrashIds(ids: string[]) {
               @click="clearSelection"
             />
             <div class="h-5 w-px bg-default" />
+            <UButton
+              label="Compare"
+              icon="i-lucide-columns-2"
+              size="sm"
+              variant="soft"
+              :disabled="selected.size !== 2"
+              @click="openCompare"
+            />
             <UDropdownMenu :items="departmentMoveOptions">
               <UButton
                 label="Move to..."

package/package.json

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

package/pyproject.toml

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

package/scripts/dashboard-api.py

@@ -1387,6 +1387,43 @@ def agent_export_to_vault(agent_id: str):
     return {"exported": True, "path": str(res.path), "vault_path": str(res.vault_path)}
 
 
+# --- Sidebar stats widget (PR87d v3.22.0) ---
+
+@app.get("/api/sidebar-stats")
+def sidebar_stats():
+    """Compact payload for the sidebar status widget.
+
+    Returns counts the widget actually displays — agents, personas,
+    departments, today's spend. Cheaper than /api/overview/command-center
+    because it skips project scanning, incidents, and quick actions.
+    """
+    agents = _load_agents()
+    departments = {a.get("department") for a in agents if a.get("department")}
+    persona_count = 0
+    mgr = _get_persona_manager()
+    if mgr:
+        try:
+            persona_count = len(mgr.list() or [])
+        except Exception:
+            persona_count = 0
+    today_cost_usd: float | None = None
+    call_count = 0
+    try:
+        from core.runtime.llm_cost_telemetry import summarise
+        s = summarise(period="today")
+        today_cost_usd = s.total_cost_usd
+        call_count = s.call_count
+    except Exception:
+        pass
+    return {
+        "agents": len(agents),
+        "personas": persona_count,
+        "departments": len(departments),
+        "today_cost_usd": today_cost_usd,
+        "today_calls": call_count,
+    }
+
+
 # --- Favorites (PR86a v3.15.0) ---
 
 @app.get("/api/favorites")