Attachments

The full chat mode supports file attachments. Visitors drag files onto the panel or pick them via the attach button; the widget uploads them through AppEngine's repository file endpoint and includes the resulting paths on the next outbound message.

How it works

Drag-and-drop is wired with react-dnd (react-dnd and react-dnd-html5-backend are pulled in by package.json). Dropping a file:

1. Adds it to fileItems in the chat store as a pending entry with the original File object.
2. The composer shows a thumbnail strip with the file name and size.
3. When the visitor sends a message, the widget uploads each pending file to POST /repository/file/upload with the org's chat token, then includes the canonical paths on the message payload.
4. The store records the message with files: [...] so the renderer can show them inline.

Uploads are scoped under the org's chat folder. The location form field is set to <orgId>/chat/<chatId> so attachments are namespaced by conversation.

Supported MIME types

The widget accepts any MIME type the user's browser will let it pick. AppEngine's storage layer enforces the actual ceiling — by default that's:

• Images: image/png, image/jpeg, image/gif, image/webp, image/svg+xml
• Documents: application/pdf, text/plain, text/csv, application/vnd.openxmlformats-* (Office docs)
• Audio / video: audio/mpeg, audio/wav, video/mp4, video/webm
• Archives: application/zip

Files outside this list return a 415 from the upload endpoint and surface as "unsupported file type" in the composer.

Rendering attachments

Inbound messages with attachments render thumbnails for images and a file card with name + size + download link for everything else. The renderer is chat-history-message-files.tsx in src/components/chat/. There is no slot API today to replace it (see Slots) — for different presentation, fork the bundle.

For images the renderer uses react-images-viewer to show a lightbox on click — full-screen with prev/next navigation when there are multiple images in the conversation.

Programmatic uploads

There is no published hook export for sending a message with a file attachment from outside the bundle. To trigger a send from your own UI (e.g. a "send screenshot" button), the practical paths today are:

• Programmatically click the panel's attach button (find the input element by its known DOM id and dispatch a change event with your File).
• Fork the bundle to add an imperative method on window.AppmintChat (e.g. attachFile(file, caption)).

Drag-and-drop outside the composer

By default the drop zone is the full chat panel. Extending the drop target to the host page requires reaching into the bundle's React tree, which is not supported through any public API today. The pragmatic alternative is to handle the drop yourself, then upload via your own AppEngine call (see the upload endpoint below) and call into the panel through whatever helpers window.AppmintChat exposes in your build.

Q&A mode

Q&A mode does not support file attachments. The composer is text-only. If you need to share a screenshot from a Q&A widget, use full chat mode instead.

Storage and retention

Files live in AppEngine's storage backend (S3 or DigitalOcean Spaces, depending on the deployment). They're served via signed URLs that expire after the configured TTL — the widget refreshes URLs on each chat history fetch, so old conversations stay viewable as long as the underlying object exists.

Retention follows the org's plan: the default is 90 days for free orgs and indefinite for paid. Check the chat module's settings in the AppMint admin console.