fix(webapp): Settings → About says how to take your files elsewhere (BEA-141) (#181)

bdrive export moves a whole project between hubs with full fidelity, and
the web UI mentioned it nowhere — the answer to "why trust a hub with my
files" only existed in a file a user had no reason to open.

Adds one paragraph to the About card: what the archive holds (every
device's journal and every blob, so full history and authorship), that
bdrive import restores it into any hub, that export warns on unpushed
changes, and a link to the migration docs. Copy only — no server route,
no download button, no palette action. The card already sits outside
every mayEdit guard, so every project member sees it; the member-role
settings e2e asserts that.

One correction to the reviewed plan: bdrive export takes a folder, not a
project id, so the copy says to run it in the synced folder rather than
leaning on the project id rendered above it.

Co-authored-by: Claude Opus 5 (1M context) <noreply@anthropic.com>

internal/webapp/frontend/e2e/home.spec.ts

@@ -350,6 +350,13 @@ test("project settings: a member sees no danger zone and cannot edit", async ({
   await expect(page.locator("#ps-desc")).toBeDisabled();
   await expect(page.locator("#ps-icon-btn")).toBeDisabled();
   await expect(page.locator("#ps-save")).toHaveCount(0);
+  // The way out is a trust answer, so it is not owner-only: a member reading
+  // About sees the export fact and the docs link.
+  await expect(page.locator(".ps-export")).toContainText("bdrive export");
+  await expect(page.locator(".ps-export a")).toHaveAttribute(
+    "href",
+    "https://docs.beardrive.ai/reference/migration/",
+  );
 });
 
 test("project settings: icon + description save, and show in nav and dashboard", async ({

internal/webapp/frontend/src/components/ProjectSettings.tsx

@@ -248,6 +248,23 @@ export function ProjectSettings({
               </>
             )}
           </dl>
+          {/* The anti-lock-in answer, at the moment someone asks it. Copy only:
+              exporting is a CLI job (`bdrive export [folder]` — run in the synced
+              folder, no project id), so there is no route and no button here. */}
+          <p className="ps-note ps-export">
+            <strong>Take your files elsewhere.</strong> Run <code>bdrive export</code> in the synced
+            folder to write the whole project — every device's journal and every content blob, so
+            full history and authorship — into a single archive. <code>bdrive import</code> restores
+            it into any other BearDrive hub, self-hosted or cloud. Export warns first if this device
+            still has changes it hasn't pushed.{" "}
+            <a
+              href="https://docs.beardrive.ai/reference/migration/"
+              target="_blank"
+              rel="noreferrer"
+            >
+              How migration works →
+            </a>
+          </p>
         </CardContent>
       </Card>
 

internal/webapp/frontend/src/style.css

@@ -530,6 +530,9 @@ button, input, a.btn { font-family: inherit; }
 .ps-facts { display: grid; grid-template-columns: auto 1fr; gap: 8px 20px; margin: 0; font-size: 13px; }
 .ps-facts dt { color: var(--text-faint); }
 .ps-facts dd { margin: 0; color: var(--text-dim); }
+.ps-export { margin: 16px 0 0; max-width: 62ch; }
+.ps-export code { font-size: 12px; padding: 1px 5px; border-radius: 4px; background: var(--surface); border: 1px solid var(--border); color: var(--text); }
+.ps-export a { color: var(--accent-bright); text-decoration: none; }
 
 /* ---- admin panels ---- */
 /* width comes from .page (app) — see #content */

internal/webapp/static/index.html

@@ -5,10 +5,10 @@
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <title>BearDrive</title>
 <link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%23f5a623'><rect x='4' y='4' width='5.6' height='24'/><rect x='11.2' y='4' width='14.4' height='11.2'/><rect x='11.2' y='16.8' width='16.8' height='11.2'/></svg>">
-  <script type="module" crossorigin src="/assets/index-seXZWqX2.js"></script>
+  <script type="module" crossorigin src="/assets/index-Cr0JEM1I.js"></script>
   <link rel="modulepreload" crossorigin href="/assets/_commonjsHelpers-CqkleIqs.js">
   <link rel="modulepreload" crossorigin href="/assets/mermaid-DQuCJ8Gi.js">
-  <link rel="stylesheet" crossorigin href="/assets/index-Bvo9-TXr.css">
+  <link rel="stylesheet" crossorigin href="/assets/index-Bg9aVdbo.css">
 </head>
 <body>
 <div id="root"></div>