@dyyz1993/create-agent 2.1.0 → 2.1.2

package/templates/browser-agent/src/mainview/lib/i18n/locales/en.json

@@ -0,0 +1,130 @@
+{
+	"app": {
+		"title": "Browser Agent",
+		"connecting": "Connecting to RPC server...",
+		"online": "Online",
+		"offline": "Offline",
+		"mode": {
+			"desktop": "Desktop (IPC)",
+			"web": "Web (WebSocket)"
+		}
+	},
+	"sidebar": {
+		"explorer": "Explorer",
+		"git": "Source Control",
+		"search": "Search"
+	},
+	"tabs": {
+		"chat": "Chat",
+		"debug": "Debug"
+	},
+	"chat": {
+		"title": "Agent Chat",
+		"placeholder": "Type your request...",
+		"send": "Send",
+		"empty": "Start a conversation...",
+		"welcome": "Start your first collection"
+	},
+	"session": {
+		"new": "New Session",
+		"history": "History"
+	},
+	"skills": {
+		"title": "Skills",
+		"xhsExplore": "Xiaohongshu Explore",
+		"xhsSearch": "Keyword Search",
+		"xhsBlogger": "Blogger Profile"
+	},
+	"explorer": {
+		"title": "Explorer",
+		"pathPlaceholder": "Path",
+		"refresh": "Refresh",
+		"listDirectory": "List directory",
+		"newFile": "New File",
+		"newFolder": "New Folder",
+		"rename": "Rename",
+		"delete": "Delete",
+		"copyPath": "Copy Path",
+		"confirmDelete": "Confirm Delete",
+		"confirmDeleteMessage": "Are you sure you want to delete \"{{name}}\"? This action cannot be undone.",
+		"emptyHint": "Enter path and click refresh"
+	},
+	"git": {
+		"title": "Source Control",
+		"staged": "Staged Changes",
+		"changes": "Changes",
+		"untracked": "Untracked",
+		"noChanges": "No changes detected",
+		"commits": "Commits",
+		"noCommits": "No commits",
+		"noFiles": "No files",
+		"loadingFiles": "Loading files...",
+		"commitPlaceholder": "Commit message (Ctrl+Enter to commit)",
+		"committing": "Committing...",
+		"commit": "Commit",
+		"openDiff": "Open Diff",
+		"openFile": "Open File",
+		"copyHash": "Copy Hash",
+		"copyMessage": "Copy Message",
+		"copyPath": "Copy Path",
+		"pull": "Pull",
+		"push": "Push",
+		"refresh": "Refresh",
+		"stage": "Stage",
+		"unstage": "Unstage",
+		"stageAll": "Stage all",
+		"unstageAll": "Unstage all",
+		"worktrees": "Worktrees",
+		"close": "Close",
+		"justNow": "just now",
+		"minutesAgo": "{{count}}m ago",
+		"hoursAgo": "{{count}}h ago",
+		"daysAgo": "{{count}}d ago"
+	},
+	"debug": {
+		"rpcCalls": "RPC Calls",
+		"call": "Call",
+		"subscriptions": "Subscriptions",
+		"subscribe": "Subscribe",
+		"unsubscribe": "Unsubscribe",
+		"events": "{{count}} events",
+		"noEvents": "No events yet",
+		"logs": "Logs",
+		"clear": "Clear",
+		"clearAll": "Clear all debug data",
+		"expandPanel": "Expand Debug Panel",
+		"collapsePanel": "Collapse Debug Panel"
+	},
+	"search": {
+		"noResults": "No results found",
+		"noResultsFor": "No results for \"{{query}}\"",
+		"resultsIn": "{{count}} result in {{fileCount}} file",
+		"resultsIn_plural": "{{count}} results in {{fileCount}} files",
+		"filesSearched": "({{count}} file searched)",
+		"filesSearched_plural": "({{count}} files searched)",
+		"typeToSearch": "Type a search term and press Enter",
+		"focusShortcut": "...{{key}}+F to focus search",
+		"tryDifferent": "Try different search terms"
+	},
+	"error": {
+		"title": "Something went wrong",
+		"unexpected": "An unexpected error occurred",
+		"retry": "Retry"
+	},
+	"theme": {
+		"light": "Light",
+		"dark": "Dark",
+		"toggle": "Toggle theme"
+	},
+	"locale": {
+		"en": "English",
+		"zh": "中文"
+	},
+	"common": {
+		"loading": "Loading...",
+		"cancel": "Cancel",
+		"confirm": "Confirm",
+		"save": "Save",
+		"delete": "Delete"
+	}
+}

