@geminilight/mindos 0.6.39 → 0.6.40

package/app/components/agents/RecentActivityFeed.tsx

@@ -2,89 +2,35 @@
 
 import { useEffect, useState, useMemo } from 'react';
 import Link from 'next/link';
-import {
-  Terminal, FileEdit, FilePlus, Trash2, Search, Clock,
-  CheckCircle2, AlertCircle, ChevronDown, ArrowRight,
-} from 'lucide-react';
+import { CheckCircle2, AlertCircle, ChevronDown, Activity, ArrowRight } from 'lucide-react';
 import { encodePath } from '@/lib/utils';
-import { useLocale } from '@/lib/LocaleContext';
-
-/* ── Types ── */
-
-interface AgentOp {
-  id: string;
-  ts: string;
-  tool: string;
-  params: Record<string, unknown>;
-  result: 'ok' | 'error';
-  message?: string;
-}
-
-type OpKind = 'read' | 'write' | 'create' | 'delete' | 'search' | 'other';
-
-/* ── Helpers ── */
-
-function opKind(tool: string): OpKind {
-  if (/search/.test(tool)) return 'search';
-  if (/read|list|get/.test(tool)) return 'read';
-  if (/create/.test(tool)) return 'create';
-  if (/delete/.test(tool)) return 'delete';
-  if (/write|update|insert|append/.test(tool)) return 'write';
-  return 'other';
-}
-
-const KIND_COLOR: Record<OpKind, string> = {
-  read: 'text-blue-400',
-  write: 'text-[var(--amber)]',
-  create: 'text-[var(--success)]',
-  delete: 'text-[var(--error)]',
-  search: 'text-purple-400',
-  other: 'text-muted-foreground',
-};
-
-function OpIcon({ kind }: { kind: OpKind }) {
-  const cls = `shrink-0 ${KIND_COLOR[kind]}`;
-  const s = 12;
-  if (kind === 'read') return <Clock size={s} className={cls} />;
-  if (kind === 'write') return <FileEdit size={s} className={cls} />;
-  if (kind === 'create') return <FilePlus size={s} className={cls} />;
-  if (kind === 'delete') return <Trash2 size={s} className={cls} />;
-  if (kind === 'search') return <Search size={s} className={cls} />;
-  return <Terminal size={s} className={cls} />;
-}
-
-function relativeTs(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`;
-}
-
-function getFilePath(params: Record<string, unknown>): string | null {
-  return typeof params.path === 'string' ? params.path : null;
-}
+import { useLocale } from '@/lib/stores/locale-store';
+import {
+  type AgentOp,
+  opKind, KindBadge, relativeTs, getFilePath,
+} from './agent-activity-shared';
 
 const VISIBLE_OPS = 5;
 
-/* ── Component ── */
-
 export default function RecentActivityFeed() {
-  const { t } = useLocale();
+  const { t, locale } = useLocale();
   const [ops, setOps] = useState<AgentOp[]>([]);
   const [loading, setLoading] = useState(true);
   const [showAll, setShowAll] = useState(false);
 
   useEffect(() => {
     let cancelled = false;
-    fetch('/api/agent-activity?limit=20')
-      .then(r => r.json())
-      .then(data => { if (!cancelled) setOps(data.events ?? []); })
-      .catch(() => {})
-      .finally(() => { if (!cancelled) setLoading(false); });
-    return () => { cancelled = true; };
+    const doFetch = () => {
+      fetch('/api/agent-activity?limit=20')
+        .then(r => r.json())
+        .then(data => { if (!cancelled) setOps(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); };
   }, []);
 
   // Filter out read-only noise, show writes/creates/deletes first
@@ -93,36 +39,48 @@ export default function RecentActivityFeed() {
       const k = opKind(op.tool);
       return k === 'write' || k === 'create' || k === 'delete';
     });
-    // If few writes, also show reads/searches
     return writes.length >= 3 ? writes : ops;
   }, [ops]);
 
   const visible = showAll ? meaningful : meaningful.slice(0, VISIBLE_OPS);
   const hiddenCount = meaningful.length - VISIBLE_OPS;
 
-  if (loading || ops.length === 0) return null;
+  if (loading) return (
+    <section className="animate-pulse" aria-label="Recent Activity">
+      <div className="h-4 w-36 bg-muted rounded mb-3" />
+      <div className="space-y-2">
+        <div className="h-10 bg-muted/50 rounded-lg" />
+        <div className="h-10 bg-muted/50 rounded-lg" />
+      </div>
+    </section>
+  );
+
+  if (ops.length === 0) return null;
 
   const copy = t.agentsContent?.overview;
 
   return (
     <section aria-label="Recent Activity">
-      <div className="flex items-center justify-between mb-3">
-        <h2 className="text-sm font-medium text-foreground">
+      <div className="flex items-center gap-2 mb-4">
+        <span className="text-[var(--amber)]"><Activity size={13} /></span>
+        <h2 className="text-sm font-semibold font-display text-foreground">
           {copy?.recentActivity ?? 'Recent Activity'}
         </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"
-        >
-          {copy?.viewAll ?? 'View all'} →
-        </Link>
+        <div className="ml-auto">
+          <Link
+            href="/agents?tab=activity"
+            className="flex items-center gap-1.5 text-xs font-medium text-[var(--amber)] hover:opacity-80 transition-colors font-display"
+          >
+            <ArrowRight size={12} />
+            <span>{copy?.viewAll ?? 'View all'}</span>
+          </Link>
+        </div>
       </div>
 
       <div className="rounded-xl border border-border bg-card overflow-hidden">
         {visible.map((op, i) => {
           const kind = opKind(op.tool);
           const filePath = getFilePath(op.params);
-          const toolShort = op.tool.replace(/^mindos_/, '');
 
           return (
             <div
@@ -131,11 +89,7 @@ export default function RecentActivityFeed() {
                 i > 0 ? 'border-t border-border/30' : ''
               } hover:bg-muted/30 transition-colors`}
             >
