Document Preview
Show a readable preview of an uploaded file without opening another program.
What it adds
Server-generated previews for common uploaded document types, shown inline wherever files are listed.
What your agent is told to do
5
What your agent is told to do
5-
1
Decide the small set of types worth previewing based on what users actually upload, and treat everything else as an icon plus file details. A general-purpose converter for every format is not the minimum coherent version of this.
-
2
Generate previews in the app's existing background job system after upload completes, and show the file as uploaded with a preview pending rather than holding the upload open.
-
3
Extend the app's existing File Upload and Attachment Gallery to display previews in place, rather than adding a second file surface alongside them.
-
4
Authorise the preview exactly as strictly as the source file. A generated thumbnail of a private contract is the private contract.
-
5
Do not render documents by handing the original bytes to the browser. Convert server-side and serve the rendered output, so an uploaded file cannot execute anything in a viewer's session.
Edge cases it handles
8
Edge cases it handles
8- Conversion is slow and sometimes fails. Queue it in the background, show progress and a clear failed state, and never let a conversion block or roll back the upload itself.
- Very large files, files with hundreds of pages, and archives nested many levels deep will exhaust a worker. Cap page count, file size, and nesting depth, and say the preview was truncated rather than failing silently.
- Cache generated previews and expire them when the source file is replaced, or users will keep seeing the old version of a document they have already updated.
- Unsupported types must degrade to a file type icon with name, size, and date, which is genuinely useful, rather than a broken image frame.
- Documents embed scripts, macros, and remote references that phone home when rendered. Strip them during conversion and block outbound fetches from the renderer.
- Previews are derived files that also consume storage. Give them a retention policy and delete them when the source file is deleted, including from any cache or CDN.
- If the app already runs Upload Malware Scanning, previews must not be generated or shown until the scan clears, otherwise the preview becomes the delivery mechanism.
- Reserve the preview's dimensions in the list so a page of files does not reflow as each thumbnail arrives, and give every preview alt text naming the file.
Definition of done
9
Definition of done
9- Common uploaded types show a readable inline preview where files are listed.
- Conversion runs in the background with visible progress and never blocks upload.
- Oversized and deeply nested files are capped and reported as truncated.
- Previews are cached and regenerated when the source file changes.
- Unsupported types fall back to an icon with file details.
- Embedded scripts and remote references are stripped before rendering.
- Deleting a file removes its previews, and preview access requires the same permission as the file.
- The feature matches the existing design system.
- No existing functionality is broken.
Related features
PDF Converter
PDF Converter
Let people turn the files they upload into PDFs, and PDFs back into editable formats.
What it does
A conversion service that accepts an uploaded document and returns it in a requested format, with progress and a downloadable result.
How it works
- 1 Start from the app's existing upload path rather than adding a second one. If File Upload, Upload Malware Scanning, or Secure File Downloads already exist, the converter consumes what upload produces and hands its output to the existing download route, so permissions and scanning are inherited rather than reimplemented.
- 2 Decide the conversion pairs you will actually support and list them in the interface. A short honest list of office documents, images, and PDF to text beats a control that offers every combination and fails on most of them.
- 3 Enforce file size, page count, and accepted types on the server before any conversion starts. A limit checked after the file has been parsed has already cost you the memory and the CPU you were trying to protect.
Copy the prompt
No account needed
Add this feature to my app:
https://addthisfeature.com/x/pdf-converter
Document Scanner
Document Scanner
Turn a phone photo of a paper document into a straight, readable, multi-page file.
What it does
A camera capture flow that detects page edges, corrects perspective, and assembles the shots into one document.
How it works
- 1 Lead with the capture screen: live edge detection, a shutter, and a running strip of the pages already taken. Somebody should be able to shoot five pages without leaving the camera.
- 2 Correct perspective and crop to the detected page before saving, then apply a contrast pass so a grey photo of a page reads as black text on white.
- 3 Give the user a review step where pages can be reordered, retaken, or deleted before anything is committed.
Copy the prompt
No account needed
Add this feature to my app:
https://addthisfeature.com/x/document-scanner
Document Import
Document Import
Turn an uploaded document into editable content instead of a dead attachment.
What it does
An import path that converts an uploaded word-processor or rich-text document into the app's own editable content.
How it works
- 1 Start from the app's existing File Upload rather than opening a second route with looser rules. A file that is about to be parsed and rendered back as editable content needs the size ceiling and the malware scan more than an ordinary attachment does, not less.
- 2 Map the imported document onto the content model the app's editor already uses. Anything the editor cannot represent must be dropped deliberately and reported, not smuggled in as raw markup.
- 3 Run parsing as background work with a visible status, because a large document will exceed a request timeout and the user needs to know whether it is working or stuck.
Copy the prompt
No account needed
Add this feature to my app:
https://addthisfeature.com/x/document-import
How it works
-
1
Copy the link
Grab the Markdown instruction URL for this feature.
-
2
Give it to your AI
Paste it into Claude Code, Cursor, v0, Lovable — whatever you build with.
-
3
It inspects, then implements
Your agent reads your existing app first, then adds the feature to fit it.
Works with your stack
These instructions are written to adapt. They tell the agent to detect your framework, match your existing design system, and reuse what you already have — rather than assuming a particular stack.
Need it tighter than that? Customize the feature and tell it exactly what you're running.