@dyyz1993/create-agent 2.1.0 → 2.1.2

package/templates/agent/src/gateway/__tests__/ws-handler-token.test.ts

@@ -1,11 +1,13 @@
-import { describe, it, expect, vi, beforeEach } from "vitest";
-import { EventEmitter } from "events";
+import { describe, it, expect, vi, beforeEach } from 'vitest';
+import { EventEmitter } from 'events';
+import type { Server } from 'http';
+import type { WebSocketServer } from 'ws';
 
-vi.mock("../../shared/register-all-handlers", () => ({
+vi.mock('../../shared/register-all-handlers', () => ({
 	registerAllHandlers: vi.fn(),
 }));
 
-vi.mock("../../shared/lib/logger", () => ({
+vi.mock('../../shared/lib/logger', () => ({
 	createLogger: () => ({
 		info: vi.fn(),
 		error: vi.fn(),
@@ -14,14 +16,22 @@ vi.mock("../../shared/lib/logger", () => ({
 	}),
 }));
 
-const MOCK_AUTH_TOKEN = "test-secure-token-123456";
+const MOCK_AUTH_TOKEN = 'test-secure-token-123456';
 
-function createMockWs() {
-	const ws = new EventEmitter();
-	(ws as any).readyState = 1;
-	(ws as any).close = vi.fn();
-	(ws as any).send = vi.fn();
-	(ws as any).ping = vi.fn();
+interface MockWs extends EventEmitter {
+	readyState: number;
+	close: ReturnType<typeof vi.fn>;
+	send: ReturnType<typeof vi.fn>;
+	ping: ReturnType<typeof vi.fn>;
+}
+
+function createMockWs(): MockWs {
+	const ws = Object.assign(new EventEmitter(), {
+		readyState: 1,
+		close: vi.fn(),
+		send: vi.fn(),
+		ping: vi.fn(),
+	}) as MockWs;
 	return ws;
 }
 
@@ -29,19 +39,19 @@ function createMockReq(url: string, headers: Record<string, string> = {}) {
 	return { url, headers };
 }
 
-describe("WS Handler Token 安全", () => {
-	let _wssInstance: EventEmitter & { clients: Set<any> };
+describe('WS Handler Token 安全', () => {
+	let _wssInstance: EventEmitter & { clients: Set<unknown> };
 
 	beforeEach(async () => {
 		vi.resetModules();
 
-		const { WebSocketServer } = await import("ws");
+		const { WebSocketServer } = await import('ws');
 		const _originalWSS = WebSocketServer;
 
-		vi.doMock("ws", () => {
+		vi.doMock('ws', () => {
 			class MockWSS extends EventEmitter {
-				clients = new Set();
-				constructor(_opts: any) {
+				clients = new Set<unknown>();
+				constructor(_opts: unknown) {
 					super();
 					// eslint-disable-next-line @typescript-eslint/no-this-alias
 					_wssInstance = this;
@@ -52,67 +62,71 @@ describe("WS Handler Token 安全", () => {
 	});
 
 	async function setupTest() {
-		const { createWsHandler } = await import("../ws-handler");
+		const { createWsHandler } = await import('../ws-handler');
 		const httpServer = new EventEmitter();
-		const wss = createWsHandler(httpServer as any, {
+		const wss = createWsHandler(httpServer as unknown as Server, {
 			config: { port: 3100, authToken: MOCK_AUTH_TOKEN, maxUploadSize: 50 * 1024 * 1024 },
 		});
 		return wss;
 	}
 
-	function emitConnection(wss: any, ws: any, req: any) {
-		wss.emit("connection", ws, req);
+	function emitConnection(
+		wss: WebSocketServer,
+		ws: MockWs,
+		req: { url: string; headers: Record<string, string> },
+	) {
+		wss.emit('connection', ws, req);
 	}
 
-	it("无 token 应被拒绝 (4001)", async () => {
+	it('无 token 应被拒绝 (4001)', async () => {
 		const wss = await setupTest();
 		const ws = createMockWs();
-		const req = createMockReq("/ws");
+		const req = createMockReq('/ws');
 		emitConnection(wss, ws, req);
-		expect((ws as any).close).toHaveBeenCalledWith(4001, "Unauthorized");
+		expect(ws.close).toHaveBeenCalledWith(4001, 'Unauthorized');
 	});
 
-	it("错误 token 应被拒绝 (4001)", async () => {
+	it('错误 token 应被拒绝 (4001)', async () => {
 		const wss = await setupTest();
 		const ws = createMockWs();
-		const req = createMockReq("/ws?token=wrong-token");
+		const req = createMockReq('/ws?token=wrong-token');
 		emitConnection(wss, ws, req);
-		expect((ws as any).close).toHaveBeenCalledWith(4001, "Unauthorized");
+		expect(ws.close).toHaveBeenCalledWith(4001, 'Unauthorized');
 	});
 
-	it("正确 token 通过 URL query 应被接受", async () => {
+	it('正确 token 通过 URL query 应被接受', async () => {
 		const wss = await setupTest();
 		const ws = createMockWs();
 		const req = createMockReq(`/ws?token=${MOCK_AUTH_TOKEN}`);
 		emitConnection(wss, ws, req);
-		expect((ws as any).close).not.toHaveBeenCalled();
+		expect(ws.close).not.toHaveBeenCalled();
 	});
 
-	it("正确 token 通过 Sec-WebSocket-Protocol header 应被接受", async () => {
+	it('正确 token 通过 Sec-WebSocket-Protocol header 应被接受', async () => {
 		const wss = await setupTest();
 		const ws = createMockWs();
-		const req = createMockReq("/ws", {
-			"sec-websocket-protocol": MOCK_AUTH_TOKEN,
+		const req = createMockReq('/ws', {
+			'sec-websocket-protocol': MOCK_AUTH_TOKEN,
 		});
 		emitConnection(wss, ws, req);
-		expect((ws as any).close).not.toHaveBeenCalled();
+		expect(ws.close).not.toHaveBeenCalled();
 	});
 
-	it("header 方式优先于 query 方式 (header 正确, query 错误)", async () => {
+	it('header 方式优先于 query 方式 (header 正确, query 错误)', async () => {
 		const wss = await setupTest();
 		const ws = createMockWs();
-		const req = createMockReq("/ws?token=wrong-token", {
-			"sec-websocket-protocol": MOCK_AUTH_TOKEN,
+		const req = createMockReq('/ws?token=wrong-token', {
+			'sec-websocket-protocol': MOCK_AUTH_TOKEN,
 		});
 		emitConnection(wss, ws, req);
-		expect((ws as any).close).not.toHaveBeenCalled();
+		expect(ws.close).not.toHaveBeenCalled();
 	});
 
-	it("token 验证使用 timingSafeEqual（长度不等返回 false）", async () => {
+	it('token 验证使用 timingSafeEqual（长度不等返回 false）', async () => {
 		const wss = await setupTest();
 		const ws = createMockWs();
 		const req = createMockReq(`/ws?token=short`);
 		emitConnection(wss, ws, req);
-		expect((ws as any).close).toHaveBeenCalledWith(4001, "Unauthorized");
+		expect(ws.close).toHaveBeenCalledWith(4001, 'Unauthorized');
 	});
 });

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

@@ -1,17 +1,19 @@
-import type { ReactNode } from "react";
-import { useState } from "react";
-import { useConnectionStore } from "./stores/use-connection-store";
-import { useBreakpointSync } from "./hooks/use-breakpoint";
-import { useRpcInit } from "./hooks/use-rpc-init";
-import { useSidebarResize } from "./hooks/use-sidebar-resize";
-import { AppLayout, type CenterTab } from "./components/layout/AppLayout";
-import { ErrorBoundary as _EB } from "./components/common/ErrorBoundary";
+import type { ReactNode } from 'react';
+import { useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { useConnectionStore } from './stores/use-connection-store';
+import { useBreakpointSync } from './hooks/use-breakpoint';
+import { useRpcInit } from './hooks/use-rpc-init';
+import { useSidebarResize } from './hooks/use-sidebar-resize';
+import { AppLayout, type CenterTab } from './components/layout/AppLayout';
+import { ErrorBoundary as _EB } from './components/common/ErrorBoundary';
 
 const ErrorBoundary = _EB as unknown as React.FC<{ children: ReactNode }>;
 
 function App() {
+	const { t } = useTranslation();
 	const ready = useConnectionStore((s) => s.ready);
-	const [centerTab, setCenterTab] = useState<CenterTab>("chat");
+	const [centerTab, setCenterTab] = useState<CenterTab>('chat');
 
 	useBreakpointSync();
 	useRpcInit();
@@ -20,10 +22,10 @@ function App() {
 
 	if (!ready) {
 		return (
-			<div className="h-screen bg-gray-900 flex items-center justify-center">
+			<div className="h-screen bg-[var(--color-bg-primary)] flex items-center justify-center">
 				<div className="text-center">
-					<div className="inline-block w-8 h-8 border-2 border-indigo-400 border-t-transparent rounded-full animate-spin mb-4" />
-					<div className="text-gray-400 text-sm">Connecting to RPC server...</div>
+					<div className="inline-block w-8 h-8 border-2 border-[var(--color-text-accent)] border-t-transparent rounded-full animate-spin mb-4" />
+					<div className="text-[var(--color-text-tertiary)] text-sm">{t('app.connecting')}</div>
 				</div>
 			</div>
 		);

package/templates/agent/src/mainview/__tests__/hooks/use-rpc-init.test.ts

@@ -1,5 +1,5 @@
-import { describe, it, expect, vi, beforeEach } from "vitest";
-import { renderHook, waitFor } from "@testing-library/react";
+import { describe, it, expect, vi, beforeEach } from 'vitest';
+import { renderHook, waitFor } from '@testing-library/react';
 
 const mockInitializeConnection = vi.fn();
 const mockAddLog = vi.fn();
@@ -11,207 +11,211 @@ const mockCall = vi.fn();
 const mockChatAddMessage = vi.fn();
 const mockChatSetMessages = vi.fn();
 
-let mockConnectionState: Record<string, any>;
-let mockLogState: Record<string, any>;
+let mockConnectionState: Record<string, unknown>;
+let mockLogState: Record<string, unknown>;
 
-function resetMockConnectionState(overrides?: Partial<Record<string, any>>) {
-  mockConnectionState = {
-    ready: false,
-    initializeConnection: mockInitializeConnection,
-    ...overrides,
-  };
+function resetMockConnectionState(overrides?: Partial<Record<string, unknown>>) {
+	mockConnectionState = {
+		ready: false,
+		initializeConnection: mockInitializeConnection,
+		...overrides,
+	};
 }
 
-function resetMockLogState(overrides?: Partial<Record<string, any>>) {
-  mockLogState = {
-    addLog: mockAddLog,
-    ...overrides,
-  };
+function resetMockLogState(overrides?: Partial<Record<string, unknown>>) {
+	mockLogState = {
+		addLog: mockAddLog,
+		...overrides,
+	};
 }
 
-vi.mock("../../stores/use-connection-store", () => {
-  return {
-    useConnectionStore: Object.assign(
-      (selector: (s: any) => any) => selector(mockConnectionState),
-      {
-        getState: () => mockConnectionState,
-        setState: (partial: any) => {
-          const next = typeof partial === "function" ? partial(mockConnectionState) : partial;
-          mockConnectionState = { ...mockConnectionState, ...next };
-        },
-      }
-    ),
-  };
+vi.mock('../../stores/use-connection-store', () => {
+	return {
+		useConnectionStore: Object.assign(
+			(selector: (s: Record<string, unknown>) => unknown) => selector(mockConnectionState),
+			{
+				getState: () => mockConnectionState,
+				setState: (
+					partial:
+						| Partial<Record<string, unknown>>
+						| ((prev: Record<string, unknown>) => Partial<Record<string, unknown>>),
+				) => {
+					const next = typeof partial === 'function' ? partial(mockConnectionState) : partial;
+					mockConnectionState = { ...mockConnectionState, ...next };
+				},
+			},
+		),
+	};
 });
 
-vi.mock("../../stores/use-log-store", () => {
-  return {
-    useLogStore: Object.assign(
-      (selector: (s: any) => any) => selector(mockLogState),
-      {
-        getState: () => mockLogState,
-        setState: (partial: any) => {
-          const next = typeof partial === "function" ? partial(mockLogState) : partial;
-          mockLogState = { ...mockLogState, ...next };
-        },
-      }
-    ),
-  };
+vi.mock('../../stores/use-log-store', () => {
+	return {
+		useLogStore: Object.assign(
+			(selector: (s: Record<string, unknown>) => unknown) => selector(mockLogState),
+			{
+				getState: () => mockLogState,
+				setState: (
+					partial:
+						| Partial<Record<string, unknown>>
+						| ((prev: Record<string, unknown>) => Partial<Record<string, unknown>>),
+				) => {
+					const next = typeof partial === 'function' ? partial(mockLogState) : partial;
+					mockLogState = { ...mockLogState, ...next };
+				},
+			},
+		),
+	};
 });
 
-vi.mock("../../stores/use-explorer-store", () => ({
-  useExplorerStore: Object.assign(
-    (selector: (s: any) => any) =>
-      selector({ listRootDir: mockListRootDir }),
-    { getState: () => ({ listRootDir: mockListRootDir }) }
-  ),
+vi.mock('../../stores/use-explorer-store', () => ({
+	useExplorerStore: Object.assign(
+		(selector: (s: Record<string, unknown>) => unknown) =>
+			selector({ listRootDir: mockListRootDir }),
+		{ getState: () => ({ listRootDir: mockListRootDir }) },
+	),
 }));
 
-vi.mock("../../stores/use-chat-store", () => ({
-  useChatStore: Object.assign(
-    (selector: (s: any) => any) =>
-      selector({ addMessage: mockChatAddMessage, setMessages: mockChatSetMessages }),
-    {
-      getState: () => ({
-        addMessage: mockChatAddMessage,
-        setMessages: mockChatSetMessages,
-      }),
-    }
-  ),
+vi.mock('../../stores/use-chat-store', () => ({
+	useChatStore: Object.assign(
+		(selector: (s: Record<string, unknown>) => unknown) =>
+			selector({ addMessage: mockChatAddMessage, setMessages: mockChatSetMessages }),
+		{
+			getState: () => ({
+				addMessage: mockChatAddMessage,
+				setMessages: mockChatSetMessages,
+			}),
+		},
+	),
 }));
 
-vi.mock("../../lib/api-client", () => ({
-  apiClient: {
-    subscribe: mockSubscribe,
-    unsubscribe: mockUnsubscribe,
-    call: mockCall,
-  },
+vi.mock('../../lib/api-client', () => ({
+	apiClient: {
+		subscribe: mockSubscribe,
+		unsubscribe: mockUnsubscribe,
+		call: mockCall,
+	},
 }));
 
-describe("useRpcInit", () => {
-  beforeEach(() => {
-    vi.clearAllMocks();
-    mockSubscribe.mockResolvedValue("sub-1");
-    mockCall.mockResolvedValue({ messages: [] });
-    resetMockLogState();
-  });
-
-  it("should call initializeConnection on mount", async () => {
-    resetMockConnectionState({ ready: false });
-    const { useRpcInit } = await import("../../hooks/use-rpc-init");
-    renderHook(() => useRpcInit());
-    expect(mockInitializeConnection).toHaveBeenCalledTimes(1);
-  });
-
-  it("should not subscribe when not ready", async () => {
-    resetMockConnectionState({ ready: false });
-    const { useRpcInit } = await import("../../hooks/use-rpc-init");
-    renderHook(() => useRpcInit());
-    expect(mockSubscribe).not.toHaveBeenCalled();
-    expect(mockListRootDir).not.toHaveBeenCalled();
-    expect(mockCall).not.toHaveBeenCalled();
-  });
-
-  it("should subscribe, load history and init explorer when ready", async () => {
-    resetMockConnectionState({ ready: true });
-    const { useRpcInit } = await import("../../hooks/use-rpc-init");
-    renderHook(() => useRpcInit());
-
-    await waitFor(() => {
-      expect(mockListRootDir).toHaveBeenCalledTimes(1);
-    });
-
-    await waitFor(() => {
-      expect(mockSubscribe).toHaveBeenCalledWith(
-        "chat.message",
-        expect.any(Function),
-        {}
-      );
-    });
-
-    await waitFor(() => {
-      expect(mockCall).toHaveBeenCalledWith("chat.list", { limit: 100 });
-    });
-  });
-
-  it("should load history messages into chat store", async () => {
-    const messages = [
-      { id: "1", role: "user" as const, content: "hello", timestamp: 1000 },
-      { id: "2", role: "assistant" as const, content: "world", timestamp: 2000 },
-    ];
-    mockCall.mockResolvedValue({ messages });
-
-    resetMockConnectionState({ ready: true });
-    const { useRpcInit } = await import("../../hooks/use-rpc-init");
-    renderHook(() => useRpcInit());
-
-    await waitFor(() => {
-      expect(mockChatSetMessages).toHaveBeenCalledWith(
-        messages.map((m) => ({
-          id: m.id,
-          role: m.role,
-          content: m.content,
-          timestamp: m.timestamp,
-        }))
-      );
-    });
-
-    expect(mockAddLog).toHaveBeenCalledWith("Loaded 2 history messages");
-  });
-
-  it("should unsubscribe on cleanup when ready", async () => {
-    resetMockConnectionState({ ready: true });
-    const { useRpcInit } = await import("../../hooks/use-rpc-init");
-    const { unmount } = renderHook(() => useRpcInit());
-
-    await waitFor(() => {
-      expect(mockSubscribe).toHaveBeenCalled();
-    });
-
-    unmount();
-    expect(mockUnsubscribe).toHaveBeenCalledWith("sub-1");
-  });
-
-  it("should handle history load failure gracefully", async () => {
-    mockCall.mockRejectedValue(new Error("Network error"));
-    resetMockConnectionState({ ready: true });
-    const { useRpcInit } = await import("../../hooks/use-rpc-init");
-    renderHook(() => useRpcInit());
-
-    await waitFor(() => {
-      expect(mockAddLog).toHaveBeenCalledWith(
-        expect.stringContaining("Failed to load history")
-      );
-    });
-  });
-
-  it("should forward chat.message payloads to chat store", async () => {
-    let subscriptionHandler: ((payload: any) => void) | undefined;
-    mockSubscribe.mockImplementation(async (_event: string, handler: (p: any) => void) => {
-      subscriptionHandler = handler;
-      return "sub-1";
-    });
-
-    resetMockConnectionState({ ready: true });
-    const { useRpcInit } = await import("../../hooks/use-rpc-init");
-    renderHook(() => useRpcInit());
-
-    await waitFor(() => {
-      expect(mockSubscribe).toHaveBeenCalled();
-    });
-
-    subscriptionHandler!({
-      id: "msg-1",
-      role: "user",
-      content: "test message",
-      timestamp: 12345,
-    });
-
-    expect(mockChatAddMessage).toHaveBeenCalledWith({
-      id: "msg-1",
-      role: "user",
-      content: "test message",
-      timestamp: 12345,
-    });
-  });
+describe('useRpcInit', () => {
+	beforeEach(() => {
+		vi.clearAllMocks();
+		mockSubscribe.mockResolvedValue('sub-1');
+		mockCall.mockResolvedValue({ messages: [] });
+		resetMockLogState();
+	});
+
+	it('should call initializeConnection on mount', async () => {
+		resetMockConnectionState({ ready: false });
+		const { useRpcInit } = await import('../../hooks/use-rpc-init');
+		renderHook(() => useRpcInit());
+		expect(mockInitializeConnection).toHaveBeenCalledTimes(1);
+	});
+
+	it('should not subscribe when not ready', async () => {
+		resetMockConnectionState({ ready: false });
+		const { useRpcInit } = await import('../../hooks/use-rpc-init');
+		renderHook(() => useRpcInit());
+		expect(mockSubscribe).not.toHaveBeenCalled();
+		expect(mockListRootDir).not.toHaveBeenCalled();
+		expect(mockCall).not.toHaveBeenCalled();
+	});
+
+	it('should subscribe, load history and init explorer when ready', async () => {
+		resetMockConnectionState({ ready: true });
+		const { useRpcInit } = await import('../../hooks/use-rpc-init');
+		renderHook(() => useRpcInit());
+
+		await waitFor(() => {
+			expect(mockListRootDir).toHaveBeenCalledTimes(1);
+		});
+
+		await waitFor(() => {
+			expect(mockSubscribe).toHaveBeenCalledWith('chat.message', expect.any(Function), {});
+		});
+
+		await waitFor(() => {
+			expect(mockCall).toHaveBeenCalledWith('chat.list', { limit: 100 });
+		});
+	});
+
+	it('should load history messages into chat store', async () => {
+		const messages = [
+			{ id: '1', role: 'user' as const, content: 'hello', timestamp: 1000 },
+			{ id: '2', role: 'assistant' as const, content: 'world', timestamp: 2000 },
+		];
+		mockCall.mockResolvedValue({ messages });
+
+		resetMockConnectionState({ ready: true });
+		const { useRpcInit } = await import('../../hooks/use-rpc-init');
+		renderHook(() => useRpcInit());
+
+		await waitFor(() => {
+			expect(mockChatSetMessages).toHaveBeenCalledWith(
+				messages.map((m) => ({
+					id: m.id,
+					role: m.role,
+					content: m.content,
+					timestamp: m.timestamp,
+				})),
+			);
+		});
+
+		expect(mockAddLog).toHaveBeenCalledWith('Loaded 2 history messages');
+	});
+
+	it('should unsubscribe on cleanup when ready', async () => {
+		resetMockConnectionState({ ready: true });
+		const { useRpcInit } = await import('../../hooks/use-rpc-init');
+		const { unmount } = renderHook(() => useRpcInit());
+
+		await waitFor(() => {
+			expect(mockSubscribe).toHaveBeenCalled();
+		});
+
+		unmount();
+		expect(mockUnsubscribe).toHaveBeenCalledWith('sub-1');
+	});
+
+	it('should handle history load failure gracefully', async () => {
+		mockCall.mockRejectedValue(new Error('Network error'));
+		resetMockConnectionState({ ready: true });
+		const { useRpcInit } = await import('../../hooks/use-rpc-init');
+		renderHook(() => useRpcInit());
+
+		await waitFor(() => {
+			expect(mockAddLog).toHaveBeenCalledWith(expect.stringContaining('Failed to load history'));
+		});
+	});
+
+	it('should forward chat.message payloads to chat store', async () => {
+		let subscriptionHandler: ((payload: Record<string, unknown>) => void) | undefined;
+		mockSubscribe.mockImplementation(
+			async (_event: string, handler: (p: Record<string, unknown>) => void) => {
+				subscriptionHandler = handler;
+				return 'sub-1';
+			},
+		);
+
+		resetMockConnectionState({ ready: true });
+		const { useRpcInit } = await import('../../hooks/use-rpc-init');
+		renderHook(() => useRpcInit());
+
+		await waitFor(() => {
+			expect(mockSubscribe).toHaveBeenCalled();
+		});
+
+		subscriptionHandler!({
+			id: 'msg-1',
+			role: 'user',
+			content: 'test message',
+			timestamp: 12345,
+		});
+
+		expect(mockChatAddMessage).toHaveBeenCalledWith({
+			id: 'msg-1',
+			role: 'user',
+			content: 'test message',
+			timestamp: 12345,
+		});
+	});
 });