@allbluecn/web-app 0.10.3 → 0.11.0

package/src/components/workspace/__tests__/dialogs/delete-workspace-options.test.tsx

@@ -0,0 +1,89 @@
+import type { ReactNode } from "react";
+
+import { render } from "@testing-library/react";
+import { describe, expect, it, vi } from "vitest";
+
+import { DeleteWorkspaceOptions } from "../../dialogs/delete-workspace-options";
+
+vi.mock("@/components/ui/field", () => ({
+  Field: ({ children }: { children: ReactNode }) => <div>{children}</div>,
+  FieldContent: ({ children }: { children: ReactNode }) => <div>{children}</div>,
+  FieldDescription: ({ children }: { children: ReactNode }) => (
+    <p>{children}</p>
+  ),
+  FieldLabel: ({ children }: { children: ReactNode }) => <div>{children}</div>,
+  FieldTitle: ({ children }: { children: ReactNode }) => <span>{children}</span>,
+}));
+
+vi.mock("@/components/ui/radio-group", () => ({
+  RadioGroup: ({ children }: { children: ReactNode }) => (
+    <div data-radix-radio-group>{children}</div>
+  ),
+  RadioGroupItem: () => <input type="radio" />,
+}));
+
+vi.mock("@/components/ui/select", () => ({
+  Select: ({ children }: { children: ReactNode }) => <div>{children}</div>,
+  SelectContent: ({ children }: { children: ReactNode }) => <div>{children}</div>,
+  SelectItem: ({ children }: { children: ReactNode }) => <div>{children}</div>,
+  SelectTrigger: ({ children }: { children: ReactNode }) => (
+    <div data-radix-select-trigger>{children}</div>
+  ),
+  SelectValue: () => <span />,
+}));
+
+vi.mock("@/components/ui/separator", () => ({
+  Separator: () => <hr />,
+}));
+
+describe("DeleteWorkspaceOptions", () => {
+  const baseProps = {
+    projectCount: 2,
+    deleteMode: "transfer" as const,
+    onDeleteModeChange: () => {},
+    storyMode: "transfer" as const,
+    onStoryModeChange: () => {},
+    knowledgeBaseMode: "delete" as const,
+    onKnowledgeBaseModeChange: () => {},
+    targetWorkspaceId: "ws-2",
+    onTargetWorkspaceIdChange: () => {},
+    workspaceOptions: [
+      { id: "ws-2", name: "其他工作区" },
+      { id: "ws-3", name: "另一个工作区" },
+    ],
+  };
+
+  it("转移模式下渲染两组处理选项并显示目标工作区下拉", () => {
+    const { container } = render(<DeleteWorkspaceOptions {...baseProps} />);
+
+    expect(
+      container.querySelectorAll("[data-radix-radio-group]"),
+    ).toHaveLength(2);
+    expect(container.querySelector("[data-radix-select-trigger]")).not.toBeNull();
+  });
+
+  it("清空模式下渲染三组处理选项且无目标工作区下拉", () => {
+    const { container } = render(
+      <DeleteWorkspaceOptions
+        {...baseProps}
+        deleteMode="clear"
+        storyMode="clear"
+      />,
+    );
+
+    expect(
+      container.querySelectorAll("[data-radix-radio-group]"),
+    ).toHaveLength(3);
+    expect(container.querySelector("[data-radix-select-trigger]")).toBeNull();
+  });
+
+  it("无项目时仅渲染知识库处理选项", () => {
+    const { container } = render(
+      <DeleteWorkspaceOptions {...baseProps} projectCount={0} />,
+    );
+
+    expect(
+      container.querySelectorAll("[data-radix-radio-group]"),
+    ).toHaveLength(1);
+  });
+});

package/src/components/workspace/__tests__/dialogs/edit-workspace-dialog.test.tsx

