Fix #417 desktop tape first-visit collapse regression #948

2026-06-26T06:54:10Z

PlasticDigits commented

2026-06-26 06:54:10 +00:00

(Migrated from gitlab.com)

Summary

Verification of GitLab #417 found the desktop recent-trades tape auto-expanded on first /trade visit: react-resizable-panels fired onExpand during initial layout and wrote cl8y-dex-trade-tape-expanded=1 before user interaction.

This MR re-collapses the tape after mount when no stored preference exists, and only persists expansion via explicit expand/collapse button handlers.

Verification checklist

Acceptance item	Result	How verified
First-visit onboarding strip with Swap link + Trade vs Limits guidance	PASS	`TradeOnboardingStrip.test.tsx`, Playwright manual script, screenshot `/tmp/issue-417-screenshots/onboarding-strip-trade.png`
Primary trade CTAs ≥ Swap visual weight (`TRADE_MONEY_CTA_CLASS`)	PASS	Code review + limit CTA 46px height with `py-3 text-sm`; screenshot `trade-ticket-ctas.png`
Slippage presets ~44px touch target	PASS	Playwright bounding box 44.0px on `trade-market-slippage-preset-0.5`
Progressive disclosure: tape + wallet history collapsed on first `/trade` visit	PASS (after fix)	Was FAIL before fix (tape auto-expanded); `TradePage.test.tsx` + Playwright toggle `Expand`, `localStorage` null
Screenshot: `/trade` first-visit layout	PASS	`/tmp/issue-417-screenshots/trade-first-visit-layout.png`
Screenshot: trade ticket CTAs vs Swap	PASS	`/tmp/issue-417-screenshots/trade-ticket-ctas.png`, `swap-cta-reference.png`
Screenshot: onboarding strip	PASS	`onboarding-strip-trade.png`
`make test-frontend`	PASS	1084/1084 tests
`make lint-frontend` / axe smoke	PASS	eslint 0 errors; `PLAYWRIGHT_SKIP_CHAIN=1 npx playwright test e2e/a11y-critical-routes.spec.ts` 8/8
Manual: dismiss + return visit	PASS	Playwright script
Manual: mobile bottom nav not obscured	PASS	`nav.app-mobile-nav-shell` overlap check + `mobile-trade-onboarding.png`
Attack: onboarding dismiss does not block wallet connect	PASS	Playwright opens connect modal with strip visible
Attack: pause/blacklist banners not hidden	PASS	Code review — disclosure only affects tape/history

Test plan

make test-frontend
src/pages/TradePage.test.tsx (desktop tape localStorage assertion)
Manual Playwright verification against make dev + LocalTerra deploy

## Summary Verification of GitLab #417 found the desktop recent-trades tape auto-expanded on first `/trade` visit: `react-resizable-panels` fired `onExpand` during initial layout and wrote `cl8y-dex-trade-tape-expanded=1` before user interaction. This MR re-collapses the tape after mount when no stored preference exists, and only persists expansion via explicit expand/collapse button handlers. ## Verification checklist | Acceptance item | Result | How verified | |-----------------|--------|--------------| | First-visit onboarding strip with Swap link + Trade vs Limits guidance | **PASS** | `TradeOnboardingStrip.test.tsx`, Playwright manual script, screenshot `/tmp/issue-417-screenshots/onboarding-strip-trade.png` | | Primary trade CTAs ≥ Swap visual weight (`TRADE_MONEY_CTA_CLASS`) | **PASS** | Code review + limit CTA 46px height with `py-3 text-sm`; screenshot `trade-ticket-ctas.png` | | Slippage presets ~44px touch target | **PASS** | Playwright bounding box 44.0px on `trade-market-slippage-preset-0.5` | | Progressive disclosure: tape + wallet history collapsed on first `/trade` visit | **PASS** (after fix) | Was **FAIL** before fix (tape auto-expanded); `TradePage.test.tsx` + Playwright toggle `Expand`, `localStorage` null | | Screenshot: `/trade` first-visit layout | **PASS** | `/tmp/issue-417-screenshots/trade-first-visit-layout.png` | | Screenshot: trade ticket CTAs vs Swap | **PASS** | `/tmp/issue-417-screenshots/trade-ticket-ctas.png`, `swap-cta-reference.png` | | Screenshot: onboarding strip | **PASS** | `onboarding-strip-trade.png` | | `make test-frontend` | **PASS** | 1084/1084 tests | | `make lint-frontend` / axe smoke | **PASS** | eslint 0 errors; `PLAYWRIGHT_SKIP_CHAIN=1 npx playwright test e2e/a11y-critical-routes.spec.ts` 8/8 | | Manual: dismiss + return visit | **PASS** | Playwright script | | Manual: mobile bottom nav not obscured | **PASS** | `nav.app-mobile-nav-shell` overlap check + `mobile-trade-onboarding.png` | | Attack: onboarding dismiss does not block wallet connect | **PASS** | Playwright opens connect modal with strip visible | | Attack: pause/blacklist banners not hidden | **PASS** | Code review — disclosure only affects tape/history | ## Test plan - [x] `make test-frontend` - [x] `src/pages/TradePage.test.tsx` (desktop tape localStorage assertion) - [x] Manual Playwright verification against `make dev` + LocalTerra deploy

