@dyyz1993/create-agent 2.0.0 → 2.1.0

package/templates/agent/src/mainview/lib/api-client.ts

@@ -1,5 +1,11 @@
 import { createTypedClient, WebSocketTransport, IPCTransport } from "@dyyz1993/rpc-core";
-import type { TypedClient, MethodParams, MethodResult, EventPayload, EventMetadata } from "@dyyz1993/rpc-core";
+import type {
+	TypedClient,
+	MethodParams,
+	MethodResult,
+	EventPayload,
+	EventMetadata,
+} from "@dyyz1993/rpc-core";
 import type { RPCMethods, RPCEvents } from "../../shared/rpc-schema";
 import { rpcCache, CACHEABLE_METHODS } from "./rpc-cache";
 
@@ -10,182 +16,183 @@ import { rpcCache, CACHEABLE_METHODS } from "./rpc-cache";
  * 3. 默认值（开发用）
  */
 function resolveAuthToken(): string {
-  if (typeof window !== "undefined") {
-    const fromQuery = new URLSearchParams(window.location.search).get("token");
-    if (fromQuery) return fromQuery;
-    const fromStorage = localStorage.getItem("rpc-auth-token");
-    if (fromStorage) return fromStorage;
-  }
-  return "pi-agent-template-token";
+	if (typeof window !== "undefined") {
+		const fromQuery = new URLSearchParams(window.location.search).get("token");
+		if (fromQuery) return fromQuery;
+		const fromStorage = localStorage.getItem("rpc-auth-token");
+		if (fromStorage) return fromStorage;
+	}
+	return "pi-agent-template-token";
 }
 
 const AUTH_TOKEN = resolveAuthToken();
 
 class APIClientImpl {
-  private client: TypedClient<RPCMethods, RPCEvents> | null = null;
-  private initPromise: Promise<void> | null = null;
-  private _transport: "ipc" | "websocket" = "websocket";
-  private _baseUrl: string | null = null;
-  private wsTransport: WebSocketTransport | null = null;
-
-  /**
-   * 桌面端同步初始化：通过 executeJavascript 接收 + __electrobunBunBridge 发送
-   */
-  initSyncForDesktop(): void {
-    if (this.client) return;
-
-    const ipcTransport = new IPCTransport();
-    this._transport = "ipc";
-    this._baseUrl = null; // 桌面端不走 HTTP
-    this.client = createTypedClient<RPCMethods, RPCEvents>(ipcTransport);
-    this.setupElectrobunBridge(ipcTransport);
-    if (import.meta.env.DEV) {
-      console.warn("[APIClient] Desktop (IPC) initialized synchronously");
-    }
-  }
-
-  /**
-   * 异步初始化：Web 端使用（连接 WebSocket）
-   */
-  async initialize(): Promise<void> {
-    // 已连接且 transport 正常 → 直接返回
-    if (this.client && (this._transport === "ipc" || this.wsTransport?.isConnected())) {
-      return;
-    }
-
-    // client 存在但 WS 断开了 → 清理后重连
-    if (this.client && this.wsTransport && !this.wsTransport.isConnected()) {
-      this.wsTransport.close();
-      this.wsTransport = null;
-      this.client = null;
-      this.initPromise = null;
-    }
-
-    if (this.initPromise) return this.initPromise;
-
-    this.initPromise = (async () => {
-      const env = this.detectEnvironment();
-
-      if (env === "electrobun") {
-        // 不应走到这里，桌面端应通过 initSyncForDesktop() 初始化
-        this.initSyncForDesktop();
-      } else {
-        this._transport = "websocket";
-        const wsUrl = this.getWebSocketUrl();
-        this.wsTransport = new WebSocketTransport(wsUrl);
-        await this.wsTransport.connect();
-        this.client = createTypedClient<RPCMethods, RPCEvents>(this.wsTransport);
-
-        const wsUrlObj = new URL(wsUrl);
-        this._baseUrl = `http://${wsUrlObj.host}`;
-      }
-    })();
-
-    return this.initPromise;
-  }
-
-  private detectEnvironment(): "electrobun" | "browser" {
-    if (typeof window === "undefined") return "browser";
-    if (window.__electrobunBunBridge) return "electrobun";
-    return "browser";
-  }
-
-  private getWebSocketUrl(): string {
-    if (typeof window === "undefined") return `ws://localhost:3100?token=${AUTH_TOKEN}`;
-    const customUrl = (
-      new URLSearchParams(window.location.search).get("ws") ||
-      localStorage.getItem("rpc-websocket-url")
-    );
-    if (customUrl) return customUrl.includes("token=") ? customUrl : `${customUrl}?token=${AUTH_TOKEN}`;
-    return `ws://${window.location.host}/ws?token=${AUTH_TOKEN}`;
-  }
-
-  /**
-   * 桌面端 IPC 桥接：
-   * - Bun → Browser: 通过 executeJavascript 调用 window.__piAgentIPC()
-   * - Browser → Bun: 通过 __electrobunBunBridge.postMessage 发送 Electrobun 消息格式
-   */
-  private setupElectrobunBridge(ipcTransport: IPCTransport): void {
-    if (typeof window === "undefined") return;
-
-    const win = window;
-
-    // 1. 注册接收函数：Bun 通过 executeJavascript 调用此函数发送消息到 Browser
-    win.__piAgentIPC = (msg: unknown) => {
-      ipcTransport.simulateMessage(msg);
-    };
-
-    // 2. 覆写 send：将 RPC-core 消息包装成 Electrobun 消息格式，通过原生桥接发送
-    const bridge = win.__electrobunBunBridge;
-
-    if (bridge) {
-      ipcTransport.send = async (message: unknown) => {
-        // 包装成 Electrobun message packet，bun 端 defineRPC 注册了 "rpc-message" handler
-        const electrobunPacket = {
-          type: "message",
-          id: "rpc-message",
-          payload: JSON.stringify(message),
-        };
-        bridge.postMessage(JSON.stringify(electrobunPacket));
-      };
-    }
-  }
-
-  getTransport(): "ipc" | "websocket" {
-    return this._transport;
-  }
-
-  /** Web 端 HTTP 基础 URL（如 http://localhost:3100），桌面端返回 null */
-  getBaseUrl(): string | null {
-    return this._baseUrl;
-  }
-
-  /** 获取当前 auth token（用于需要直接调 HTTP 的场景） */
-  getAuthToken(): string {
-    return AUTH_TOKEN;
-  }
-
-  async call<K extends keyof RPCMethods>(
-    method: K,
-    params: MethodParams<RPCMethods, K>
-  ): Promise<MethodResult<RPCMethods, K>> {
-    const methodStr = method as string;
-    const ttl = CACHEABLE_METHODS[methodStr];
-    if (ttl !== undefined) {
-      const cached = rpcCache.get<MethodResult<RPCMethods, K>>(methodStr, params, ttl);
-      if (cached !== null) return cached;
-    }
-
-    await this.initialize();
-    const result = await this.client!.call(method, params);
-
-    if (ttl !== undefined) {
-      rpcCache.set(methodStr, params, result);
-    }
-
-    return result;
-  }
-
-  async subscribe<K extends keyof RPCEvents>(
-    eventType: K,
-    handler: (payload: EventPayload<RPCEvents[K]>, metadata: EventMetadata<RPCEvents[K]>) => void,
-    filter?: Record<string, unknown>
-  ): Promise<string> {
-    await this.initialize();
-    return this.client!.subscribe(eventType, handler, filter);
-  }
-
-  unsubscribe(subscriptionId: string): void {
-    this.client?.unsubscribe(subscriptionId);
-  }
-
-  isConnected(): boolean {
-    return this.client !== null;
-  }
-
-  close(): void {
-    this.client?.close();
-  }
+	private client: TypedClient<RPCMethods, RPCEvents> | null = null;
+	private initPromise: Promise<void> | null = null;
+	private _transport: "ipc" | "websocket" = "websocket";
+	private _baseUrl: string | null = null;
+	private wsTransport: WebSocketTransport | null = null;
+
+	/**
+	 * 桌面端同步初始化：通过 executeJavascript 接收 + __electrobunBunBridge 发送
+	 */
+	initSyncForDesktop(): void {
+		if (this.client) return;
+
+		const ipcTransport = new IPCTransport();
+		this._transport = "ipc";
+		this._baseUrl = null;
+		this.client = createTypedClient<RPCMethods, RPCEvents>(ipcTransport);
+		this.setupElectrobunBridge(ipcTransport);
+	}
+
+	/**
+	 * 异步初始化：Web 端使用（连接 WebSocket）
+	 */
+	async initialize(): Promise<void> {
+		// 已连接且 transport 正常 → 直接返回
+		if (this.client && (this._transport === "ipc" || this.wsTransport?.isConnected())) {
+			return;
+		}
+
+		// client 存在但 WS 断开了 → 清理后重连
+		if (this.client && this.wsTransport && !this.wsTransport.isConnected()) {
+			this.wsTransport.close();
+			this.wsTransport = null;
+			this.client = null;
+			this.initPromise = null;
+		}
+
+		if (this.initPromise) return this.initPromise;
+
+		this.initPromise = (async () => {
+			const env = this.detectEnvironment();
+
+			if (env === "electrobun") {
+				// 不应走到这里，桌面端应通过 initSyncForDesktop() 初始化
+				this.initSyncForDesktop();
+			} else {
+				this._transport = "websocket";
+				const wsUrl = this.getWebSocketUrl();
+				this.wsTransport = new WebSocketTransport({
+					url: wsUrl,
+					authToken: AUTH_TOKEN,
+					reconnect: true,
+				});
+				await this.wsTransport.connect();
+				this.client = createTypedClient<RPCMethods, RPCEvents>(this.wsTransport);
+
+				const wsUrlObj = new URL(wsUrl);
+				this._baseUrl = `http://${wsUrlObj.host}`;
+			}
+		})();
+
+		return this.initPromise;
+	}
+
+	private detectEnvironment(): "electrobun" | "browser" {
+		if (typeof window === "undefined") return "browser";
+		if (window.__electrobunBunBridge) return "electrobun";
+		return "browser";
+	}
+
+	private getWebSocketUrl(): string {
+		if (typeof window === "undefined") return `ws://localhost:3100?token=${AUTH_TOKEN}`;
+		const customUrl =
+			new URLSearchParams(window.location.search).get("ws") ||
+			localStorage.getItem("rpc-websocket-url");
+		if (customUrl)
+			return customUrl.includes("token=") ? customUrl : `${customUrl}?token=${AUTH_TOKEN}`;
+		return `ws://${window.location.host}/ws?token=${AUTH_TOKEN}`;
+	}
+
+	/**
+	 * 桌面端 IPC 桥接：
+	 * - Bun → Browser: 通过 executeJavascript 调用 window.__piAgentIPC()
+	 * - Browser → Bun: 通过 __electrobunBunBridge.postMessage 发送 Electrobun 消息格式
+	 */
+	private setupElectrobunBridge(ipcTransport: IPCTransport): void {
+		if (typeof window === "undefined") return;
+
+		const win = window;
+
+		// 1. 注册接收函数：Bun 通过 executeJavascript 调用此函数发送消息到 Browser
+		win.__piAgentIPC = (msg: unknown) => {
+			ipcTransport.simulateMessage(msg);
+		};
+
+		// 2. 覆写 send：将 RPC-core 消息包装成 Electrobun 消息格式，通过原生桥接发送
+		const bridge = win.__electrobunBunBridge;
+
+		if (bridge) {
+			ipcTransport.send = async (message: unknown) => {
+				// 包装成 Electrobun message packet，bun 端 defineRPC 注册了 "rpc-message" handler
+				const electrobunPacket = {
+					type: "message",
+					id: "rpc-message",
+					payload: JSON.stringify(message),
+				};
+				bridge.postMessage(JSON.stringify(electrobunPacket));
+			};
+		}
+	}
+
+	getTransport(): "ipc" | "websocket" {
+		return this._transport;
+	}
+
+	/** Web 端 HTTP 基础 URL（如 http://localhost:3100），桌面端返回 null */
+	getBaseUrl(): string | null {
+		return this._baseUrl;
+	}
+
+	/** 获取当前 auth token（用于需要直接调 HTTP 的场景） */
+	getAuthToken(): string {
+		return AUTH_TOKEN;
+	}
+
+	async call<K extends keyof RPCMethods>(
+		method: K,
+		params: MethodParams<RPCMethods, K>
+	): Promise<MethodResult<RPCMethods, K>> {
+		const methodStr = method as string;
+		const ttl = CACHEABLE_METHODS[methodStr];
+		if (ttl !== undefined) {
+			const cached = rpcCache.get<MethodResult<RPCMethods, K>>(methodStr, params, ttl);
+			if (cached !== null) return cached;
+		}
+
+		await this.initialize();
+		const result = await this.client!.call(method, params);
+
+		if (ttl !== undefined) {
+			rpcCache.set(methodStr, params, result);
+		}
+
+		return result;
+	}
+
+	async subscribe<K extends keyof RPCEvents>(
+		eventType: K,
+		handler: (payload: EventPayload<RPCEvents[K]>, metadata: EventMetadata<RPCEvents[K]>) => void,
+		filter?: Record<string, unknown>
+	): Promise<string> {
+		await this.initialize();
+		return this.client!.subscribe(eventType, handler, filter);
+	}
+
+	unsubscribe(subscriptionId: string): void {
+		this.client?.unsubscribe(subscriptionId);
+	}
+
+	isConnected(): boolean {
+		return this.client !== null;
+	}
+
+	close(): void {
+		this.client?.close();
+	}
 }
 
 export const apiClient = new APIClientImpl();

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

