admin c0ff22394c
All checks were successful
Build and Push / build (push) Successful in 1m29s
Threema QR: on-demand modal + auto-open on first add
2026-05-17 17:13:44 +02:00
2026-04-25 22:48:05 +02:00
2026-04-29 12:16:00 +02:00
2026-04-09 22:16:22 +02:00
2026-04-09 22:16:22 +02:00
2026-04-12 18:13:26 +02:00
2026-04-09 22:16:22 +02:00
2026-04-10 21:56:31 +02:00
2026-04-11 12:21:34 +02:00
2026-04-11 12:21:34 +02:00
2026-04-09 22:16:22 +02:00
2026-04-09 22:16:22 +02:00

Threema UX v2 — QR available on demand

Replaces the previous attempt that had the QR rendering inline above the channel help text. That placement didn't work for you in practice because it wasn't visible when you actually wanted it.

What this does instead

  1. "Show QR" link next to the channel title in the threema card — visible at all times, clickable any time you want the QR.

  2. Auto-opens the modal the first time you focus the add-ID input on the page (so a new user adding their first ID sees it without needing to click "Show QR" themselves). Doesn't re-pop after dismissal — the link covers re-opens.

  3. Modal with QR + 3-step instructions + "AIAGENT" label. Plain <img> (no next/image), closes on ESC / overlay click / × button.

The earlier threema-setup.tsx component file is removed — replaced by threema-qr-modal.tsx.

Files

src/lib/threema-gateway-config.ts                      # unchanged from before — central gateway constants
src/components/channel-users/threema-qr-modal.tsx      # NEW — the modal
src/components/channel-users/channel-users.tsx         # MODIFIED — Show QR button + focus auto-open + modal mount
deploy/patch-i18n-threema.mjs                          # adds threemaSetup.showQr label in 4 langs
public/threema/qr_code_AIAGENT.png                     # unchanged

Apply

cd /path/to/pieced-portal

# Remove the old inline component if you applied the previous archive
rm -f src/components/channel-users/threema-setup.tsx

# Drop new + modified files
unzip -o /path/to/threema-ux-v2.zip

# Update messages
node deploy/patch-i18n-threema.mjs

# TS check
npx tsc --noEmit

git add -A
git commit -m "Threema QR: on-demand modal + auto-open on first add"
git push

After redeploy, the threema card under Authorized Users shows:

threema    [Show QR]                              0 users
            ────────────────────
            <help text: 'Enter your own Threema ID...'>
            ────────────────────
            [ input: A8K2P3X7    ] [ Add ]
            ^^^ focusing this opens the QR modal the first time

Clicking "Show QR" or focusing the input → modal with QR + steps.

Description
No description provided
Readme 7 MiB
Languages
TypeScript 95.2%
JavaScript 3.5%
Shell 1%
CSS 0.2%