Skip to content

feat(currency-info): revamped new-UI token info layout - #585

Open
bmc08gt wants to merge 1 commit into
mainfrom
feat-currency-info-v2
Open

feat(currency-info): revamped new-UI token info layout#585
bmc08gt wants to merge 1 commit into
mainfrom
feat-currency-info-v2

Conversation

@bmc08gt

@bmc08gt bmc08gt commented Aug 15, 2026

Copy link
Copy Markdown
Collaborator

Revamps the token/currency info page for the new UI (BetaFlags.newUI), per the Figma frames 9121-14267, 9137-9119, 9137-9343 and the notes below them. The legacy layout is untouched for the old UI.

Builds on the pushable buy flow (#584, merged).

Layout (top → bottom)

  • Hero bill card — reuses TokenCardView. Balance + appreciation pill when held; identity only when not.
  • Action tiles — Give / Convert / Withdraw, or a single Get when the token isn't held.
  • Recent — per-token activity preview (held tokens only); header opens the full history.
  • Market Cap — reuses CurrencyInfoMarketCapSection as-is (value + monthly delta live inside the interactive chart).
  • About — extracted into a reusable CurrencyInfoAboutSection (keeps ExpandableText expand/collapse) + social links.
  • Created-at footer.

Title bar

  • Leading Liquid Glass pill (icon, name, market cap) that appears only once the hero card's own title scrolls under the bar, tracked via onScrollGeometryChange.
  • The item is faded rather than inserted/removed — churning toolbar items mid-transition wedges nav-bar layout.
  • The capsule is drawn by the label (glassEffect(.regular, in: .capsule)) instead of the toolbar's platter: the system platter hugs its content and swallows most of the trailing inset the spec calls for. Measured against the spec — height 36pt (spec ~37), width 112pt (~107), trailing gap 21pt.
  • Label uses semantic .primary/.secondary so the glass applies the system's vibrancy and stays legible over a bright bill card scrolling beneath.
  • Top scroll edge set to .soft, so content fades under the bar instead of meeting a hard line. The bar background is deliberately left in place — hiding it removes the surface that effect renders into.

Behaviour

  • USDF / Dollars: Convert + Withdraw only (Give ships separately), no market-cap chart, no created date, not shareable; About sits under Recent. Title uses the mint's name, so it reads "Dollars".
  • Actions: Give → .give(mint); Convert / Get → the pushed buy flow (.buyCurrency, feat(buy): allow the buy flow to be pushed onto a host stack #584); Withdraw → .withdrawCurrency(mint), pre-selected.
  • Top-right keeps the existing share button (no overflow menu); hidden for USDF.
  • Per-token Recent loads through the view model (loadRecentActivities), keeping DB access out of the view.
  • Spacing on this screen and the wallet snaps to the 4pt grid (2/6/10 → 4/8/12).

Behind BetaFlags.newUI, replace the currency info screen with the new layout:
a hero bill card, inline Give / Convert / Withdraw tiles (a single Get when the
token is not held), a per-token Recent preview, the reused market-cap chart,
the About block, and a created-at footer. The legacy layout is untouched.

- Actions: Give -> give; Convert / Get -> the pushed buy flow; Withdraw ->
  withdrawCurrency(mint) (pre-selected).
- USDF: Convert + Withdraw only, no market-cap chart, no created date, not
  shareable, and the title uses the mint name ("Dollars").
- Title bar: a leading Liquid Glass pill (icon, name, market cap) revealed only
  once the hero card title scrolls under the bar; the bar background is hidden
  and the top scroll edge softened so content scrolls beneath it.
- Reuse: CurrencyInfoMarketCapSection as-is; About extracted to
  CurrencyInfoAboutSection (keeps expand/collapse). Per-token Recent loads via
  the view model, keeping DB access out of the view.
- Spacing across this screen and the wallet snaps to the 4pt grid.

Builds on the pushable buy flow (.buyCurrency).
@bmc08gt
bmc08gt force-pushed the feat-currency-info-v2 branch from f21b957 to 7431427 Compare August 15, 2026 18:33
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.

1 participant