package/templates/browser-agent/src/mainview/lib/i18n/locales/zh.json

@@ -0,0 +1,128 @@
+{
+	"app": {
+		"title": "Browser Agent",
+		"connecting": "正在连接 RPC 服务器...",
+		"online": "在线",
+		"offline": "离线",
+		"mode": {
+			"desktop": "桌面 (IPC)",
+			"web": "Web (WebSocket)"
+		}
+	},
+	"sidebar": {
+		"explorer": "资源管理器",
+		"git": "源代码管理",
+		"search": "搜索"
+	},
+	"tabs": {
+		"chat": "聊天",
+		"debug": "调试"
+	},
+	"chat": {
+		"title": "Agent 对话",
+		"placeholder": "输入需求...",
+		"send": "发送",
+		"empty": "开始对话...",
+		"welcome": "开始你的第一次采集"
+	},
+	"session": {
+		"new": "新建会话",
+		"history": "历史会话"
+	},
+	"skills": {
+		"title": "技能库",
+		"xhsExplore": "小红书首页采集",
+		"xhsSearch": "关键词搜索采集",
+		"xhsBlogger": "博主主页采集"
+	},
+	"explorer": {
+		"title": "资源管理器",
+		"pathPlaceholder": "路径",
+		"refresh": "刷新",
+		"listDirectory": "列出目录",
+		"newFile": "新建文件",
+		"newFolder": "新建文件夹",
+		"rename": "重命名",
+		"delete": "删除",
+		"copyPath": "复制路径",
+		"confirmDelete": "确认删除",
+		"confirmDeleteMessage": "确定要删除 \"{{name}}\" 吗？此操作无法撤销。",
+		"emptyHint": "输入路径并点击刷新"
+	},
+	"git": {
+		"title": "源代码管理",
+		"staged": "已暂存更改",
+		"changes": "更改",
+		"untracked": "未跟踪",
+		"noChanges": "未检测到更改",
+		"commits": "提交记录",
+		"noCommits": "暂无提交",
+		"noFiles": "暂无文件",
+		"loadingFiles": "加载文件中...",
+		"commitPlaceholder": "提交信息 (Ctrl+Enter 提交)",
+		"committing": "提交中...",
+		"commit": "提交",
+		"openDiff": "打开差异",
+		"openFile": "打开文件",
+		"copyHash": "复制哈希",
+		"copyMessage": "复制信息",
+		"copyPath": "复制路径",
+		"pull": "拉取",
+		"push": "推送",
+		"refresh": "刷新",
+		"stage": "暂存",
+		"unstage": "取消暂存",
+		"stageAll": "全部暂存",
+		"unstageAll": "全部取消暂存",
+		"worktrees": "工作树",
+		"close": "关闭",
+		"justNow": "刚刚",
+		"minutesAgo": "{{count}}分钟前",
+		"hoursAgo": "{{count}}小时前",
+		"daysAgo": "{{count}}天前"
+	},
+	"debug": {
+		"rpcCalls": "RPC 调用",
+		"call": "调用",
+		"subscriptions": "订阅",
+		"subscribe": "订阅",
+		"unsubscribe": "取消订阅",
+		"events": "{{count}} 个事件",
+		"noEvents": "暂无事件",
+		"logs": "日志",
+		"clear": "清空",
+		"clearAll": "清空所有调试数据",
+		"expandPanel": "展开调试面板",
+		"collapsePanel": "折叠调试面板"
+	},
+	"search": {
+		"noResults": "未找到结果",
+		"noResultsFor": "未找到 \"{{query}}\" 的结果",
+		"resultsIn": "{{count}} 个结果在 {{fileCount}} 个文件中",
+		"filesSearched": "(已搜索 {{count}} 个文件)",
+		"typeToSearch": "输入搜索词并按回车",
+		"focusShortcut": "...{{key}}+F 聚焦搜索",
+		"tryDifferent": "尝试不同的搜索词"
+	},
+	"error": {
+		"title": "出了点问题",
+		"unexpected": "发生了意外错误",
+		"retry": "重试"
+	},
+	"theme": {
+		"light": "浅色",
+		"dark": "深色",
+		"toggle": "切换主题"
+	},
+	"locale": {
+		"en": "English",
+		"zh": "中文"
+	},
+	"common": {
+		"loading": "加载中...",
+		"cancel": "取消",
+		"confirm": "确认",
+		"save": "保存",
+		"delete": "删除"
+	}
+}

