feat: copy a file's or folder's #/name@owner link from Files, Music, Photos and Search

"Copy link" puts the address group-link.js resolves on the clipboard, on the
hub's origin rather than the page's, so a link copied in the desktop
application is not app://meshbay. Files offers it for one row, from the
right-click menu or the toolbar with one row ticked (a phone's way in);
Music on one track's menu, whose dots a phone has; Photos on a right-clicked
tile and in the lightbox's bar. The video player and the file preview carry
a link button next to Download.

Applications get a `linkFor(entry | folderPath)` prop (MESHBAY_DESIGN.md
§9.2) and offer the action only when it names a link. The group page builds
it from the hub's row; Search from each result's own group and its path
before the merged views prefixed it, and names no link for a folder of the
merged tree, which a group name alone does not identify.

harness/copy_link_probe.py mounts the three applications in Chrome and reads
what reached the clipboard.

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

1 files changed, 264 insertions, 0 deletions

diff --git a/packages/meshbay-hub/tests/harness/copy_link_probe.py b/packages/meshbay-hub/tests/harness/copy_link_probe.py
new file mode 100644
index 0000000..50d269d
--- /dev/null
+++ b/packages/meshbay-hub/tests/harness/copy_link_probe.py
@@ -0,0 +1,264 @@
+#!/usr/bin/env python3
+"""
+"Copy link" in Files, Music and Photos, in a real browser.
+
+Mounts the shipped `FilesPanel`, `MusicApp` and `PhotosApp` on a made-up
+index — no node, no transport — with the `linkFor` a group page gives them,
+built by the real `copy-link.js` for a group `demo@someowner`. Opens each
+menu the way a reader would (right-click; the dots on a phone; the Files
+toolbar with one row ticked), picks "Copy link", and reads back what reached
+the clipboard and what the page said.
+
+    copy_link_probe.py
+
+Prints JSON: one entry per case.
+"""
+
+import http.server
+import json
+import socketserver
+import subprocess
+import sys
+import tempfile
+import threading
+import time
+from pathlib import Path
+
+STATIC = Path(__file__).resolve().parents[2] / "src" / "meshbay_hub" / "static"
+PORT = 8775
+RECORDS = []
+socketserver.TCPServer.allow_reuse_address = True
+
+FRAME = r"""<!doctype html><html><head><meta charset=utf-8>
+<link rel="stylesheet" href="/style.css"></head><body>
+<div id="files"></div><div id="music"></div><div id="photos"></div>
+<script type="module">
+import { html, render } from '/vendor/htm-preact.js';
+import { initLocale, setLocale } from '/i18n.js';
+import { FilesPanel } from '/files-app.js';
+import { MusicApp } from '/music-app.js';
+import { PhotosApp } from '/photos-app.js';
+import { groupItemLink, entryPath } from '/copy-link.js';
+
+const LOGS = [];
+addEventListener('error', (e) => LOGS.push('error: ' + (e.message || e)));
+addEventListener('unhandledrejection',
+  (e) => LOGS.push('rejection: ' + (e.reason && e.reason.message || e.reason)));
+const frame = () => new Promise((r) => requestAnimationFrame(() => requestAnimationFrame(r)));
+const wait = (ms) => new Promise((r) => setTimeout(r, ms));
+
+// What the clipboard was handed, and nothing else: a headless page has no
+// clipboard permission to test against.
+const COPIES = [];
+Object.defineProperty(navigator, 'clipboard', { configurable: true,
+  value: { writeText: async (text) => { COPIES.push(text); } } });
+
+const GROUP = { name: 'demo', owner_username: 'someowner' };
+const linkFor = (target) => (target
+  ? groupItemLink(GROUP, typeof target === 'string' ? target : entryPath(target)) : null);
+const noop = () => {};
+const ref = { current: null };
+
+const labels = () => [...document.querySelectorAll('.ctx-menu .ctx-menu-label')]
+  .map((el) => el.textContent);
+const pick = async (label) => {
+  const item = [...document.querySelectorAll('.ctx-menu .ctx-menu-item')]
+    .find((b) => b.querySelector('.ctx-menu-label').textContent === label);
+  if (!item) return false;
+  item.click();
+  await wait(50);
+  return true;
+};
+const note = () => (document.querySelector('.copy-link-note') || {}).textContent || '';
+const closeMenus = async () => {
+  document.body.dispatchEvent(new MouseEvent('mousedown', { bubbles: true }));
+  await frame();
+};
+const rightClick = async (el) => {
+  await closeMenus();
+  const r = el.getBoundingClientRect();
+  el.dispatchEvent(new MouseEvent('contextmenu', { bubbles: true, cancelable: true,
+    clientX: r.left + 10, clientY: r.top + 5 }));
+  await frame();
+};
+const rowNamed = (name) => [...document.querySelectorAll('tr.file-row')]
+  .find((tr) => tr.querySelector('.file-name')
+    && tr.querySelector('.file-name').textContent.trim().startsWith(name));
+
+(async () => {
+  const cases = [];
+  try {
+    setLocale('en');
+    await initLocale();
+    try { localStorage.setItem('meshbay_music_view_mode', 'flat'); } catch {}
+
+    // -- Files --
+    const FILES = [
+      { id: 'f1', name: 'IMG 0001.JPG', path: 'Root/trip_2015', size: 10, type: 'image',
+        added_at: 1 },
+      { id: 'f2', name: 'notes.txt', path: 'Root/trip_2015', size: 5, type: 'document',
+        added_at: 2 },
+    ];
+    render(html`<${FilesPanel} groupId="g" transportRef=${ref} gekRef=${ref}
+      status="connected" entries=${FILES} nodeDirs=${['Root', 'Root/trip_2015']}
+      nodeRoots=${[{ name: 'Root', writable: false }]}
+      setEntries=${noop} setNodeDirs=${noop} setNodeRoots=${noop} applyIndex=${noop}
+      isNodeAdmin=${false} operatorPaired=${false} userId="me" setError=${noop}
+      onPreview=${noop} linkFor=${linkFor} />`, document.getElementById('files'));
+    await frame();
+
+    await rightClick(rowNamed('Root'));
+    const folderLabels = labels();
+    await pick('Copy link');
+    cases.push({ case: 'files folder', labels: folderLabels, copied: COPIES.at(-1), note: note() });
+
+    rowNamed('Root').click(); await frame();
+    rowNamed('trip_2015').click(); await frame();
+    await rightClick(rowNamed('IMG 0001.JPG'));
+    const fileLabels = labels();
+    await pick('Copy link');
+    cases.push({ case: 'files file', labels: fileLabels, copied: COPIES.at(-1), note: note() });
+
+    await closeMenus();
+    const linkBtn = () => document.querySelector('.tb-actions button[aria-label="Copy link"]');
+    rowNamed('notes.txt').querySelector('input[type=checkbox]').click(); await frame();
+    const oneTicked = linkBtn() ? !linkBtn().disabled : null;
+    if (linkBtn() && !linkBtn().disabled) { linkBtn().click(); await wait(50); }
+    const copiedFromToolbar = COPIES.at(-1);
+    for (const n of ['IMG 0001.JPG', 'notes.txt']) {
+      rowNamed(n).querySelector('input[type=checkbox]').click(); await frame();
+    }
+    const twoTicked = linkBtn() ? !linkBtn().disabled : null;
+    cases.push({ case: 'files toolbar', one_enabled: oneTicked, two_enabled: twoTicked,
+      copied: copiedFromToolbar });
+    render(null, document.getElementById('files'));
+
+    // -- Music: a loose track, its row's dots (what a phone has) --
+    const TRACKS = [
+      { id: 'a1', name: 'track 01.flac', path: 'Music/Some Album', size: 3, type: 'audio' },
+      { id: 'a2', name: 'track 02.flac', path: 'Music/Some Album', size: 3, type: 'audio' },
+    ];
+    render(html`<${MusicApp} groupId="g" transportRef=${ref} gekRef=${ref}
+      status="connected" entries=${TRACKS} musicDirectories=${['Music']}
+      musicbrainzConfig=${{ enabled: false }} onPlayQueue=${noop} userId=""
+      linkFor=${linkFor} />`, document.getElementById('music'));
+    await frame();
+    await closeMenus();
+    const dots = document.querySelector('.music-flat-track .ctx-dots');
+    if (dots) { dots.click(); await frame(); }
+    const trackLabels = labels();
+    await pick('Copy link');
+    cases.push({ case: 'music track', dots: Boolean(dots), labels: trackLabels,
+      copied: COPIES.at(-1) });
+    render(null, document.getElementById('music'));
+
+    // -- Photos: right-click a tile; the lightbox's button --
+    const PHOTOS = [
+      { id: 'p1', name: 'beach.jpg', path: 'Pics/Summer', size: 4, type: 'image', added_at: 1 },
+    ];
+    render(html`<${PhotosApp} groupId="g" transportRef=${ref} gekRef=${ref}
+      status="connected" entries=${PHOTOS} photoDirectories=${['Pics']}
+      setError=${noop} linkFor=${linkFor} />`, document.getElementById('photos'));
+    await frame();
+    const album = document.querySelector('.photo-album-card');
+    if (album) { album.click(); await frame(); }
+    const tile = document.querySelector('.photo-tile');
+    let tileLabels = [];
+    if (tile) {
+      await rightClick(tile);
+      tileLabels = labels();
+      await pick('Copy link');
+    }
+    const fromTile = COPIES.at(-1);
+    if (tile) { tile.click(); await frame(); }
+    const lb = document.querySelector('.photo-lightbox button[aria-label="Copy link"]');
+    COPIES.length = 0;
+    if (lb) { lb.click(); await wait(50); }
+    cases.push({ case: 'photos', tile: Boolean(tile), labels: tileLabels, copied: fromTile,
+      lightbox_button: Boolean(lb), lightbox_copied: COPIES.at(-1) || null });
+
+    parent.postMessage({ cases, logs: LOGS, origin: location.origin }, '*');
+  } catch (err) {
+    parent.postMessage({ error: String(err && (err.stack || err)), logs: LOGS }, '*');
+  }
+})();
+</script></body></html>"""
+
+PAGE = r"""<!doctype html><html><head><meta charset=utf-8></head>
+<body style="margin:0"><div id="frames"></div><script>
+addEventListener('message', (e) => {
+  fetch('/log', { method: 'POST', body: JSON.stringify(e.data) });
+});
+const f = document.createElement('iframe');
+f.src = '/case';
+f.style.cssText = 'width:1100px;height:800px;border:0;display:block';
+document.getElementById('frames').appendChild(f);
+</script></body></html>"""
+
+
+class H(http.server.BaseHTTPRequestHandler):
+    def log_message(self, *a):
+        pass
+
+    def do_POST(self):
+        length = int(self.headers.get("Content-Length") or 0)
+        if self.path == "/log":
+            RECORDS.append(json.loads(self.rfile.read(length).decode()))
+        else:
+            self.rfile.read(length)
+        self.send_response(204)
+        self.end_headers()
+
+    def _send(self, body: bytes, ctype: str) -> None:
+        self.send_response(200)
+        self.send_header("Content-Type", ctype)
+        self.send_header("Content-Length", str(len(body)))
+        self.end_headers()
+        self.wfile.write(body)
+
+    def do_GET(self):
+        path = self.path.split("?")[0]
+        if path == "/":
+            self._send(PAGE.encode(), "text/html; charset=utf-8")
+        elif path == "/case":
+            self._send(FRAME.encode(), "text/html; charset=utf-8")
+        else:
+            asset = (STATIC / path.lstrip("/")).resolve()
+            if not str(asset).startswith(str(STATIC)) or not asset.is_file():
+                self.send_response(404)
+                self.end_headers()
+                return
+            self._send(asset.read_bytes(),
+                       "text/css" if asset.suffix == ".css"
+                       else "text/javascript" if asset.suffix == ".js"
+                       else "application/octet-stream")
+
+
+def main() -> int:
+    with socketserver.TCPServer(("127.0.0.1", PORT), H) as srv:
+        threading.Thread(target=srv.serve_forever, daemon=True).start()
+        with tempfile.TemporaryDirectory(ignore_cleanup_errors=True) as profile:
+            proc = subprocess.Popen(
+                ["google-chrome", "--headless=new", "--disable-gpu", "--no-sandbox",
+                 f"--user-data-dir={profile}", "--window-size=1100,900",
+                 f"http://127.0.0.1:{PORT}/"],
+                stdout=subprocess.DEVNULL, stderr=subprocess.DEVNULL)
+            for _ in range(300):
+                if RECORDS:
+                    break
+                time.sleep(0.1)
+            proc.terminate()
+            try:
+                proc.wait(timeout=10)
+            except subprocess.TimeoutExpired:
+                proc.kill()
+                proc.wait()
+    if not RECORDS:
+        print(json.dumps({"error": "no measurement"}), file=sys.stderr)
+        return 1
+    print(json.dumps(RECORDS[0], indent=1))
+    return 0
+
+
+if __name__ == "__main__":
+    raise SystemExit(main())