Skip to content

feat(api-keys): QR code on key creation encoding server URL + key (#1677)#1701

Open
bambuman wants to merge 1 commit into
maziggy:devfrom
bambuman:feature/api-key-qr
Open

feat(api-keys): QR code on key creation encoding server URL + key (#1677)#1701
bambuman wants to merge 1 commit into
maziggy:devfrom
bambuman:feature/api-key-qr

Conversation

@bambuman

@bambuman bambuman commented Jun 9, 2026

Copy link
Copy Markdown
Contributor

Supersedes #1693 — retargeted to dev per CONTRIBUTING.md (branch was rebased --onto dev; #1693 could not be reopened after the force-push).

Description

Adds a QR code button to the "API Key Created Successfully" panel. Clicking it shows a modal with a single QR encoding the Bambuddy base URL and the new API key together, so a mobile client can scan once to configure both — no copy-pasting the long, shown-only-once key.

Related Issue

Fixes #1677

Documentation

Companion docs PRs:

Pick one:

  • Docs PR(s) linked above

Type of Change

  • New feature (non-breaking change that adds functionality)

Changes Made

  • New QR code button + modal (ApiKeyQRCodeModal) on the key-creation success panel.
  • Payload contract (v1): bambuddy://config?v=1&url=<encodeURIComponent(baseUrl)>&key=<encodeURIComponent(apiKey)>, built by a reusable buildApiKeyQrPayload() helper.
  • baseUrl prefers the configured External URL setting, falling back to window.location.origin (so the encoded address is reachable from a phone behind a reverse proxy / Docker host).
  • QR is generated client-side from the in-memory key (keys are stored hashed and never retrievable) — never refetched. Modal shows a secret-key warning and closes on Escape.
  • Adds the qrcode.react dependency; new UI strings added to all locale files.

Screenshots

brave_screenshot1 brave_screenshot2

Testing

  • I have tested this on my local machine

Unit tests for the payload contract (scheme, v=1 first, URL-encoding, no raw-key leak, query round-trip). tsc clean, eslint clean, payload + i18n-parity suites pass (15 tests).

Checklist

  • My code follows the project's coding style
  • I have commented my code where necessary
  • My changes generate no new warnings
  • I have tested my changes thoroughly

…ziggy#1677)

Add a "QR code" button to the "API Key Created Successfully" panel that
opens a modal with a single QR encoding the Bambuddy base URL and the new
API key together, so a mobile client can scan once to configure both.

Payload (v1 contract):
  bambuddy://config?v=1&url=<encodeURIComponent(baseUrl)>&key=<encodeURIComponent(apiKey)>

- baseUrl prefers the configured External URL setting, falling back to
  window.location.origin.
- The QR is generated client-side from the in-memory key (keys are stored
  hashed and never retrievable later), so it is never refetched.
- Modal shows the QR, a caption, and a secret-key warning; closes on Escape.

Adds the qrcode.react dependency (renders QRCodeSVG), a reusable
buildApiKeyQrPayload() helper, and unit tests for the payload contract
(scheme, v=1 first, URL-encoding, no raw-key leak, round-trip). New UI
strings are added to all locale files.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
@bambuman bambuman requested a review from maziggy as a code owner June 9, 2026 15:13
@bambuman

bambuman commented Jun 9, 2026

Copy link
Copy Markdown
Contributor Author

Sorry for the rule miss here — Claude had added a CLAUDE.local.md note that wrongly overrode the base branch to main, and I didn't catch it before opening the PR. Now fixed: rebased onto dev and retargeted to dev per CONTRIBUTING.md. tsc + eslint clean, payload-contract and i18n-parity suites pass.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant