feat(frontend): simplify claim-cost + Kumbaya buy link + USD hint (GitLab #206) #389

2026-05-14T08:30:08Z

Brouie commented

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

(Migrated from gitlab.com)

Closes #206.

What this changes

Three sub-deliverables per the spec, all on the referrals register card:

Simplify claim cost display. Drop the AmountDisplay triple-stack (with "decimal" and "abbr" row labels) in favor of a single readable line: 1 CL8Y. Uses formatAmountTriple(...).decimal inline so onchain-decimals stays correct without the noisy abbr / decimal scaffolding.
Buy CL8Y on Kumbaya link. Centralized URL helper at frontend/src/lib/kumbayaSwapUrl.ts that builds the swap URL with the canonical CL8Y address as outputCurrency (sourced live from ReferralRegistry.cl8yToken(), since CL8Y isn't currently in addresses.ts). Uses kumbayaDexUrl() for the base when env is set, falls back to https://www.kumbaya.xyz/#/swap otherwise. Link uses target="_blank" + rel="noreferrer noopener" per spec.
USD hint with documented product rule. Uses the existing illustrative placeholder pattern (CL8Y_USD_PRICE_PLACEHOLDER = 1 from arenaPageHelpers.ts, same as the Arena hero "TOTAL USD"). Shows ≈ $1.00 USD · illustrative under the cost. Inline code comment documents which pattern was chosen and why (matches cl8yUsdEquivalentDisplay.ts disclosure language for #192). Tooltip clarifies it's not live FX.

Tests

New frontend/src/lib/kumbayaSwapUrl.test.ts — 4 cases:

swap URL with outputCurrency when token address is provided
base swap URL fallback when output token undefined / empty
honors VITE_KUMBAYA_DEX_URL when set
always returns absolute https URL

Suite delta: 325/325 → 329/329 across 59 → 60 files (+4 tests, +1 file). Zero regressions.

Manual verification

Tested locally pointed at MegaETH mainnet (chain 4326, real ReferralRegistry):

Claim cost row shows 1 CL8Y as a single readable line (no DECIMAL/ABBR rows)
USD line shows ≈ $1.00 USD · illustrative with tooltip explaining it's a fixed placeholder
Buy CL8Y on Kumbaya button opens new tab to https://www.kumbaya.xyz/#/swap?outputCurrency=0xfBAa45A537cF07dC768c469FfaC4e88208B0098D&confirmed=1
Existing "Burned only if the registration succeeds." copy preserved
Click behavior is noreferrer noopener — no referer leak to Kumbaya

Out of scope

The earnings card (YOUR REFERRAL CHARM) also uses AmountTripleStack with the same decimal/abbr noise — flagged in a separate note on this issue. This MR scopes to .referrals-register-cost only as the spec asks.
USD figure is illustrative, not live. If/when we want live USD via a quoter, that's #192's lane.

Closes #206. ## What this changes Three sub-deliverables per the spec, all on the referrals register card: 1. **Simplify claim cost display.** Drop the `AmountDisplay` triple-stack (with "decimal" and "abbr" row labels) in favor of a single readable line: `1 CL8Y`. Uses `formatAmountTriple(...).decimal` inline so onchain-decimals stays correct without the noisy abbr / decimal scaffolding. 2. **Buy CL8Y on Kumbaya link.** Centralized URL helper at `frontend/src/lib/kumbayaSwapUrl.ts` that builds the swap URL with the canonical CL8Y address as `outputCurrency` (sourced live from `ReferralRegistry.cl8yToken()`, since CL8Y isn't currently in `addresses.ts`). Uses `kumbayaDexUrl()` for the base when env is set, falls back to `https://www.kumbaya.xyz/#/swap` otherwise. Link uses `target="_blank"` + `rel="noreferrer noopener"` per spec. 3. **USD hint with documented product rule.** Uses the existing illustrative placeholder pattern (`CL8Y_USD_PRICE_PLACEHOLDER = 1` from `arenaPageHelpers.ts`, same as the Arena hero "TOTAL USD"). Shows `≈ $1.00 USD · illustrative` under the cost. Inline code comment documents which pattern was chosen and why (matches `cl8yUsdEquivalentDisplay.ts` disclosure language for #192). Tooltip clarifies it's not live FX. ## Tests New `frontend/src/lib/kumbayaSwapUrl.test.ts` — 4 cases: - swap URL with `outputCurrency` when token address is provided - base swap URL fallback when output token undefined / empty - honors `VITE_KUMBAYA_DEX_URL` when set - always returns absolute https URL Suite delta: 325/325 → 329/329 across 59 → 60 files (+4 tests, +1 file). Zero regressions. ## Manual verification Tested locally pointed at MegaETH mainnet (chain 4326, real ReferralRegistry): - Claim cost row shows `1 CL8Y` as a single readable line (no DECIMAL/ABBR rows) - USD line shows `≈ $1.00 USD · illustrative` with tooltip explaining it's a fixed placeholder - `Buy CL8Y on Kumbaya` button opens new tab to `https://www.kumbaya.xyz/#/swap?outputCurrency=0xfBAa45A537cF07dC768c469FfaC4e88208B0098D&confirmed=1` - Existing "Burned only if the registration succeeds." copy preserved - Click behavior is `noreferrer noopener` — no referer leak to Kumbaya ## Out of scope - The earnings card (YOUR REFERRAL CHARM) also uses `AmountTripleStack` with the same decimal/abbr noise — flagged in a separate note on this issue. This MR scopes to `.referrals-register-cost` only as the spec asks. - USD figure is illustrative, not live. If/when we want live USD via a quoter, that's #192's lane.

Brouie commented

2026-05-14 08:31:46 +00:00

(Migrated from gitlab.com)

{width=637 height=335}

![image.png](/uploads/2d9062ef29b92645964156fb9b283096/image.png){width=637 height=335}

PlasticDigits (Migrated from gitlab.com) merged commit a0fbe57718 into main

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

PlasticDigits commented

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

(Migrated from gitlab.com)

mentioned in commit a0fbe57718

mentioned in commit a0fbe5771842f520cdaeadbea5b3cf7a064c963d

Sign in to join this conversation.

No reviewers

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!389

Rows
Columns