@nextclaw/ui 0.11.23 → 0.12.1

package/src/components/layout/Sidebar.tsx

@@ -1,7 +1,7 @@
 import { cn } from '@/lib/utils';
 import { LANGUAGE_OPTIONS, t, type I18nLanguage } from '@/lib/i18n';
 import { THEME_OPTIONS, type UiTheme } from '@/lib/theme';
-import { Cpu, GitBranch, History, MessageCircle, MessageSquare, Sparkles, BookOpen, Plug, BrainCircuit, AlarmClock, Languages, Palette, KeyRound, Settings, ArrowLeft, Search, Shield, Wrench, Wifi } from 'lucide-react';
+import { Cpu, GitBranch, History, MessageCircle, MessageSquare, Sparkles, BookOpen, Plug, BrainCircuit, AlarmClock, Languages, Palette, KeyRound, Settings, ArrowLeft, Search, Shield, Wrench, Wifi, Bot } from 'lucide-react';
 import { NavLink } from 'react-router-dom';
 import { useDocBrowser } from '@/components/doc-browser';
 import { BrandHeader } from '@/components/common/BrandHeader';
@@ -61,6 +61,11 @@ export function Sidebar({ mode }: SidebarProps) {
       target: '/chat/skills',
       label: t('marketplaceFilterSkills'),
       icon: BrainCircuit,
+    },
+    {
+      target: '/agents',
+      label: t('agentsPageTitle'),
+      icon: Bot,
     }
   ];
 

package/src/components/layout/app-layout.test.tsx

@@ -0,0 +1,30 @@
+import { render, screen } from '@testing-library/react';
+import { MemoryRouter, Route, Routes } from 'react-router-dom';
+import { describe, expect, it } from 'vitest';
+import { AppLayout } from '@/components/layout/AppLayout';
+import { I18nProvider } from '@/components/providers/I18nProvider';
+
+describe('AppLayout', () => {
+  it('treats /agents as a main workspace route instead of the settings shell', () => {
+    const { container } = render(
+      <I18nProvider>
+        <MemoryRouter initialEntries={['/agents']}>
+          <Routes>
+            <Route
+              path="*"
+              element={(
+                <AppLayout>
+                  <div data-testid="agents-content">Agents Content</div>
+                </AppLayout>
+              )}
+            />
+          </Routes>
+        </MemoryRouter>
+      </I18nProvider>
+    );
+
+    expect(screen.getByTestId('agents-content')).toBeTruthy();
+    expect(screen.queryByTestId('settings-sidebar-header')).toBeNull();
+    expect(container.querySelector('aside')).toBeNull();
+  });
+});

package/src/components/ui/tabs.tsx

@@ -61,6 +61,8 @@ export function TabsTrigger({ value, children, className }: TabsTriggerProps) {
     <button
       type="button"
       onClick={() => context.onValueChange(value)}
+      aria-pressed={isActive}
+      data-state={isActive ? 'active' : 'inactive'}
       className={cn(
         'inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-[13px] font-medium ring-offset-white transition-all duration-fast focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50',
         isActive

package/src/hooks/README.md

@@ -0,0 +1,3 @@
+## 目录预算豁免
+
+- 原因：`hooks/` 目录作为 UI 行为接入层，需要并列保留按能力划分的查询、变更和会话辅助 hooks；本次新增 `useAgents.ts` 是为了把 agent 管理职责从 `useConfig.ts` 拆出，属于减债后的职责回收，而不是继续堆叠到单文件。

package/src/hooks/agents/useAgents.ts

@@ -0,0 +1,44 @@
+import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
+import { createAgent, deleteAgent, fetchAgents } from '@/api/agents';
+import { toast } from 'sonner';
+import { t } from '@/lib/i18n';
+
+export function useAgents() {
+  return useQuery({
+    queryKey: ['agents'],
+    queryFn: fetchAgents,
+    staleTime: 30_000
+  });
+}
+
+export function useCreateAgent() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: ({ data }: { data: Parameters<typeof createAgent>[0] }) => createAgent(data),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['agents'] });
+      queryClient.invalidateQueries({ queryKey: ['config'] });
+      toast.success(t('configSavedApplied'));
+    },
+    onError: (error: Error) => {
+      toast.error(t('configSaveFailed') + ': ' + error.message);
+    }
+  });
+}
+
+export function useDeleteAgent() {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: ({ agentId }: { agentId: string }) => deleteAgent(agentId),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['agents'] });
+      queryClient.invalidateQueries({ queryKey: ['config'] });
+      toast.success(t('configSavedApplied'));
+    },
+    onError: (error: Error) => {
+      toast.error(t('configSaveFailed') + ': ' + error.message);
+    }
+  });
+}