package/templates/browser-agent/src/mainview/lib/network-bus.ts

@@ -0,0 +1,92 @@
+/**
+ * Network Bus — lightweight event emitter for RPC/SSE communication logging.
+ *
+ * The api-client emits events here on every request/response/SSE-event.
+ * The NetworkPanel subscribes to render a live activity feed, giving the
+ * user visibility into the transport layer (solving the "I can't see any
+ * RPC activity" problem with the old silent WebSocket transport).
+ */
+
+export interface NetworkLogEntry {
+	id: string;
+	time: number;
+	kind: "request" | "response" | "event" | "status";
+	label: string;
+	detail?: string;
+}
+
+type NetworkListener = (entry: NetworkLogEntry) => void;
+
+class NetworkBus {
+	private listeners = new Set<NetworkListener>();
+	private entries: NetworkLogEntry[] = [];
+	private maxEntries = 200;
+	private counter = 0;
+
+	subscribe(listener: NetworkListener): () => void {
+		this.listeners.add(listener);
+		return () => {
+			this.listeners.delete(listener);
+		};
+	}
+
+	getEntries(): NetworkLogEntry[] {
+		return [...this.entries];
+	}
+
+	private emit(entry: Omit<NetworkLogEntry, "id" | "time">): void {
+		const full: NetworkLogEntry = {
+			...entry,
+			id: `net_${++this.counter}`,
+			time: Date.now(),
+		};
+		this.entries.push(full);
+		if (this.entries.length > this.maxEntries) {
+			this.entries.shift();
+		}
+		for (const listener of [...this.listeners]) {
+			listener(full);
+		}
+	}
+
+	emitRequest(method: string, params: unknown): void {
+		const paramSummary = this.summarize(params);
+		this.emit({
+			kind: "request",
+			label: `POST /api/rpc → ${method}`,
+			detail: paramSummary,
+		});
+	}
+
+	emitResponse(method: string, elapsedMs: number): void {
+		this.emit({
+			kind: "response",
+			label: `← ${method}`,
+			detail: `${elapsedMs}ms`,
+		});
+	}
+
+	emitEvent(eventType: string, metadata?: Record<string, unknown>): void {
+		this.emit({
+			kind: "event",
+			label: `← SSE ${eventType}`,
+			detail: metadata ? JSON.stringify(metadata) : undefined,
+		});
+	}
+
+	emitStatus(message: string): void {
+		this.emit({
+			kind: "status",
+			label: message,
+		});
+	}
+
+	private summarize(value: unknown): string {
+		if (value === null || value === undefined) return "";
+		const str = JSON.stringify(value);
+		if (!str) return "";
+		return str.length > 120 ? str.slice(0, 117) + "..." : str;
+	}
+}
+
+export const networkBus = new NetworkBus();

package/templates/browser-agent/src/mainview/lib/rpc-cache.ts

