@allbluecn/web-app 0.3.0

package/src/components/story/transfer-story-popover.tsx

@@ -0,0 +1,261 @@
+// 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/>.
+
+import { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { GitCompareArrows, GitPullRequest, Check } from "lucide-react";
+import { ProjectIconDisplay } from "@/components/project/project-icon";
+import { Button } from "@/components/ui/button";
+import { Separator } from "@/components/ui/separator";
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipTrigger,
+} from "@/components/ui/tooltip";
+import {
+  Popover,
+  PopoverContent,
+  PopoverTrigger,
+} from "@/components/ui/popover";
+import { toast } from "sonner";
+import { transferStoryToProjectFn, transferStoryAsChildFn } from "@/server/serverFns/story";
+import { StorySelectDialog } from "./inline-editors/story-select-dialog";
+
+interface TransferStoryPopoverProps {
+  storyId?: string;
+  storyIds?: string[];
+  currentProjectId?: string | null;
+  projects: { id: string; name: string; displayId?: string | null; icon: string }[];
+  onTransferred: (updatedStories?: Array<{ id: string; identifier: string; projectId: string; parentId: string | null }>) => void;
+  trigger?: React.ReactNode;
+}
+
+type TransferredStory = { id: string; identifier: string; projectId: string; parentId: string | null };
+
+export function TransferStoryPopover({
+  storyId,
+  storyIds = [],
+  currentProjectId,
+  projects,
+  onTransferred,
+  trigger,
+}: TransferStoryPopoverProps) {
+  const { t } = useTranslation("story");
+  const isBatch = storyIds.length > 0;
+  const singleStoryId = storyId ?? (storyIds[0] ?? "");
+  const [open, setOpen] = useState(false);
+  const [dialogOpen, setDialogOpen] = useState(false);
+  const [selectedProjectId, setSelectedProjectId] = useState<string | null>(null);
+  const [submitting, setSubmitting] = useState(false);
+
+  const otherProjects = projects.filter((p) => p.id !== currentProjectId);
+  const currentProjectName = currentProjectId
+    ? projects.find((p) => p.id === currentProjectId)?.name ?? ""
+    : "";
+  const filteredTip = isBatch && currentProjectId && currentProjectName
+    ? t("transfer.filteredTip", { count: storyIds.length, project: currentProjectName })
+    : undefined;
+
+  const handleOpenChange = (next: boolean) => {
+    setOpen(next);
+    if (next) setSelectedProjectId(null);
+  };
+
+  const handleConfirmTransfer = async () => {
+    if (!selectedProjectId) return;
+    setSubmitting(true);
+    try {
+      const updated: Array<{ id: string; identifier: string; projectId: string; parentId: string | null }> = [];
+      if (isBatch) {
+        let success = 0;
+        let failed = 0;
+        for (const id of storyIds) {
+          try {
+            const result = await transferStoryToProjectFn({
+              data: { storyId: id, targetProjectId: selectedProjectId },
+            });
+            updated.push({
+              id: (result as any).id,
+              identifier: (result as any).identifier,
+              projectId: (result as any).projectId,
+              parentId: (result as any).parentId,
+            });
+            success++;
+          } catch {
+            failed++;
+          }
+        }
+        if (failed > 0) {
+          toast.error(t("transfer.doneWithFailures", { success, failed }));
+        } else {
+          toast.success(t("transfer.transferredToProject", { count: success }));
+        }
+      } else {
+        const result = await transferStoryToProjectFn({
+          data: { storyId: singleStoryId, targetProjectId: selectedProjectId },
+        });
+        updated.push({
+          id: (result as any).id,
+          identifier: (result as any).identifier,
+          projectId: (result as any).projectId,
+          parentId: (result as any).parentId,
+        });
+        toast.success(t("transfer.transferred"));
+      }
+      setOpen(false);
+      onTransferred(updated);
+    } catch (e) {
+      toast.error(e instanceof Error ? e.message : t("transfer.failed"));
+    } finally {
+      setSubmitting(false);
+    }
+  };
+
+  const handleTransferAsChild = (parentStoryId: string) => {
+    void (async () => {
+      setSubmitting(true);
+      let success = 0;
+      let failed = 0;
+      for (const id of storyIds) {
+        try {
+          await transferStoryAsChildFn({
+            data: { storyId: id, parentStoryId: parentStoryId },
+          });
+          success++;
+        } catch {
+          failed++;
+        }
+      }
+      setSubmitting(false);
+      if (failed > 0) {
+        toast.error(t("transfer.doneWithFailures", { success, failed }));
+      } else {
+        toast.success(t("transfer.asChildDone", { count: success }));
+      }
+      onTransferred();
+    })();
+  };
+
+  return (
+    <>
+      <Popover open={open} onOpenChange={handleOpenChange}>
+        <Tooltip>
+          <TooltipTrigger asChild>
+            <PopoverTrigger asChild>
+              {trigger ?? (
+                <Button
+                  variant="ghost"
+                  size="icon"
+                  className="size-8"
+                  aria-label={t("transfer.transfer")}
+                >
+                  <GitCompareArrows className="size-4" />
+                </Button>
+              )}
+            </PopoverTrigger>
+          </TooltipTrigger>
+          <TooltipContent>
+            {isBatch ? t("transfer.transferCount", { count: storyIds.length }) : t("transfer.transfer")}
+          </TooltipContent>
+        </Tooltip>
+        <PopoverContent align="end" className="w-64 p-1.5">
+            <div className="px-2 py-1.5 text-xs font-medium text-muted-foreground">
+              {isBatch ? t("transfer.toProjectCount", { count: storyIds.length }) : t("transfer.toProject")}
+            </div>
+            <div className="max-h-48 overflow-y-auto [&>button+button]:mt-1">
+              {otherProjects.length === 0 ? (
+                <div className="py-6 text-center text-sm text-muted-foreground">
+                  {t("transfer.noProjects")}
+                </div>
+              ) : (
+                otherProjects.map((p) => {
+                  const isSelected = selectedProjectId === p.id;
+                  return (
+                    <button
+                      key={p.id}
+                      type="button"
+                      onClick={() => setSelectedProjectId(p.id)}
+                      disabled={submitting}
+                      className={`flex w-full items-center gap-2.5 rounded-md px-2 py-1.5 text-left text-sm transition-colors disabled:opacity-50 ${
+                        isSelected ? "bg-accent" : "hover:bg-muted"
+                      }`}
+                    >
+                      <ProjectIconDisplay name={p.icon} size={16} />
+                      <span className="min-w-0 flex-1 truncate">{p.name}</span>
+                      {p.displayId && (
+                        <span className="shrink-0 rounded-sm bg-muted px-1.5 py-0.5 text-[10px] font-normal text-muted-foreground">
+                          {p.displayId}
+                        </span>
+                      )}
+                      {isSelected && (
+                        <Check className="size-3.5 shrink-0 text-primary" />
+                      )}
+                    </button>
+                  );
+                })
+              )}
+            </div>
+            <Separator orientation="horizontal" data-horizontal className="-my-1" />
+            <div className="grid grid-cols-2 gap-1.5">
+              <Button
+                type="button"
+                variant="outline"
+                size="sm"
+                className="h-8 justify-center gap-1.5"
+                onClick={() => {
+                  setOpen(false);
+                  setDialogOpen(true);
+                }}
+                disabled={projects.length === 0}
+              >
+                <GitPullRequest className="size-3.5" />
+                {t("transfer.asChild")}
+              </Button>
+              <Button
+                type="button"
+                size="sm"
+                className="h-8 justify-center gap-1.5"
+                onClick={handleConfirmTransfer}
+                disabled={!selectedProjectId || submitting}
+              >
+                {!submitting && <Check className="size-3.5" />}
+                {submitting ? t("transfer.transferring") : t("transfer.confirm")}
+              </Button>
+            </div>
+          </PopoverContent>
+      </Popover>
+
+      <StorySelectDialog
+        open={dialogOpen}
+        onOpenChange={(v) => !submitting && setDialogOpen(v)}
+        storyId={singleStoryId}
+        projects={projects}
+        title={t("transfer.asChildOfProject")}
+        excludeProjectIds={currentProjectId ? [currentProjectId] : []}
+        hideAllProjects
+        filteredTip={filteredTip}
+        onSelected={(parent) => {
+          if (typeof parent === "string") {
+            handleTransferAsChild(parent);
+          } else if (Array.isArray(parent) && parent.length > 0) {
+            handleTransferAsChild(parent[0]);
+          }
+        }}
+      />
+    </>
+  );
+}