@@ -0,0 +1,68 @@
+import { describe, it, expect, vi } from "vitest";
+import { render, screen } from "@testing-library/react";
+import { EditWorkspaceDialog } from "../../dialogs/edit-workspace-dialog";
+
+vi.mock("@/components/ui/button", () => ({
+  Button: ({ children, ...props }: any) => <button {...props}>{children}</button>,
+}));
+
+vi.mock("@/components/ui/input", () => ({
+  Input: (props: any) => <input {...props} />,
+}));
+
+vi.mock("@/components/ui/dialog", () => ({
+  Dialog: ({ children }: any) => <div>{children}</div>,
+  DialogContent: ({ children }: any) => <div>{children}</div>,
+  DialogFooter: ({ children }: any) => <div>{children}</div>,
+  DialogHeader: ({ children }: any) => <div>{children}</div>,
+  DialogTitle: ({ children }: any) => <h2>{children}</h2>,
+}));
+
+vi.mock("@/components/shared-kit/icons/lucide-icon-picker", () => ({
+  LucideIconPicker: () => <div data-testid="icon-picker" />,
+}));
+
+vi.mock("@tanstack/react-router", () => ({
+  useRouter: () => ({ navigate: vi.fn() }),
+}));
+
+vi.mock("@tanstack/react-form", () => {
+  const makeField = (value: string) => ({
+    value,
+    handleChange: vi.fn(),
+    handleBlur: vi.fn(),
+    meta: { errors: [] },
+  });
+  return {
+    useForm: () => {
+      const fields = {
+        name: makeField("测试"),
+        icon: makeField("folder"),
+        description: makeField(""),
+      };
+      return {
+        handleSubmit: (e: any) => e.preventDefault(),
+        setFieldValue: () => {},
+        state: { values: { name: "测试", icon: "folder", description: "" } },
+        fields,
+        Field: ({ name, children }: { name: "name" | "icon" | "description"; children: unknown }) =>
+          typeof children === "function"
+            ? (children as (field: unknown) => unknown)(fields[name])
+            : null,
+      };
+    },
+  };
+});
+
+describe("EditWorkspaceDialog", () => {
+  it("打开时渲染标题", () => {
+    render(
+      <EditWorkspaceDialog
+        open={true}
+        onOpenChange={() => {}}
+        workspace={{ id: "ws1", name: "测试", icon: "folder", description: null }}
+      />
+    );
+    expect(screen.getByRole("heading")).toBeInTheDocument();
+  });
+});

package/src/components/workspace/__tests__/header/workspace-header.test.tsx

@@ -0,0 +1,40 @@
+import { describe, it, expect, vi } from "vitest";
+import { render, screen } from "@testing-library/react";
+import { WorkspaceHeader } from "../../header/workspace-header";
+
+vi.mock("@/components/ui/button", () => ({
+  Button: ({ children, ...props }: any) => <button {...props}>{children}</button>,
+}));
+
+vi.mock("@/components/ui/dropdown-menu", () => ({
+  DropdownMenu: ({ children }: any) => <div>{children}</div>,
+  DropdownMenuTrigger: ({ children }: any) => <div>{children}</div>,
+  DropdownMenuContent: ({ children }: any) => <div>{children}</div>,
+  DropdownMenuItem: ({ children }: any) => <div>{children}</div>,
+}));
+
+vi.mock("@/components/ui/separator", () => ({
+  Separator: () => <div data-testid="separator" />,
+}));
+
+vi.mock("@/components/shared-kit/icons/lucide-icon-picker/lucide-icon-by-name", () => ({
+  LucideIconByName: () => <div data-testid="icon" />,
+}));
+
+vi.mock("@tanstack/react-router", () => ({
+  Link: ({ children }: any) => <a>{children}</a>,
+}));
+
+describe("WorkspaceHeader", () => {
+  it("渲染工作空间名称", () => {
+    const WORKSPACE = {
+      id: "ws1",
+      name: "测试工作空间",
+      description: null,
+      icon: "folder",
+      _count: { projects: 0 },
+    };
+    render(<WorkspaceHeader workspace={WORKSPACE} onEdit={() => {}} onDelete={() => {}} />);
+    expect(screen.getByText("测试工作空间")).toBeInTheDocument();
+  });
+});