-              <OpIcon kind={kind} />
-
-              <span className="text-xs font-medium text-foreground font-display shrink-0">
-                {toolShort}
-              </span>
+              <KindBadge kind={kind} locale={locale} size="sm" />
 
               {filePath ? (
                 <Link
@@ -149,6 +103,13 @@ export default function RecentActivityFeed() {
                 <span className="flex-1" />
               )}
 
+              {/* agent name badge */}
+              {op.agentName && (
+                <span className="text-[0.6rem] font-medium text-muted-foreground/70 bg-muted/60 px-1.5 py-0.5 rounded-full shrink-0 font-display" title={op.agentName}>
+                  {op.agentName.length > 20 ? op.agentName.slice(0, 20) + '...' : op.agentName}
+                </span>
+              )}
+
               {op.result === 'ok'
                 ? <CheckCircle2 size={11} className="shrink-0 text-[var(--success)]/60" />
                 : <AlertCircle size={11} className="shrink-0 text-[var(--error)]/60" />

package/app/components/agents/agent-activity-shared.tsx

@@ -0,0 +1,110 @@
+'use client';
+
+/**
+ * Shared types and helpers for Agent Activity UI components.
+ * Used by both AgentActivitySection (full audit log) and RecentActivityFeed (compact list).
+ */
+
+import { Terminal, FileEdit, FilePlus, Trash2, Search, Clock } from 'lucide-react';
+
+// ─── Types ─────────────────────────────────────────────────────────────────────
+
+export interface AgentOp {
+  id?: string;
+  ts: string;
+  tool: string;
+  params: Record<string, unknown>;
+  result: 'ok' | 'error';
+  message?: string;
+  agentName?: string;
+}
+
+export type OpKind = 'read' | 'write' | 'create' | 'delete' | 'search' | 'other';
+
+// ─── Helpers ───────────────────────────────────────────────────────────────────
+
+export function opKind(tool: string): OpKind {
+  if (/search/.test(tool)) return 'search';
+  if (/read|list|get/.test(tool)) return 'read';
+  if (/create/.test(tool)) return 'create';
+  if (/delete/.test(tool)) return 'delete';
+  if (/write|update|insert|append/.test(tool)) return 'write';
+  return 'other';
+}
+
+export const KIND_LABEL: Record<string, Record<OpKind, string>> = {
+  en: { read: 'Read', write: 'Write', create: 'Create', delete: 'Delete', search: 'Search', other: 'Other' },
+  zh: { read: '读取', write: '写入', create: '创建', delete: '删除', search: '搜索', other: '其他' },
+};
+
+export const KIND_STYLE: Record<OpKind, { bg: string; text: string; border: string }> = {
+  read:   { bg: 'rgba(138,180,216,0.10)', text: '#8ab4d8', border: 'rgba(138,180,216,0.25)' },
+  write:  { bg: 'rgba(200,135,58,0.10)',  text: 'var(--amber)', border: 'rgba(200,135,58,0.25)' },
+  create: { bg: 'rgba(122,173,128,0.10)', text: 'var(--success)', border: 'rgba(122,173,128,0.25)' },
+  delete: { bg: 'rgba(200,80,80,0.10)',   text: 'var(--error)', border: 'rgba(200,80,80,0.25)' },
+  search: { bg: 'rgba(200,160,216,0.10)', text: '#c8a0d8', border: 'rgba(200,160,216,0.25)' },
+  other:  { bg: 'var(--muted)', text: 'var(--muted-foreground)', border: 'var(--border)' },
+};
+
+export const KIND_COLOR: Record<OpKind, string> = {
+  read: 'text-blue-400',
+  write: 'text-[var(--amber)]',
+  create: 'text-[var(--success)]',
+  delete: 'text-[var(--error)]',
+  search: 'text-purple-400',
+  other: 'text-muted-foreground',
+};
+
+export function OpIcon({ kind, size = 13 }: { kind: OpKind; size?: number }) {
+  if (kind === 'read')   return <Clock size={size} />;
+  if (kind === 'write')  return <FileEdit size={size} />;
+  if (kind === 'create') return <FilePlus size={size} />;
+  if (kind === 'delete') return <Trash2 size={size} />;
+  if (kind === 'search') return <Search size={size} />;
+  return <Terminal size={size} />;
+}
+
+export function formatTs(ts: string): string {
+  try {
+    const d = new Date(ts);
+    return d.toLocaleString(undefined, { month: 'short', day: 'numeric', hour: '2-digit', minute: '2-digit', second: '2-digit' });
+  } catch { return ts; }
+}
+
+export function relativeTs(ts: string): string {
+  const diff = Date.now() - new Date(ts).getTime();
+  const m = Math.floor(diff / 60000);
+  const h = Math.floor(diff / 3600000);
+  const d = Math.floor(diff / 86400000);
+  if (m < 1) return '<1m';
+  if (m < 60) return `${m}m`;
+  if (h < 24) return `${h}h`;
+  return `${d}d`;
+}
+
+export function getFilePath(params: Record<string, unknown>): string | null {
+  return typeof params.path === 'string' ? params.path : null;
+}
+
+/** Compact colored badge showing operation kind with icon + localized label. */
+export function KindBadge({ kind, locale, size = 'md' }: { kind: OpKind; locale?: string; size?: 'sm' | 'md' }) {
+  const style = KIND_STYLE[kind];
+  const lang = locale?.startsWith('zh') ? 'zh' : 'en';
+  const label = KIND_LABEL[lang][kind];
+  const iconSize = size === 'sm' ? 9 : 10;
+  const fontSize = size === 'sm' ? '0.6rem' : '0.68rem';
+  const padding = size === 'sm' ? '1px 6px' : '2px 8px';
+
+  return (
+    <span className="font-display" style={{
+      display: 'inline-flex', alignItems: 'center', gap: 3,
+      padding, borderRadius: 999, fontSize,
+      fontWeight: 600,
+      background: style.bg, color: style.text, border: `1px solid ${style.border}`,
+      flexShrink: 0, whiteSpace: 'nowrap',
+    }}>
+      <OpIcon kind={kind} size={iconSize} />
+      {label}
+    </span>
+  );
+}

package/app/components/agents/agents-content-model.ts

@@ -1,6 +1,6 @@
 import type { AgentInfo, SkillInfo } from '@/components/settings/types';
 
-export type AgentsDashboardTab = 'overview' | 'mcp' | 'skills' | 'a2a' | 'sessions';
+export type AgentsDashboardTab = 'overview' | 'mcp' | 'skills' | 'a2a' | 'sessions' | 'activity';
 export type AgentResolvedStatus = 'connected' | 'detected' | 'notFound';
 export type SkillCapability = 'research' | 'coding' | 'docs' | 'ops' | 'memory';
 export type SkillSourceFilter = 'all' | 'builtin' | 'user';
@@ -24,7 +24,7 @@ export interface AgentBuckets {
 }
 
 export function parseAgentsTab(tab: string | undefined): AgentsDashboardTab {
-  if (tab === 'mcp' || tab === 'skills' || tab === 'a2a' || tab === 'sessions') return tab;
+  if (tab === 'mcp' || tab === 'skills' || tab === 'a2a' || tab === 'sessions' || tab === 'activity') return tab;
   return 'overview';
 }
 

package/app/components/ask/AgentSelectorCapsule.tsx

@@ -5,7 +5,7 @@ import { createPortal } from 'react-dom';
 import { Bot, ChevronDown, X, Check } from 'lucide-react';
 import type { AcpAgentSelection } from '@/hooks/useAskModal';
 import type { DetectedAgent } from '@/hooks/useAcpDetection';
-import { useLocale } from '@/lib/LocaleContext';
+import { useLocale } from '@/lib/stores/locale-store';
 
 interface AgentSelectorCapsuleProps {
   selectedAgent: AcpAgentSelection | null;