package/src/components/story/types.ts

@@ -0,0 +1,195 @@
+// 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/>.
+
+import type { StoryState, StoryPriority } from "./constants";
+import type { AvatarConfig } from "@allbluecn/shared";
+
+export interface UserBrief {
+  id: string;
+  username: string;
+  email: string;
+  avatarConfig: AvatarConfig | null;
+  bgShape: string | null;
+  bgColor: string | null;
+}
+
+export interface StoryLabelBrief {
+  labelId: string;
+  label: { id: string; name: string; color: string };
+}
+
+export interface StoryListItem {
+  id: string;
+  identifier: string;
+  name: string;
+  description: string | null;
+  state: StoryState;
+  priority: StoryPriority;
+  archived: boolean;
+  startDate: string | null;
+  targetDate: string | null;
+  boardOrder: number;
+  projectId: string | null;
+  parentId: string | null;
+  parent: { id: string; title: string; status: StoryState; identifier?: string } | null;
+  assignee: UserBrief | null;
+  createdBy: UserBrief;
+  labels: { id: string; name: string; color: string }[];
+  createdAt: string;
+  updatedAt: string;
+}
+
+export interface StoryDetail extends StoryListItem {
+  sequenceId: number;
+  description: string | null;
+  updatedBy: UserBrief | null;
+  parentId: string | null;
+  parent: StoryBrief | null;
+}
+
+export interface ReactionGroup {
+  emoji: string;
+  count: number;
+  userIds: string[];
+  reacted: boolean;
+}
+
+export interface CommentWithReplies {
+  id: string;
+  content: string;
+  user: UserBrief;
+  parentId: string | null;
+  reactions: ReactionGroup[];
+  replies: CommentWithReplies[];
+  createdAt: string;
+  updatedAt: string;
+}
+
+export interface ActivityItem {
+  id: string;
+  user: UserBrief;
+  action: string;
+  field: string | null;
+  oldValue: string | null;
+  newValue: string | null;
+  createdAt: string;
+  isAI: boolean;
+}
+
+// ====== P3：关联关系类型 ======
+
+// 需求描述 JSON 格式：NotionDocEditor 输出 { html, markdown }，存入 DB 为 JSON 字符串
+export interface StoryDescriptionContent {
+  html: string;
+  markdown: string;
+}
+
+export function parseStoryDescription(desc: string | null | undefined): StoryDescriptionContent {
+  if (!desc) return { html: "", markdown: "" };
+  try {
+    const parsed = JSON.parse(desc) as StoryDescriptionContent;
+    if (typeof parsed.html === "string" && typeof parsed.markdown === "string") return parsed;
+  } catch {}
+  return { html: desc, markdown: desc };
+}
+
+export function serializeStoryDescription(html: string, markdown: string): string {
+  return JSON.stringify({ html, markdown });
+}
+
+// 依赖类型
+export type DependencyType = "blocks" | "blocked_by" | "relates_to";
+
+// Story 简要信息（用于关联关系）
+export interface StoryBrief {
+  id: string;
+  title: string;
+  status: StoryState;
+  identifier?: string;
+}
+
+// 父子树节点
+export interface StoryTreeNode {
+  id: string;
+  title: string;
+  status: StoryState;
+  parentId: string | null;
+  depth: number;
+  hasChildren: boolean;
+  childrenCount: number;
+  children?: StoryTreeNode[];
+}
+
+// 依赖项（去重）
+export interface DependencyItem {
+  id: string;
+  title: string;
+  status: StoryState;
+  type: DependencyType;
+}
+
+// 依赖分组
+export interface DependencyGroup {
+  blocking: DependencyItem[];
+  blockedBy: DependencyItem[];
+  relatesTo: DependencyItem[];
+}
+
+// 链接项
+export interface StoryLinkItem {
+  id: string;
+  url: string;
+  title: string | null;
+  description: string | null;
+}
+
+// 附件项
+export interface StoryAttachmentItem {
+  id: string;
+  fileName: string;
+  fileSize: number;
+  mimeType: string;
+  storageUrl: string;
+}
+
+// PRD 简要信息
+export interface PrdBrief {
+  id: string;
+  title: string;
+}
+
+// 文档简要信息
+export interface DocBrief {
+  id: string;
+  title: string;
+}
+
+// 关联 Tab 数据汇总
+export interface RelationsData {
+  hierarchy: {
+    parent: StoryBrief | null;
+    children: StoryListItem[];
+    hasChildren: boolean;
+  };
+  dependencies: DependencyGroup;
+  links: StoryLinkItem[];
+  attachments: StoryAttachmentItem[];
+  knowledge: {
+    prds: PrdBrief[];
+    docs: DocBrief[];
+  };
+}

