docs(tasks): include Recovery PIN setup and 12-word voucher generation in task specs

This commit is contained in:
Tyler Gillispie 2026-08-24 22:16:28 -07:00
parent 449b428cea
commit 8e7efcc1d1
2 changed files with 57 additions and 32 deletions

View File

@ -2,22 +2,24 @@
- **Target Files:** `ui/components/LoginPage.tsx`, - **Target Files:** `ui/components/LoginPage.tsx`,
`ui/components/RegisterPage.tsx`, `ui/components/RecoveryPage.tsx`, `ui/components/RegisterPage.tsx`, `ui/components/RecoveryPage.tsx`,
`ui/public/auth-client.js` `ui/public/auth-client.js`, `server/main.ts`, `server/recovery.ts`
- **Core Objective:** Modernize the login, registration, and recovery screens - **Core Objective:** Modernize the login, registration, and recovery screens
with one-tap hero passkey trigger, WebAuthn autofill / conditional mediation, with one-tap hero passkey trigger, WebAuthn conditional mediation, and full
and progressive disclosure for fallback options. 2-step onboarding featuring Recovery PIN setup and 12-Word BIP-39 voucher
generation.
- **Dependencies:** - **Dependencies:**
`tasks/new/2026-0824.04.gem.feat.ui-shell.design-tokens-and-adaptive-nav-2215.md` `tasks/new/2026-0824.04.gem.feat.ui-shell.design-tokens-and-adaptive-nav-2215.md`
- **Additional Important Notes:** Must support seamless WebAuthn conditional - **Additional Important Notes:** Must support seamless WebAuthn conditional
mediation (`startAuthentication(..., true)`) while gracefully handling devices mediation (`startAuthentication(..., true)`) and provide a zero-knowledge
that do not support autofill. 12-word BIP-39 recovery voucher generated in-browser during account
registration.
--- ---
## 1. TASK METADATA ## 1. TASK METADATA
The header block specifies the authentication templates, client-side WebAuthn The header block specifies the authentication templates, client-side WebAuthn
handler, core objective, dependencies, and constraints. handler, recovery endpoints, core objective, dependencies, and constraints.
## 2. Architectural Considerations & Risks ## 2. Architectural Considerations & Risks
@ -26,14 +28,18 @@ handler, core objective, dependencies, and constraints.
- **Autofill Abort Collisions:** If conditional mediation - **Autofill Abort Collisions:** If conditional mediation
(`mediation: 'conditional'`) is running in the background and the user (`mediation: 'conditional'`) is running in the background and the user
explicitly taps "Sign In with Passkey", some browsers can throw an explicitly taps "Sign In with Passkey", some browsers can throw an
`AbortError` if not handled correctly. `AbortError` if not handled cleanly.
- _Mitigation:_ Cancel or ignore active conditional mediation promises before - _Mitigation:_ Cancel or ignore active conditional mediation promises before
starting explicit user-gesture WebAuthn authentication. starting explicit user-gesture WebAuthn authentication.
- **Missing Recovery Seed Visibility:** If the 12-word BIP39 seed phrase during - **Zero-Knowledge Recovery Voucher Loss:** If the 12-word BIP39 seed phrase
registration is obscured or difficult to copy on mobile, users could lose during registration is skipped or lost without user confirmation, the account
account recovery capability. cannot be recovered if the physical device is lost.
- _Mitigation:_ Provide a clear, high-contrast 12-word grid with a prominent - _Mitigation:_ Provide a clear, high-contrast 12-word grid with a prominent
1-tap "Copy All Words" clipboard button. 1-tap "Copy All Words" clipboard button and require a confirmation
acknowledgment before proceeding to the dashboard.
- **Server Share Storage Security:** The Hot Server Share must be stored with a
strong Argon2id/SHA-256 hash of the user's PIN in `recovery_shares` and
rate-limited.
### Alternatives ### Alternatives
@ -63,19 +69,30 @@ handler, core objective, dependencies, and constraints.
mode. mode.
- On explicit button click, execute modal WebAuthn login. - On explicit button click, execute modal WebAuthn login.
### Phase 3: Registration & Recovery Mobile Polish ### Phase 3: Registration & 12-Word Voucher Setup Flow
1. In `ui/components/RegisterPage.tsx`: 1. In `ui/components/RegisterPage.tsx`:
- Streamline invite code and username entry into high-contrast inputs. - Step 1: Username & Invite Code validation.
- Format 12-word seed phrase in a 2-column mobile card grid with a 1-tap copy - Step 2: Passkey creation via WebAuthn.
button. - Step 3 (Recovery Setup): Prompt the user to set a **Recovery PIN** (minimum
2. In `ui/components/RecoveryPage.tsx`: 6 digits/chars) and generate the 2-of-3 SSS shares in-browser via
- Support auto-advance input matrix and paste-all text box for seed phrase Wasm/WebCrypto.
verification. - Display the **12-Word BIP-39 Recovery Voucher** in a clean 2-column mobile
card grid with a 1-tap "Copy Words" button.
- Send the encrypted Server Share + PIN hash to the backend to persist in
`recovery_shares`.
### Phase 4: Verification & Quality Gates ### Phase 4: Account Recovery Verification Matrix
1. Run `deno fmt ui/**/*.tsx ui/public/**/*.js`. 1. In `ui/components/RecoveryPage.tsx`:
- Support auto-advance input matrix and paste-all text box for 12-word seed
phrase verification.
- Connect client-side Wasm reconstructor to bind a replacement passkey upon
successful validation.
### Phase 5: Verification & Quality Gates
1. Run `deno fmt ui/**/*.tsx ui/public/**/*.js server/**/*.ts`.
2. Run `deno task lint` and `deno task check`. 2. Run `deno task lint` and `deno task check`.
3. Run `deno task test` to verify zero regression in authentication endpoints 3. Run `deno task test` to verify zero regression in authentication endpoints
and redirects. and redirects.