package/src/components/workspace/__tests__/kb/workspace-kb-card.test.tsx

@@ -0,0 +1,154 @@
+import { describe, it, expect, vi, beforeEach } from "vitest";
+import { render, screen, fireEvent, waitFor } from "@testing-library/react";
+
+const mocks = vi.hoisted(() => ({
+  invalidate: vi.fn(),
+  setKbs: vi.fn(),
+  renameDoc: vi.fn(),
+  removeDoc: vi.fn(),
+  reorderDocs: vi.fn(),
+}));
+
+vi.mock("@tanstack/react-router", () => ({
+  useRouter: () => ({ invalidate: mocks.invalidate }),
+  Link: ({ to, children, ...rest }: any) => (
+    <a href={typeof to === "string" ? to : "#"} {...rest}>{children}</a>
+  ),
+}));
+vi.mock("@tanstack/react-start", () => ({
+  useServerFn: (fn: any) => async (...args: any[]) => fn(...args),
+}));
+vi.mock("@/server/serverFns/workspace-kb", () => ({
+  getWorkspaceKbCardFn: vi.fn().mockResolvedValue({ kbs: [], quickDocs: [] }),
+  listWorkspaceAvailableKbsFn: vi.fn(),
+  setWorkspaceKbsFn: mocks.setKbs,
+  renameQuickDocFn: mocks.renameDoc,
+  removeQuickDocFn: mocks.removeDoc,
+  reorderQuickDocsFn: mocks.reorderDocs,
+  searchQuickDocCandidatesFn: vi.fn(),
+  addQuickDocsFn: vi.fn(),
+}));
+vi.mock("@dnd-kit/react", () => ({
+  DragDropProvider: ({ children }: any) => <div>{children}</div>,
+  useDroppable: () => ({ ref: null, isDropTarget: false }),
+}));
+vi.mock("@dnd-kit/react/sortable", () => ({
+  useSortable: () => ({ ref: undefined, handleRef: undefined, isDragging: false }),
+}));
+vi.mock("sonner", () => ({
+  toast: { error: vi.fn(), success: vi.fn(), warning: vi.fn() },
+}));
+vi.mock("../workspace-kb-manage-dialog", () => ({
+  WorkspaceKbManageDialog: () => null,
+}));
+vi.mock("../workspace-quick-doc-dialog", () => ({
+  WorkspaceQuickDocDialog: () => null,
+}));
+vi.mock("@/components/ui/tooltip", () => ({
+  Tooltip: ({ children }: any) => <span data-testid="tooltip-wrapper">{children}</span>,
+  TooltipContent: ({ children }: any) => <span>{children}</span>,
+  TooltipTrigger: ({ children }: any) => <span data-testid="tooltip-trigger">{children}</span>,
+}));
+
+import { WorkspaceKbCard } from "../../kb/workspace-kb-card";
+
+const KB = { id: "kb1", name: "团队库", icon: "notebook", visibility: "team" };
+const DOC_ROW = {
+  id: "q1", displayTitle: "接入指南", columnIndex: 0, sortOrder: 0, label: null, icon: null, source: "doc" as const,
+  docId: "d1", kbId: "kb1", kbName: "团队库", docIcon: null,
+  group: null, externalId: null, faviconUrl: null, sourceTitle: "接入指南", url: null, stale: false,
+};
+const STALE_ROW = {
+  ...DOC_ROW, id: "q2", displayTitle: "旧法条", source: "general" as const,
+  docId: null, kbId: null, kbName: null, group: "legal" as const, externalId: "gone",
+  faviconUrl: null, sourceTitle: null, url: null, stale: true,
+};
+const EXTERNAL_URL_ROW = {
+  ...DOC_ROW, id: "q3", displayTitle: "外部工具", source: "general" as const,
+  docId: null, kbId: null, kbName: null, group: "bookmark" as const, externalId: "ext123",
+  faviconUrl: null, sourceTitle: "PNG to ICO", url: "https://tool.xuecan.net/png-to-ico/", stale: false,
+};
+
+beforeEach(() => {
+  vi.clearAllMocks();
+});
+
+describe("WorkspaceKbCard 渲染", () => {
+  it("空数据显示空状态且「前往知识库」禁用", () => {
+    render(<WorkspaceKbCard workspaceId="ws1" data={{ kbs: [], quickDocs: [] }} />);
+    expect(screen.getByText(/快捷知识入口/)).toBeInTheDocument();
+    // 前往知识库图标按钮 disabled，无 aria-label
+    const buttons = screen.getAllByRole("button");
+    const disabledBtn = buttons.find((b) => b.getAttribute("disabled") !== null);
+    expect(disabledBtn).toBeTruthy();
+  });
+
+  it("渲染快捷文档行（5列布局）", () => {
+    render(<WorkspaceKbCard workspaceId="ws1" data={{ kbs: [], quickDocs: [DOC_ROW] }} />);
+    expect(screen.getByText("接入指南")).toBeInTheDocument();
+  });
+
+  it("失效条目显示「源已失效」", () => {
+    render(<WorkspaceKbCard workspaceId="ws1" data={{ kbs: [], quickDocs: [STALE_ROW] }} />);
+    expect(screen.getByText(/源已失效/)).toBeInTheDocument();
+  });
+
+  it("已关联知识库时不显示知识库名称（chip 已移除），前往按钮 tooltip 显示库名", () => {
+    render(<WorkspaceKbCard workspaceId="ws1" data={{ kbs: [KB], quickDocs: [] }} />);
+    // chip 行已移除，但 goToKb tooltip 仍显示库名
+    expect(screen.getByText("团队库")).toBeInTheDocument();
+  });
+});
+
+describe("WorkspaceKbCard 乐观更新", () => {
+  it("删除确认后乐观移除并调 removeQuickDocFn", async () => {
+    render(<WorkspaceKbCard workspaceId="ws1" data={{ kbs: [], quickDocs: [DOC_ROW] }} />);
+    fireEvent.click(screen.getByRole("button", { name: "删除" }));
+    fireEvent.click(screen.getByRole("button", { name: "确认" }));
+    await waitFor(() => {
+      expect(mocks.removeDoc).toHaveBeenCalledWith({ data: { quickDocId: "q1" } });
+    });
+    expect(screen.queryByText("接入指南")).not.toBeInTheDocument();
+  });
+
+  it("重命名提交调用 renameQuickDocFn 且 UI 更新", async () => {
+    render(<WorkspaceKbCard workspaceId="ws1" data={{ kbs: [], quickDocs: [DOC_ROW] }} />);
+    fireEvent.click(screen.getByRole("button", { name: "重命名" }));
+    const input = screen.getByRole("textbox");
+    fireEvent.change(input, { target: { value: "新标题" } });
+    fireEvent.keyDown(input, { key: "Enter" });
+    await waitFor(() => {
+      expect(mocks.renameDoc).toHaveBeenCalledWith({
+        data: { quickDocId: "q1", displayTitle: "新标题" },
+      });
+    });
+    expect(screen.getByText("新标题")).toBeInTheDocument();
+  });
+
+  it("外部 URL 卡片使用 <a href> 而非 Link", () => {
+    render(<WorkspaceKbCard workspaceId="ws1" data={{ kbs: [], quickDocs: [EXTERNAL_URL_ROW] }} />);
+    // 外部 URL 应渲染为普通 <a> 标签，而非 TanStack Router Link（mock 为 <a>）
+    const link = screen.getByText("外部工具").closest("a");
+    expect(link).toBeInTheDocument();
+    expect((link as HTMLAnchorElement).href).toBe("https://tool.xuecan.net/png-to-ico/");
+    expect((link as HTMLAnchorElement).target).toBe("_blank");
+  });
+
+  it("编辑状态下点击行不触发导航", async () => {
+    render(<WorkspaceKbCard workspaceId="ws1" data={{ kbs: [], quickDocs: [DOC_ROW] }} />);
+    // 进入编辑模式
+    fireEvent.click(screen.getByRole("button", { name: "重命名" }));
+    // 编辑态：快捷文档行的主链接不应存在（渲染为 span，无导航能力）
+    const row = document.querySelector("[data-quick-doc-row]");
+    expect(row).toBeInTheDocument();
+    // 主链接区域（包含 title 的 <a>）应不存在
+    const mainLink = row!.querySelector<HTMLAnchorElement>('.flex-1.truncate > a');
+    expect(mainLink).not.toBeInTheDocument();
+    // Input 应存在且可编辑
+    expect(screen.getByRole("textbox")).toBeInTheDocument();
+    // 点击行区域不应有导航（因为没有 Link）
+    fireEvent.click(row!);
+    // 编辑状态应保持（点击行内不会意外退出）
+    expect(screen.getByRole("textbox")).toBeInTheDocument();
+  });
+});

