@geminilight/mindos 0.6.39 → 0.6.41

package/app/components/agents/AgentDetailContent.tsx

@@ -1,14 +1,16 @@
 'use client';
 
 import Link from 'next/link';
-import { useCallback, useMemo, useState } from 'react';
+import { useCallback, useEffect, useMemo, useState } from 'react';
 import {
   ArrowLeft, Activity, Globe, Key, Loader2, Server, Search,
   Shield, ShieldCheck, Trash2, Wifi, WifiOff, Zap,
+  FileEdit, FilePlus, Clock, Terminal, CheckCircle2, AlertCircle, ChevronDown, BookOpen,
 } from 'lucide-react';
-import { useLocale } from '@/lib/LocaleContext';
+import { useLocale } from '@/lib/stores/locale-store';
 import { toast } from '@/lib/toast';
-import { useMcpData } from '@/hooks/useMcpData';
+import { encodePath } from '@/lib/utils';
+import { useMcpData } from '@/lib/stores/mcp-store';
 import { useA2aRegistry } from '@/hooks/useA2aRegistry';
 import { apiFetch } from '@/lib/api';
 import { copyToClipboard } from '@/lib/clipboard';
@@ -268,6 +270,9 @@ export default function AgentDetailContent({ agentKey }: { agentKey: string }) {
         </div>
       </section>
 
+      {/* ═══════════ KNOWLEDGE INTERACTION ═══════════ */}
+      <KnowledgeInteractionSection />
+
       {/* ═══════════ MCP MANAGEMENT ═══════════ */}
       <section className="rounded-xl border border-border bg-card p-4 space-y-3">
         <div className="flex flex-wrap items-center justify-between gap-2">
@@ -786,6 +791,232 @@ function EnvPermSection({
   );
 }
 
+/* ═══════════ Knowledge Interaction ═══════════ */
+
+interface AuditEvent {
+  id: string;
+  ts: string;
+  tool: string;
+  params: Record<string, unknown>;
+  result: 'ok' | 'error';
+  message?: string;
+  durationMs?: number;
+}
+
+type InteractionKind = 'read' | 'write' | 'create' | 'delete' | 'search' | 'other';
+
+function classifyTool(tool: string): InteractionKind {
+  if (/search/.test(tool)) return 'search';
+  if (/read|list|get/.test(tool)) return 'read';
+  if (/create|batch_create/.test(tool)) return 'create';
+  if (/delete/.test(tool)) return 'delete';
+  if (/write|update|insert|append|edit|rename|move/.test(tool)) return 'write';
+  return 'other';
+}
+
+const INTERACTION_ICON: Record<InteractionKind, { icon: typeof Clock; color: string }> = {
+  read: { icon: Clock, color: 'text-blue-400' },
+  write: { icon: FileEdit, color: 'text-[var(--amber)]' },
+  create: { icon: FilePlus, color: 'text-[var(--success)]' },
+  delete: { icon: Trash2, color: 'text-[var(--error)]' },
+  search: { icon: Search, color: 'text-purple-400' },
+  other: { icon: Terminal, color: 'text-muted-foreground' },
+};
+
+function interactionAge(ts: string): string {
+  const diff = Date.now() - new Date(ts).getTime();
+  const m = Math.floor(diff / 60_000);
+  if (m < 1) return '<1m';
+  if (m < 60) return `${m}m`;
+  const h = Math.floor(diff / 3_600_000);
+  if (h < 24) return `${h}h`;
+  return `${Math.floor(diff / 86_400_000)}d`;
+}
+
+const VISIBLE_EVENTS = 5;
+
+function KnowledgeInteractionSection() {
+  const { t } = useLocale();
+  const d = t.agentsContent?.detail;
+  const [events, setEvents] = useState<AuditEvent[]>([]);
+  const [loading, setLoading] = useState(true);
+  const [showAll, setShowAll] = useState(false);
+
+  useEffect(() => {
+    let cancelled = false;
+    const doFetch = () => {
+      fetch('/api/agent-activity?limit=50')
+        .then(r => r.json())
+        .then(data => { if (!cancelled) setEvents(data.events ?? []); })
+        .catch(() => {})
+        .finally(() => { if (!cancelled) setLoading(false); });
+    };
+    doFetch();
+    const onVisible = () => { if (document.visibilityState === 'visible') doFetch(); };
+    document.addEventListener('visibilitychange', onVisible);
+    return () => { cancelled = true; document.removeEventListener('visibilitychange', onVisible); };
+  }, []);
+
+  const stats = useMemo(() => {
+    if (events.length === 0) return null;
+    const reads = events.filter(e => classifyTool(e.tool) === 'read').length;
+    const writes = events.filter(e => ['write', 'create', 'delete'].includes(classifyTool(e.tool))).length;
+    const errors = events.filter(e => e.result === 'error').length;
+    const durations = events.filter(e => typeof e.durationMs === 'number').map(e => e.durationMs!);
+    const avgMs = durations.length > 0 ? Math.round(durations.reduce((a, b) => a + b, 0) / durations.length) : null;
+    const files = new Set<string>();
+    for (const e of events) {
+      const p = e.params.path;
+      if (typeof p === 'string') files.add(p);
+    }
+    const errorRate = events.length > 0 ? Math.round((errors / events.length) * 100) : 0;
+    return { total: events.length, reads, writes, errors, errorRate, avgMs, filesCount: files.size };
+  }, [events]);
+
+  // Meaningful events: prioritize writes, but show all if few writes
+  const meaningful = useMemo(() => {
+    const writeOps = events.filter(e => {
+      const k = classifyTool(e.tool);
+      return k === 'write' || k === 'create' || k === 'delete';
+    });
+    return writeOps.length >= 3 ? writeOps : events;
+  }, [events]);
+
+  const visible = showAll ? meaningful : meaningful.slice(0, VISIBLE_EVENTS);
+  const hiddenCount = meaningful.length - VISIBLE_EVENTS;
+
+  if (loading) {
+    return (
+      <section className="rounded-xl border border-border bg-card p-4">
+        <div className="flex justify-center py-6">
+          <Loader2 size={16} className="animate-spin text-muted-foreground" />
+        </div>
+      </section>
+    );
+  }
+
+  if (events.length === 0) {
+    return (
+      <section className="rounded-xl border border-border bg-card p-4 space-y-3">
+        <h2 className="text-xs font-semibold text-foreground flex items-center gap-2 shrink-0">
+          <BookOpen size={12} className="text-muted-foreground/50" />
+          {d?.knowledgeInteraction ?? 'Knowledge Interaction'}
+        </h2>
+        <div className="rounded-lg border border-dashed border-border/50 bg-muted/10 px-4 py-6 text-center">
+          <BookOpen size={20} className="text-muted-foreground/30 mx-auto mb-2" />
+          <p className="text-2xs text-muted-foreground/50">{d?.knowledgeNoData ?? 'No interactions yet. Agents will show activity here once they start working with your knowledge base.'}</p>
+        </div>
+      </section>
+    );
+  }
+
+  return (
+    <section className="rounded-xl border border-border bg-card overflow-hidden">
+      {/* Header */}
+      <div className="flex items-center justify-between px-4 pt-4 pb-2">
+        <h2 className="text-xs font-semibold text-foreground flex items-center gap-2 shrink-0">
+          <BookOpen size={12} className="text-muted-foreground/50" />
+          {d?.knowledgeInteraction ?? 'Knowledge Interaction'}
+        </h2>
+        <Link
+          href={`/view/${encodePath('.mindos/agent-audit-log.json')}`}
+          className="text-2xs font-medium text-[var(--amber)] hover:opacity-80 transition-opacity font-display"
+        >
+          {d?.viewFullLog ?? 'View log'} →
+        </Link>
+      </div>
+
+      {/* Stats bar — compact horizontal strip */}
+      {stats && (
+        <div className="flex items-center gap-px mx-4 mb-3 rounded-lg overflow-hidden border border-border/40">
+          <div className="flex-1 px-3 py-2 bg-muted/20">
+            <p className="text-2xs text-muted-foreground/50 leading-none mb-1">{d?.statTotalCalls ?? 'Calls'}</p>
+            <p className="text-sm font-semibold text-foreground font-mono tabular-nums leading-none">{stats.total}</p>
+          </div>
+          <div className="flex-1 px-3 py-2 bg-muted/20 border-l border-border/30">
+            <p className="text-2xs text-muted-foreground/50 leading-none mb-1">{d?.statFilesTouched ?? 'Files'}</p>
+            <p className="text-sm font-semibold text-foreground font-mono tabular-nums leading-none">{stats.filesCount}</p>
+          </div>
+          <div className="flex-1 px-3 py-2 bg-muted/20 border-l border-border/30">
+            <p className="text-2xs text-muted-foreground/50 leading-none mb-1">{d?.statReadWrite ?? 'R / W'}</p>
+            <p className="text-sm font-semibold text-foreground font-mono tabular-nums leading-none">
+              <span className="text-blue-400">{stats.reads}</span>
+              <span className="text-muted-foreground/30 mx-0.5">/</span>
+              <span className="text-[var(--amber)]">{stats.writes}</span>
+            </p>
+          </div>
+          <div className="flex-1 px-3 py-2 bg-muted/20 border-l border-border/30">
+            <p className="text-2xs text-muted-foreground/50 leading-none mb-1">{d?.statHealth ?? 'Health'}</p>
+            <p className="text-sm font-semibold font-mono tabular-nums leading-none">
+              {stats.errors > 0 ? (
+                <span className="text-[var(--error)]">{stats.errorRate}% err</span>
+              ) : (
+                <span className="text-[var(--success)]">100%</span>
+              )}
+            </p>
+          </div>
+        </div>
+      )}
+
+      {/* Timeline */}
+      <div className="border-t border-border/40">
+        <div className="px-4 py-2 flex items-center justify-between">
+          <p className="text-2xs text-muted-foreground/40 uppercase tracking-wider font-display">{d?.recentOps ?? 'Recent operations'}</p>
+        </div>
+        {visible.map((ev, i) => {
+          const kind = classifyTool(ev.tool);
+          const { icon: Icon, color } = INTERACTION_ICON[kind];
+          const filePath = typeof ev.params.path === 'string' ? ev.params.path : null;
+          const toolShort = ev.tool.replace(/^mindos_/, '');
+
+          return (
+            <div
+              key={ev.id ?? i}
+              className={`flex items-center gap-3 px-4 py-2 ${i > 0 ? 'border-t border-border/20' : 'border-t border-border/20'} hover:bg-muted/20 transition-colors`}
+            >
+              <div className="w-5 h-5 rounded-md bg-muted/40 flex items-center justify-center shrink-0">
+                <Icon size={11} className={color} />
+              </div>
+              <span className="text-xs font-medium text-foreground/80 font-mono shrink-0 min-w-[90px]">{toolShort}</span>
+              {filePath ? (
+                <Link
+                  href={`/view/${encodePath(filePath)}`}
+                  className="text-xs text-muted-foreground hover:text-[var(--amber)] truncate min-w-0 flex-1 font-mono transition-colors"
+                  title={filePath}
+                >
+                  {filePath}
+                </Link>
+              ) : (
+                <span className="flex-1" />
+              )}
+              {ev.result === 'ok'
+                ? <CheckCircle2 size={10} className="shrink-0 text-[var(--success)]/40" />
+                : <AlertCircle size={10} className="shrink-0 text-[var(--error)]/60" />
+              }
+              <span className="text-2xs text-muted-foreground/30 tabular-nums shrink-0 font-mono w-[28px] text-right" title={ev.ts}>
+                {interactionAge(ev.ts)}
+              </span>
+            </div>
+          );
+        })}
+      </div>
+
+      {/* Show more */}
+      {hiddenCount > 0 && (
+        <div className="px-4 py-2 border-t border-border/20">
+          <button
+            onClick={() => setShowAll(v => !v)}
+            className="flex items-center gap-1.5 text-xs font-medium text-[var(--amber)] hover:opacity-80 transition-opacity cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring rounded"
+          >
+            <ChevronDown size={12} className={`transition-transform duration-200 ${showAll ? 'rotate-180' : ''}`} />
+            <span>{showAll ? (d?.showLess ?? 'Show less') : `${hiddenCount} more`}</span>
+          </button>
+        </div>
+      )}
+    </section>
+  );
+}
+
 /* ═══════════ Activity & Usage ═══════════ */
 
 function ActivitySection({ agent }: { agent: AgentInfo }) {

package/app/components/agents/AgentsContentPage.tsx

@@ -2,8 +2,8 @@
 
 import { useMemo } from 'react';
 import { toast } from '@/lib/toast';
-import { useLocale } from '@/lib/LocaleContext';
-import { useMcpData } from '@/hooks/useMcpData';
+import { useLocale } from '@/lib/stores/locale-store';
+import { useMcpData } from '@/lib/stores/mcp-store';
 import { useA2aRegistry } from '@/hooks/useA2aRegistry';
 import { copyToClipboard } from '@/lib/clipboard';
 import { generateSnippet } from '@/lib/mcp-snippets';
@@ -17,6 +17,7 @@ import AgentsMcpSection from './AgentsMcpSection';
 import AgentsSkillsSection from './AgentsSkillsSection';
 import AgentsPanelA2aTab from './AgentsPanelA2aTab';
 import AgentsPanelSessionsTab from './AgentsPanelSessionsTab';
+import AgentActivitySection from './AgentActivitySection';
 
 export default function AgentsContentPage({ tab }: { tab: AgentsDashboardTab }) {
   const { t } = useLocale();
@@ -24,6 +25,12 @@ export default function AgentsContentPage({ tab }: { tab: AgentsDashboardTab })
   const mcp = useMcpData();
   const a2a = useA2aRegistry();
   const pageHeader = useMemo(() => {
+    if (tab === 'activity') {
+      return {
+        title: a.navActivity ?? 'Activity',
+        subtitle: a.activitySubtitle ?? 'Agent operations audit log.',
+      };
+    }
     if (tab === 'sessions') {
       return {
         title: 'Sessions',
@@ -125,6 +132,10 @@ export default function AgentsContentPage({ tab }: { tab: AgentsDashboardTab })
       {tab === 'sessions' && (
         <AgentsPanelSessionsTab />
       )}
+
+      {tab === 'activity' && (
+        <AgentActivitySection />
+      )}
     </div>
   );
 }

package/app/components/agents/AgentsMcpSection.tsx

@@ -3,7 +3,7 @@
 import { useCallback, useMemo, useState } from 'react';
 import Link from 'next/link';
 import { RefreshCw, Search, Server } from 'lucide-react';
-import type { McpContextValue } from '@/hooks/useMcpData';
+import type { McpContextValue } from '@/lib/stores/mcp-store';
 import type { AgentBuckets, AgentStatusFilter, AgentTransportFilter } from './agents-content-model';
 import {
   ActionButton,
@@ -339,6 +339,9 @@ function ByAgentView({
                         variant="primary"
                       />
                     )}
+                    {!agent.installed && (
+                      <span className="text-2xs text-muted-foreground/60">or CLI Skill</span>
+                    )}
                   </div>
                 </div>
 
@@ -385,14 +388,10 @@ function ByServerView({
   const [reconnectingServer, setReconnectingServer] = useState<string | null>(null);
   const [reconnectMsg, setReconnectMsg] = useState<Record<string, string>>({});
 
-  const isMindosServer = (name: string) => name.toLowerCase().includes('mindos');
-
   const handleAddAgent = useCallback(
-    async (agentKey: string, serverName: string) => {
+    async (agentKey: string, _serverName: string) => {
       setPickerServer(null);
-      if (isMindosServer(serverName)) {
-        await onInstallMindos(agentKey);
-      }
+      await onInstallMindos(agentKey);
     },
     [onInstallMindos],
   );
@@ -442,10 +441,7 @@ function ByServerView({
             .map((name) => allAgents.find((a) => a.name === name))
             .filter(Boolean) as typeof allAgents;
           const orphanNames = srv.agents.filter((name) => !agentDetails.some((a) => a.name === name));
-          const canManage = isMindosServer(srv.serverName);
-          const availableToAdd = canManage
-            ? allAgents.filter((a) => !srv.agents.includes(a.name))
-            : [];
+          const availableToAdd = allAgents.filter((a) => !srv.agents.includes(a.name));
 
           const connectedCount = agentDetails.filter((a) => resolveAgentStatus(a) === 'connected').length;
           const detectedCount = agentDetails.filter((a) => resolveAgentStatus(a) === 'detected').length;
@@ -462,7 +458,7 @@ function ByServerView({
                   <span className="text-sm font-semibold text-foreground truncate">{srv.serverName}</span>
                 </div>
                 <div className="flex items-center gap-1.5 shrink-0">
-                  {canManage && agentDetails.length > 0 && (
+                  {agentDetails.length > 0 && (
                     <ActionButton
                       onClick={() => void handleReconnectAllInServer(srv.serverName, agentDetails)}
                       disabled={reconnectingServer !== null || busyAction !== null}
@@ -471,8 +467,7 @@ function ByServerView({
                       busyLabel={copy.reconnectAllRunning}
                     />
                   )}
-                  {canManage && (
-                    <div className="relative">
+                  <div className="relative">
                       <AddAvatarButton
                         onClick={() => setPickerServer(pickerServer === srv.serverName ? null : srv.serverName)}
                         label={copy.addAgent}
@@ -486,7 +481,6 @@ function ByServerView({
                         onClose={() => setPickerServer(null)}
                       />
                     </div>
-                  )}
                 </div>
               </div>
 
@@ -526,7 +520,7 @@ function ByServerView({
                       <AgentAvatar
                         name={agent.name}
                         status={agentStatus}
-                        onRemove={canManage ? () => setConfirmState({ agentName: agent.name, serverName: srv.serverName }) : undefined}
+                        onRemove={() => setConfirmState({ agentName: agent.name, serverName: srv.serverName })}
                       />
                     </Link>
                   );

package/app/components/agents/AgentsOverviewSection.tsx

@@ -79,15 +79,16 @@ export default function AgentsOverviewSection({
   a2aCount?: number;
 }) {
   const allHealthy = riskQueue.length === 0 && mcpRunning;
-  const totalAgents = allAgents.length;
   const [riskOpen, setRiskOpen] = useState(false);
 
   const sortedAgents = useMemo(
     () =>
-      [...allAgents].sort((a, b) => {
-        const rank = (x: AgentInfo) => (x.present && x.installed ? 0 : x.present ? 1 : 2);
-        return rank(a) - rank(b) || a.name.localeCompare(b.name);
-      }),
+      [...allAgents]
+        .filter(a => a.present) // hide not-found agents from overview
+        .sort((a, b) => {
+          const rank = (x: AgentInfo) => (x.installed ? 0 : 1);
+          return rank(a) - rank(b) || a.name.localeCompare(b.name);
+        }),
     [allAgents],
   );
 
@@ -103,7 +104,7 @@ export default function AgentsOverviewSection({
             icon={<Zap size={14} aria-hidden="true" />}
             label={pulseCopy.connected}
             value={buckets.connected.length}
-            total={totalAgents}
+            total={sortedAgents.length}
             tone="ok"
           />
           <StatCell
@@ -143,6 +144,26 @@ export default function AgentsOverviewSection({
         </div>
       </section>
 
+      {/* ═══════════ QUICK NAVIGATION ═══════════ */}
+      <nav className="grid grid-cols-1 md:grid-cols-2 gap-3" aria-label="Quick navigation">
+        <QuickNavCard
+          href="/agents?tab=mcp"
+          icon={<Server size={18} aria-hidden="true" />}
+          title="MCP"
+          stat={mcpRunning ? copy.toolsUnit(mcpToolCount) : copy.mcpOffline}
+          statTone={mcpRunning ? 'ok' : 'warn'}
+          description={copy.nextActionHint as string}
+        />
+        <QuickNavCard
+          href="/agents?tab=skills"
+          icon={<Zap size={18} aria-hidden="true" />}
+          title="Skills"
+          stat={copy.enabledUnit(enabledSkillCount)}
+          statTone="ok"
+          description={`${pulseCopy.enabledSkills}: ${enabledSkillCount}`}
+        />
+      </nav>
+
       {/* ═══════════ RISK CAPSULE ═══════════ */}
       {riskQueue.length > 0 && (
         <div>
@@ -206,26 +227,6 @@ export default function AgentsOverviewSection({
         </div>
       )}
 
-      {/* ═══════════ QUICK NAVIGATION ═══════════ */}
-      <nav className="grid grid-cols-1 md:grid-cols-2 gap-3" aria-label="Quick navigation">
-        <QuickNavCard
-          href="/agents?tab=mcp"
-          icon={<Server size={18} aria-hidden="true" />}
-          title="MCP"
-          stat={mcpRunning ? copy.toolsUnit(mcpToolCount) : copy.mcpOffline}
-          statTone={mcpRunning ? 'ok' : 'warn'}
-          description={copy.nextActionHint as string}
-        />
-        <QuickNavCard
-          href="/agents?tab=skills"
-          icon={<Zap size={18} aria-hidden="true" />}
-          title="Skills"
-          stat={copy.enabledUnit(enabledSkillCount)}
-          statTone="ok"
-          description={`${pulseCopy.enabledSkills}: ${enabledSkillCount}`}
-        />
-      </nav>
-
       {/* ═══════════ RECENT ACTIVITY ═══════════ */}
       <RecentActivityFeed />
 
@@ -235,7 +236,7 @@ export default function AgentsOverviewSection({
           <div className="flex items-center justify-between mb-3">
             <h2 className="text-sm font-medium text-foreground">{copy.usagePulse}</h2>
             <span className="text-2xs text-muted-foreground tabular-nums select-none">
-              {copy.agentCount(totalAgents)}
+              {copy.agentCount(sortedAgents.length)}
             </span>
           </div>
           <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-3">

package/app/components/agents/AgentsPanelA2aTab.tsx

@@ -2,7 +2,7 @@
 
 import { useState, useCallback } from 'react';
 import { Check, ChevronDown, ChevronUp, Clock, Code2, Download, Globe, Loader2, MessageSquare, Network, RefreshCw, RotateCcw, Save, Settings2, Trash2, Wifi, WifiOff, Wrench, Zap } from 'lucide-react';
-import { useLocale } from '@/lib/LocaleContext';
+import { useLocale } from '@/lib/stores/locale-store';
 import { useAcpConfig } from '@/hooks/useAcpConfig';
 import type { RemoteAgent, DelegationRecord } from '@/lib/a2a/types';
 import type { AcpRegistryEntry } from '@/lib/acp/types';

package/app/components/agents/AgentsPanelSessionsTab.tsx

@@ -33,7 +33,12 @@ export default function AgentsPanelSessionsTab() {
     }
   }, []);
 
-  useEffect(() => { fetchSessions(); }, [fetchSessions]);
+  useEffect(() => {
+    fetchSessions();
+    const onVisible = () => { if (document.visibilityState === 'visible') fetchSessions(); };
+    document.addEventListener('visibilitychange', onVisible);
+    return () => { document.removeEventListener('visibilitychange', onVisible); };
+  }, [fetchSessions]);
 
   const handleClose = useCallback(async (sessionId: string) => {
     try {

package/app/components/agents/AgentsSkillsSection.tsx

@@ -6,7 +6,7 @@ import Link from 'next/link';
 import { ChevronDown, ChevronRight, Search, Trash2, Zap } from 'lucide-react';
 import { Toggle } from '@/components/settings/Primitives';
 import { apiFetch } from '@/lib/api';
-import type { McpContextValue } from '@/hooks/useMcpData';
+import type { McpContextValue } from '@/lib/stores/mcp-store';
 import type {
   AgentBuckets,
   SkillCapabilityFilter,

package/app/components/agents/DiscoverAgentModal.tsx

@@ -2,7 +2,7 @@
 
 import { useState } from 'react';
 import { X, Loader2, Globe, AlertCircle, CheckCircle2 } from 'lucide-react';
-import { useLocale } from '@/lib/LocaleContext';
+import { useLocale } from '@/lib/stores/locale-store';
 import type { RemoteAgent } from '@/lib/a2a/types';
 
 interface DiscoverAgentModalProps {