package/src/lib/i18n.agents.ts

@@ -0,0 +1,66 @@
+export const AGENT_LABELS: Record<string, { zh: string; en: string }> = {
+  agentsPageTitle: { zh: 'Agent 管理', en: 'Agents' },
+  agentsPageDescription: {
+    zh: '管理可对话的 Agent 身份。每个 Agent 都有自己的主目录、设定、记忆与技能。',
+    en: 'Manage conversational agent identities. Each agent owns its home directory, setup, memory, and skills.'
+  },
+  agentsHeroEyebrow: { zh: 'Agent 管理台', en: 'Agent Gallery' },
+  agentsHeroTitle: {
+    zh: '让每个 Agent 都像真正的协作者一样存在',
+    en: 'Give every agent the presence of a real collaborator'
+  },
+  agentsHeroDescription: {
+    zh: '在这里浏览、创建并切换不同的 Agent 身份。每个 Agent 都有自己的头像、名称、主目录，以及独立的记忆与技能空间。',
+    en: 'Browse, create, and choose distinct agent identities. Every agent carries its own avatar, name, home directory, memory, and skills space.'
+  },
+  agentsCreateButton: { zh: '新增 Agent', en: 'New Agent' },
+  agentsCreateDialogTitle: { zh: '创建新的 Agent 身份', en: 'Create a new agent identity' },
+  agentsCreateDialogDescription: {
+    zh: '默认逻辑保持简单。只填必要信息，其余能力继续走统一配置与主目录模板。',
+    en: 'Keep the flow simple. Provide only the essentials and let shared defaults plus the home directory template do the rest.'
+  },
+  agentsCreateDialogHint: {
+    zh: '如果你希望让 AI 自动完成全部自定义，也可以继续使用 `nextclaw agents new`。',
+    en: 'If you want AI to automate the full setup, you can still use `nextclaw agents new`.'
+  },
+  agentsCreateTitle: { zh: '创建 Agent', en: 'Create Agent' },
+  agentsCreateDescription: {
+    zh: '这里提供轻量入口。完整自动化创建链路也可通过 `nextclaw agents new` 使用。',
+    en: 'This is the lightweight UI entry. The full automation path is also available through `nextclaw agents new`.'
+  },
+  agentsFormIdPlaceholder: { zh: 'Agent ID，例如 engineer', en: 'Agent ID, for example engineer' },
+  agentsFormNamePlaceholder: { zh: '显示名称，可选', en: 'Display name, optional' },
+  agentsFormDescriptionPlaceholder: { zh: '角色描述，可选', en: 'Role description, optional' },
+  agentsFormAvatarPlaceholder: { zh: '头像 URL 或本地路径，可选', en: 'Avatar URL or local path, optional' },
+  agentsFormHomePlaceholder: { zh: '主目录，可选', en: 'Home Directory, optional' },
+  agentsCreateAction: { zh: '创建 Agent', en: 'Create Agent' },
+  agentsRemoveAction: { zh: '移除', en: 'Remove' },
+  agentsNewChat: { zh: '新建会话', en: 'New Chat' },
+  agentsLoading: { zh: '正在加载 Agent...', en: 'Loading agents...' },
+  agentsEmpty: { zh: '当前还没有附加 Agent', en: 'No extra agents yet' },
+  agentsEmptyDescription: {
+    zh: '先创建第一个专职 Agent，让它拥有自己的名字、头像与主目录。',
+    en: 'Create the first specialist agent with its own name, avatar, and home directory.'
+  },
+  agentsBuiltIn: { zh: '内建', en: 'Built-in' },
+  agentsCustom: { zh: '自定义', en: 'Custom' },
+  agentsOverviewTotal: { zh: '全部 Agent', en: 'Conversational agents' },
+  agentsOverviewBuiltIn: { zh: '系统主 Agent', en: 'System main agents' },
+  agentsOverviewCustom: { zh: '专职 Agent', en: 'Specialist agents' },
+  agentsCardBuiltInSummary: {
+    zh: '系统主 Agent，适合作为默认入口与总控协作者。',
+    en: 'The built-in main agent, ideal as the default entry and coordinating collaborator.'
+  },
+  agentsCardCustomSummary: {
+    zh: '专属 Agent 身份，可沉淀自己的记忆、技能与角色风格。',
+    en: 'A dedicated identity with its own memory, skills, and role style.'
+  },
+  agentsCardHomeLabel: { zh: '主目录', en: 'Home Directory' },
+  agentsCardAvatarLabel: { zh: 'Avatar', en: 'Avatar' },
+  agentsCardStartChat: { zh: '开始对话', en: 'Start Chat' },
+  agentsCardBuiltInTag: { zh: '系统主', en: 'Main Agent' },
+  agentsCardCustomTag: { zh: '专职', en: 'Specialist' },
+  chatDraftAgentTitle: { zh: '本次会话 Agent', en: 'Draft agent' },
+  chatDraftAgentDescription: { zh: '创建后不可切换', en: 'Locked after creation' },
+  chatDraftAgentCurrent: { zh: '当前 Agent', en: 'Current Agent' }
+};

