@allbluecn/web-app 0.10.3 → 0.11.0

package/src/components/layout/sidebar-03/nav-workspace.tsx

@@ -17,6 +17,7 @@
 
 import { Link, useLocation } from "@tanstack/react-router";
 import { useEffect, useState } from "react";
+import { useQuery, useQueryClient } from "@tanstack/react-query";
 import { Layers, Plus, PinOff } from "lucide-react";
 import {
   SidebarGroup,
@@ -29,22 +30,23 @@ import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip
 import { cn } from "@/lib/utils";
 import { isParentActive } from "@/lib/sidebar-utils";
 import { LucideIconByName } from "@/components/shared-kit/icons/lucide-icon-picker/lucide-icon-by-name";
-import { CreateWorkspaceDialog } from "@/components/workspace/create-workspace-dialog";
-import { useLiveQuery } from "@tanstack/react-db";
-import { workspacesCollection } from "@/lib/collections/reference/workspaces-collection";
-import { toggleWorkspacePinFn } from "@/server/serverFns/workspace";
+import { CreateWorkspaceDialog } from "@/components/workspace/dialogs/create-workspace-dialog";
+import { WORKSPACES_QUERY_KEY } from "@/lib/collections/reference/workspaces-collection";
+import {
+  listPinnedWorkspacesBriefFn,
+  toggleWorkspacePinFn,
+} from "@/server/serverFns/workspace";
 import { m } from "@/paraglide/messages.js";
 
 function WorkspaceLinks({ pathname }: { pathname: string }) {
-  const { data: workspaces } = useLiveQuery((q) =>
-    q.from({ w: workspacesCollection })
-  );
-  const workspacesList =
-    (workspaces as unknown as Array<{
-      id: string;
-      name: string;
-      icon: string;
-    }> | undefined) ?? [];
+  // useQuery 直读 per-request queryClient（_nav loader 已 SSR 预取），
+  // 列表随 SSR HTML 直出，刷新无需等待；避免 module-level collection 的跨请求泄漏
+  const { data } = useQuery({
+    queryKey: WORKSPACES_QUERY_KEY,
+    queryFn: () => listPinnedWorkspacesBriefFn(),
+  });
+  const queryClient = useQueryClient();
+  const workspacesList = data ?? [];
 
   return (
     <SidebarMenu className="space-y-1">
@@ -90,7 +92,7 @@ function WorkspaceLinks({ pathname }: { pathname: string }) {
               className="absolute right-1 top-1/2 -translate-y-1/2 flex size-5 items-center justify-center rounded text-sidebar-foreground/70 opacity-0 transition-opacity group-hover/ws:opacity-100 hover:bg-sidebar-accent hover:text-sidebar-accent-foreground"
               onClick={async () => {
                 await toggleWorkspacePinFn({ data: { workspaceId: ws.id, pinned: false } });
-                (workspacesCollection as any).utils?.refetch?.();
+                void queryClient.invalidateQueries({ queryKey: WORKSPACES_QUERY_KEY });
                 window.dispatchEvent(new CustomEvent("workspace-pinned", { detail: { workspaceId: ws.id, pinned: false } }));
               }}
             >
@@ -112,16 +114,12 @@ export function NavWorkspace() {
   const { state } = useSidebar();
   const { pathname } = useLocation();
   const isCollapsed = state === "collapsed";
-  const [mounted, setMounted] = useState(false);
   const [createOpen, setCreateOpen] = useState(false);
-
-  useEffect(() => {
-    setMounted(true);
-  }, []);
+  const queryClient = useQueryClient();
 
   useEffect(() => {
     const refresh = () => {
-      (workspacesCollection as any).utils?.refetch?.();
+      void queryClient.invalidateQueries({ queryKey: WORKSPACES_QUERY_KEY });
     };
     window.addEventListener("workspace-created", refresh);
     window.addEventListener("workspace-deleted", refresh);
@@ -133,7 +131,7 @@ export function NavWorkspace() {
       window.removeEventListener("workspace-updated", refresh);
       window.removeEventListener("workspace-pinned", refresh);
     };
-  }, []);
+  }, [queryClient]);
 
   if (isCollapsed) {
     return (
@@ -173,7 +171,7 @@ export function NavWorkspace() {
           <Plus className="size-3.5" />
         </button>
       </div>
-      {mounted && <WorkspaceLinks pathname={pathname} />}
+      <WorkspaceLinks pathname={pathname} />
       <CreateWorkspaceDialog open={createOpen} onOpenChange={setCreateOpen} />
     </SidebarGroup>
   );

package/src/components/shared-kit/avatars/notion-avatar.tsx

@@ -19,6 +19,7 @@
 
 import { useEffect, useState } from "react"
 import type { AvatarConfig, AvatarPart, ShapeType } from "@allbluecn/kernel"
+import { sanitizeSvg } from "../../../lib/sanitize"
 
 const noneParts: AvatarPart[] = ["glasses", "hair", "accessories", "details", "beard"]
 
@@ -120,7 +121,7 @@ export function NotionAvatar({
         aspectRatio: "1 / 1",
         ...style,
       }}
-      dangerouslySetInnerHTML={{ __html: svgContent }}
+      dangerouslySetInnerHTML={{ __html: sanitizeSvg(svgContent) }}
     />
   )
 }

package/src/components/shared-kit/icons/__tests__/lucide-curated-icons.test.ts

@@ -35,8 +35,8 @@ const NUMBER_TAIL_ALLOWLIST = new Set([
 ]);
 
 describe("CURATED_ICONS 精选名单完整性", () => {
-  it("数量在目标区间 400-520", () => {
-    expect(CURATED_ICONS.length).toBeGreaterThanOrEqual(400);
+  it("数量在目标区间 380-520", () => {
+    expect(CURATED_ICONS.length).toBeGreaterThanOrEqual(380);
     expect(CURATED_ICONS.length).toBeLessThanOrEqual(520);
   });
 

package/src/components/shared-kit/icons/__tests__/lucide-icon-picker.test.tsx

@@ -34,11 +34,12 @@ describe("LucideIconByName", () => {
     expect(svg?.innerHTML).toContain("<path");
   });
 
-  it("精选外/未知 name 渲染 fallback（默认 Circle 占位）", () => {
+  it("精选外/未知 name 渲染默认占位图标（FaceSlightlySmilingPlus）", () => {
     const { container } = render(<LucideIconByName name="not-exist-icon" />);
     const svg = container.querySelector("svg");
     expect(svg).toBeTruthy();
-    expect(svg?.innerHTML).toContain("<circle");
+    expect(svg?.getAttribute("class")).toContain("lucide-face-slightly-smiling-plus");
+    expect(svg?.innerHTML).toContain("<path");
   });
 
   it("undefined name 渲染 fallback", () => {

package/src/components/shared-kit/icons/lucide-icon-picker/curated-icons.ts

@@ -20,7 +20,7 @@
 // 机械禁则由 lucide-curated-icons.test.ts 强制校验。
 
 import {
-  Accessibility, Activity, Ambulance, Ampersand, Anchor, Angry, Aperture, Archive, ArrowDown, ArrowDownLeft,
+  Accessibility, Activity, Ambulance, Ampersand, Anchor, Aperture, Archive, ArrowDown, ArrowDownLeft,
   ArrowDownRight, ArrowLeft, ArrowRight, ArrowUp, ArrowUpLeft, ArrowUpRight, Asterisk, AtSign, Atom, AudioLines,
   Award, BadgeCheck, Bandage, Banknote, Barcode, Bath, Battery, BatteryCharging, Bed, BedDouble,
   Beer, Bell, BellPlus, BellRing, Bike, Binary, Binoculars, Bird, Bold, Book,
@@ -35,15 +35,15 @@ import {
   EthernetPort, ExternalLink, Eye, Factory, FastForward, File, FileArchive, FileBadge, FileBox, FileCheck,
   FileClock, FileCode, FilePlus, FileText, Files, Film, Fish, Flag, FlaskConical, Flower,
   Folder, FolderCheck, FolderClock, FolderClosed, FolderCode, FolderGit, FolderHeart, FolderKanban, FolderOpen, FolderPlus,
-  FolderRoot, FolderSearch, FolderSync, FolderTree, Frown, Funnel, Gamepad, Gauge, Gift, Ghost,
+  FolderRoot, FolderSearch, FolderSync, FolderTree, Funnel, Gamepad, Gauge, Gift, Ghost,
   GitBranch, GitCommitHorizontal, GitCommitVertical, GitCompare, GitFork, GitGraph, GitMerge, Globe, GraduationCap, Grid2x2Check,
   Grid2x2Plus, Guitar, Hammer, HardDrive, Hash, Headphones, Headset, Heart, HeartPulse, Helicopter,
   Hexagon, Hospital, Hourglass, IdCard, Image, ImageDown, ImagePlus, ImageUp, Images, Inbox,
   Infinity, Info, Italic, Joystick, Key, KeyRound, Keyboard, Lamp, Landmark, Laptop,
-  Laugh, Layers, LayoutDashboard, LayoutFreeform, LayoutGrid, LayoutList, LayoutPanelLeft, LayoutTemplate, Leaf, Library,
+  Layers, LayoutDashboard, LayoutFreeform, LayoutGrid, LayoutList, LayoutPanelLeft, LayoutTemplate, Leaf, Library,
   Lightbulb, Link, List, ListChecks, ListOrdered, Loader, LoaderCircle, LoaderPinwheel, LocateFixed, Lock,
   LogIn, LogOut, Luggage, Mail, MailCheck, MailOpen, MailPlus, MailSearch, MailWarning, Mailbox,
-  Map, MapPin, Medal, Megaphone, Meh, MessageCircle, MessageCircleCheck, MessageCircleHeart, MessageCircleMore, MessageCirclePlus,
+  Map, MapPin, Medal, Megaphone, MessageCircle, MessageCircleCheck, MessageCircleHeart, MessageCircleMore, MessageCirclePlus,
   MessageCircleQuestionMark, MessageSquare, MessageSquareCheck, MessageSquareCode, MessageSquareLock, MessagesSquare, Mic, Microscope, Minus, Monitor,
   Moon, Mountain, MountainSnow, Mouse, MousePointer, MousePointerClick, Music, Navigation, Network, Newspaper,
   Nfc, Octagon, PaintBucket, Paintbrush, Palette, PanelTop, PartyPopper, Pause, PenLine, PenTool,
@@ -52,7 +52,7 @@ import {
   Reply, Rewind, Rocket, Route, Sailboat, Satellite, Save, Scan, ScanBarcode, ScanFace,
   ScanLine, ScanSearch, ScanText, School, Search, SearchAlert, SearchCode, Send, Server, Shapes,
   Shield, ShieldAlert, ShieldCheck, Ship, ShoppingBag, ShoppingBasket, ShoppingCart, Sigma, Signal, Signpost,
-  Siren, SkipBack, SkipForward, Slash, SlidersHorizontal, Smartphone, Smile, Skull, Snowflake, Sofa,
+  Siren, SkipBack, SkipForward, Slash, SlidersHorizontal, Smartphone, Skull, Snowflake, Sofa,
   Spade, Sparkles, Spline, Sprout, Square, SquarePen, SquareTerminal, Stamp, Star, StarCheck,
   StarHalf, StarMinus, StarPlus, Stethoscope, Store, Strikethrough, Sun, Sunrise, Sunset, SwatchBook,
   Syringe, Table, TableOfContents, Tablet, Tag, Tags, Target, Tent, Terminal, TestTube,
@@ -391,11 +391,6 @@ export const CURATED_ICONS: CuratedIcon[] = [
     { name: "star-minus", Icon: StarMinus, zh: ["减星"] },
     { name: "star-plus", Icon: StarPlus, zh: ["加星"] },
     { name: "thumbs-down", Icon: ThumbsDown, zh: ["踩"] },
-    { name: "smile", Icon: Smile, zh: ["微笑"] },
-    { name: "frown", Icon: Frown, zh: ["愁眉"] },
-    { name: "meh", Icon: Meh, zh: ["一般"] },
-    { name: "laugh", Icon: Laugh, zh: ["大笑"] },
-    { name: "angry", Icon: Angry, zh: ["愤怒"] },
     { name: "map", Icon: Map, zh: ["地图"] },
     { name: "map-pin", Icon: MapPin, zh: ["地图钉"] },
     { name: "navigation", Icon: Navigation, zh: ["导航"] },

package/src/components/shared-kit/icons/lucide-icon-picker/lucide-icon-by-name.tsx

@@ -16,7 +16,7 @@
 // along with this program. If not, see <https://www.gnu.org/licenses/>.
 
 import type { ReactNode } from "react";
-import { Smile } from "lucide-react";
+import { FaceSlightlySmilingPlus } from "lucide-react";
 import { cn } from "@/lib/utils";
 import { CURATED_ICON_MAP } from "./curated-icons";
 import { pascalToKebab } from "./icon-data";
@@ -48,7 +48,7 @@ interface LucideIconByNameProps {
   name?: string;
   size?: number;
   className?: string;
-  /** 默认：Smile 微笑脸（未选择图标时的占位） */
+  /** 默认：FaceSlightlySmilingPlus 微笑脸（未选择图标时的占位） */
   fallback?: ReactNode;
 }
 
@@ -64,7 +64,7 @@ export function LucideIconByName({
     return (
       <>
         {fallback ?? (
-          <Smile
+          <FaceSlightlySmilingPlus
             size={size}
             aria-hidden
             className={cn("text-muted-foreground", className)}

package/src/components/shared-kit/theme/theme-surface.tsx

@@ -0,0 +1,52 @@
+// SPDX-License-Identifier: AGPL-3.0-or-later
+// AllBlue - 理想之海
+// Copyright (C) 2026 AllBlue Contributors
+//
+// This program is free software: you can redistribute it and/or modify
+// it under the terms of the GNU Affero General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// This program is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU Affero General Public License for more details.
+//
+// You should have received a copy of the GNU Affero General Public License
+// along with this program. If not, see <https://www.gnu.org/licenses/>.
+
+// 测试专用样板组件：VRT 视觉回归基线的主题表面聚合。
+// 不接入任何路由，不加入 shared-kit/index.ts 导出（避免被产品代码误引用）。
+// 文案为测试样板硬编码中文（不出现在产品 UI），豁免 i18n。
+
+"use client"
+
+import { Button } from "@/components/ui/button"
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
+import { Input } from "@/components/ui/input"
+import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip"
+
+export function ThemeSurface() {
+  return (
+    <div data-testid="theme-surface" className="bg-background text-foreground p-6 space-y-4 w-96">
+      <Card>
+        <CardHeader><CardTitle className="text-base">语义色表面</CardTitle></CardHeader>
+        <CardContent className="space-y-3">
+          <Input placeholder="输入框 placeholder" />
+          <div className="flex gap-2">
+            <Button size="sm">主按钮</Button>
+            <Button size="sm" variant="secondary">次按钮</Button>
+            <Button size="sm" variant="destructive">危险</Button>
+            <Tooltip>
+              <TooltipTrigger asChild>
+                <Button size="sm" variant="outline">带提示</Button>
+              </TooltipTrigger>
+              <TooltipContent>工具提示内容</TooltipContent>
+            </Tooltip>
+          </div>
+          <div className="rounded-lg border bg-muted p-3 text-sm text-muted-foreground">muted 区域</div>
+        </CardContent>
+      </Card>
+    </div>
+  )
+}

package/src/components/story/relations/general-groups.ts

@@ -1,15 +1 @@
-import { m } from '@/paraglide/messages.js'
-
-const GROUP_LABELS: Record<string, () => string> = {
-  legal: m.story_knowledgeDialog_groupLegal,
-  compliance: m.story_knowledgeDialog_groupCompliance,
-  dictionary: m.story_knowledgeDialog_groupDictionary,
-  bookmark: m.story_knowledgeDialog_groupBookmark,
-  summary: m.story_knowledgeDialog_groupSummary,
-}
-
-/** 通用知识库分组 key → 标签（未知 key 原样返回） */
-export function generalGroupLabel(group: string): string {
-  const labelFn = GROUP_LABELS[group]
-  return labelFn ? labelFn() : group
-}
+export { generalGroupLabel } from "@/components/knowledge/general-groups";

package/src/components/story/relations/knowledge-select-dialog.tsx

@@ -18,7 +18,7 @@
 import * as React from "react";
 import { useServerFn } from "@tanstack/react-start";
 import { toast } from "sonner";
-import { BookMarked, BookOpenText, Bookmark, Check, ChevronsUpDown, Scale, ShieldCheck, Sprout } from "lucide-react";
+import { BookOpenText, BookMarked, Bookmark, Check, Scale, ShieldCheck, Sprout } from "lucide-react";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Badge } from "@/components/ui/badge";
@@ -40,6 +40,7 @@ import {
   type SearchDocRow,
 } from "@/server/serverFns/story";
 import { generalGroupLabel } from "./general-groups";
+import { KbFilterPopover, type KbFilter } from "@/components/knowledge/kb-filter-popover";
 import type { DocBrief } from "../types";
 import { m } from "@/paraglide/messages.js";
 
@@ -50,24 +51,6 @@ interface KbBrief {
   visibility: string;
 }
 
-type KbFilter = { type: "kb"; id: string } | { type: "general"; group: string } | null;
-
-const GENERAL_GROUP_ICONS: Record<string, React.ComponentType<{ className?: string }>> = {
-  legal: Scale,
-  compliance: ShieldCheck,
-  dictionary: BookMarked,
-  bookmark: Bookmark,
-  summary: Sprout,
-};
-
-const GENERAL_GROUP_META = [
-  { key: "legal" },
-  { key: "compliance" },
-  { key: "dictionary" },
-  { key: "bookmark" },
-  { key: "summary" },
-] as const;
-
 export interface KnowledgeSelectDialogProps {
   open: boolean;
   onOpenChange: (open: boolean) => void;
@@ -98,7 +81,6 @@ export function KnowledgeSelectDialog({
   const [selected, setSelected] = React.useState<Set<string>>(new Set());
   const [loading, setLoading] = React.useState(false);
   const [submitting, setSubmitting] = React.useState(false);
-  const [kbPopoverOpen, setKbPopoverOpen] = React.useState(false);
 
   const linkedIds = React.useMemo(() => new Set(linkedDocs.map((d) => d.id)), [linkedDocs]);
 
@@ -156,7 +138,6 @@ export function KnowledgeSelectDialog({
 
   const handleKbSelect = (filter: KbFilter) => {
     setKbFilter(filter);
-    setKbPopoverOpen(false);
     void loadDocs(filter, search);
   };
 
@@ -281,7 +262,6 @@ export function KnowledgeSelectDialog({
     }
   };
 
-  const activeKb = kbFilter?.type === "kb" ? kbs.find((k) => k.id === kbFilter.id) : undefined;
 
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
@@ -290,71 +270,17 @@ export function KnowledgeSelectDialog({
           <DialogTitle>{m.story_knowledgeDialog_title()}</DialogTitle>
         </DialogHeader>
 
-        <div className="flex items-center gap-2">
-          <Input
-            placeholder={m.story_knowledgeDialog_searchPlaceholder()}
-            value={search}
-            onChange={(e) => handleSearch(e.target.value)}
-            className="h-8"
-          />
-          <Popover open={kbPopoverOpen} onOpenChange={setKbPopoverOpen}>
-            <PopoverTrigger asChild>
-              <Button variant="outline" size="sm" className="h-8 shrink-0 gap-1">
-                <BookOpenText className="size-3.5" />
-                {activeKb
-                  ? activeKb.name
-                  : kbFilter?.type === "general"
-                    ? generalGroupLabel(kbFilter.group)
-                    : m.story_knowledgeDialog_allKbs()}
-                <ChevronsUpDown className="size-3.5 opacity-50" />
-              </Button>
-            </PopoverTrigger>
-            <PopoverContent align="end" className="w-60 p-1">
-              <button
-                type="button"
-                className="flex w-full items-center justify-between rounded-sm px-2 py-1.5 mt-1 text-sm hover:bg-muted"
-                onClick={() => handleKbSelect(null)}
-              >
-                {m.story_knowledgeDialog_allKbs()}
-                {kbFilter === null && <Check className="size-3.5" />}
-              </button>
-              <div className="border-t px-2 pt-3 text-xs font-medium text-muted-foreground">
-                {m.story_knowledgeDialog_userKbs()}
-              </div>
-              {kbs.map((kb) => (
-                <button
-                  key={kb.id}
-                  type="button"
-                  className="flex w-full items-center justify-between rounded-sm px-2 py-1.5 text-sm hover:bg-muted"
-                  onClick={() => handleKbSelect({ type: "kb", id: kb.id })}
-                >
-                  <span className="truncate">{kb.name}</span>
-                  {kbFilter?.type === "kb" && kbFilter.id === kb.id && <Check className="size-3.5" />}
-                </button>
-              ))}
-              <div className=" border-t px-2 pt-3 text-xs font-medium text-muted-foreground">
-                {m.story_knowledgeDialog_generalKbs()}
-              </div>
-              {GENERAL_GROUP_META.map((group) => {
-                const Icon = GENERAL_GROUP_ICONS[group.key];
-                return (
-                  <button
-                    key={group.key}
-                    type="button"
-                    className="flex w-full items-center justify-between rounded-sm px-2 py-1.5 text-sm hover:bg-muted"
-                    onClick={() => handleKbSelect({ type: "general", group: group.key })}
-                  >
-                    <span className="flex min-w-0 items-center gap-2">
-                      <Icon className="size-3.5 shrink-0 text-muted-foreground" />
-                      <span className="truncate">{generalGroupLabel(group.key)}</span>
-                    </span>
-                    {kbFilter?.type === "general" && kbFilter.group === group.key && <Check className="size-3.5" />}
-                  </button>
-                );
-              })}
-            </PopoverContent>
-          </Popover>
-        </div>
+        <KbFilterPopover
+          search={search}
+          onSearchChange={handleSearch}
+          filter={kbFilter}
+          onFilterChange={(f) => { setKbFilter(f); void loadDocs(f, search); }}
+          userKbs={kbs}
+          searchPlaceholder={m.story_knowledgeDialog_searchPlaceholder()}
+          allLabel={m.story_knowledgeDialog_allKbs()}
+          userKbsLabel={m.story_knowledgeDialog_userKbs()}
+          generalKbsLabel={m.story_knowledgeDialog_generalKbs()}
+        />
 
         <div className="h-80 overflow-y-auto rounded-md border p-1">
           {loading ? (

package/src/components/story/story-list-view.tsx

@@ -79,7 +79,13 @@ export function StoryListView({ stories: initialStories, users: initialUsers, pr
   const [users, setUsers] = useState<UserBrief[]>(initialUsers);
   const [projectId, setProjectId] = useState<string | undefined>(() => {
     try {
-      return localStorage.getItem(STORY_PROJECT_FILTER_KEY) ?? undefined;
+      const stored = localStorage.getItem(STORY_PROJECT_FILTER_KEY) ?? undefined;
+      // 清理过期残留（项目已删除或 localStorage 跨账号残留），避免列表查询空集
+      if (stored && stored !== "__archived__" && !initialProjects.some((p) => p.id === stored)) {
+        localStorage.removeItem(STORY_PROJECT_FILTER_KEY);
+        return undefined;
+      }
+      return stored;
     } catch {
       return undefined;
     }

package/src/components/tiptap/node/table-node/ui/table-move-row-column-button/use-table-move-row-column.ts

@@ -315,8 +315,6 @@ function tableMoveRowColumn({
     const moveOperation =
       finalOrientation === "row" ? moveTableRow : moveTableColumn
 
-    console.log({ from, to, finalOrientation, direction })
-
     const dispatch = (tr: Transaction) => editor.view.dispatch(tr)
 
     if (editor.state.selection instanceof CellSelection) {

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

@@ -0,0 +1,36 @@
+import { describe, it, expect, vi } from "vitest";
+import { render, screen } from "@testing-library/react";
+import { WorkspaceActivityCard } from "../../activity/workspace-activity-card";
+
+vi.mock("@/components/project/project-activity-list", () => ({
+  ProjectActivityList: ({ activities }: { activities: any[] }) => (
+    <ul data-testid="activity-list">
+      {activities.map((a: any) => (
+        <li key={a.id}>{a.action}</li>
+      ))}
+    </ul>
+  ),
+}));
+
+vi.mock("@tanstack/react-router", () => ({
+  Link: ({ children }: any) => <a>{children}</a>,
+}));
+
+describe("WorkspaceActivityCard", () => {
+  it("渲染活动列表", () => {
+    const ACTIVITIES = [
+      {
+        id: "a1",
+        action: "创建项目",
+        projectId: "p1",
+        userId: "u1",
+        targetType: null,
+        targetId: null,
+        metadata: {},
+        createdAt: new Date(),
+      },
+    ];
+    render(<WorkspaceActivityCard activities={ACTIVITIES} workspaceId="ws1" />);
+    expect(screen.getByTestId("activity-list")).toBeInTheDocument();
+  });
+});

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

@@ -0,0 +1,17 @@
+import { describe, it, expect } from "vitest";
+import { render, screen } from "@testing-library/react";
+import { WorkspaceContributionCard } from "../../contribution/workspace-contribution-card";
+
+vi.mock("@/components/shared-kit/data-viz/contribution-graph-tooltip", () => ({
+  ContributionGraphWithTooltip: ({ title }: { title: string }) => (
+    <div data-testid="contribution-graph">{title}</div>
+  ),
+}));
+
+describe("WorkspaceContributionCard", () => {
+  it("渲染贡献图卡片", () => {
+    const data = [{ date: "2024-01-01", count: 5, level: 3 }];
+    render(<WorkspaceContributionCard data={data} />);
+    expect(screen.getByTestId("contribution-graph")).toBeInTheDocument();
+  });
+});

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

@@ -0,0 +1,63 @@
+import { describe, it, expect, vi } from "vitest";
+import { render, screen } from "@testing-library/react";
+import { CreateWorkspaceDialog } from "../../dialogs/create-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() }),
+  Link: ({ children }: any) => <a>{children}</a>,
+}));
+
+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("CreateWorkspaceDialog", () => {
+  it("打开时渲染标题", () => {
+    render(<CreateWorkspaceDialog open={true} onOpenChange={() => {}} />);
+    expect(screen.getByRole("heading")).toBeInTheDocument();
+  });
+});