PlasticDigits commented

2026-06-26 06:56:02 +00:00

(Migrated from gitlab.com)

Security review — MR !948

Commit reviewed: 59cc70e0793ed6add85e14dcc5ce70031133c8ee
Scope: TradePage.tsx desktop tape first-visit collapse fix (useEffect + rAF re-collapse), removal of localStorage writes from Panel onExpand/onCollapse, optional chaining on imperative panel API, test assertion, and AGENTS_FRONTEND_TRADE_ONBOARDING_IA.md doc note.

Method: Diff review with trace of attacker-controlled input to sinks. Prior MR security threads: none.

Outcome: FINDINGS: 0 medium+

No inline threads — nothing to flag on the diff.

Summary

This change is a client-side UI regression fix for progressive disclosure on /trade. It does not introduce new network endpoints, auth paths, on-chain interactions, or rendering of untrusted data.

readTradePanelExpanded / writeTradePanelExpanded — unchanged helpers; reads only accept '1' as expanded, writes only '1'/'0'. Keys are compile-time constants; no injection or deserialization surface.
useEffect + requestAnimationFrame re-collapse — runs once on mount when no stored preference exists; only toggles local React state and calls tapePanelRef.current?.collapse?.(). No external input, secrets, or privileged operations.
Removing writeTradePanelExpanded from Panel onExpand/onCollapse — limits persistence to explicit button handlers; reduces spurious writes from library layout events. No authz or trust-boundary impact.
Tests / docs — assertion and guidance only; no runtime security effect.

Label: block:security not applied (no medium+ findings).

## Security review — MR !948 **Commit reviewed:** `59cc70e0793ed6add85e14dcc5ce70031133c8ee` **Scope:** `TradePage.tsx` desktop tape first-visit collapse fix (`useEffect` + rAF re-collapse), removal of `localStorage` writes from `Panel` `onExpand`/`onCollapse`, optional chaining on imperative panel API, test assertion, and `AGENTS_FRONTEND_TRADE_ONBOARDING_IA.md` doc note. **Method:** Diff review with trace of attacker-controlled input to sinks. Prior MR security threads: none. **Outcome:** `FINDINGS: 0` medium+ No inline threads — nothing to flag on the diff. ### Summary This change is a client-side UI regression fix for progressive disclosure on `/trade`. It does not introduce new network endpoints, auth paths, on-chain interactions, or rendering of untrusted data. - **`readTradePanelExpanded` / `writeTradePanelExpanded`** — unchanged helpers; reads only accept `'1'` as expanded, writes only `'1'`/`'0'`. Keys are compile-time constants; no injection or deserialization surface. - **`useEffect` + `requestAnimationFrame` re-collapse** — runs once on mount when no stored preference exists; only toggles local React state and calls `tapePanelRef.current?.collapse?.()`. No external input, secrets, or privileged operations. - **Removing `writeTradePanelExpanded` from `Panel` `onExpand`/`onCollapse`** — limits persistence to explicit button handlers; reduces spurious writes from library layout events. No authz or trust-boundary impact. - **Tests / docs** — assertion and guidance only; no runtime security effect. **Label:** `block:security` not applied (no medium+ findings).