package/src/lib/i18n.chat.ts

@@ -42,6 +42,10 @@ export const CHAT_LABELS: Record<string, { zh: string; en: string }> = {
   chatNoSessionHint: { zh: '创建一个会话并发送第一条消息。', en: 'Create a session and send your first message.' },
   chatHistoryLoading: { zh: '加载会话历史中...', en: 'Loading session history...' },
   chatNoMessages: { zh: '暂无消息，发送一条开始对话。', en: 'No messages yet. Send one to start.' },
+  chatBackToParent: { zh: '返回父会话', en: 'Back to parent' },
+  chatChildSessionLoading: { zh: '正在加载子会话…', en: 'Loading child session…' },
+  chatChildSessionEmpty: { zh: '子会话还没有消息。', en: 'No child session messages yet.' },
+  chatChildSessionClosePanel: { zh: '关闭子会话侧栏', en: 'Close child session panel' },
   chatTyping: { zh: 'Agent 正在思考...', en: 'Agent is thinking...' },
   chatInputPlaceholder: { zh: '输入消息，输入 / 选择技能，Enter 发送，Shift + Enter 换行', en: 'Type a message, type / to select skills, Enter to send, Shift + Enter for newline' },
   chatInputHint: { zh: '支持多轮上下文，默认走当前会话。', en: 'Multi-turn context is preserved in the current session.' },
@@ -56,6 +60,7 @@ export const CHAT_LABELS: Record<string, { zh: string; en: string }> = {
   chatSlashHint: { zh: '输入 / 触发命令或技能选择', en: 'Type / to access commands and skills' },
   chatSlashCommandHint: { zh: '回车插入命令，继续输入参数后发送。', en: 'Press Enter to insert command, then add args and send.' },
   chatSlashSkillHint: { zh: '回车把该技能加入本轮请求。', en: 'Press Enter to add this skill for the next turn.' },
+  chatSkillScopeBuiltin: { zh: '内建', en: 'Built-in' },
   chatSkillScopeProject: { zh: '项目', en: 'Project' },
   chatSkillScopeWorkspace: { zh: '工作区', en: 'Workspace' },
   chatPickerRecent: { zh: '最近使用', en: 'Recent' },

package/src/lib/i18n.ts

@@ -1,3 +1,4 @@
+import { AGENT_LABELS } from './i18n.agents';
 import { CHANNEL_LABELS } from './i18n.channels';
 import { CHANNEL_AUTH_LABELS } from './i18n.channel-auth';
 import { CHAT_LABELS } from './i18n.chat';
@@ -10,9 +11,9 @@ import {
   setLanguage,
   subscribeLanguageChange,
   type I18nLanguage
-} from './i18n/i18n-language-owner';
+} from './i18n-runtime/i18n-language-owner';
 import { MARKETPLACE_LABELS } from './i18n.marketplace';
-import { PATH_PICKER_LABELS } from './i18n/i18n.path-picker';
+import { PATH_PICKER_LABELS } from './i18n-runtime/i18n.path-picker';
 import { REMOTE_LABELS } from './i18n.remote';
 export type { I18nLanguage };
 export {
@@ -24,7 +25,6 @@ export {
   setLanguage,
   subscribeLanguageChange
 };
-
 export function formatDateTime(value?: string | Date, lang: I18nLanguage = getLanguage()): string {
   if (!value) {
     return '-';
@@ -381,8 +381,6 @@ export const LABELS: Record<string, { zh: string; en: string }> = {
   defaultContextTokensHelp: { zh: '当 Agent 未设置单独值时使用该上下文预算。', en: 'Input context budget for agents when no per-agent override is set.' },
   defaultEngine: { zh: '默认引擎', en: 'Default Engine' },
   defaultEngineHelp: { zh: '默认使用的 Agent 引擎类型，例如 native 或 codex-sdk。', en: 'Default agent engine kind, for example native or codex-sdk.' },
-  maxPingPongTurns: { zh: '最大乒乓轮次', en: 'Max Ping-Pong Turns' },
-  maxPingPongTurnsHelp: { zh: '设为 0 可阻止 Agent 间自动 ping-pong。', en: 'Set to 0 to block automatic agent-to-agent ping-pong loops.' },
   agentList: { zh: 'Agent 列表', en: 'Agent List' },
   agentListHelp: { zh: '在同一个网关进程中运行多个固定角色 Agent。', en: 'Run multiple fixed-role agents in one gateway process.' },
   bindings: { zh: '绑定规则', en: 'Bindings' },
@@ -409,7 +407,6 @@ export const LABELS: Record<string, { zh: string; en: string }> = {
   peerIdPlaceholder: { zh: '对端 ID（需先设置对端类型）', en: 'Peer ID (requires peer kind)' },
   addBinding: { zh: '添加绑定', en: 'Add Binding' },
   saveRuntimeSettings: { zh: '保存运行时设置', en: 'Save Runtime Settings' },
-
   // Secrets
   secretsPageTitle: { zh: '密钥管理', en: 'Secrets Management' },
   secretsPageDescription: {
@@ -494,6 +491,7 @@ export const LABELS: Record<string, { zh: string; en: string }> = {
   },
 
   // Chat
+  ...AGENT_LABELS,
   ...CHAT_LABELS,
 
   // Cron

package/src/lib/ui-document-title.ts

@@ -9,6 +9,7 @@ const ROUTE_TITLE_KEYS: Array<{ prefix: string; key: string }> = [
   { prefix: '/marketplace', key: 'marketplace' },
   { prefix: '/skills', key: 'marketplaceSkillsPageTitle' },
   { prefix: '/cron', key: 'cronPageTitle' },
+  { prefix: '/agents', key: 'agentsPageTitle' },
   { prefix: '/chat', key: 'chat' },
   { prefix: '/model', key: 'modelPageTitle' },
   { prefix: '/search', key: 'searchPageTitle' },