feat: 输入框左下角增加文件上传按钮

[devin-ai-integration]

Summary

在聊天输入框左下角添加文件上传按钮，支持点击上传和拖拽上传文件。

具体改动：

1. InputStore 增加文件状态管理（input-store.ts）

   • 新增 files observable 数组存储已选文件
   • 新增 addFiles()、removeFile()、clearFiles() 方法
   • 发送消息后自动清空附件
   • 允许仅有附件（无文本）时发送消息

2. Footer 组件集成文件上传功能（footer.tsx）

   • 左下角新增 📎 文件上传按钮（使用 Paperclip 图标）
   • 复用已有的 FileUpload / FileUploadTrigger / FileUploadContent 组件
   • 在输入框和操作栏之间显示已选文件预览（文件名、大小、删除按钮）
   • 支持拖拽文件到页面上传（带蒙层提示）
   • 操作栏布局从 justify-end 改为 justify-between，左侧上传按钮、右侧发送按钮

Review & Testing Checklist for Human

• 点击左下角 📎 按钮，弹出文件选择器，选择文件后能在输入框中看到文件预览
• 拖拽文件到页面，能看到拖拽蒙层提示，放下后文件出现在预览区
• 点击文件预览上的 X 按钮能移除单个文件
• 发送消息后附件列表自动清空

Notes

• 当前 agent-core 的 TaskReq 仅支持 input: string，文件数据暂时只在 UI 层管理。后续可扩展 TaskReq 以支持将文件内容传递给 Agent 处理。
• 已有的 FileUpload 组件之前未被使用，本 PR 首次将其集成到实际功能中。

Link to Devin session: https://app.devin.ai/sessions/d385bb1a2d7f41b4892cb0c13f7e2b34
Requested by: @RichDavidMu

---

[devin-ai-integration]

🤖 Devin AI Engineer

I'll be helping with this pull request! Here's what you should know:

✅ I will automatically:

• Address comments on this PR. Add '(aside)' to your comment to have me ignore it.
• Look at CI failures and help fix them

Note: I can only respond to comments from users who have write access to this repository.

⚙️ Control Options:

• Disable automatic comment and CI monitoring

[devin-ai-integration]

Devin Review found 1 potential issue.

View 2 additional findings in Devin Review.

[devin-ai-integration]

🔴 Attached files are never sent to the backend and are silently discarded

The PR adds UI for file uploads and allows sending messages with only files attached (no text). However, in handleSend(), stream.task() is called with only { input: this.input } — the files array is never included in the request payload. Immediately after, this.clearFiles() discards the files. This means the entire file upload feature is non-functional: users can attach files and see them in the UI, but clicking send silently drops them. This is especially problematic when a user sends a message with files but no text input, as the TaskReq at packages/agent-core/src/service/handlers/task.ts:6-9 only accepts { input: string; sessionId?: string }, so the backend would receive an empty input string with no files.

Prompt for agents

The files collected in InputStore.files are never passed to stream.task() at input-store.ts:42. The call is `await stream.task({ input: this.input })` but the files are simply cleared on the next line. To fix this properly:

1. The TaskReq interface in packages/agent-core/src/service/handlers/task.ts needs to be extended to support file attachments (e.g., add a `files?: File[]` field).
2. The stream.task() method in app/web-app/src/stream/stream.ts needs to accept and forward the files.
3. The backend pipeline (TaskCtx, AgentController, etc.) needs to handle file content.
4. InputStore.handleSend() needs to pass `this.files` (as a plain array copy via `this.files.slice()`) to stream.task().

Without backend support for files, the UI should either not allow file uploads or should show an error when files are attached, rather than silently discarding them.

---

Was this helpful? React with 👍 or 👎 to provide feedback.