package/src/components/workspace/__tests__/members/workspace-member-item.test.tsx

@@ -0,0 +1,24 @@
+import { describe, it, expect, vi } from "vitest";
+import { render, screen } from "@testing-library/react";
+import { WorkspaceMemberItem } from "../../members/workspace-member-item";
+
+vi.mock("@/components/shared-kit", () => ({
+  UserAvatar: ({ name }: { name?: string }) => <div data-testid="user-avatar">{name?.[0] ?? "?"}</div>,
+}));
+
+const MEMBER = {
+  id: "m1",
+  userId: "u1",
+  role: "member" as const,
+  status: "active" as const,
+  joinedAt: new Date(),
+  user: { id: "u1", username: "张三", email: "zhangsan@example.com" },
+};
+
+describe("WorkspaceMemberItem", () => {
+  it("渲染成员用户名和邮箱", () => {
+    render(<WorkspaceMemberItem member={MEMBER} workspaceOwnerId="owner1" onRemove={() => {}} />);
+    expect(screen.getByText("张三")).toBeInTheDocument();
+    expect(screen.getByText("zhangsan@example.com")).toBeInTheDocument();
+  });
+});

package/src/components/workspace/__tests__/members/workspace-members-manager.test.tsx

@@ -0,0 +1,51 @@
+import { describe, it, expect, vi } from "vitest";
+import { render, screen } from "@testing-library/react";
+import { WorkspaceMembersManager } from "../../members/workspace-members-manager";
+
+vi.mock("@/components/ui/button", () => ({
+  Button: ({ children, ...props }: any) => <button {...props}>{children}</button>,
+}));
+
+vi.mock("@/components/ui/input", () => ({
+  Input: (props: any) => <input {...props} />,
+}));
+
+vi.mock("@/components/ui/dialog", () => ({
+  Dialog: ({ children }: any) => <div>{children}</div>,
+  DialogContent: ({ children }: any) => <div>{children}</div>,
+  DialogFooter: ({ children }: any) => <div>{children}</div>,
+  DialogHeader: ({ children }: any) => <div>{children}</div>,
+  DialogTitle: ({ children }: any) => <h2>{children}</h2>,
+  DialogDescription: ({ children }: any) => <p>{children}</p>,
+}));
+
+vi.mock("@/components/ui/sonner", () => ({
+  toast: { error: vi.fn(), success: vi.fn() },
+}));
+
+vi.mock("@/components/ui/tooltip", () => ({
+  TooltipProvider: ({ children }: any) => <div>{children}</div>,
+  Tooltip: ({ children }: any) => <div>{children}</div>,
+  TooltipTrigger: ({ children }: any) => <div>{children}</div>,
+  TooltipContent: ({ children }: any) => <div>{children}</div>,
+}));
+
+vi.mock("@/server/serverFns/workspace", () => ({
+  listWorkspaceMembersFn: vi.fn().mockResolvedValue([]),
+  inviteWorkspaceMemberFn: vi.fn().mockResolvedValue({}),
+  removeWorkspaceMemberFn: vi.fn().mockResolvedValue({}),
+}));
+
+describe("WorkspaceMembersManager", () => {
+  it("渲染组件不崩溃", () => {
+    render(
+      <WorkspaceMembersManager
+        workspaceId="ws1"
+        workspaceOwnerId="owner1"
+        members={[]}
+        onMembersUpdated={() => {}}
+      />,
+    );
+    expect(screen.getAllByText(/成员/).length).toBeGreaterThan(0);
+  });
+});