@@ -8,17 +8,11 @@ import App from "./App";
 const isElectrobun = typeof window !== "undefined" && !!window.__electrobunBunBridge;
 
 if (isElectrobun) {
-  // 桌面端：同步初始化 IPC（Electrobun 要求桥接在页面加载时同步设置）
-  apiClient.initSyncForDesktop();
-}
-// Web 端 WS 初始化由 App.tsx 统一管理，避免竞争
-
-if (import.meta.env.DEV) {
-  console.warn("[Main] Application starting, isElectrobun:", isElectrobun);
+	apiClient.initSyncForDesktop();
 }
 
 createRoot(document.getElementById("root")!).render(
-  <StrictMode>
-    <App />
-  </StrictMode>
+	<StrictMode>
+		<App />
+	</StrictMode>
 );

package/templates/agent/src/mainview/stores/use-feed-store.ts

@@ -3,53 +3,53 @@ import { apiClient } from "../lib/api-client";
 import type { FeedCategory, FeedPost } from "../../shared/modules/feed";
 
 interface FeedState {
-  posts: FeedPost[];
-  author: string;
-  category: FeedCategory;
-  content: string;
-  loading: boolean;
-
-  setAuthor: (author: string) => void;
-  setCategory: (category: FeedCategory) => void;
-  setContent: (content: string) => void;
-  createPost: () => Promise<void>;
-  loadPosts: () => Promise<void>;
-  addPost: (post: FeedPost) => void;
+	posts: FeedPost[];
+	author: string;
+	category: FeedCategory;
+	content: string;
+	loading: boolean;
+
+	setAuthor: (author: string) => void;
+	setCategory: (category: FeedCategory) => void;
+	setContent: (content: string) => void;
+	createPost: () => Promise<void>;
+	loadPosts: () => Promise<void>;
+	addPost: (post: FeedPost) => void;
 }
 
 export const useFeedStore = create<FeedState>((set, get) => ({
-  posts: [],
-  author: "alice",
-  category: "tech",
-  content: "",
-  loading: false,
-
-  setAuthor: (author) => set({ author }),
-  setCategory: (category) => set({ category }),
-  setContent: (content) => set({ content }),
-
-  createPost: async () => {
-    const { content, category, author } = get();
-    if (!content.trim()) return;
-    set({ loading: true });
-    try {
-      await apiClient.call("feed.post", { content: content.trim(), category, author });
-      set({ content: "", loading: false });
-    } catch {
-      set({ loading: false });
-    }
-  },
-
-  loadPosts: async () => {
-    try {
-      const res = await apiClient.call("feed.list", { limit: 100 });
-      set({ posts: res.posts });
-    } catch {
-      // ignore
-    }
-  },
-
-  addPost: (post) => set((s) => ({ posts: [...s.posts, post] })),
+	posts: [],
+	author: "alice",
+	category: "tech",
+	content: "",
+	loading: false,
+
+	setAuthor: (author) => set({ author }),
+	setCategory: (category) => set({ category }),
+	setContent: (content) => set({ content }),
+
+	createPost: async () => {
+		const { content, category, author } = get();
+		if (!content.trim()) return;
+		set({ loading: true });
+		try {
+			await apiClient.call("feed.post", { content: content.trim(), category, author });
+			set({ content: "", loading: false });
+		} catch {
+			set({ loading: false });
+		}
+	},
+
+	loadPosts: async () => {
+		try {
+			const res = await apiClient.call("feed.list", { limit: 100 });
+			set({ posts: res.posts });
+		} catch {
+			// ignore
+		}
+	},
+
+	addPost: (post) => set((s) => ({ posts: [...s.posts, post] })),
 }));
 
 // --- Event Stream (订阅面板) ---
