diff --git a/tasks/new/2026-0824.05.gem.feat.ui-auth.hero-passkey-and-onboarding-2216.md b/tasks/new/2026-0824.05.gem.feat.ui-auth.hero-passkey-and-onboarding-2216.md index 760309a..eb8aed6 100644 --- a/tasks/new/2026-0824.05.gem.feat.ui-auth.hero-passkey-and-onboarding-2216.md +++ b/tasks/new/2026-0824.05.gem.feat.ui-auth.hero-passkey-and-onboarding-2216.md @@ -2,22 +2,24 @@ - **Target Files:** `ui/components/LoginPage.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 - with one-tap hero passkey trigger, WebAuthn autofill / conditional mediation, - and progressive disclosure for fallback options. + with one-tap hero passkey trigger, WebAuthn conditional mediation, and full + 2-step onboarding featuring Recovery PIN setup and 12-Word BIP-39 voucher + generation. - **Dependencies:** `tasks/new/2026-0824.04.gem.feat.ui-shell.design-tokens-and-adaptive-nav-2215.md` - **Additional Important Notes:** Must support seamless WebAuthn conditional - mediation (`startAuthentication(..., true)`) while gracefully handling devices - that do not support autofill. + mediation (`startAuthentication(..., true)`) and provide a zero-knowledge + 12-word BIP-39 recovery voucher generated in-browser during account + registration. --- ## 1. TASK METADATA 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 @@ -26,14 +28,18 @@ handler, core objective, dependencies, and constraints. - **Autofill Abort Collisions:** If conditional mediation (`mediation: 'conditional'`) is running in the background and the user 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 starting explicit user-gesture WebAuthn authentication. -- **Missing Recovery Seed Visibility:** If the 12-word BIP39 seed phrase during - registration is obscured or difficult to copy on mobile, users could lose - account recovery capability. +- **Zero-Knowledge Recovery Voucher Loss:** If the 12-word BIP39 seed phrase + during registration is skipped or lost without user confirmation, the account + cannot be recovered if the physical device is lost. - _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 @@ -63,19 +69,30 @@ handler, core objective, dependencies, and constraints. mode. - 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`: - - Streamline invite code and username entry into high-contrast inputs. - - Format 12-word seed phrase in a 2-column mobile card grid with a 1-tap copy - button. -2. In `ui/components/RecoveryPage.tsx`: - - Support auto-advance input matrix and paste-all text box for seed phrase - verification. + - Step 1: Username & Invite Code validation. + - Step 2: Passkey creation via WebAuthn. + - Step 3 (Recovery Setup): Prompt the user to set a **Recovery PIN** (minimum + 6 digits/chars) and generate the 2-of-3 SSS shares in-browser via + Wasm/WebCrypto. + - 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`. 3. Run `deno task test` to verify zero regression in authentication endpoints and redirects. diff --git a/tasks/new/2026-0824.06.gem.feat.ui-user-hub.adaptive-launchpad-sessions-passkeys-2217.md b/tasks/new/2026-0824.06.gem.feat.ui-user-hub.adaptive-launchpad-sessions-passkeys-2217.md index acc47b6..0600489 100644 --- a/tasks/new/2026-0824.06.gem.feat.ui-user-hub.adaptive-launchpad-sessions-passkeys-2217.md +++ b/tasks/new/2026-0824.06.gem.feat.ui-user-hub.adaptive-launchpad-sessions-passkeys-2217.md @@ -1,15 +1,17 @@ # TASK METADATA - **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 - desktop tables into responsive, touch-friendly card decks with device icons, - AAGUID brand chips, and 1-tap revocation actions. + desktop tables into responsive card decks, and add an Emergency Recovery + Backup management card (view status, reset recovery PIN, re-generate 12-word + voucher). - **Dependencies:** `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 - add-passkey actions work flawlessly on mobile touchscreens without accidental - mis-clicks. +- **Additional Important Notes:** Must ensure single-tap revocation, add-passkey + actions, and emergency recovery voucher management work smoothly on + touchscreens. --- @@ -27,11 +29,11 @@ dependencies, and constraints. - _Mitigation:_ Highlight the "Current Device" with an emerald badge to distinguish it from remote sessions, and provide confirmation feedback on single-tap revocation. -- **Information Density vs Screen Space:** Displaying raw UUIDs, AAGUIDs, and - long User-Agent strings clutters mobile viewports. - - _Mitigation:_ Truncate IDs to 8 characters with a 1-tap copy action, and - display friendly device labels (📱 Phone, 💻 Laptop) and known AAGUID vendor - names (Google Password Manager, Apple Keychain, YubiKey). +- **Recovery PIN Reset Security:** Resetting a recovery PIN or regenerating the + 2-of-3 SSS shares must require an authenticated session and live passkey user + verification to prevent unauthorized recovery tampering. + - _Mitigation:_ Re-verify user authentication before accepting updated + recovery PIN hashes. ### Alternatives @@ -61,7 +63,7 @@ dependencies, and constraints. - Single-tap "Revoke Session" button. - 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`: - 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 enrollment. - 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