1cd06746fe
Enable supported photo and file attachment workflows across Quick Add and Chat. - Expand Quick Add and Chat picker, paste, and drag/drop attachment intake. - Preserve pending attachments until direct and room sends are accepted, with accessible previews and retry support. - Align Chat MIME and size validation with task attachments, including video, Markdown, and TOML support. - Add regression coverage for attachment previews, delivery behavior, and accepted MIME types. Files changed: .changeset/fn-8502-chat-quick-add-attachments.md | 7 ++ docs/dashboard-guide.md | 5 +- ... quick-entry-attachment-preview-modal.test.tsx} | 50 ++++++-- packages/dashboard/app/components/ChatView.tsx | 80 +++++++++++-- .../dashboard/app/components/InlineCreateCard.tsx | 6 +- .../app/components/PendingAttachmentPreviews.css | 60 ++++++++++ ...ePreviews.tsx => PendingAttachmentPreviews.tsx} | 68 ++++++----- .../app/components/PendingImagePreviews.css | 35 ------ .../dashboard/app/components/QuickEntryBox.tsx | 127 +++++++++++++-------- packages/dashboard/app/components/TaskForm.tsx | 6 +- .../__tests__/ChatView.core-interactions.test.tsx | 61 ++++++++-- .../__tests__/ChatView.mobile-render.test.tsx | 20 +++- .../components/__tests__/ChatView.rooms.test.tsx | 27 ++++- .../components/__tests__/QuickEntryBox.test.tsx | 59 ++++++++-- packages/dashboard/app/hooks/useChat.ts | 41 ++++++- .../src/__tests__/chat-attachment-content.test.ts | 17 +++ packages/dashboard/src/chat-attachment-content.ts | 4 +- .../dashboard/src/routes/chat-attachment-config.ts | 16 +++ .../src/routes/register-chat-room-routes.ts | 9 +- .../dashboard/src/routes/register-chat-routes.ts | 11 +- 20 files changed, 534 insertions(+), 175 deletions(-) Fusion-Task-Id: FN-8502 Fusion-Task-Lineage: 0205187c-7e5b-45f8-a71d-fcfd9fb01e65 Co-authored-by: Fusion (runfusion.ai) <noreply@runfusion.ai>
61 lines
1.5 KiB
CSS
61 lines
1.5 KiB
CSS
/*
|
|
FNXC:QuickAddAttachments 2026-08-03-00:00:
|
|
Images retain the compact thumbnail affordance; non-images use the same shell with a readable,
|
|
wrapping filename and no empty open target. Token sizing keeps attachment controls usable at the
|
|
existing mobile breakpoint without introducing a second responsive layout system.
|
|
*/
|
|
.pending-image-preview__open {
|
|
display: block;
|
|
width: 100%;
|
|
height: 100%;
|
|
padding: 0;
|
|
border: 0;
|
|
background: transparent;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.pending-image-preview__open:focus-visible {
|
|
outline: var(--focus-ring-width, thin) solid var(--focus-ring, var(--color-primary));
|
|
outline-offset: calc(var(--space-xs) * -1);
|
|
}
|
|
|
|
.inline-create-preview--file {
|
|
width: auto;
|
|
max-width: calc(var(--space-2xl) * 4);
|
|
height: auto;
|
|
min-height: var(--space-2xl);
|
|
}
|
|
|
|
.pending-attachment-preview__file {
|
|
display: block;
|
|
min-width: 0;
|
|
padding: var(--space-xs) var(--space-xl) var(--space-xs) var(--space-sm);
|
|
overflow-wrap: anywhere;
|
|
color: var(--text-primary);
|
|
font-size: var(--font-size-xs);
|
|
line-height: var(--line-height-tight);
|
|
}
|
|
|
|
.pending-image-preview__modal-content {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
justify-content: flex-start;
|
|
min-width: 100%;
|
|
min-height: 100%;
|
|
padding: var(--space-md);
|
|
}
|
|
|
|
.pending-image-preview__modal-content img {
|
|
display: block;
|
|
width: auto;
|
|
height: auto;
|
|
max-width: none;
|
|
max-height: none;
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.pending-attachment-preview__file {
|
|
padding: var(--space-sm);
|
|
}
|
|
}
|