@allbluecn/web-app 0.5.0 → 0.5.1

package/src/server/serverFns/story/story-crud.ts

@@ -25,7 +25,7 @@ import { isUserInTeam } from "@/server/team-access";
 import { BUILTIN_INDEPENDENT_DISPLAY_ID } from "@/lib/builtin-project";
 import type { ActivityItem } from "@/components/story/types";
 import { diffDescriptionBlocks } from "@/lib/story/description-diff";
-import { USER_BRIEF_SELECT, STORY_LIST_SELECT, castStoryUsers, castUserBrief, toDateOnly } from "./types";
+import { USER_BRIEF_SELECT, STORY_LIST_SELECT, castStoryUsers, castUserBrief, toDateOnly, ACTIVITY_SELECT, toActivityItem } from "./types";
 import { buildListWhere } from "./story-list-query";
 
 async function validateAssignee(projectId: string, assigneeId: string | null | undefined) {
@@ -116,9 +116,10 @@ export const createStoryFn = createServerFn({ method: "POST" })
     for (let attempt = 0; attempt < MAX_RETRIES; attempt++) {
       try {
         return await prisma.$transaction(async (tx) => {
+          let parentStory: { id: string; identifier: string; name: string } | null = null;
           if (data.parentId) {
-            const parent = await tx.story.findUnique({ where: { id: data.parentId }, select: { id: true } });
-            if (!parent) throw new Error("父需求不存在");
+            parentStory = await tx.story.findUnique({ where: { id: data.parentId }, select: { id: true, identifier: true, name: true } });
+            if (!parentStory) throw new Error("父需求不存在");
           }
           let sequenceId: number;
           let identifier: string;
@@ -177,7 +178,23 @@ export const createStoryFn = createServerFn({ method: "POST" })
             data: { storyId: story.id, userId, action: "created", isAI: data.isAI },
           });
 
-          return castStoryUsers(story);
+          // 创建时带父需求：父需求侧补「添加子需求」活动
+          let parentActivity: ReturnType<typeof toActivityItem> | null = null;
+          if (parentStory) {
+            const pa = await tx.storyActivity.create({
+              data: {
+                storyId: parentStory.id,
+                userId,
+                action: "child_added",
+                newValue: `${story.identifier} ${story.name}`.trim(),
+                isAI: data.isAI,
+              },
+              select: ACTIVITY_SELECT,
+            });
+            parentActivity = toActivityItem(pa);
+          }
+
+          return { ...castStoryUsers(story), activities: parentActivity ? [parentActivity] : [] };
         });
       } catch (e: unknown) {
         const isUniqueViolation =

package/src/server/serverFns/story/story-dependencies.ts

@@ -20,7 +20,7 @@ import { getRequest } from "@tanstack/react-start/server";
 import { z } from "zod";
 import { prisma } from "@allbluecn/database";
 import { requireAuth } from "@/server/auth-helpers";
-import { STORY_LIST_SELECT, castStoryUsers } from "./types";
+import { STORY_LIST_SELECT, castStoryUsers, ACTIVITY_SELECT, toActivityItem } from "./types";
 import type { DependencyRow } from "@/components/story/types";
 
 const edgeTypeSchema = z.enum(["BLOCKS", "STARTS_BEFORE", "FINISHES_BEFORE"]);
@@ -41,7 +41,8 @@ export const addDependenciesFn = createServerFn({ method: "POST" })
   )
   .handler(async ({ data }) => {
     const request = getRequest();
-    await requireAuth(request);
+    const session = await requireAuth(request);
+    const userId = session.user!.id!;
 
     // 一次性取全部出边（3 类型合并；不按 projectId 裁剪——跨项目边同样参与环判定），
     // 构建内存邻接表供本批循环的环检测复用，避免 O(items × 可达节点) 次串行 RTT
@@ -111,7 +112,38 @@ export const addDependenciesFn = createServerFn({ method: "POST" })
       batchEdges.push({ sourceId: item.sourceId, targetId: item.targetId });
     }
 
-    return { created, failed };
+    // 活动记录：依赖两端各记一条「添加依赖关系」（newValue 为对方需求描述），
+    // 返回带 storyId 供 UI 过滤当前需求侧的记录
+    let activities: Array<ReturnType<typeof toActivityItem> & { storyId: string }> = [];
+    if (created.length > 0) {
+      const endpointIds = [...new Set(batchEdges.flatMap((e) => [e.sourceId, e.targetId]))];
+      const endpoints = await prisma.story.findMany({
+        where: { id: { in: endpointIds } },
+        select: { id: true, identifier: true, name: true },
+      });
+      const labelById = new Map(
+        endpoints.map((s) => [s.id, `${s.identifier} ${s.name}`.trim()]),
+      );
+      const createdActivities = await Promise.all(
+        batchEdges.flatMap(({ sourceId, targetId }) => {
+          const sourceLabel = labelById.get(sourceId) ?? "";
+          const targetLabel = labelById.get(targetId) ?? "";
+          return [
+            prisma.storyActivity.create({
+              data: { storyId: sourceId, userId, action: "dependency_added", newValue: targetLabel },
+              select: { ...ACTIVITY_SELECT, storyId: true },
+            }),
+            prisma.storyActivity.create({
+              data: { storyId: targetId, userId, action: "dependency_added", newValue: sourceLabel },
+              select: { ...ACTIVITY_SELECT, storyId: true },
+            }),
+          ];
+        }),
+      );
+      activities = createdActivities.map((a) => ({ ...toActivityItem(a), storyId: a.storyId }));
+    }
+
+    return { created, failed, activities };
   });
 
 export const removeDependencyFn = createServerFn({ method: "POST" })

