Add post-buy transaction result share popover #365
Labels
No labels
agent:fix_bugfix
agent:fix_conflicts
agent:fix_security
agent:gap_analysis
agent:implement
agent:open_issues
agents
agent:security_audit
agent:verify
area
timecurve
arena
arena-v2
audit
block:feature_review
block:security
bug
contracts
design
devops
docs
documentation
enhancement
epic
feature
frontend
indexer
low priority
megaeth
operations
ops
performance
QA
qa checklist
referrals
removal
security
smart-contracts
tech-debt
testing
time-arena
timecurve
visual-qa
No milestone
No project
No assignees
1 participant
Notifications
Due date
No due date set.
Dependencies
No dependencies set
Reference
code/yieldomega#365
Loading…
Reference in a new issue
No description provided.
Delete branch "%!s()"
Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?
Parent
Child of #363 — Improve top of funnel marketing and shareability.
Current codebase
useArenaBuyEffectToastspushes up to four auto-dismissing lines viaArenaEffectToastStack(fixed overlay, staggered motion, 4s dismiss). Wired fromArenaSimplePage.tsxon successful buy.buildArenaBuyProjectedEffectLines(pre-submit preview) andbuildArenaBuyActualEffectLines(indexer-confirmed buy row) produce separate pill strings: timer (+Ns), XP, BP breakdown, streak, flag, level transitions.BuyItem/ArenaBuyIteminindexerApi.ts—actual_seconds_added,new_deadline,timer_hard_reset, BP columns,flag_planted,buyer_active_defended_streak, charm/doub paid,tx_hash,block_timestamp.LevelUpCelebrationPopover— feature unlock on level cross (#335)WhileYouWereAwayModal— absent-session summary (#338)ReferralRegisterSection.tsx+referralShareCopyFeedback.ts(clipboard + banner timing).mobileBuyEffectToastLayout.test.tspins toast stack above bottom nav — any new popover must respect album dock + safe-area clearance.Why needed
The BUY button triggers unusually dense consequences (timer, ranks, BP, prizes, rivals displaced). Today those appear as fleeting multi-toast lines optimized for feedback, not sharing. A single closable transaction-result card turns each buy into a screenshot-ready advertisement — compact, legible, mobile-first — while respecting anti–cognitive-overload copy rules from #363.
Constraints / guardrails
/only; do not block buy submit or wallet flow; popover is dismissible and must not trap focus permanently.useArenaBuyEffectToastshead-resolution pattern; no new RPC mirrors ·INV-FRONTEND-301-INDEXER-FIRST-DISPLAY.prefers-reduced-motion;role="dialog"orrole="status"with accessible dismiss; do not auto-dismiss before user can read/share (unlike current 4s toast stack).LevelUpCelebrationPopoverand WYWA modal — no more than one celebratory overlay at a time.Relevant files
useArenaSaleSession.ts,ArenaSimplePage.tsxarenaBuyProjectedEffects.ts,arenaBuyEffectToastLines.ts,timeArenaBuyPreview.ts,timeArenaUx.tsArenaEffectToastStack.tsx,useArenaBuyEffectToasts.tsfrontend/src/styles/yieldomega-glass-arena.css,frontend/src/index.cssfrontend/src/lib/indexerApi.ts(BuyItem)arenaBuyProjectedEffects.test.ts,ArenaSimplePage.test.tsx,e2e/anvil-arena-03-wallet-writes.spec.ts,e2e/anvil-arena-05-play-feel.spec.tsreferralShareCopyFeedback.tsRecommended direction
Structured result model
buildArenaBuyShareSummary(buy, context)returning a fixed schema:{ headline, rows: { icon?, label, value }[], txHash?, shareText? }covering timer delta, rank/podium movement (when inferable from indexer head), BP earned, prizes/settlements triggered, rivals displaced, XP/level if applicable.buildArenaBuyActualEffectLinesinternals but collapse into grouped rows (not one toast per line).UI — closable popover card
ArenaBuyResultSharePopover) portaled near checkout; opens on buy success; close button + backdrop tap + Escape.ArenaEffectToastStackso users get one card instead of stacked ephemeral toasts (keep toast path behind flag only if needed for rollback).Copy / emoji guidelines
⏱ +2m 14s · 🏆 Last Buyer · +120 BP— tune in implementation.Screenshot verification artifact
@playwright/testscreenshot) captures at three viewports asserting bounding box height ≤ viewport and text legibility (nofont-sizebelow existing arena minimums).Acceptance criteria
/, a closable popover card appears summarizing that transaction's consequences in one compact panel.Test plan
cd frontend && npm run typecheck && npm run lint && npm testArenaSimplePage.test.tsx/arenaVisualUxHooks.test.tsmobileBuyEffectToastLayout.test.tsor new layout test for popover clearance above mobile nav + album dockbash scripts/e2e-anvil.sh(or targetedanvil-arena-03-wallet-writes.spec.ts) with--workers=5Attack / abuse test plan
navigator.clipboardgracefully (mirror referral copy errors); no secret leakage in share text.Verification criteria
cd frontend && npm run typecheck && npm run lint && npm test— PASSmentioned in issue #363
mentioned in commit
785cd4b74fmentioned in merge request !536
mentioned in commit
2a7ad1d3a9mentioned in commit
d8a779f26eVerification — #365 post-buy transaction result share popover
Verified on
main@d8a779f2(merged MR for #365). No repo changes required.Acceptance criteria
/PLAYWRIGHT_SPECS=e2e/anvil-arena-03-wallet-writes.spec.ts bash scripts/e2e-anvil.sh— test DOUB buy shows post-buy result share popover on /arenaBuyShareSummary.test.ts,arenaBuyProjectedEffects.test.ts; manual review of screenshot fixturesdocs/testing/screenshots/issue-365/{mobile,tablet,desktop}.png); headline + ≤7 grouped rowsCI=1 npm run test:e2e -- --workers=1 e2e/buy-result-share-screenshots.spec.ts— 3/3 bounding-box assertsarenaBuyShareSummary.test.ts(upgrades to indexer-confirmed);useArenaBuyResultSharePopover.tshead-resolution effectArenaBuyResultSharePopover.test.tsx; hook skips chime whenreduceMotionuseArenaBuyResultSharePopover.tscelebrationActivedeferral;ArenaSimplePagewiringTest plan / invariants
cd frontend && npm run typecheck && npm run lint && npm testCI=1 npm run test:e2e -- --workers=1 e2e/buy-result-share-screenshots.spec.tsPLAYWRIGHT_SPECS=e2e/anvil-arena-03-wallet-writes.spec.ts bash scripts/e2e-anvil.shmobileBuyResultShareLayout.test.tsArenaSimplePage.test.tsx/arenaVisualUxHooks.test.tswiringAttack / abuse checks (code + unit tests)
referralShareCopyFeedbackpattern in popover)buildArenaBuyShareSummaryshareText)showCardreplaces state;pendingRefsingle slot)lastResolvedBuyIdRef+findViewerBuyAtHead)Follow-ups
bash scripts/e2e-anvil.shcurrently has unrelated failures onanvil-arena-01-mount(AUDIT nav expects/arena/protocol, lands on/audit) andanvil-arena-05-play-feel(arena-xp-heromissing) — pre-existing route/UX drift outside #365 scope.Closing as verified.