package/src/components/workspace/__tests__/projects/workspace-project-list.test.tsx

@@ -0,0 +1,46 @@
+import { describe, it, expect, vi } from "vitest";
+import { render, screen } from "@testing-library/react";
+import { WorkspaceProjectList } from "../../projects/workspace-project-list";
+
+vi.mock("@/components/ui/button", () => ({
+  Button: ({ children, ...props }: any) => <button {...props}>{children}</button>,
+}));
+
+vi.mock("@/components/ui/card", () => ({
+  Card: ({ children, className, ...props }: any) => <div className={className} {...props}>{children}</div>,
+}));
+
+vi.mock("@/components/shared-kit/icons/lucide-icon-picker/lucide-icon-by-name", () => ({
+  LucideIconByName: () => <div data-testid="icon" />,
+}));
+
+vi.mock("@/components/project/create-project-dialog", () => ({
+  CreateProjectDialog: () => null,
+}));
+
+vi.mock("@tanstack/react-router", () => ({
+  Link: ({ children }: any) => <a>{children}</a>,
+}));
+
+const PROJECTS = [
+  {
+    id: "p1",
+    name: "产品需求",
+    description: "PRD 管理项目",
+    icon: "lightbulb",
+    updatedAt: new Date("2024-01-15"),
+    _count: { members: 3 },
+  },
+];
+
+describe("WorkspaceProjectList", () => {
+  it("空状态显示提示卡片", () => {
+    render(<WorkspaceProjectList projects={[]} workspaceId="ws1" workspaceName="测试" />);
+    expect(screen.getByText(/暂无项目/)).toBeInTheDocument();
+  });
+
+  it("有项目时显示项目列表", () => {
+    render(<WorkspaceProjectList projects={PROJECTS} workspaceId="ws1" workspaceName="测试" />);
+    expect(screen.getByText("产品需求")).toBeInTheDocument();
+  });
+});