@@ -0,0 +1,94 @@
+interface CacheEntry<T> {
+  data: T;
+  timestamp: number;
+}
+
+class RpcCache {
+  private cache = new Map<string, CacheEntry<unknown>>();
+  private defaultTTL: number;
+  private pruneTimer: ReturnType<typeof setInterval> | null = null;
+
+  constructor(defaultTTL = 2000) {
+    this.defaultTTL = defaultTTL;
+  }
+
+  private key(method: string, params: unknown): string {
+    return `${method}:${JSON.stringify(params)}`;
+  }
+
+  get<T>(method: string, params: unknown, ttl?: number): T | null {
+    const k = this.key(method, params);
+    const entry = this.cache.get(k);
+    if (!entry) return null;
+
+    const effectiveTTL = ttl ?? this.defaultTTL;
+    if (Date.now() - entry.timestamp > effectiveTTL) {
+      this.cache.delete(k);
+      return null;
+    }
+
+    return entry.data as T;
+  }
+
+  set<T>(method: string, params: unknown, data: T): void {
+    const k = this.key(method, params);
+    this.cache.set(k, { data, timestamp: Date.now() });
+    if (!this.pruneTimer) this.startPruneTimer();
+  }
+
+  invalidate(method: string): void {
+    const prefix = `${method}:`;
+    for (const key of this.cache.keys()) {
+      if (key.startsWith(prefix)) {
+        this.cache.delete(key);
+      }
+    }
+  }
+
+  invalidateAll(methods: string[]): void {
+    for (const m of methods) {
+      this.invalidate(m);
+    }
+  }
+
+  clear(): void {
+    this.cache.clear();
+    if (this.pruneTimer) {
+      clearInterval(this.pruneTimer);
+      this.pruneTimer = null;
+    }
+  }
+
+  prune(): void {
+    const threshold = this.defaultTTL * 10;
+    const now = Date.now();
+    for (const [key, entry] of this.cache) {
+      if (now - entry.timestamp > threshold) {
+        this.cache.delete(key);
+      }
+    }
+    if (this.cache.size === 0 && this.pruneTimer) {
+      clearInterval(this.pruneTimer);
+      this.pruneTimer = null;
+    }
+  }
+
+  private startPruneTimer(): void {
+    if (this.pruneTimer) return;
+    this.pruneTimer = setInterval(() => this.prune(), this.defaultTTL * 5);
+  }
+}
+
+export const CACHEABLE_METHODS: Record<string, number> = {
+  "file.listDir": 2000,
+  "file.readFile": 3000,
+  "git.status": 2000,
+  "git.branches": 5000,
+  "git.log": 3000,
+  "git.diff": 3000,
+  "git.commitFiles": 3000,
+  "git.commitFileDiff": 3000,
+  "git.worktreeList": 5000,
+};
+
+export const rpcCache = new RpcCache(2000);

package/templates/browser-agent/src/mainview/main.tsx

@@ -0,0 +1,18 @@
+import "./lib/i18n";
+import { StrictMode } from "react";
+import { createRoot } from "react-dom/client";
+import { apiClient } from "./lib/api-client";
+import "./index.css";
+import App from "./App";
+
+const isElectrobun = typeof window !== "undefined" && !!window.__electrobunBunBridge;
+
+if (isElectrobun) {
+	apiClient.initSyncForDesktop();
+}
+
+createRoot(document.getElementById("root")!).render(
+	<StrictMode>
+		<App />
+	</StrictMode>
+);

package/templates/browser-agent/src/mainview/stores/__tests__/use-connection-store.test.ts

@@ -0,0 +1,26 @@
+import { describe, it, expect, vi, beforeEach } from "vitest";
+
+describe("useConnectionStore", () => {
+  beforeEach(async () => {
+    vi.resetModules();
+  });
+
+  it("should have initial state", async () => {
+    const { useConnectionStore } = await import("../use-connection-store");
+    const state = useConnectionStore.getState();
+    expect(state.mode).toBe("web");
+    expect(state.ready).toBe(false);
+  });
+
+  it("should set ready state", async () => {
+    const { useConnectionStore } = await import("../use-connection-store");
+    useConnectionStore.getState().setReady(true);
+    expect(useConnectionStore.getState().ready).toBe(true);
+  });
+
+  it("should set mode", async () => {
+    const { useConnectionStore } = await import("../use-connection-store");
+    useConnectionStore.getState().setMode("desktop");
+    expect(useConnectionStore.getState().mode).toBe("desktop");
+  });
+});

package/templates/browser-agent/src/mainview/stores/__tests__/use-locale-store.test.ts

@@ -0,0 +1,32 @@
+import { describe, it, expect, beforeEach, vi } from "vitest";
+
+describe("useLocaleStore", () => {
+  beforeEach(async () => {
+    vi.resetModules();
+    localStorage.clear();
+  });
+
+  it("should default to English", async () => {
+    const { useLocaleStore } = await import("../use-locale-store");
+    expect(useLocaleStore.getState().locale).toBe("en");
+  });
+
+  it("should change locale", async () => {
+    const { useLocaleStore } = await import("../use-locale-store");
+    useLocaleStore.getState().setLocale("zh");
+    expect(useLocaleStore.getState().locale).toBe("zh");
+  });
+
+  it("should persist locale to localStorage", async () => {
+    const { useLocaleStore } = await import("../use-locale-store");
+    useLocaleStore.getState().setLocale("zh");
+    expect(localStorage.getItem("locale")).toBe("zh");
+  });
+
+  it("should restore locale from localStorage", async () => {
+    localStorage.setItem("locale", "zh");
+    vi.resetModules();
+    const { useLocaleStore } = await import("../use-locale-store");
+    expect(useLocaleStore.getState().locale).toBe("zh");
+  });
+});