package/src/components/story/views/__tests__/use-flat-rows.test.ts

@@ -0,0 +1,76 @@
+// 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/>.
+
+import { describe, expect, it } from "vitest";
+import { renderHook } from "@testing-library/react";
+import { useFlatRows } from "../use-flat-rows";
+import type { GroupNode } from "../../display/types";
+
+const story = (id: string) => ({ id }) as any;
+
+function makeGroup(key: string, label: string, subKeys: string[]): GroupNode {
+  return {
+    key,
+    label,
+    items: [story(`${key}-a`), story(`${key}-b`)],
+    subGroups: subKeys.map((sk) => ({
+      key: sk,
+      label: sk,
+      items: [story(`${key}/${sk}-1`)],
+    })),
+  };
+}
+
+describe("useFlatRows", () => {
+  it("同名子组 across 不同父组时 header key 唯一（路径 key）", () => {
+    const groups = [makeGroup("P1", "P1", ["子A", "子B"]), makeGroup("P2", "P2", ["子A"])];
+    const { result } = renderHook(() => useFlatRows(groups, {}));
+    const headers = result.current.filter((r) => r.kind === "header");
+    const keys = headers.map((r) => r.key);
+    expect(keys).toEqual(["P1", "P1/子A", "P1/子B", "P2", "P2/子A"]);
+    expect(new Set(keys).size).toBe(keys.length);
+  });
+
+  it("折叠状态按路径 key 隔离：折叠 P1/子A 不影响 P2/子A", () => {
+    const groups = [makeGroup("P1", "P1", ["子A"]), makeGroup("P2", "P2", ["子A"])];
+    const { result } = renderHook(() => useFlatRows(groups, { "P1/子A": true }));
+    const subA = result.current.filter((r) => r.kind === "header" && r.key.endsWith("/子A"));
+    expect(subA).toHaveLength(2);
+    expect(subA[0]).toMatchObject({ key: "P1/子A", isCollapsed: true });
+    expect(subA[1]).toMatchObject({ key: "P2/子A", isCollapsed: false });
+    const visibleKeys = result.current.map((r) => r.key);
+    expect(visibleKeys).toContain("P1/子A");
+    expect(visibleKeys).not.toContain("P1/子A-1");
+    expect(visibleKeys).toContain("P2/子A-1");
+  });
+
+  it("折叠状态隔离反向：折叠 P2/子A 不影响 P1/子A", () => {
+    const groups = [makeGroup("P1", "P1", ["子A"]), makeGroup("P2", "P2", ["子A"])];
+    const { result } = renderHook(() => useFlatRows(groups, { "P2/子A": true }));
+    const subA = result.current.filter((r) => r.kind === "header" && r.key.endsWith("/子A"));
+    expect(subA[0]).toMatchObject({ key: "P1/子A", isCollapsed: false });
+    expect(subA[1]).toMatchObject({ key: "P2/子A", isCollapsed: true });
+  });
+
+  it("裸 node.key 折叠不会命中路径 key（防止回退联动）", () => {
+    const groups = [makeGroup("P1", "P1", ["子A"]), makeGroup("P2", "P2", ["子A"])];
+    const bare = { "子A": true } as Record<string, boolean>;
+    const { result } = renderHook(() => useFlatRows(groups, bare));
+    const subA = result.current.filter((r) => r.kind === "header" && r.isCollapsed);
+    expect(subA).toHaveLength(0);
+  });
+});