package/src/components/workspace/{create-workspace-dialog.tsx → dialogs/create-workspace-dialog.tsx}

@@ -29,7 +29,7 @@ import {
 } from "@/components/ui/dialog";
 import { LucideIconPicker } from "@/components/shared-kit/icons/lucide-icon-picker";
 import { createWorkspaceFn } from "@/server/serverFns/workspace";
-import { createWorkspaceSchema, type CreateWorkspaceValues } from "./schemas/create-workspace";
+import { createWorkspaceSchema, type CreateWorkspaceValues } from "../schemas/create-workspace";
 import { m } from "@/paraglide/messages.js";
 
 interface CreateWorkspaceDialogProps {

package/src/components/workspace/{edit-workspace-dialog.tsx → dialogs/edit-workspace-dialog.tsx}

@@ -29,7 +29,7 @@ import {
 } from "@/components/ui/dialog";
 import { LucideIconPicker } from "@/components/shared-kit/icons/lucide-icon-picker";
 import { updateWorkspaceFn } from "@/server/serverFns/workspace";
-import { createWorkspaceSchema, type CreateWorkspaceValues } from "./schemas/create-workspace";
+import { createWorkspaceSchema, type CreateWorkspaceValues } from "../schemas/create-workspace";
 import { m } from "@/paraglide/messages.js";
 
 interface EditWorkspaceDialogProps {