package/templates/browser-agent/src/mainview/stores/__tests__/use-log-store.test.ts

@@ -0,0 +1,28 @@
+import { describe, it, expect, beforeEach } from "vitest";
+
+describe("useLogStore", () => {
+  beforeEach(async () => {
+    vi.resetModules();
+  });
+
+  it("should start with empty logs", async () => {
+    const { useLogStore } = await import("../use-log-store");
+    expect(useLogStore.getState().logs).toEqual([]);
+  });
+
+  it("should add log entries", async () => {
+    const { useLogStore } = await import("../use-log-store");
+    useLogStore.getState().addLog("test message");
+    const logs = useLogStore.getState().logs;
+    expect(logs).toHaveLength(1);
+    expect(logs[0]).toContain("test message");
+  });
+
+  it("should limit log entries", async () => {
+    const { useLogStore } = await import("../use-log-store");
+    for (let i = 0; i < 200; i++) {
+      useLogStore.getState().addLog(`log ${i}`);
+    }
+    expect(useLogStore.getState().logs.length).toBeLessThanOrEqual(100);
+  });
+});

package/templates/browser-agent/src/mainview/stores/__tests__/use-theme-store.test.ts

@@ -0,0 +1,59 @@
+import { describe, it, expect, beforeEach, vi } from "vitest";
+
+describe("useThemeStore", () => {
+  beforeEach(async () => {
+    vi.resetModules();
+    localStorage.clear();
+    document.documentElement.classList.remove("dark");
+  });
+
+  it("should default to dark theme", async () => {
+    const { useThemeStore } = await import("../use-theme-store");
+    const state = useThemeStore.getState();
+    expect(state.theme).toBe("dark");
+  });
+
+  it("should toggle between light and dark", async () => {
+    const { useThemeStore } = await import("../use-theme-store");
+    const store = useThemeStore.getState();
+
+    expect(store.theme).toBe("dark");
+    store.toggleTheme();
+    expect(useThemeStore.getState().theme).toBe("light");
+
+    useThemeStore.getState().toggleTheme();
+    expect(useThemeStore.getState().theme).toBe("dark");
+  });
+
+  it("should set theme explicitly", async () => {
+    const { useThemeStore } = await import("../use-theme-store");
+    useThemeStore.getState().setTheme("light");
+    expect(useThemeStore.getState().theme).toBe("light");
+  });
+
+  it("should persist theme to localStorage", async () => {
+    const { useThemeStore } = await import("../use-theme-store");
+    useThemeStore.getState().setTheme("light");
+
+    expect(localStorage.getItem("theme")).toBe("light");
+  });
+
+  it("should restore theme from localStorage", async () => {
+    localStorage.setItem("theme", "light");
+
+    vi.resetModules();
+    const { useThemeStore } = await import("../use-theme-store");
+
+    expect(useThemeStore.getState().theme).toBe("light");
+  });
+
+  it("should apply dark class to document element", async () => {
+    const { useThemeStore } = await import("../use-theme-store");
+    useThemeStore.getState().setTheme("dark");
+
+    expect(document.documentElement.classList.contains("dark")).toBe(true);
+
+    useThemeStore.getState().setTheme("light");
+    expect(document.documentElement.classList.contains("dark")).toBe(false);
+  });
+});

package/templates/browser-agent/src/mainview/stores/message-batcher.ts

@@ -0,0 +1,25 @@
+type Update = { sessionId: string; apply: () => void };
+
+let queue: Update[] = [];
+let rafId: number | null = null;
+
+function flush() {
+  rafId = null;
+  const batch = queue;
+  queue = [];
+  for (const u of batch) u.apply();
+}
+
+export function batchMessageUpdate(sessionId: string, apply: () => void) {
+  queue.push({ sessionId, apply });
+  if (!rafId) {
+    rafId = requestAnimationFrame(flush);
+  }
+}
+
+export function flushNow() {
+  if (rafId) {
+    cancelAnimationFrame(rafId);
+    flush();
+  }
+}