Problem
Token icons are missing from swap, limit order, TWAP, and stop-loss transaction cards. Only text symbols show (e.g. "ETH > USDC") with no logos.
tk ticket: sa-midv
Figma: https://www.figma.com/design/GeIQBjsXPrqJRYLVCzcjdV/AI-UX-Flows?node-id=2861-3112
Root Cause
Icons were never implemented in TxStepCardSwapPair. The component only accepts fromSymbol/toSymbol string props — no icon props exist. The vanilla JS migration is unrelated.
The icon data IS available: swapData.sellAsset.icon and swapData.buyAsset.icon carry valid URLs, and AssetIcon component already exists and is used elsewhere (portfolio, tx history, asset search).
Fix
TxStepCard.tsx — Add fromIcon/toIcon optional props to TxStepCardSwapPair, render AssetIcon
- All 4 UI components — Pass icon URLs from tool output:
InitiateSwapUI.tsx
LimitOrderUI.tsx
StopLossUI.tsx
TwapUI.tsx
Acceptance Criteria
Problem
Token icons are missing from swap, limit order, TWAP, and stop-loss transaction cards. Only text symbols show (e.g. "ETH > USDC") with no logos.
tk ticket:
sa-midvFigma: https://www.figma.com/design/GeIQBjsXPrqJRYLVCzcjdV/AI-UX-Flows?node-id=2861-3112
Root Cause
Icons were never implemented in
TxStepCardSwapPair. The component only acceptsfromSymbol/toSymbolstring props — no icon props exist. The vanilla JS migration is unrelated.The icon data IS available:
swapData.sellAsset.iconandswapData.buyAsset.iconcarry valid URLs, andAssetIconcomponent already exists and is used elsewhere (portfolio, tx history, asset search).Fix
TxStepCard.tsx— AddfromIcon/toIconoptional props toTxStepCardSwapPair, renderAssetIconInitiateSwapUI.tsxLimitOrderUI.tsxStopLossUI.tsxTwapUI.tsxAcceptance Criteria