Skip to content

fix(#629): surface fee-payer derivation mode and warn on PRF fallback - #664

Open
Hussman256 wants to merge 3 commits into
Miracle656:mainfrom
Hussman256:fix/feepayer-derivation-visibility-629
Open

fix(#629): surface fee-payer derivation mode and warn on PRF fallback#664
Hussman256 wants to merge 3 commits into
Miracle656:mainfrom
Hussman256:fix/feepayer-derivation-visibility-629

Conversation

@Hussman256

Copy link
Copy Markdown
Contributor

Summary

Closes #629. Closes #617.


fix(#629) — Surface fee-payer derivation and warn on PRF fallback

The /settings/fee-payer detail page (active G… address, derivation mode, probe log, copy-for-bug-report) was already fully implemented but completely unreachable — nothing in the UI linked to it, and nothing warned when PRF silently downgraded to legacy.

Changes

Settings overview — Fee Payer card

  • Added a Fee Payer navigation card (between Passkeys and Guardian) routing to /settings/fee-payer
  • When isFeePayerPrfDowngrade() is true: red dot indicator, red-tinted border, subtitle changes to "PRF unavailable — using legacy derivation"

Dashboard — PRF downgrade banner

  • After ensureFeePayer() settles, surfaces a dismissible red banner when PRF fell back to legacy
  • Explains the authenticator didn't supply a PRF result and the same passkey will look like a different wallet on a PRF-capable device
  • "View diagnostics" button links directly to /settings/fee-payer

/settings/fee-payer (pre-existing, now reachable)

  • Active G… address + copy button
  • Derivation mode label + description (prf-raw / prf-hkdf / legacy)
  • Full probe log: every candidate tried, public key, on-chain probe result
  • One-click "Copy for bug report"

fix(#617) — Redesign the onboarding / create screen

Restyles app/page.tsx to match the redesign spec. All logic (passkey register → fee-payer → factory deploy) is unchanged.

Changes

app/globals.css

  • Added @keyframes pulse-ring + @keyframes pulse-ring-2 — two staggered gold rings expanding outward from the mark
  • Added .biometric-pulse class with ::before / ::after pseudo-elements for the rings

app/page.tsx

  • Pulse ring: 96×96 .biometric-pulse container wrapping <VeilMark size={64} />
  • Headline: Lora-italic <h1>"Your passkey is your wallet."* — with "your wallet." in the .hl gold highlight
  • Lede: "No seed phrase. No password. Just your biometric — securing a smart contract wallet on Stellar."
  • CTAs: id="onboarding-create" (Create wallet) and id="onboarding-recover" (Recover existing wallet)
  • Footnote: "Secured by WebAuthn on Stellar" — fixed the mis-ID (tutorial-titlewebauthn-footnote)
  • Dead markup removed: empty {/* Main card */} comment block

Acceptance criteria

#629
✅ Fee Payer card in Settings visible on every session
✅ PRF-downgraded users see a warning on Dashboard and the Settings card
✅ Detail page shows G… address, derivation mode, and probe log with one-click copy

#617
✅ Centered hero with pulse ring + gold-highlighted Lora headline
✅ Create / Recover CTAs; WebAuthn footnote
✅ Onboarding tutorial + create flow unchanged
✅ Dead markup removed

…F fallback

- Add 'Fee Payer' card to Settings overview linking to /settings/fee-payer
  - Shows a red dot indicator and red border when isFeePayerPrfDowngrade() is true
  - Subtitle changes to 'PRF unavailable - using legacy derivation' on downgrade
- Add PRF-downgrade banner on Dashboard (dismissible)
  - Appears after ensureFeePayer() settles when PRF was requested but fell back
  - Links to /settings/fee-payer where the full derivation log and copy-for-bug-report button live
- /settings/fee-payer page (already existed) now reachable without a debugger:
  - Shows active G... address and derivation mode (prf-raw / prf-hkdf / legacy)
  - Shows every candidate that was probed and its on-chain probe result
  - Downgrade warning with error detail if prfError is present
  - One-click copy of the full diagnostics blob for bug reports
- Hero: centered biometric pulse ring (two-ring gold animation) wrapping
  the VeilMark at 96px, defined as .biometric-pulse in globals.css
- Headline: Lora-italic h1 with 'your wallet.' highlighted via .hl gold underlay
- Lede: single sentence explaining no seed phrase, biometric, Stellar
- CTAs: Create wallet (btn-gold, id=onboarding-create) and
  Recover existing wallet (btn-ghost, id=onboarding-recover)
- Footnote: 'Secured by WebAuthn on Stellar' id=webauthn-footnote
  (was mis-IDed as tutorial-title)
- Removed dead empty-card comment block
- Onboarding tutorial + registering/deploying/done flow unchanged
@Hussman256
Hussman256 requested a review from Miracle656 as a code owner August 26, 2026 21:13
@drips-wave

drips-wave Bot commented Aug 26, 2026

Copy link
Copy Markdown

@Hussman256 Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits.

You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀

Learn more about application limits

@vercel

vercel Bot commented Aug 26, 2026

Copy link
Copy Markdown

@Hussman256 is attempting to deploy a commit to the miracle656's projects Team on Vercel.

A member of the Team first needs to authorize it.

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.

Surface which fee-payer derivation is in use, and warn when it is a fallback Redesign the Onboarding / Create screen

1 participant