@@ -57,73 +57,73 @@ export const useFeedStore = create<FeedState>((set, get) => ({
 export type SubEventType = "feed.update" | "chat.message" | "timer.tick";
 
 interface EventEntry {
-  id: string;
-  eventType: SubEventType;
-  payload: unknown;
-  filter: Record<string, unknown>;
-  timestamp: number;
+	id: string;
+	eventType: SubEventType;
+	payload: unknown;
+	filter: Record<string, unknown>;
+	timestamp: number;
 }
 
 interface EventStreamState {
-  entries: EventEntry[];
-  activeEventType: SubEventType;
-  activeFilter: string; // JSON string for the filter
-  subscriptionId: string | null;
-  subscribed: boolean;
-
-  setActiveEventType: (t: SubEventType) => void;
-  setActiveFilter: (f: string) => void;
-  handleSubscribe: () => Promise<void>;
-  handleUnsubscribe: () => void;
-  addEntry: (eventType: SubEventType, payload: unknown, filter: Record<string, unknown>) => void;
+	entries: EventEntry[];
+	activeEventType: SubEventType;
+	activeFilter: string; // JSON string for the filter
+	subscriptionId: string | null;
+	subscribed: boolean;
+
+	setActiveEventType: (t: SubEventType) => void;
+	setActiveFilter: (f: string) => void;
+	handleSubscribe: () => Promise<void>;
+	handleUnsubscribe: () => void;
+	addEntry: (eventType: SubEventType, payload: unknown, filter: Record<string, unknown>) => void;
 }
 
 export const useEventStreamStore = create<EventStreamState>((set, get) => ({
-  entries: [],
-  activeEventType: "feed.update",
-  activeFilter: "",
-  subscriptionId: null,
-  subscribed: false,
-
-  setActiveEventType: (t) => set({ activeEventType: t }),
-  setActiveFilter: (f) => set({ activeFilter: f }),
-
-  handleSubscribe: async () => {
-    const { activeEventType, activeFilter } = get();
-    try {
-      const filter = activeFilter.trim() ? JSON.parse(activeFilter) : {};
-      const subId = await apiClient.subscribe(
-        activeEventType,
-        (payload: unknown) => {
-          get().addEntry(activeEventType, payload, filter);
-        },
-        filter,
-      );
-      set({ subscriptionId: subId, subscribed: true });
-    } catch (err) {
-      console.error("Subscribe error:", err);
-    }
-  },
-
-  handleUnsubscribe: () => {
-    const { subscriptionId } = get();
-    if (subscriptionId) {
-      apiClient.unsubscribe(subscriptionId);
-    }
-    set({ subscriptionId: null, subscribed: false });
-  },
-
-  addEntry: (eventType, payload, filter) =>
-    set((s) => ({
-      entries: [
-        ...s.entries.slice(-49),
-        {
-          id: `evt-${Date.now()}-${Math.random().toString(36).slice(2, 5)}`,
-          eventType,
-          payload,
-          filter,
-          timestamp: Date.now(),
-        },
-      ],
-    })),
+	entries: [],
+	activeEventType: "feed.update",
+	activeFilter: "",
+	subscriptionId: null,
+	subscribed: false,
+
+	setActiveEventType: (t) => set({ activeEventType: t }),
+	setActiveFilter: (f) => set({ activeFilter: f }),
+
+	handleSubscribe: async () => {
+		const { activeEventType, activeFilter } = get();
+		try {
+			const filter = activeFilter.trim() ? JSON.parse(activeFilter) : {};
+			const subId = await apiClient.subscribe(
+				activeEventType,
+				(payload: unknown) => {
+					get().addEntry(activeEventType, payload, filter);
+				},
+				filter
+			);
+			set({ subscriptionId: subId, subscribed: true });
+		} catch {
+			// subscription failed — UI stays unsubscribed
+		}
+	},
+
+	handleUnsubscribe: () => {
+		const { subscriptionId } = get();
+		if (subscriptionId) {
+			apiClient.unsubscribe(subscriptionId);
+		}
+		set({ subscriptionId: null, subscribed: false });
+	},
+
+	addEntry: (eventType, payload, filter) =>
+		set((s) => ({
+			entries: [
+				...s.entries.slice(-49),
+				{
+					id: `evt-${Date.now()}-${Math.random().toString(36).slice(2, 5)}`,
+					eventType,
+					payload,
+					filter,
+					timestamp: Date.now(),
+				},
+			],
+		})),
 }));