From 4066c754a613deb965472853fe69727d68be593e Mon Sep 17 00:00:00 2001 From: Christophe Besson Date: Sat, 15 Aug 2026 15:48:36 +0200 Subject: fix(downloads): automatic really is automatic, and a selection downloads all of it MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Two bugs in what shipped last, and both were mine. Automatic mode still opened Save As, because with no folder granted the code fell through to the file picker — while the documentation said it would use the browser's own download folder. It does that now. Over 512 MB it still asks, since getting there means holding the file in memory and a tab will not survive a 40 GB blob; Settings is where to stop it asking again. Selecting two files downloaded one. They were started without awaiting, so each asked the browser for a save dialog at once, and a browser allows exactly one — the rest were rejected and the errors went nowhere. They are awaited one at a time now, which serializes the dialogs and not the transfers: each call returns as soon as its transfer is registered. Then the adjustments. The transfers widget offers Open on a finished download that went into a granted folder — the bytes go to a new tab, and that is the whole of what a page can do: no browser lets one start a desktop application or show a file manager, so the folder half of that request cannot be built and the guide says so. The Files toolbar was four controls of three different heights in a row. It is three groups now — what you can add, where you are, what you can do with what is here — on one baseline, with icons from the set and a gap between the dots and the word Actions. Chat comes first among the tabs and is the one you land on. The three Discover entries in the sidebar have icons. And a link in a chat message becomes a link: built as an element and never as markup, http and https only, so `javascript:` is not one message away from running here. Co-Authored-By: Claude Opus 5 --- packages/meshbay-hub/src/meshbay_hub/static/app.js | 169 +++++++++++++++------ 1 file changed, 120 insertions(+), 49 deletions(-) (limited to 'packages/meshbay-hub/src/meshbay_hub/static/app.js') diff --git a/packages/meshbay-hub/src/meshbay_hub/static/app.js b/packages/meshbay-hub/src/meshbay_hub/static/app.js index b84b7b1..c8fb694 100644 --- a/packages/meshbay-hub/src/meshbay_hub/static/app.js +++ b/packages/meshbay-hub/src/meshbay_hub/static/app.js @@ -261,6 +261,13 @@ const ICON_PATHS = { upload: ['M12 20.5v-12', 'M7.5 13l4.5-4.5 4.5 4.5', 'M4.5 4h15'], transfer: ['M6.5 3.5v11', 'M3.5 11l3 3.5 3-3.5', 'M17.5 20.5v-11', 'M14.5 13l3-3.5 3 3.5'], + search: ['M11 4.5a6.5 6.5 0 1 0 0 13 6.5 6.5 0 0 0 0-13', 'M15.8 15.8L20.5 20.5'], + dots: ['M12 5.6h.01', 'M12 12h.01', 'M12 18.4h.01'], + checkbox: ['M5.5 4h13a1.5 1.5 0 0 1 1.5 1.5v13a1.5 1.5 0 0 1-1.5 1.5h-13A1.5 1.5 0 0 1 4 18.5v-13A1.5 1.5 0 0 1 5.5 4z'], + home: ['M4 11.2L12 4.5l8 6.7', 'M6.2 9.8V19a1 1 0 0 0 1 1h9.6a1 1 0 0 0 1-1V9.8'], + 'folder-plus': ['M3.5 6.6a1 1 0 0 1 1-1h4.2l2 2.4h7.8a1 1 0 0 1 1 1v9.4a1 1 0 0 1-1 1h-14a1 1 0 0 1-1-1z', + 'M12 11.4v5', 'M9.5 13.9h5'], + plus: ['M12 5v14', 'M5 12h14'], clip: ['M20.5 11.8l-8.4 8.4a5.4 5.4 0 0 1-7.6-7.6l8.8-8.8a3.6 3.6 0 0 1 5.1 5.1l-8.8 8.8a1.8 1.8 0 0 1-2.5-2.5l8.1-8.1'], pencil: ['M4 20h4l10.5-10.5a2.1 2.1 0 0 0-3-3L5 17v3', 'M14.5 6.5l3 3'], @@ -418,6 +425,11 @@ function TransferWidget() { : it.status === 'cancelled' ? t('transfers.cancelled') : it.error || t('transfers.failed')} + ${it.canOpen && html` + + `} `} @@ -475,11 +487,11 @@ function Sidebar({ groups, route, menuOpen, role }) {
${t('sidebar.discover')}
${t('sidebar.public_groups')} + href="#/explore"><${Icon} name="globe" /> ${t('sidebar.public_groups')} ${t('sidebar.search')} + href="#/search"><${Icon} name="search" /> ${t('sidebar.search')} ${t('sidebar.create_group')} + href="#/create-group"><${Icon} name="plus" /> ${t('sidebar.create_group')}
${t('sidebar.my_groups')}
@@ -938,13 +950,21 @@ const PIPELINE_WINDOW = 8; * it and hand the browser a blob", or false for "the person dismissed the * dialog", which is not an error and must not start a transfer. */ -async function _openDownloadTarget(filename, pickerOpts = {}) { +async function _openDownloadTarget(filename, size = 0, pickerOpts = {}) { try { const target = await downloads.openTarget(filename); if (target) return target; } catch (err) { console.warn('[MeshBay] download folder unusable:', err.message); } + + // No granted folder. Saving automatically means not putting a dialog in the + // way, so anything that fits in memory goes to the browser's own download + // folder — which is what "automatic" meant to whoever chose the setting. + // Past that a blob would take the tab down with it, and one dialog is the + // lesser evil; Settings is where to stop it happening again. + if (downloads.getMode() === 'auto' && size < downloads.BLOB_LIMIT) return null; + if (!window.showSaveFilePicker) return null; try { const handle = await window.showSaveFilePicker({ @@ -1030,7 +1050,7 @@ function GroupPage({ groupId, group, token, username, userId, onRefreshAuth, const [currentPath, setCurrentPath] = useState(''); const [videoEntry, setVideoEntry] = useState(null); const [previewEntry, setPreviewEntry] = useState(null); - const [tab, setTab] = useState('files'); + const [tab, setTab] = useState('chat'); // Directories are not index entries, so a new empty one needs a nudge // to appear in the breadcrumb listing. const [nodeDirs, setNodeDirs] = useState([]); @@ -1201,12 +1221,12 @@ function GroupPage({ groupId, group, token, username, userId, onRefreshAuth, // Both of these have to happen inside the click: a browser grants a file // picker, and re-grants a folder, only from a user gesture. - const target = await _openDownloadTarget(entry.name); + const target = await _openDownloadTarget(entry.name, entry.size); if (target === false) return; // the picker was dismissed transfers.start({ kind: 'download', name: (target && target.name) || entry.name, - total: entry.size, transport, + total: entry.size, transport, open: target && target.open, run: async ({ signal, onProgress }) => { const totalChunks = Math.ceil(entry.size / CHUNK_SIZE); let done = 0; @@ -1311,7 +1331,7 @@ function GroupPage({ groupId, group, token, username, userId, onRefreshAuth, const totalBytes = files.reduce((n, f) => n + (f.entry.size || 0), 0); const suggested = (dir.split('/').pop() || 'files') + '.zip'; - const target = await _openDownloadTarget(suggested, { + const target = await _openDownloadTarget(suggested, totalBytes, { types: [{ description: 'ZIP archive', accept: { 'application/zip': ['.zip'] } }], }); @@ -1325,7 +1345,7 @@ function GroupPage({ groupId, group, token, username, userId, onRefreshAuth, transfers.start({ kind: 'download', name: (target && target.name) || suggested, - total: totalBytes, transport, + total: totalBytes, transport, open: target && target.open, run: async ({ signal, onProgress }) => { const writable = target ? target.writable : null; const parts = writable ? null : []; @@ -1475,8 +1495,14 @@ function GroupPage({ groupId, group, token, username, userId, onRefreshAuth, ? selectedFiles[0] : null; const deletableFiles = selectedFiles.filter( e => isNodeAdmin || (userId && e.uploader_id === userId)); - const run = (fn) => { setActionsOpen(false); setSelecting(false); - setSelected(new Set()); fn(); }; + const run = (fn) => { + setActionsOpen(false); + setSelecting(false); + setSelected(new Set()); + Promise.resolve().then(fn).catch(err => { + if (err && err.name !== 'AbortError') setError(err.message); + }); + }; const actionItems = html` ${onlyFile && onlyFile.type === 'video' && html` @@ -1490,18 +1516,21 @@ function GroupPage({ groupId, group, token, username, userId, onRefreshAuth, `} ${selectedFiles.length > 0 && html` - `} ${selectedDirs.length > 0 && html` - +
${tab === 'files' && html`
- - +
+ + +
+
- setCurrentPath('')}>/ + setCurrentPath('')}> + <${Icon} name="home" /> + ${breadcrumbs.map((seg, i) => { const path = breadcrumbs.slice(0, i + 1).join('/'); return html` @@ -1621,28 +1656,33 @@ function GroupPage({ groupId, group, token, username, userId, onRefreshAuth, `; })}
- setFilter(e.target.value)} /> - - ${selecting && html` -
- - ${actionsOpen && html` -
${actionItems}
- `} + +
+
+ <${Icon} name="search" /> + setFilter(e.target.value)} />
- `} + + ${selecting && html` +
+ + ${actionsOpen && html`
${actionItems}
`} +
+ `} +
@@ -2067,6 +2107,34 @@ function MembersPanel({ groupId, group, token, transportRef, gekRef, // ── Chat Panel ────────────────────────────────────────────────────────── +/** + * Message text with its links made clickable. + * + * Only http and https, and built as elements rather than markup: a message is + * something another member wrote, so it must never become HTML. `javascript:` + * and `data:` are not matched at all, and the anchors carry noopener so the new + * tab cannot reach back into this one. + */ +const URL_RE = /\bhttps?:\/\/[^\s<>"']+/gi; + +function linkify(text) { + const out = []; + let last = 0; + for (const m of String(text).matchAll(URL_RE)) { + if (m.index > last) out.push(text.slice(last, m.index)); + // Trailing punctuation is almost never part of the address. + let url = m[0]; + let tail = ''; + while (/[.,;:!?)\]]$/.test(url)) { tail = url.slice(-1) + tail; url = url.slice(0, -1); } + out.push(html`${url}`); + if (tail) out.push(tail); + last = m.index + m[0].length; + } + if (last < text.length) out.push(text.slice(last)); + return out; +} + function formatTime(ts) { const d = new Date(ts * 1000); const now = new Date(); @@ -2258,7 +2326,10 @@ function ChatPanel({ transportRef, username, entries, gekRef, onRefreshIndex, on
${formatSize(att.size)}
` : html` - ${m.payload} + + ${linkify(parsed && typeof parsed.text === 'string' + ? parsed.text : m.payload)} + `} ${formatTime(m.timestamp)} -- cgit v1.2.3