code/yieldomega

Watch

Fork 0

Referrals: simplify claim-cost display + Kumbaya buy CL8Y link with USD hint #206

New issue

Closed

opened 2026-05-13 16:03:45 +00:00 by PlasticDigits · 4 comments

PlasticDigits commented

2026-05-13 16:03:45 +00:00

(Migrated from gitlab.com)

Summary

On /referrals, the Claim your guide code card (ReferralRegisterSection) shows registration burn cost using AmountDisplay, which renders an AmountTripleStack with "decimal" and "abbr" rows. For this small cost panel that reads as noisy and unclear—participants mainly need one readable CL8Y figure.

Also add a clear outbound link to Kumbaya to acquire CL8Y for the burn, and show an approximate CL8Y price in USD next to or near that affordance.

UX / copy

Replace or narrow the claim-cost presentation so it does not show the internal abbr / decimal row labels (either use a single formatted line via formatAmountTriple / compact string, or a dedicated compact variant—see frontend/src/components/AmountDisplay.tsx policy vs. this call site in frontend/src/pages/referrals/ReferralRegisterSection.tsx inside .referrals-register-cost).
Add a link (opens new tab, rel="noreferrer noopener") to Kumbaya swap with CL8Y as output token, for example:

https://www.kumbaya.xyz/#/swap?outputCurrency=0xfBAa45A537cF07dC768c469FfaC4e88208B0098D&confirmed=1

Prefer centralizing the URL (env constant or small helper) if production CL8Y address can differ by chain—align with docs/integrations/kumbaya.md / integrator-kit token list where applicable (GitLab #46).
USD: Show USD for the burn amount (not just generic token price) or show price per 1 CL8Y with copy that matches repo disclosure patterns (live quoter vs static placeholder—see frontend/src/lib/cl8yUsdEquivalentDisplay.ts, Arena CL8Y_USD_PRICE_PLACEHOLDER in arenaPageHelpers.ts, and GitLab #192 for staleness/illustrative USD language).

Acceptance criteria

Claim cost row is readable at a glance; no decimal / abbr labels in this card.
Visible Buy CL8Y on Kumbaya (or similar) control linking to the swap URL above (or env-driven equivalent).
USD figure follows an explicit product rule (live vs illustrative) and is documented in code comments or adjacent muted text.

Tests / QA

Update or add a Playwright / Vitest assertion if the referrals surface spec touches this block (frontend/e2e/referrals-surface.spec.ts).

Referrals page / register UX: GitLab #64
Kumbaya integration: GitLab #46
USD equivalent affordance: GitLab #192

/cc @PlasticDigits/yieldomega

## Summary On `/referrals`, the **Claim your guide code** card (`ReferralRegisterSection`) shows registration burn cost using `AmountDisplay`, which renders an `AmountTripleStack` with **"decimal"** and **"abbr"** rows. For this small cost panel that reads as noisy and unclear—participants mainly need one readable CL8Y figure. Also add a clear **outbound link to Kumbaya** to acquire CL8Y for the burn, and show an **approximate CL8Y price in USD** next to or near that affordance. ## UX / copy - Replace or narrow the claim-cost presentation so it does **not** show the internal `abbr` / `decimal` row labels (either use a single formatted line via `formatAmountTriple` / compact string, or a dedicated compact variant—see `frontend/src/components/AmountDisplay.tsx` policy vs. this call site in `frontend/src/pages/referrals/ReferralRegisterSection.tsx` inside `.referrals-register-cost`). - Add a link (opens new tab, `rel="noreferrer noopener"`) to Kumbaya swap with CL8Y as output token, for example: `https://www.kumbaya.xyz/#/swap?outputCurrency=0xfBAa45A537cF07dC768c469FfaC4e88208B0098D&confirmed=1` Prefer centralizing the URL (env constant or small helper) if production CL8Y address can differ by chain—align with `docs/integrations/kumbaya.md` / integrator-kit token list where applicable ([GitLab #46](https://gitlab.com/PlasticDigits/yieldomega/-/issues/46)). - **USD:** Show USD for the **burn amount** (not just generic token price) or show **price per 1 CL8Y** with copy that matches repo disclosure patterns (live quoter vs static placeholder—see `frontend/src/lib/cl8yUsdEquivalentDisplay.ts`, Arena `CL8Y_USD_PRICE_PLACEHOLDER` in `arenaPageHelpers.ts`, and [**GitLab #192**](https://gitlab.com/PlasticDigits/yieldomega/-/issues/192) for staleness/illustrative USD language). ## Acceptance criteria - [ ] Claim cost row is readable at a glance; no `decimal` / `abbr` labels in this card. - [ ] Visible **Buy CL8Y on Kumbaya** (or similar) control linking to the swap URL above (or env-driven equivalent). - [ ] USD figure follows an explicit product rule (live vs illustrative) and is documented in code comments or adjacent muted text. ## Tests / QA - Update or add a Playwright / Vitest assertion if the referrals surface spec touches this block (`frontend/e2e/referrals-surface.spec.ts`). ## Related - Referrals page / register UX: [GitLab #64](https://gitlab.com/PlasticDigits/yieldomega/-/issues/64) - Kumbaya integration: [GitLab #46](https://gitlab.com/PlasticDigits/yieldomega/-/issues/46) - USD equivalent affordance: [GitLab #192](https://gitlab.com/PlasticDigits/yieldomega/-/issues/192) /cc @PlasticDigits/yieldomega

Brouie commented

2026-05-14 05:33:14 +00:00

(Migrated from gitlab.com)

While verifying #206 on prod with a connected wallet — the same noisy decimal / abbr triple-stack pattern shows up on the YOUR REFERRAL CHARM earnings card (the empty-state breakdown rows under "As guide" and "As traveler"). out of scope for #206's .referrals-register-cost target as filed, just flagging in case you want to roll it into the same fix or split off.

While verifying #206 on prod with a connected wallet — the same noisy `decimal` / `abbr` triple-stack pattern shows up on the YOUR REFERRAL CHARM earnings card (the empty-state breakdown rows under "As guide" and "As traveler"). out of scope for #206's `.referrals-register-cost` target as filed, just flagging in case you want to roll it into the same fix or split off.

Brouie commented

2026-05-14 08:28:20 +00:00

(Migrated from gitlab.com)

mentioned in commit a06634077f

mentioned in commit a06634077f4a63e81122f3ffc335db8ff436cf9a

Brouie commented

2026-05-14 08:30:10 +00:00

(Migrated from gitlab.com)

mentioned in merge request !389

PlasticDigits commented

2026-05-14 13:41:35 +00:00

(Migrated from gitlab.com)

mentioned in commit a0fbe57718

mentioned in commit a0fbe5771842f520cdaeadbea5b3cf7a064c963d

PlasticDigits (Migrated from gitlab.com) closed this issue

2026-05-14 13:41:36 +00:00

No milestone

No project

No assignees

1 participant

Notifications

Due date

The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set

Reference

code/yieldomega#206

No description provided.

Rows
Columns