Skip to content

Onboarding: make the Helius key step visually optional #219

Description

@zo-sol

Problem

Step 03 of the unlock tutorial (Market_RPC) asks for a Helius API key. The copy already says the step is optional, but the visual hierarchy says the opposite, so first-time users read it as a required signup before they can use the app.

Current state in surfaces/webview/src/settings/HeliusKeyForm.tsx, rendered as step 03 by surfaces/webview/src/unlock/UnlockProvider.tsx:170-172:

Element Current styling Reads as
Save Key button an-btn an-btn-green, full width, primary green the action to take
Get_your_key · helius.dev link green accent, uppercase go sign up for a third party service
Skip for now 11px uppercase, var(--an-fg-dim) gray text an afterthought

The step copy in surfaces/webview/src/i18n/messages.ts:106-110 is already honest:

Completely optional. The public RPC works by default. Paste a Helius key for faster market indexing.

The styling contradicts that sentence. The key was added for speed and stability on market indexing and comment flows, but the public RPC path works fine and most users will never have a paid Helius plan.

Change

Invert the emphasis for the onboarding usage only:

  1. Make skip the visually primary action. Color and size comparable to what Save Key has today.
  2. Demote the key entry path to secondary gray: the input, the Save Key button, and the helius.dev link.
  3. Add one line of reassurance that skipping changes nothing about whether the app works, so the user does not have to infer it from the step copy alone.

Scope

HeliusKeyForm is shared with two other surfaces where a prominent Save Key is correct:

  • Settings > Helius (surfaces/webview/src/chat/Sessions.tsx:705)
  • Market tab retry prompt (surfaces/webview/src/market/MarketScreen.tsx:186)

So this should be a variant on the shared component rather than a global restyle. The component already takes a skipLabel prop, so an emphasis prop follows the existing pattern.

Notes

  • Any new copy needs all three locales (en / ko / ru) in surfaces/webview/src/i18n/messages.ts.
  • The skip control keeps calling useDefaultRpc, so there is no behavior change, only presentation.
  • Same reasoning applies to the market-side prompt text Add Helius key for faster results (MarketScreen.tsx:286) if it starts reading as a requirement, but that one is triggered by an actual failure so it is lower priority.

Activity

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

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions