feat(settings): choose between Save As and saving into a folder

Downloading a selection of twenty files meant twenty Save As dialogs,
which is the wrong answer for the feature that had just been built.
Settings → Downloads now offers saving automatically, and that is the
default; asking every time stays available for people who want it.

The correction worth recording: a web page cannot be given a filesystem
path and cannot read one either. There is no ~/Downloads to configure and
nothing to type, on any operating system — which is also why none of this
will need changing on Windows. What a browser grants is a handle to a
folder the user picked in a dialog, so that is what the setting keeps:
picked once, stored in IndexedDB, re-confirmed once a session because the
grant comes back as a claim rather than a permission. Where no folder has
been granted, and in Firefox and Safari where none can be, files go to
the browser's own download folder — which on most machines is the folder
that was meant all along.

Automatic saving has one risk a dialog does not: it can silently replace
a file. It does not — a taken name gets a suffix before the extension,
`clip (2).mp4`, so a download folder does not fill up with files the
system no longer recognises. That, and the default, are what
test_downloads.py pins.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

1 files changed, 11 insertions, 0 deletions

diff --git a/packages/meshbay-hub/src/meshbay_hub/static/style.css b/packages/meshbay-hub/src/meshbay_hub/static/style.css
index 24e8843..2296b2d 100644
--- a/packages/meshbay-hub/src/meshbay_hub/static/style.css
+++ b/packages/meshbay-hub/src/meshbay_hub/static/style.css
@@ -1179,6 +1179,17 @@ button:disabled { opacity: 0.5; cursor: not-allowed; }
 .group-desc-edit textarea:focus { outline: none; border-color: var(--border-focus); }
 .group-desc-edit div { display: flex; gap: 6px; margin-top: 4px; }
 
+.settings-choice {
+  display: flex;
+  align-items: flex-start;
+  gap: 8px;
+  padding: 7px 0;
+  cursor: pointer;
+}
+.settings-choice input { margin-top: 3px; flex-shrink: 0; }
+.settings-choice strong { display: block; font-size: 0.88em; color: var(--text); }
+.settings-choice .settings-hint { display: block; margin-top: 2px; }
+
 /* ── Transfers widget ────────────────────────────────────────────────────── */
 
 .transfer-wrap { position: relative; display: flex; align-items: center; }