package/src/server/serverFns/story/story-links.ts

@@ -20,12 +20,14 @@ import { getRequest } from "@tanstack/react-start/server";
 import { z } from "zod";
 import { prisma } from "@allbluecn/database";
 import { requireAuth } from "@/server/auth-helpers";
+import { ACTIVITY_SELECT, toActivityItem } from "./types";
 
 export const addLinkFn = createServerFn({ method: "POST" })
   .validator(z.object({ storyId: z.string(), url: z.string().url(), title: z.string().optional(), description: z.string().optional() }))
   .handler(async ({ data }) => {
     const request = getRequest();
     const session = await requireAuth(request);
+    const userId = session.user!.id!;
 
     const link = await prisma.storyLink.create({
       data: {
@@ -36,7 +38,17 @@ export const addLinkFn = createServerFn({ method: "POST" })
       },
     });
 
-    return link;
+    const activity = await prisma.storyActivity.create({
+      data: {
+        storyId: data.storyId,
+        userId,
+        action: "link_added",
+        newValue: data.title || data.url,
+      },
+      select: ACTIVITY_SELECT,
+    });
+
+    return { ...link, activity: toActivityItem(activity) };
   });
 
 export const updateLinkFn = createServerFn({ method: "POST" })

package/src/server/serverFns/story/story-tree.ts

@@ -54,7 +54,8 @@ export const addChildFn = createServerFn({ method: "POST" })
   .validator(z.object({ parentId: z.string(), childId: z.string() }))
   .handler(async ({ data }) => {
     const request = getRequest();
-    await requireAuth(request);
+    const session = await requireAuth(request);
+    const userId = session.user!.id!;
 
     const existingChild = await prisma.story.findUnique({
       where: { id: data.childId },
@@ -68,11 +69,37 @@ export const addChildFn = createServerFn({ method: "POST" })
       throw new Error("不能将子需求设为其父需求的子需求（循环依赖）");
     }
 
+    const parent = await prisma.story.findUnique({
+      where: { id: data.parentId },
+      select: { id: true, identifier: true, name: true },
+    });
+
     const child = await prisma.story.update({
       where: { id: data.childId },
       data: { parentId: data.parentId },
     });
 
+    // 活动记录：父需求记「添加子需求」，子需求记「变更父需求」（与 updateStoryFn 格式一致）
+    if (parent) {
+      const childLabel = `${existingChild?.identifier ?? ""} ${existingChild?.name ?? ""}`.trim();
+      const parentLabel = `${parent.identifier} ${parent.name}`.trim();
+      await prisma.$transaction([
+        prisma.storyActivity.create({
+          data: { storyId: parent.id, userId, action: "child_added", newValue: childLabel },
+        }),
+        prisma.storyActivity.create({
+          data: {
+            storyId: child.id,
+            userId,
+            action: "parent_changed",
+            field: "parentId",
+            oldValue: "",
+            newValue: parentLabel,
+          },
+        }),
+      ]);
+    }
+
     return child;
   });
 

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 = {
@@ -140,6 +141,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/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/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>
-  );
-}