Mintplex-Labs/anything-llm
1
0
Fork 0
mirror of https://github.com/Mintplex-Labs/anything-llm.git synced 2026-07-19 22:23:50 -04:00
Code Issues 328 Packages Projects Releases 10 Wiki Activity

[PR #5373] [CLOSED] feat: inline file preview card for agent-created and filesystem files #5422

New Issue
Closed
opened 2026-06-05 15:21:18 -04:00 by yindo · 0 comments
yindo commented 2026-06-05 15:21:18 -04:00
Owner
Copy Link
Copy Source

📋 Pull Request Information

Original PR: https://github.com/Mintplex-Labs/anything-llm/pull/5373
Author: @Eiyron
Created: 4/7/2026
Status: ❌ Closed

Base: master ← Head: feat/file-preview-card

📝 Commits (1)

  • eb78e8a feat: inline file preview card for agent-created and filesystem files

📊 Changes

7 files changed (+828 additions, -118 deletions)

View changed files

➕ frontend/src/components/WorkspaceChat/ChatContainer/ChatHistory/FilePreviewCard/index.jsx (+599 -0)
📝 frontend/src/components/WorkspaceChat/ChatContainer/ChatHistory/HistoricalMessage/HistoricalOutputs/index.jsx (+3 -2)
📝 frontend/src/components/WorkspaceChat/ChatContainer/ChatHistory/index.jsx (+2 -2)
📝 frontend/src/models/files.js (+30 -2)
📝 server/endpoints/agentFileServer.js (+76 -53)
📝 server/utils/agents/aibitat/plugins/filesystem/edit-file.js (+48 -39)
📝 server/utils/agents/aibitat/plugins/filesystem/write-text-file.js (+70 -20)

📄 Description

What this adds

Whenever the agent creates or edits a file via both the create-*-file skills and the filesystem-write-text-file / filesystem-edit-file tools, a collapsible inline preview card now appears in the chat. No download required to see what was created.

Preview supports

  • 30+ programming languages with VSCode-style syntax highlighting (Python, Lua, PowerShell, Batch, Shell, Rust, Go, JS/TS, C#, Java, C/C++, Ruby, PHP, SQL, YAML, and more)
    • Plain text formats: .txt, .md, .csv, .json
    • PDF rendered via inline iframe
    • Images (.png, .jpg, .gif, .webp, .svg)
    • Binary formats (PPTX, DOCX, XLSX) show a graceful "preview not available" message with download button

Files changed (7 files)

  • NEW: FilePreviewCard/index.jsx — collapsible preview card component
    • ChatHistory/index.jsx — routes fileDownloadCard websocket messages to FilePreviewCard
    • HistoricalOutputs/index.jsx — uses FilePreviewCard for historical messages
    • models/files.js — adds previewUrl() and fetchText() helpers
    • agentFileServer.js — adds /preview endpoint; relaxes DB ownership check so files serve immediately before chat record is saved
    • filesystem/write-text-file.js — registers preview output via socket.send() (live) and registerOutput() (historical) after writing
    • filesystem/edit-file.js — same as above after edits

Technical notes

  • Race condition fix: endpoint no longer requires a DB chat record before serving — checks storage first
    • Collapse state backed by sessionStorage so it survives streaming and scroll re-renders without jitter
    • Line numbers sync scroll with code content via JS scrollTop sync
    • /preview endpoint accepts ?token= query param for iframe/img src embedding

🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.

## 📋 Pull Request Information **Original PR:** https://github.com/Mintplex-Labs/anything-llm/pull/5373 **Author:** [@Eiyron](https://github.com/Eiyron) **Created:** 4/7/2026 **Status:** ❌ Closed **Base:** `master` ← **Head:** `feat/file-preview-card` --- ### 📝 Commits (1) - [`eb78e8a`](https://github.com/Mintplex-Labs/anything-llm/commit/eb78e8a6c638e067cfd53f3888461cc4e372d9df) feat: inline file preview card for agent-created and filesystem files ### 📊 Changes **7 files changed** (+828 additions, -118 deletions) <details> <summary>View changed files</summary> ➕ `frontend/src/components/WorkspaceChat/ChatContainer/ChatHistory/FilePreviewCard/index.jsx` (+599 -0) 📝 `frontend/src/components/WorkspaceChat/ChatContainer/ChatHistory/HistoricalMessage/HistoricalOutputs/index.jsx` (+3 -2) 📝 `frontend/src/components/WorkspaceChat/ChatContainer/ChatHistory/index.jsx` (+2 -2) 📝 `frontend/src/models/files.js` (+30 -2) 📝 `server/endpoints/agentFileServer.js` (+76 -53) 📝 `server/utils/agents/aibitat/plugins/filesystem/edit-file.js` (+48 -39) 📝 `server/utils/agents/aibitat/plugins/filesystem/write-text-file.js` (+70 -20) </details> ### 📄 Description ### What this adds Whenever the agent creates or edits a file via both the `create-*-file` skills and the `filesystem-write-text-file` / `filesystem-edit-file` tools, a collapsible inline preview card now appears in the chat. No download required to see what was created. ### Preview supports - 30+ programming languages with VSCode-style syntax highlighting (Python, Lua, PowerShell, Batch, Shell, Rust, Go, JS/TS, C#, Java, C/C++, Ruby, PHP, SQL, YAML, and more) - - Plain text formats: .txt, .md, .csv, .json - - PDF rendered via inline iframe - - Images (.png, .jpg, .gif, .webp, .svg) - - Binary formats (PPTX, DOCX, XLSX) show a graceful "preview not available" message with download button ### Files changed (7 files) - NEW: `FilePreviewCard/index.jsx` — collapsible preview card component - - `ChatHistory/index.jsx` — routes fileDownloadCard websocket messages to FilePreviewCard - - `HistoricalOutputs/index.jsx` — uses FilePreviewCard for historical messages - - `models/files.js` — adds previewUrl() and fetchText() helpers - - `agentFileServer.js` — adds /preview endpoint; relaxes DB ownership check so files serve immediately before chat record is saved - - `filesystem/write-text-file.js` — registers preview output via socket.send() (live) and registerOutput() (historical) after writing - - `filesystem/edit-file.js` — same as above after edits ### Technical notes - Race condition fix: endpoint no longer requires a DB chat record before serving — checks storage first - - Collapse state backed by sessionStorage so it survives streaming and scroll re-renders without jitter - - Line numbers sync scroll with code content via JS scrollTop sync - - /preview endpoint accepts ?token= query param for iframe/img src embedding --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>
yindo added the pull-request label 2026-06-05 15:21:18 -04:00
yindo closed this issue 2026-06-05 15:21:18 -04:00
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
Desktop
Docker
Integration Request
Integration Request
OS: Linux
OS: Mobile
OS: Windows
UI/UX
blocked
bug
bug
core-team-only
documentation
duplicate
embed-widget
enhancement
feature request
github_actions
good first issue
investigating
needs info / can't replicate
possible bug
pull-request
Mirrored from GitHub Pull Request
 question
stage: specifications
wontfix
No Label pull-request
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
yindo
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: Mintplex-Labs/anything-llm#5422
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?