package/src/components/story/views/__tests__/view-types.test.ts

@@ -0,0 +1,87 @@
+// 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/>.
+
+import { describe, it, expect } from "vitest";
+import {
+  DEFAULT_VIEW_ID,
+  getDefaultViewName,
+  VIEW_ICONS,
+  renderViewIcon,
+  buildDefaultView,
+  toSavedView,
+} from "../view-types";
+import { List, Flag } from "lucide-react";
+import { DEFAULT_DISPLAY_OPTIONS } from "../../display/types";
+
+describe("view-types", () => {
+  it("buildDefaultView 返回内置默认视图", () => {
+    const v = buildDefaultView();
+    expect(v.id).toBe(DEFAULT_VIEW_ID);
+    expect(v.name).toBe(getDefaultViewName());
+    expect(v.isBuiltIn).toBe(true);
+    expect(v.filterConditions).toEqual([]);
+    expect(v.displayOptions).toEqual(DEFAULT_DISPLAY_OPTIONS);
+    expect(v.projectId).toBeUndefined();
+    expect(v.icon).toBe("list");
+  });
+
+  it("renderViewIcon 命中返回对应组件，未命中回退 List", () => {
+    expect(renderViewIcon("flag")).toBe(Flag);
+    expect(renderViewIcon("list")).toBe(List);
+    expect(renderViewIcon("not-exist")).toBe(List);
+  });
+
+  it("VIEW_ICONS 至少 10 项且 name 唯一", () => {
+    expect(VIEW_ICONS.length).toBeGreaterThanOrEqual(10);
+    const names = VIEW_ICONS.map((v) => v.name);
+    expect(new Set(names).size).toBe(names.length);
+  });
+
+  it("toSavedView 把 DB 行映射为 SavedView，projectId null→undefined", () => {
+    const row = {
+      id: "abc",
+      name: "我的视图",
+      description: "desc",
+      icon: "flag",
+      projectId: null,
+      filters: [{ id: "f1", property: "state", operator: "is", value: "backlog" }],
+      displayOptions: { ...DEFAULT_DISPLAY_OPTIONS, groupBy: "priority" },
+    };
+    const v = toSavedView(row);
+    expect(v.id).toBe("abc");
+    expect(v.name).toBe("我的视图");
+    expect(v.description).toBe("desc");
+    expect(v.icon).toBe("flag");
+    expect(v.projectId).toBeUndefined();
+    expect(v.isBuiltIn).toBe(false);
+    expect(v.filterConditions).toHaveLength(1);
+    expect(v.displayOptions.groupBy).toBe("priority");
+  });
+
+  it("toSavedView 容错：非法 filters 回退空数组，displayOptions 损坏回退默认", () => {
+    const v = toSavedView({ id: "x", name: "n", description: null, icon: "", projectId: "p1", filters: "bad", displayOptions: null });
+    expect(v.filterConditions).toEqual([]);
+    expect(v.displayOptions).toEqual(DEFAULT_DISPLAY_OPTIONS);
+    expect(v.projectId).toBe("p1");
+    expect(v.icon).toBe("list");
+  });
+
+  it("toSavedView 过滤缺失 property/operator 的脏条件", () => {
+    const v = toSavedView({ id: "x", name: "n", description: null, icon: "list", projectId: null, filters: [{ id: "f", property: "state" }, { property: "state", operator: "is", value: "backlog" }], displayOptions: DEFAULT_DISPLAY_OPTIONS });
+    expect(v.filterConditions).toHaveLength(1);
+  });
+});