View File

@ -1,15 +1,17 @@
# TASK METADATA # TASK METADATA
- **Target Files:** `ui/components/AppLaunchpadPage.tsx`, - **Target Files:** `ui/components/AppLaunchpadPage.tsx`,
`ui/components/SessionsPage.tsx`, `ui/components/PasskeysPage.tsx` `ui/components/SessionsPage.tsx`, `ui/components/PasskeysPage.tsx`,
`server/main.ts`, `server/recovery.ts`
- **Core Objective:** Convert Launchpad, Sessions, and Passkeys views from rigid - **Core Objective:** Convert Launchpad, Sessions, and Passkeys views from rigid
desktop tables into responsive, touch-friendly card decks with device icons, desktop tables into responsive card decks, and add an Emergency Recovery
AAGUID brand chips, and 1-tap revocation actions. Backup management card (view status, reset recovery PIN, re-generate 12-word
voucher).
- **Dependencies:** - **Dependencies:**
`tasks/new/2026-0824.04.gem.feat.ui-shell.design-tokens-and-adaptive-nav-2215.md` `tasks/new/2026-0824.04.gem.feat.ui-shell.design-tokens-and-adaptive-nav-2215.md`
- **Additional Important Notes:** Must ensure single-tap revocation and - **Additional Important Notes:** Must ensure single-tap revocation, add-passkey
add-passkey actions work flawlessly on mobile touchscreens without accidental actions, and emergency recovery voucher management work smoothly on
mis-clicks. touchscreens.
--- ---
@ -27,11 +29,11 @@ dependencies, and constraints.
- _Mitigation:_ Highlight the "Current Device" with an emerald badge to - _Mitigation:_ Highlight the "Current Device" with an emerald badge to
distinguish it from remote sessions, and provide confirmation feedback on distinguish it from remote sessions, and provide confirmation feedback on
single-tap revocation. single-tap revocation.
- **Information Density vs Screen Space:** Displaying raw UUIDs, AAGUIDs, and - **Recovery PIN Reset Security:** Resetting a recovery PIN or regenerating the
long User-Agent strings clutters mobile viewports. 2-of-3 SSS shares must require an authenticated session and live passkey user
- _Mitigation:_ Truncate IDs to 8 characters with a 1-tap copy action, and verification to prevent unauthorized recovery tampering.
display friendly device labels (📱 Phone, 💻 Laptop) and known AAGUID vendor - _Mitigation:_ Re-verify user authentication before accepting updated
names (Google Password Manager, Apple Keychain, YubiKey). recovery PIN hashes.
### Alternatives ### Alternatives
@ -61,7 +63,7 @@ dependencies, and constraints.
- Single-tap "Revoke Session" button. - Single-tap "Revoke Session" button.
- Prominent top action: "Revoke All Other Sessions". - Prominent top action: "Revoke All Other Sessions".
### Phase 3: Adaptive Passkeys Manager ### Phase 3: Adaptive Passkeys Manager & Emergency Recovery Card
1. In `ui/components/PasskeysPage.tsx`: 1. In `ui/components/PasskeysPage.tsx`:
- Render passkey cards with authenticator vendor badge (via AAGUID lookup). - Render passkey cards with authenticator vendor badge (via AAGUID lookup).
@ -69,6 +71,12 @@ dependencies, and constraints.
- Large "Add Another Passkey" hero action button for easy multi-device - Large "Add Another Passkey" hero action button for easy multi-device
enrollment. enrollment.
- Single-tap "Remove Passkey" button with confirmation. - Single-tap "Remove Passkey" button with confirmation.
- **Emergency Recovery Backup Card**:
- Display current recovery configuration status (e.g. "PIN Protected +
12-Word Voucher Configured").
- Action buttons to:
1. "Reset Recovery PIN"
2. "Re-generate Recovery Voucher & Shares" (with 1-tap copy modal).
### Phase 4: Verification & Quality Gates ### Phase 4: Verification & Quality Gates