@taskforcehq/taskforce 0.3.305 → 0.3.307

package/dist/components/task/TaskContextUpload.js

@@ -1,528 +1,6 @@
-import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
-import { useEffect, useMemo, useRef, useState } from 'react';
-import { AlertTriangle, Copy, Download, File, FileUp, Loader2, PencilLine, Trash2, ChevronDown, ChevronRight } from 'lucide-react';
-import styles from '../../Taskforce.module.css';
-import { dispatchOpenMarkdownDocument } from '../../utils/contextFiles';
-import { canOpenAnnotatedAttachment, dispatchOpenAnnotatedAttachment } from '../../utils/annotatedAttachments';
-import { dispatchTaskforceContextAssetsMutated } from '../../utils/contextAssetEvents';
-import { getDocumentReferenceLabel } from '../../utils/documentReferences';
-const ACCEPTED_CONTEXT_FILE_TYPES = [
-    '.png', '.jpg', '.jpeg', '.webp', '.gif',
-    '.pdf', '.txt', '.md', '.csv', '.json', '.doc', '.docx',
-    '.html', '.js', '.ts', '.tsx', '.css', '.py', '.java', '.go', '.rs', '.sh'
-].join(',');
-const SUPPORTED_CLIPBOARD_IMAGE_TYPES = new Set(['image/png', 'image/jpeg', 'image/webp']);
-const ACCEPTED_CONTEXT_EXTENSIONS = new Set(ACCEPTED_CONTEXT_FILE_TYPES.split(',').map((ext) => ext.trim().toLowerCase()));
-const MAX_CONTEXT_FILE_SIZE_BYTES = 10 * 1024 * 1024; // 10 MB per file
-const CONTEXT_NOTICE_TIMEOUT_MS = 3500;
-function getFileExtension(fileName) {
-    const trimmed = fileName.trim().toLowerCase();
-    const dotIdx = trimmed.lastIndexOf('.');
-    if (dotIdx === -1)
-        return '';
-    return trimmed.slice(dotIdx);
-}
-function formatFileList(fileNames) {
-    if (fileNames.length === 0)
-        return '';
-    const shown = fileNames.slice(0, 3).join(', ');
-    const extra = fileNames.length - 3;
-    return extra > 0 ? `${shown}, +${extra} more` : shown;
-}
-function getLocalFileFingerprint(file) {
-    return `${file.name.trim().toLowerCase()}::${file.size}::${file.lastModified}`;
-}
-function readFileAsDataUrl(file) {
-    return new Promise((resolve, reject) => {
-        const reader = new FileReader();
-        reader.onload = () => resolve(String(reader.result || ''));
-        reader.onerror = () => reject(reader.error || new Error('Failed to read file'));
-        reader.readAsDataURL(file);
-    });
-}
-function isImagePath(path) {
-    return /\.(png|jpe?g|webp|gif)(\?|#|$)/i.test(path);
-}
-function getClipboardImageType(item) {
-    const rawTypes = item.types;
-    if (!rawTypes)
-        return null;
-    for (const type of Array.from(rawTypes)) {
-        const normalizedType = String(type || '').trim().toLowerCase();
-        if (SUPPORTED_CLIPBOARD_IMAGE_TYPES.has(normalizedType)) {
-            return normalizedType;
-        }
-    }
-    return null;
-}
-function buildDownloadUrl(pathValue, displayName) {
-    const separator = pathValue.includes('?') ? '&' : '?';
-    return `${pathValue}${separator}download=1&filename=${encodeURIComponent(displayName)}`;
-}
-function getAttachmentDisplayName(item) {
-    if (typeof item === 'string')
-        return item.split('/').pop() || 'Context file';
-    return item.displayName || item.originalFilename || item.caption || item.fsPath || item.path.split('/').pop() || 'Context file';
-}
-function getAttachmentTypeLabel(item) {
-    const candidates = typeof item === 'string'
-        ? [item]
-        : [item.originalFilename, item.displayName, item.caption, item.fsPath, item.path];
-    for (const candidate of candidates) {
-        if (!candidate)
-            continue;
-        const ext = getFileExtension(candidate);
-        if (ext)
-            return ext.replace('.', '').slice(0, 5).toUpperCase();
-    }
-    const path = typeof item === 'string' ? item : item.path;
-    return /^https?:\/\//i.test(path) ? 'LINK' : 'FILE';
-}
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ContextAttachmentManager } from '../context/ContextAttachmentManager';
 export function TaskContextUpload(props) {
-    const { taskId, taskReferenceLabel, workspaceId, contextFiles, onAddContextFile, onRemoveContextFile, onUpdateContextCaption } = props;
-    const inputRef = useRef(null);
-    const [uploading, setUploading] = useState(false);
-    const [uploadError, setUploadError] = useState(null);
-    const [linkValue, setLinkValue] = useState('');
-    const [linkError, setLinkError] = useState(null);
-    const [contextNotice, setContextNotice] = useState(null);
-    const [showContextUpload, setShowContextUpload] = useState(false);
-    const [isDropActive, setIsDropActive] = useState(false);
-    const [dragDepth, setDragDepth] = useState(0);
-    const contextKeyRef = useRef(new Set());
-    const localUploadFingerprintRef = useRef(new Set());
-    const normalizeKey = (value) => (value || '').trim();
-    const getContextKeys = (path, fsPath) => {
-        const keys = [];
-        const normalizedPath = normalizeKey(path);
-        const normalizedFsPath = normalizeKey(fsPath);
-        if (normalizedPath)
-            keys.push(`path:${normalizedPath}`);
-        if (normalizedFsPath)
-            keys.push(`fs:${normalizedFsPath}`);
-        return keys;
-    };
-    const keySetFromFiles = useMemo(() => {
-        const next = new Set();
-        contextFiles.forEach((item) => {
-            if (typeof item === 'string') {
-                getContextKeys(item).forEach((key) => next.add(key));
-                return;
-            }
-            getContextKeys(item.path, item.fsPath).forEach((key) => next.add(key));
-        });
-        return next;
-    }, [contextFiles]);
-    useEffect(() => {
-        contextKeyRef.current = new Set(keySetFromFiles);
-    }, [keySetFromFiles]);
-    const hasAnyKey = (set, keys) => keys.some((key) => set.has(key));
-    const addKeys = (set, keys) => keys.forEach((key) => set.add(key));
-    const trimmedWorkspaceId = String(workspaceId || '').trim();
-    const buildApiHeaders = (contentType = 'application/json') => {
-        const headers = { 'Content-Type': contentType };
-        if (trimmedWorkspaceId)
-            headers['x-taskforce-workspace-id'] = trimmedWorkspaceId;
-        return headers;
-    };
-    const addLink = (rawValue, clearInput = true, contextKeySet = contextKeyRef.current) => {
-        const trimmed = rawValue.trim();
-        if (!trimmed)
-            return 'invalid';
-        const isHttp = /^https?:\/\//i.test(trimmed);
-        if (!isHttp)
-            return 'invalid';
-        const normalizedPath = trimmed;
-        const keys = getContextKeys(normalizedPath);
-        if (hasAnyKey(contextKeySet, keys))
-            return 'duplicate';
-        const nameFromPath = trimmed.split(/[\\/]/).pop() || trimmed;
-        onAddContextFile({
-            path: normalizedPath,
-            caption: nameFromPath,
-            timestamp: new Date().toISOString()
-        });
-        addKeys(contextKeySet, keys);
-        if (clearInput)
-            setLinkValue('');
-        setLinkError(null);
-        return 'added';
-    };
-    useEffect(() => {
-        if (!contextNotice)
-            return;
-        const timeoutId = window.setTimeout(() => {
-            setContextNotice(null);
-        }, CONTEXT_NOTICE_TIMEOUT_MS);
-        return () => window.clearTimeout(timeoutId);
-    }, [contextNotice]);
-    const handleSelectedFiles = async (selectedFilesInput) => {
-        if (selectedFilesInput.length === 0)
-            return;
-        setUploadError(null);
-        setContextNotice(null);
-        const selectedFiles = selectedFilesInput;
-        const unsupportedFiles = [];
-        const oversizedFiles = [];
-        const localDuplicateFiles = [];
-        const uploadCandidates = [];
-        const localFingerprintSet = new Set(localUploadFingerprintRef.current);
-        selectedFiles.forEach((file) => {
-            const ext = getFileExtension(file.name);
-            if (!ACCEPTED_CONTEXT_EXTENSIONS.has(ext)) {
-                unsupportedFiles.push(file.name);
-                return;
-            }
-            if (file.size > MAX_CONTEXT_FILE_SIZE_BYTES) {
-                oversizedFiles.push(file.name);
-                return;
-            }
-            const fingerprint = getLocalFileFingerprint(file);
-            if (localFingerprintSet.has(fingerprint)) {
-                localDuplicateFiles.push(file.name);
-                return;
-            }
-            localFingerprintSet.add(fingerprint);
-            uploadCandidates.push({ file, fingerprint });
-        });
-        const validationNotices = [];
-        if (unsupportedFiles.length > 0) {
-            validationNotices.push(`${unsupportedFiles.length} unsupported file${unsupportedFiles.length === 1 ? '' : 's'} skipped: ${formatFileList(unsupportedFiles)}.`);
-        }
-        if (oversizedFiles.length > 0) {
-            validationNotices.push(`${oversizedFiles.length} file${oversizedFiles.length === 1 ? '' : 's'} over 10 MB skipped: ${formatFileList(oversizedFiles)}.`);
-        }
-        if (localDuplicateFiles.length > 0) {
-            validationNotices.push(`${localDuplicateFiles.length} local duplicate file${localDuplicateFiles.length === 1 ? '' : 's'} skipped before upload: ${formatFileList(localDuplicateFiles)}.`);
-        }
-        if (uploadCandidates.length === 0) {
-            if (validationNotices.length > 0)
-                setContextNotice(validationNotices.join(' '));
-            if (inputRef.current)
-                inputRef.current.value = '';
-            return;
-        }
-        setUploading(true);
-        const contextKeySet = new Set(contextKeyRef.current);
-        let duplicateCount = 0;
-        try {
-            for (const { file, fingerprint } of uploadCandidates) {
-                let data = null;
-                // Keep uploads same-origin so local runtime never routes attachments through the cloud API base.
-                const initRes = await fetch('/api/taskforce/context-upload/init', {
-                    method: 'POST',
-                    headers: buildApiHeaders(),
-                    body: JSON.stringify({
-                        originalName: file.name,
-                        mimeType: file.type || 'application/octet-stream',
-                        size: file.size,
-                        taskId: taskId || null,
-                        workspaceId: trimmedWorkspaceId || null
-                    })
-                });
-                if (initRes.ok) {
-                    const initData = await initRes.json();
-                    if (initData?.success && typeof initData?.uploadUrl === 'string' && typeof initData?.path === 'string') {
-                        const uploadRes = await fetch(initData.uploadUrl, {
-                            method: String(initData.method || 'PUT'),
-                            headers: initData.headers || { 'Content-Type': file.type || 'application/octet-stream' },
-                            body: file
-                        });
-                        if (!uploadRes.ok) {
-                            throw new Error(`Upload failed for ${file.name}`);
-                        }
-                        const finalizeRes = await fetch('/api/taskforce/context-upload/finalize', {
-                            method: 'POST',
-                            headers: buildApiHeaders(),
-                            body: JSON.stringify({
-                                relativePath: initData.relativePath,
-                                mimeType: file.type || 'application/octet-stream',
-                                originalName: file.name,
-                                size: file.size,
-                                taskId: taskId || null,
-                                workspaceId: trimmedWorkspaceId || null
-                            })
-                        });
-                        if (!finalizeRes.ok) {
-                            const finalizeError = await finalizeRes.json().catch(() => ({}));
-                            throw new Error(finalizeError?.error || `Upload failed for ${file.name}`);
-                        }
-                        data = await finalizeRes.json().catch(() => null);
-                    }
-                    else if (initData?.success && typeof initData?.path === 'string') {
-                        data = initData;
-                    }
-                }
-                if (!data) {
-                    const encoded = await readFileAsDataUrl(file);
-                    const res = await fetch('/api/taskforce/context-upload', {
-                        method: 'POST',
-                        headers: buildApiHeaders(),
-                        body: JSON.stringify({
-                            file: encoded,
-                            originalName: file.name,
-                            taskId: taskId || null,
-                            workspaceId: trimmedWorkspaceId || null
-                        })
-                    });
-                    if (!res.ok) {
-                        throw new Error(`Upload failed for ${file.name}`);
-                    }
-                    data = await res.json();
-                }
-                if (!data?.success || !data?.path) {
-                    throw new Error(`Upload failed for ${file.name}`);
-                }
-                const keys = getContextKeys(data.path, data.fsPath);
-                if (hasAnyKey(contextKeySet, keys)) {
-                    duplicateCount += 1;
-                    continue;
-                }
-                onAddContextFile({
-                    path: data.path,
-                    fsPath: data.fsPath,
-                    caption: typeof data.caption === 'string' && data.caption.trim().length > 0 ? data.caption : file.name,
-                    displayName: typeof data.displayName === 'string' ? data.displayName : undefined,
-                    originalFilename: typeof data.originalFilename === 'string' ? data.originalFilename : file.name,
-                    assetId: typeof data.assetId === 'string' ? data.assetId : undefined,
-                    referenceNumber: typeof data.referenceNumber === 'number' ? data.referenceNumber : null,
-                    referenceLabel: typeof data.referenceLabel === 'string' ? data.referenceLabel : undefined,
-                    taskId: typeof data.taskId === 'string' ? data.taskId : null,
-                    timestamp: new Date().toISOString()
-                });
-                dispatchTaskforceContextAssetsMutated({
-                    workspaceId: trimmedWorkspaceId || 'default',
-                    taskId: taskId || null,
-                    reason: 'upload'
-                });
-                addKeys(contextKeySet, keys);
-                localUploadFingerprintRef.current.add(fingerprint);
-            }
-            const notices = [...validationNotices];
-            if (duplicateCount > 0) {
-                notices.push(`${duplicateCount} duplicate file${duplicateCount === 1 ? '' : 's'} skipped.`);
-            }
-            setContextNotice(notices.length > 0 ? notices.join(' ') : null);
-            contextKeyRef.current = contextKeySet;
-        }
-        catch (error) {
-            setUploadError(error instanceof Error ? error.message : 'Failed to upload context file');
-        }
-        finally {
-            setUploading(false);
-            if (inputRef.current)
-                inputRef.current.value = '';
-        }
-    };
-    const handleFilesSelected = async (files) => {
-        if (!files || files.length === 0)
-            return;
-        await handleSelectedFiles(Array.from(files));
-    };
-    const handlePasteImage = async () => {
-        setUploadError(null);
-        setContextNotice(null);
-        if (!navigator.clipboard || typeof navigator.clipboard.read !== 'function') {
-            setUploadError('Clipboard image paste is not available in this browser.');
-            return;
-        }
-        try {
-            const clipboardItems = await navigator.clipboard.read();
-            const imageFiles = [];
-            for (const item of clipboardItems) {
-                const imageType = getClipboardImageType(item);
-                if (!imageType)
-                    continue;
-                const blob = await item.getType(imageType);
-                const extension = imageType.toLowerCase() === 'image/png'
-                    ? 'png'
-                    : imageType.toLowerCase() === 'image/webp'
-                        ? 'webp'
-                        : 'jpg';
-                imageFiles.push(new globalThis.File([blob], `pasted-image-${Date.now()}.${extension}`, { type: imageType }));
-            }
-            if (imageFiles.length === 0) {
-                setUploadError('Clipboard does not currently contain a supported image.');
-                return;
-            }
-            await handleSelectedFiles(imageFiles);
-        }
-        catch (error) {
-            setUploadError(error?.message || 'Failed to read an image from the clipboard.');
-        }
-    };
-    const parseDroppedLinks = (event) => {
-        const droppedLinks = new Set();
-        const rawUriList = event.dataTransfer.getData('text/uri-list') || '';
-        const rawText = event.dataTransfer.getData('text/plain') || '';
-        const candidates = `${rawUriList}\n${rawText}`
-            .split('\n')
-            .map((line) => line.trim())
-            .filter((line) => !!line && !line.startsWith('#'));
-        for (const candidate of candidates) {
-            if (/^file:\/\//i.test(candidate)) {
-                try {
-                    const fileUrl = new URL(candidate);
-                    const fsPath = decodeURIComponent(fileUrl.pathname || '').trim();
-                    if (fsPath)
-                        droppedLinks.add(fsPath);
-                }
-                catch {
-                    // Ignore malformed file URL drops
-                }
-                continue;
-            }
-            droppedLinks.add(candidate);
-        }
-        return Array.from(droppedLinks);
-    };
-    const handleDrop = (event) => {
-        event.preventDefault();
-        event.stopPropagation();
-        setIsDropActive(false);
-        setDragDepth(0);
-        setUploadError(null);
-        setLinkError(null);
-        setContextNotice(null);
-        if (event.dataTransfer.files && event.dataTransfer.files.length > 0) {
-            void handleFilesSelected(event.dataTransfer.files);
-            return;
-        }
-        const droppedLinks = parseDroppedLinks(event);
-        if (droppedLinks.length === 0) {
-            setLinkError('Drop a file or URL.');
-            return;
-        }
-        const contextKeySet = new Set(contextKeyRef.current);
-        let duplicateCount = 0;
-        let addedCount = 0;
-        let invalidCount = 0;
-        droppedLinks.forEach((link) => {
-            const result = addLink(link, false, contextKeySet);
-            if (result === 'duplicate')
-                duplicateCount += 1;
-            if (result === 'added')
-                addedCount += 1;
-            if (result === 'invalid')
-                invalidCount += 1;
-        });
-        const notices = [];
-        if (duplicateCount > 0) {
-            notices.push(`${duplicateCount} duplicate link${duplicateCount === 1 ? '' : 's'} skipped.`);
-        }
-        if (invalidCount > 0) {
-            notices.push(`${invalidCount} local path${invalidCount === 1 ? '' : 's'} skipped. Upload files to attach them, or drop an http(s) URL to link.`);
-        }
-        setContextNotice(notices.length > 0 ? notices.join(' ') : (addedCount > 0 ? null : contextNotice));
-        contextKeyRef.current = contextKeySet;
-    };
-    const handleDragEnter = (event) => {
-        event.preventDefault();
-        event.stopPropagation();
-        setDragDepth((depth) => depth + 1);
-        setIsDropActive(true);
-    };
-    const handleDragLeave = (event) => {
-        event.preventDefault();
-        event.stopPropagation();
-        setDragDepth((depth) => {
-            const nextDepth = Math.max(0, depth - 1);
-            if (nextDepth === 0)
-                setIsDropActive(false);
-            return nextDepth;
-        });
-    };
-    const handleDragOver = (event) => {
-        event.preventDefault();
-        event.stopPropagation();
-        event.dataTransfer.dropEffect = 'copy';
-    };
-    const imageFiles = contextFiles.filter((item) => {
-        const path = typeof item === 'string' ? item : item.path;
-        return isImagePath(path);
-    });
-    const documentFiles = contextFiles.filter((item) => {
-        const path = typeof item === 'string' ? item : item.path;
-        return !isImagePath(path);
-    });
-    return (_jsxs("div", { className: styles.specialistSection, children: [_jsxs("div", { className: styles.toggleHeading, onClick: () => setShowContextUpload(!showContextUpload), title: showContextUpload ? 'Hide context documents' : 'Show context documents', children: [_jsxs("label", { className: styles.label, children: ["Context Documents ", contextFiles.length > 0 && `(${contextFiles.length})`] }), showContextUpload ? _jsx(ChevronDown, { size: 14 }) : _jsx(ChevronRight, { size: 14 })] }), showContextUpload && (_jsxs(_Fragment, { children: [_jsx("p", { className: styles.settingsHint, children: "Upload files into task context storage, or add an external http(s) URL." }), _jsxs("div", { className: styles.contextUploadPanel, children: [_jsxs("div", { className: styles.contextUploadActions, children: [_jsxs("button", { type: "button", className: styles.secondaryHeaderBtn, onClick: () => inputRef.current?.click(), disabled: uploading, children: [uploading ? _jsx(Loader2, { size: 12, className: styles.spinner }) : _jsx(FileUp, { size: 12 }), uploading ? 'Uploading...' : 'Upload File'] }), _jsxs("button", { type: "button", className: styles.secondaryHeaderBtn, onClick: () => {
-                                            void handlePasteImage();
-                                        }, disabled: uploading, children: [_jsx(Copy, { size: 12 }), "Paste Image from Clipboard"] })] }), _jsx("input", { ref: inputRef, type: "file", accept: ACCEPTED_CONTEXT_FILE_TYPES, multiple: true, className: styles.hiddenInput, onChange: (e) => {
-                                    void handleFilesSelected(e.target.files);
-                                } }), uploadError && _jsx("div", { className: styles.error, children: uploadError }), _jsxs("div", { className: styles.contextLinkRow, children: [_jsx("input", { type: "text", className: styles.input, placeholder: "Add external URL (https://...)", value: linkValue, onChange: (e) => {
-                                            setLinkValue(e.target.value);
-                                            if (linkError)
-                                                setLinkError(null);
-                                            if (contextNotice)
-                                                setContextNotice(null);
-                                        } }), _jsx("button", { type: "button", className: styles.secondaryHeaderBtn, onClick: () => {
-                                            if (!linkValue.trim()) {
-                                                setLinkError('Enter an http(s) URL to link.');
-                                                return;
-                                            }
-                                            const result = addLink(linkValue, true);
-                                            if (result === 'invalid') {
-                                                setLinkError('Only external http(s) URLs can be linked here. Upload files to attach them.');
-                                                return;
-                                            }
-                                            if (result === 'duplicate') {
-                                                setContextNotice('Link already exists in task context.');
-                                            }
-                                            else if (result === 'added') {
-                                                setContextNotice(null);
-                                            }
-                                        }, children: "Add URL" })] }), _jsxs("div", { className: `${styles.contextDropzone} ${isDropActive ? styles.contextDropzoneActive : ''}`, onDragEnter: handleDragEnter, onDragLeave: handleDragLeave, onDragOver: handleDragOver, onDrop: handleDrop, children: [_jsx(FileUp, { size: 14 }), _jsx("span", { children: "Drop files or URLs here" })] })] }), contextNotice && _jsx("div", { className: styles.contextNotice, children: contextNotice }), linkError && _jsx("div", { className: styles.error, children: linkError }), imageFiles.length > 0 && (_jsx("div", { className: styles.attachmentGrid, children: contextFiles.map((item, idx) => {
-                            const path = typeof item === 'string' ? item : item.path;
-                            if (!isImagePath(path))
-                                return null;
-                            const fsPath = typeof item === 'string' ? undefined : item.fsPath;
-                            const caption = typeof item === 'string' ? '' : item.caption || '';
-                            const displayName = getAttachmentDisplayName(item);
-                            const isImage = isImagePath(path);
-                            const isExternalUrl = /^https?:\/\//i.test(path);
-                            const canAnnotate = canOpenAnnotatedAttachment(item, { taskId });
-                            return (_jsxs("div", { className: styles.attachmentCard, children: [_jsxs("div", { className: styles.attachmentPreviewContainer, children: [isImage ? (_jsx("img", { src: path, alt: caption || `Context file ${idx}`, onClick: () => {
-                                                    if (dispatchOpenAnnotatedAttachment(item, { taskId, taskReferenceLabel }))
-                                                        return;
-                                                    window.open(path, '_blank');
-                                                }, onError: (e) => {
-                                                    e.target.style.display = 'none';
-                                                    e.target.parentElement.classList.add(styles.brokenImage);
-                                                } })) : (_jsxs("button", { type: "button", className: styles.contextFileLink, onClick: () => {
-                                                    if (dispatchOpenMarkdownDocument(item, fsPath))
-                                                        return;
-                                                    window.open(path, '_blank');
-                                                }, title: "Open file", children: [_jsx(FileUp, { size: 16 }), _jsx("span", { children: caption || fsPath || path.split('/').pop() || 'Context file' })] })), _jsxs("div", { className: styles.brokenImagePlaceholder, children: [_jsx(AlertTriangle, { size: 16 }), _jsx("span", { children: "Preview unavailable" })] }), _jsxs("div", { className: styles.attachmentActions, children: [canAnnotate && (_jsx("button", { type: "button", className: styles.attachmentActionBtn, onClick: (e) => {
-                                                            e.stopPropagation();
-                                                            dispatchOpenAnnotatedAttachment(item, { taskId, taskReferenceLabel });
-                                                        }, title: "Annotate", children: _jsx(PencilLine, { size: 12 }) })), fsPath && (_jsx("button", { type: "button", className: styles.attachmentActionBtn, onClick: (e) => {
-                                                            e.stopPropagation();
-                                                            navigator.clipboard.writeText(fsPath);
-                                                        }, title: `Copy path: ${fsPath}`, children: _jsx(Copy, { size: 12 }) })), !isExternalUrl && (_jsx("button", { type: "button", className: styles.attachmentActionBtn, onClick: (e) => {
-                                                            e.stopPropagation();
-                                                            window.open(buildDownloadUrl(path, caption || displayName), '_blank');
-                                                        }, title: "Download", children: _jsx(Download, { size: 12 }) })), _jsx("button", { type: "button", className: styles.attachmentActionBtn, onClick: (e) => {
-                                                            e.stopPropagation();
-                                                            onRemoveContextFile(idx);
-                                                        }, title: "Delete", children: _jsx(Trash2, { size: 12 }) })] })] }), _jsx("input", { type: "text", className: styles.attachmentCaptionInput, placeholder: "Add a label...", value: caption, onChange: (e) => onUpdateContextCaption(idx, e.target.value) })] }, idx));
-                        }) })), documentFiles.length > 0 && (_jsx("div", { className: styles.documentAttachmentList, children: contextFiles.map((item, idx) => {
-                            const path = typeof item === 'string' ? item : item.path;
-                            if (isImagePath(path))
-                                return null;
-                            const fsPath = typeof item === 'string' ? undefined : item.fsPath;
-                            const caption = typeof item === 'string' ? '' : item.caption || '';
-                            const displayName = getAttachmentDisplayName(item);
-                            const fileType = getAttachmentTypeLabel(item);
-                            const documentReferenceLabel = typeof item === 'string' ? '' : getDocumentReferenceLabel(item);
-                            const isExternalUrl = /^https?:\/\//i.test(path);
-                            return (_jsxs("div", { className: styles.documentAttachmentItem, children: [_jsxs("div", { className: styles.documentAttachmentRow, children: [_jsxs("button", { type: "button", className: styles.documentAttachmentLink, onClick: () => {
-                                                    if (dispatchOpenMarkdownDocument(item, fsPath))
-                                                        return;
-                                                    window.open(path, '_blank');
-                                                }, title: displayName, children: [_jsxs("span", { className: styles.documentAttachmentMain, children: [_jsx("span", { className: styles.documentAttachmentIcon, "aria-hidden": "true", children: _jsx(File, { size: 13 }) }), _jsxs("span", { className: styles.documentAttachmentText, children: [_jsx("span", { className: styles.documentAttachmentName, children: displayName }), documentReferenceLabel && (_jsx("span", { className: styles.taskIdBadge, children: documentReferenceLabel }))] })] }), _jsx("span", { className: styles.documentAttachmentType, children: fileType })] }), _jsxs("div", { className: styles.documentAttachmentActions, children: [fsPath && (_jsx("button", { type: "button", className: styles.documentAttachmentActionBtn, onClick: () => {
-                                                            navigator.clipboard.writeText(fsPath);
-                                                        }, title: `Copy path: ${fsPath}`, children: _jsx(Copy, { size: 12 }) })), !isExternalUrl && (_jsx("button", { type: "button", className: styles.documentAttachmentActionBtn, onClick: () => {
-                                                            window.open(buildDownloadUrl(path, caption || displayName), '_blank');
-                                                        }, title: "Download", children: _jsx(Download, { size: 12 }) })), _jsx("button", { type: "button", className: styles.documentAttachmentActionBtn, onClick: () => onRemoveContextFile(idx), title: "Delete", children: _jsx(Trash2, { size: 12 }) })] })] }), _jsx("input", { type: "text", className: styles.documentAttachmentCaptionInput, placeholder: "Add a label...", value: caption, onChange: (e) => onUpdateContextCaption(idx, e.target.value) })] }, idx));
-                        }) }))] }))] }));
+    const { taskId, taskReferenceLabel, workspaceId, apiBaseUrl, contextFiles, onAddContextFile, onRemoveContextFile, onUpdateContextCaption, } = props;
+    return (_jsx(ContextAttachmentManager, { ownerType: "task", ownerId: taskId, ownerReferenceLabel: taskReferenceLabel, workspaceId: workspaceId, apiBaseUrl: apiBaseUrl, attachments: contextFiles, onAddAttachment: onAddContextFile, onRemoveAttachment: onRemoveContextFile, onUpdateAttachmentCaption: onUpdateContextCaption }));
 }

package/dist/components/task/TaskContextUpload.test.js

@@ -32,11 +32,11 @@ describe('TaskContextUpload drag and drop', () => {
     const renderUpload = (contextFiles = [], taskId, extraProps) => render(_jsx(TaskContextUpload, { taskId: taskId, contextFiles: contextFiles, onAddContextFile: onAddContextFile, onRemoveContextFile: onRemoveContextFile, onUpdateContextCaption: onUpdateContextCaption, ...extraProps }));
     const openSection = async (user) => {
         const localUser = user ?? userEvent.setup();
-        const showToggle = screen.queryByTitle('Show context documents');
-        if (showToggle) {
+        if (!screen.queryByText('Drop files or URLs here')) {
+            const showToggle = await screen.findByTitle('Show context documents');
             await localUser.click(showToggle);
         }
-        return screen.getByText('Drop files or URLs here');
+        return screen.findByText('Drop files or URLs here');
     };
     beforeEach(() => {
         vi.clearAllMocks();