@allbluecn/web-app 0.5.0 → 0.6.0

package/src/server/serverFns/story/types.ts

@@ -21,6 +21,7 @@ import type { StoryState, StoryPriority } from "@/components/story/constants";
 import type {
   UserBrief,
   ReactionGroup,
+  ActivityItem,
 } from "@/components/story/types";
 
 export const USER_BRIEF_SELECT = {
@@ -74,6 +75,7 @@ export const STORY_LIST_SELECT_LIGHT = {
   labels: { select: { label: { select: { id: true, name: true, color: true } } } },
   createdAt: true,
   updatedAt: true,
+  iteration: { select: { id: true, name: true } },
 } satisfies Prisma.StoryDefaultArgs["select"];
 
 export type StoryListRow = Prisma.StoryGetPayload<{ select: typeof STORY_LIST_SELECT }>;
@@ -140,6 +142,42 @@ export function castUserBrief(u: {
   };
 }
 
+/** 活动记录 select（含 user brief），供 serverFn 返回新创建的活动给 UI 即时追加 */
+export const ACTIVITY_SELECT = {
+  id: true,
+  action: true,
+  field: true,
+  oldValue: true,
+  newValue: true,
+  isAI: true,
+  createdAt: true,
+  user: { select: USER_BRIEF_SELECT },
+} as const;
+
+export interface ActivityRow {
+  id: string;
+  action: string;
+  field: string | null;
+  oldValue: string | null;
+  newValue: string | null;
+  isAI: boolean;
+  createdAt: Date;
+  user: { id: string; username: string; email: string; avatarConfig: unknown; bgShape: string | null; bgColor: string | null };
+}
+
+export function toActivityItem(a: ActivityRow): ActivityItem {
+  return {
+    id: a.id,
+    action: a.action,
+    field: a.field,
+    oldValue: a.oldValue,
+    newValue: a.newValue,
+    isAI: a.isAI,
+    createdAt: a.createdAt.toISOString(),
+    user: castUserBrief(a.user),
+  };
+}
+
 export function aggregateReactions(
   reactions: { emoji: string; userId: string }[],
   currentUserId: string,

package/src/styles/globals.css

@@ -493,3 +493,28 @@ html.theme-transitioning *::after {
   height: 40px !important;
   border-radius: 20px !important;
 }
+
+/* 关联附件预览网格：笔记本4列，大屏(≥1536px)5列；4列时预览高度较矮 */
+.attachment-preview-grid {
+  grid-template-columns: repeat(4, minmax(0, 1fr));
+  --attachment-preview-h: 18rem;
+  --attachment-preview-h-sub: 9rem;
+}
+@media (min-width: 1536px) {
+  .attachment-preview-grid {
+    grid-template-columns: repeat(5, minmax(0, 1fr));
+    /* 5列（大屏）保持原高度（h-96 / h-48） */
+    --attachment-preview-h: 24rem;
+    --attachment-preview-h-sub: 12rem;
+  }
+}
+
+/* open-file-viewer 预览（FilePreview）：插件不支持的命令按钮处于 disabled 态，直接隐藏 */
+.ofv-preview-scope .ofv-toolbar button:disabled {
+  display: none;
+}
+/* open-file-viewer 预览（FilePreview）：默认隐藏 text/code 顶部标题栏，由组件切换类名显隐；
+   音频等类型的标题不隐藏 */
+.ofv-preview-title-hidden .ofv-code-header {
+  display: none;
+}

package/src/types/project.ts

@@ -82,7 +82,7 @@ export type ProjectModuleKey =
   | "bug"
   | "acceptance";
 
-// 板块概览（卡片网格用，mock）
+// 板块概览（卡片网格用，count/lastUpdatedAt 来自 getModuleOverviewFn）
 export interface ProjectModuleOverview {
   key: ProjectModuleKey;
   title: string;
@@ -92,12 +92,12 @@ export interface ProjectModuleOverview {
   lastUpdatedAt: Date | null;
 }
 
-// 板块列表项（mock，用于板块详情页）
+// 板块列表项（requirement 板块来自 listModuleStoriesFn，其余板块暂无数据源）
 export interface ProjectModuleItem {
   id: string;
   title: string;
-  status: string;
+  state: string;
   priority: string;
-  assignee?: string;
-  updatedAt: Date;
+  assignee?: string | null;
+  updatedAt: string;
 }

package/vite.shared.ts

@@ -160,6 +160,8 @@ export function createWebViteConfig(opts: WebViteConfigOptions) {
           '@allblue/devtools',
           '@allbluecn/plugins-core',
           '@allbluecn/tiptap',
+          '@open-file-viewer/core',
+          '@open-file-viewer/react',
         ],
       },
     }

package/src/components/project/project-animated-icon.tsx

@@ -1,73 +0,0 @@
-// 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 { ComponentType } from "react";
-import { FolderKanbanIcon } from "@/components/animated-icons/folder-kanban";
-import { BriefcaseBusinessIcon } from "@/components/animated-icons/briefcase-business";
-import { RocketIcon } from "@/components/animated-icons/rocket";
-import { FlaskIcon } from "@/components/animated-icons/flask";
-import { TerminalIcon } from "@/components/animated-icons/terminal";
-import { ContrastIcon } from "@/components/animated-icons/contrast";
-import { MessageSquareIcon } from "@/components/animated-icons/message-square";
-import { GraduationCapIcon } from "@/components/animated-icons/graduation-cap";
-import { HeartPulseIcon } from "@/components/animated-icons/heart-pulse";
-import { CartIcon } from "@/components/animated-icons/cart";
-import { LayersIcon } from "@/components/animated-icons/layers";
-import { UsersIcon } from "@/components/animated-icons/users";
-import { EarthIcon } from "@/components/animated-icons/earth";
-import { SparklesIcon } from "@/components/animated-icons/sparkles";
-import { CompassIcon } from "@/components/animated-icons/compass";
-import { ShieldCheckIcon } from "@/components/animated-icons/shield-check";
-import { cn } from "@/lib/utils";
-
-type AnimatedIconComp = ComponentType<{ size?: number; className?: string }>;
-
-// 项目动画图标映射（value 与 PROJECT_ICONS 一一对应）
-// 仅用于项目详情页顶部展示，其他位置用 ProjectIconDisplay（静态）
-const ANIMATED_MAP: Record<string, AnimatedIconComp> = {
-  "folder-kanban": FolderKanbanIcon,
-  "briefcase-business": BriefcaseBusinessIcon,
-  rocket: RocketIcon,
-  flask: FlaskIcon,
-  terminal: TerminalIcon,
-  contrast: ContrastIcon,
-  "message-square": MessageSquareIcon,
-  "graduation-cap": GraduationCapIcon,
-  "heart-pulse": HeartPulseIcon,
-  cart: CartIcon,
-  layers: LayersIcon,
-  users: UsersIcon,
-  earth: EarthIcon,
-  sparkles: SparklesIcon,
-  compass: CompassIcon,
-  "shield-check": ShieldCheckIcon,
-};
-
-interface ProjectAnimatedIconProps {
-  name?: string;
-  size?: number;
-  className?: string;
-}
-
-export function ProjectAnimatedIcon({
-  name,
-  size = 24,
-  className,
-}: ProjectAnimatedIconProps) {
-  const Icon = ANIMATED_MAP[name ?? ""] ?? FolderKanbanIcon;
-  return <Icon size={size} className={cn(className)} />;
-}

package/src/components/shared/icon-packs/index.ts

@@ -1 +0,0 @@
-export * from '@allbluecn/ui/icon-packs'

package/src/components/shared/icon-packs/knowledge.ts

@@ -1 +0,0 @@
-export * from '@allbluecn/ui/icon-packs/knowledge'

package/src/components/shared/icon-packs/prd.ts

@@ -1 +0,0 @@
-export * from '@allbluecn/ui/icon-packs/prd'

package/src/components/shared/icon-packs/project.ts

@@ -1 +0,0 @@
-export * from '@allbluecn/ui/icon-packs/project'

package/src/components/shared/icon-picker.tsx

@@ -1 +0,0 @@
-export * from '@allbluecn/ui/icon-picker'

package/src/components/story/detail/story-detail-toolbar/attachments.tsx

@@ -1,73 +0,0 @@
-// 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 { Paperclip } from "lucide-react";
-import { useTranslation } from "react-i18next";
-import { Button } from "@/components/ui/button";
-import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover";
-import { AttachmentsPanel } from "../../relations/attachments-panel";
-import type { RelationsData } from "../../types";
-
-export function StoryDetailAttachments({
-  storyId,
-  data,
-  onRefresh,
-}: {
-  storyId: string;
-  data: RelationsData;
-  onRefresh: (next: (prev: RelationsData) => RelationsData) => void;
-}) {
-  const { t } = useTranslation("story");
-  const count = data.attachments.length;
-
-  return (
-    <Popover>
-      <PopoverTrigger asChild>
-        <Button
-          variant="ghost"
-          size="sm"
-          className="h-7 gap-1.5 px-2.5 text-xs font-normal hover:bg-muted rounded-md"
-          title={t("relations.uploadAttachment")}
-        >
-          <Paperclip className="size-3.5 text-muted-foreground" />
-          {t("relations.attachment")}
-          {count > 0 && (
-            <span className="ml-0.5 inline-flex min-w-[18px] items-center justify-center rounded-full bg-primary px-1 text-[10px] font-medium text-primary-foreground">
-              {count}
-            </span>
-          )}
-        </Button>
-      </PopoverTrigger>
-      <PopoverContent align="start" className="w-[380px] p-4">
-        <div className="flex items-center justify-between mb-3">
-          <span className="text-sm font-semibold">{t("relations.attachment")}</span>
-          {count > 0 && <span className="text-xs text-muted-foreground">{t("relations.itemCount", { count })}</span>}
-        </div>
-        <AttachmentsPanel
-          storyId={storyId}
-          data={data.attachments}
-          onUpdate={(newAttachments) =>
-            onRefresh((prev) => ({
-              ...prev,
-              attachments: newAttachments,
-            }))
-          }
-        />
-      </PopoverContent>
-    </Popover>
-  );
-}

package/src/components/story/detail/story-detail-toolbar/knowledge.tsx

@@ -1,73 +0,0 @@
-// 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 { BookOpenText } from "lucide-react";
-import { useTranslation } from "react-i18next";
-import { Button } from "@/components/ui/button";
-import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover";
-import { KnowledgePanel } from "../../relations/knowledge-panel";
-import type { RelationsData } from "../../types";
-
-export function StoryDetailKnowledge({
-  storyId,
-  data,
-  onRefresh,
-}: {
-  storyId: string;
-  data: RelationsData;
-  onRefresh: (next: (prev: RelationsData) => RelationsData) => void;
-}) {
-  const { t } = useTranslation("story");
-  const count = data.knowledge.prds.length + data.knowledge.docs.length;
-
-  return (
-    <Popover>
-      <PopoverTrigger asChild>
-        <Button
-          variant="ghost"
-          size="sm"
-          className="h-7 gap-1.5 px-2.5 text-xs font-normal hover:bg-muted rounded-md"
-          title={t("relations.knowledgeTitle")}
-        >
-          <BookOpenText className="size-3.5 text-muted-foreground" />
-          {t("relations.knowledge")}
-          {count > 0 && (
-            <span className="ml-0.5 inline-flex min-w-[18px] items-center justify-center rounded-full bg-primary px-1 text-[10px] font-medium text-primary-foreground">
-              {count}
-            </span>
-          )}
-        </Button>
-      </PopoverTrigger>
-      <PopoverContent align="start" className="w-[380px] p-4">
-        <div className="flex items-center justify-between mb-3">
-          <span className="text-sm font-semibold">{t("relations.knowledge")}</span>
-          {count > 0 && <span className="text-xs text-muted-foreground">{t("relations.itemCount", { count })}</span>}
-        </div>
-        <KnowledgePanel
-          storyId={storyId}
-          data={data.knowledge}
-          onUpdate={(updates) =>
-            onRefresh((prev) => ({
-              ...prev,
-              knowledge: { ...prev.knowledge, ...updates },
-            }))
-          }
-        />
-      </PopoverContent>
-    </Popover>
-  );
-}

package/src/components/story/detail/story-detail-toolbar/links.tsx

@@ -1,73 +0,0 @@
-// 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 { Link2 } from "lucide-react";
-import { useTranslation } from "react-i18next";
-import { Button } from "@/components/ui/button";
-import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover";
-import { LinksPanel } from "../../relations/links-panel";
-import type { RelationsData } from "../../types";
-
-export function StoryDetailLinks({
-  storyId,
-  data,
-  onRefresh,
-}: {
-  storyId: string;
-  data: RelationsData;
-  onRefresh: (next: (prev: RelationsData) => RelationsData) => void;
-}) {
-  const { t } = useTranslation("story");
-  const count = data.links.length;
-
-  return (
-    <Popover>
-      <PopoverTrigger asChild>
-        <Button
-          variant="ghost"
-          size="sm"
-          className="h-7 gap-1.5 px-2.5 text-xs font-normal hover:bg-muted rounded-md"
-          title={t("relations.linksTitle")}
-        >
-          <Link2 className="size-3.5 text-muted-foreground" />
-          {t("relations.links")}
-          {count > 0 && (
-            <span className="ml-0.5 inline-flex min-w-[18px] items-center justify-center rounded-full bg-primary px-1 text-[10px] font-medium text-primary-foreground">
-              {count}
-            </span>
-          )}
-        </Button>
-      </PopoverTrigger>
-      <PopoverContent align="start" className="w-[380px] p-4">
-        <div className="flex items-center justify-between mb-3">
-          <span className="text-sm font-semibold">{t("relations.links")}</span>
-          {count > 0 && <span className="text-xs text-muted-foreground">{t("relations.itemCount", { count })}</span>}
-        </div>
-        <LinksPanel
-          storyId={storyId}
-          data={data.links}
-          onUpdate={(newLinks) =>
-            onRefresh((prev) => ({
-              ...prev,
-              links: newLinks,
-            }))
-          }
-        />
-      </PopoverContent>
-    </Popover>
-  );
-}

package/src/components/story/relations/attachments-panel.tsx

@@ -1,179 +0,0 @@
-// 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 * as React from "react";
-import { Plus, Upload, FileText, Trash2 } from "lucide-react";
-import { useTranslation } from "react-i18next";
-import { Button } from "@/components/ui/button";
-import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogTrigger } from "@/components/ui/dialog";
-import { useServerFn } from "@tanstack/react-start";
-import { getAttachmentsFn, removeAttachmentFn } from "@/server/serverFns/story";
-import { toast } from "sonner";
-import { type StoryAttachmentItem } from "../types";
-
-export interface AttachmentsPanelProps {
-  storyId: string;
-  data: StoryAttachmentItem[];
-  onUpdate: (newAttachments: StoryAttachmentItem[]) => void;
-}
-
-export function AttachmentsPanel({ storyId, data, onUpdate }: AttachmentsPanelProps) {
-  const { t } = useTranslation("story");
-  const [open, setOpen] = React.useState(false);
-  const [selectedFile, setSelectedFile] = React.useState<File | null>(null);
-  const [uploading, setUploading] = React.useState(false);
-
-  const removeAttachment = useServerFn(removeAttachmentFn);
-
-  const handleUpload = async () => {
-    if (!selectedFile) {
-      toast.error(t("attachments.selectFile"));
-      return;
-    }
-
-    setUploading(true);
-    try {
-      // 使用原生 fetch 调用 serverFn 端点上传（支持 FormData）
-      const formData = new FormData();
-      formData.append("storyId", storyId);
-      formData.append("file", selectedFile);
-
-      // 注意：serverFn 不支持 FormData，这里使用 Mock 实现
-      // 实际应用中应调用专用上传 API
-      const mockUrl = `/mock-storage/${Date.now()}-${selectedFile.name}`;
-      const newAttachment: StoryAttachmentItem = {
-        id: `mock-${Date.now()}`,
-        fileName: selectedFile.name,
-        fileSize: selectedFile.size,
-        mimeType: selectedFile.type || "application/octet-stream",
-        storageUrl: mockUrl,
-      };
-
-      // 乐观更新
-      onUpdate([newAttachment, ...data]);
-      toast.success(t("attachments.uploaded"));
-      setOpen(false);
-      setSelectedFile(null);
-    } catch (error: any) {
-      console.error(t("attachments.uploadFailed"), error);
-      toast.error(error.message || t("attachments.uploadFailed"));
-    } finally {
-      setUploading(false);
-    }
-  };
-
-  const handleRemove = async (attachmentId: string) => {
-    try {
-      // Mock 附件用本地移除
-      if (attachmentId.startsWith("mock-")) {
-        onUpdate(data.filter((att) => att.id !== attachmentId));
-        toast.success(t("attachments.removed"));
-        return;
-      }
-
-      await removeAttachment({ data: { attachmentId } });
-      toast.success(t("attachments.removed"));
-      onUpdate(data.filter((att) => att.id !== attachmentId));
-    } catch (error: any) {
-      console.error(t("attachments.removeFailed"), error);
-      toast.error(error.message || t("attachments.removeFailed"));
-    }
-  };
-
-  const formatFileSize = (bytes: number) => {
-    if (bytes === 0) return "0 B";
-    const k = 1024;
-    const sizes = ["B", "KB", "MB", "GB"];
-    const i = Math.floor(Math.log(bytes) / Math.log(k));
-    return `${parseFloat((bytes / Math.pow(k, i)).toFixed(1))} ${sizes[i]}`;
-  };
-
-  return (
-    <div className="space-y-4">
-      <div className="flex items-center justify-between">
-        <div className="text-sm font-medium">{t("attachments.title")}</div>
-        <Dialog open={open} onOpenChange={setOpen}>
-          <DialogTrigger asChild>
-            <Button type="button" variant="outline" size="sm">
-              <Plus className="h-4 w-4 mr-2" />
-              {t("attachments.add")}
-            </Button>
-          </DialogTrigger>
-          <DialogContent>
-            <DialogHeader>
-              <DialogTitle>{t("attachments.uploadTitle")}</DialogTitle>
-            </DialogHeader>
-            <div className="space-y-4">
-              <label className="flex flex-col items-center justify-center w-full h-32 border-2 border-dashed rounded-md cursor-pointer hover:bg-muted transition-colors">
-                <Upload className="h-8 w-8 mb-2 text-muted-foreground" />
-                <span className="text-sm text-muted-foreground">
-                  {selectedFile ? selectedFile.name : t("attachments.clickToSelect")}
-                </span>
-                <input
-                  type="file"
-                  className="hidden"
-                  onChange={(e) => setSelectedFile(e.target.files?.[0] || null)}
-                />
-              </label>
-              <div className="flex justify-end gap-2">
-                <Button type="button" variant="outline" onClick={() => setOpen(false)}>
-                  {t("attachments.cancel")}
-                </Button>
-                <Button type="button" onClick={handleUpload} disabled={uploading || !selectedFile}>
-                  {uploading ? t("attachments.uploading") : t("attachments.upload")}
-                </Button>
-              </div>
-            </div>
-          </DialogContent>
-        </Dialog>
-      </div>
-
-      {data.length > 0 ? (
-        <div className="space-y-2">
-          {data.map((att) => (
-            <div
-              key={att.id}
-              className="flex items-center justify-between p-3 bg-muted rounded-md"
-            >
-              <div className="flex items-center gap-2 flex-1 min-w-0">
-                <FileText className="h-4 w-4 text-muted-foreground shrink-0" />
-                <div className="flex-1 min-w-0">
-                  <div className="text-sm font-medium truncate">{att.fileName}</div>
-                  <div className="text-xs text-muted-foreground">
-                    {formatFileSize(att.fileSize)} · {att.mimeType}
-                  </div>
-                </div>
-              </div>
-              <Button
-                type="button"
-                variant="ghost"
-                size="icon"
-                onClick={() => handleRemove(att.id)}
-              >
-                <Trash2 className="h-4 w-4" />
-              </Button>
-            </div>
-          ))}
-        </div>
-      ) : (
-        <div className="text-sm text-muted-foreground text-center py-4">
-          {t("attachments.empty")}
-        </div>
-      )}
-    </div>
-  );
-}