WebRTC LAN/WiFi result sharing

[techninja]

🧬 What's the mutation?

LAN peer sharing ("Family View") — allows a device with scored results to share them with another device on the same network via WebRTC DataChannel. No server, no cloud relay. Pairing uses QR codes: source shows offer QR → viewer scans → viewer shows answer QR → source scans back (or paste fallback). Data streams peer-to-peer.

New files:

• src/utils/peer-rtc.js + peer-rtc-shared.js — WebRTC offer/answer/DataChannel (multi-viewer source, single viewer)
• src/utils/peer-sdp.js — base64url encode/decode full SDP for QR transport
• src/utils/peer-qr.js — QR generation (uqr + logo overlay) and scanning (BarcodeDetector + jsQR fallback)
• src/utils/peer-protocol.js — request/response over DataChannel with chunked transfer for large payloads
• src/utils/peer-state.js — viewer session state, remote data caching, disconnect handling
• src/components/molecules/share-source/ — settings drawer widget (QR display, webcam scanner, paste input)
• src/components/molecules/share-viewer/ — viewer pairing page (answer QR, copy code, retry)
• src/pages/pair/pair-view.js — route handler for /pair/:offer
• docs/app-spec/LAN_PEER_SHARING.md — full feature spec

Modified files:

• src/pages/home/home-view.js — added PairView to router stack
• src/pages/beta/beta-init.js — remote viewer mode detection, reconnect state
• src/pages/beta/beta-view.js — viewer mode UI (read-only, disconnect button, reconnect prompt)
• src/pages/beta/results-store.js — transparent proxy to remote results when viewing
• src/pages/beta/scoring-controller.js — skip queue in viewer mode, loading state on switch
• src/components/organisms/trait-grid/render-card.js — load emoji from remote individuals
• src/components/organisms/settings-drawer/ — added "Share Results" section
• src/index.html — import map entries for uqr/jsqr, CSS links
• scripts/vendor-deps.js — ESM wrapping for UMD deps
• package.json — added uqr, jsqr dependencies

🔬 Why?

Results are "trapped" in the desktop browser's IndexedDB. Users want to casually browse scores on their phone without re-uploading and re-scoring. This gives them a zero-server, zero-cloud way to view results from any device on the same network — reinforcing the privacy-first message.

🧪 How to test

• Source device: Settings → Share Results → Start Sharing → QR appears
• Viewer device: scan QR → answer QR/code displayed
• Source: scan viewer's answer QR (📷 button) or paste code → connection established
• Viewer: auto-navigates to /beta → individuals load → trait cards show scored results
• Switch individuals on viewer → results update (cached on second visit)
• Source: "Stop Sharing" → viewer disconnects gracefully
• Viewer: refresh → sees "Connection lost" prompt → "Back to My Data" clears session
• pnpm run test:node passes

📸 Screenshots / recordings

Source settings drawer with QR and viewer count.

🏷️ Type

• 🧬 Feature (new capability)

✅ Checklist

• Tests pass locally
• No console errors in browser
• Mobile tested
• Spec compliance — drawer-sections.js (164 lines, +14 from new section) and BarcodeDetector type (not in TS lib, global API) are the only new violations. Pre-existing: test.js, beta-view.js, beta-view.css.

---

🔮 Reviewer's horoscope

Your WebRTC handshake will complete on the first try today. The STUN server smiles upon you. Do not fear the base64url padding.

[techninja]

This needs

• Better design
• Better UX (doable though from mobile to desktop and back)
• Better caching, more persistent connection? Allow full tenant data sync of available content?
• Tests!