fix: runepool position loading on account pages + view position redirect - #12512
fix: runepool position loading on account pages + view position redirect#12512kaladinlight wants to merge 1 commit into
Conversation
Account/asset pages render the DeFi section without anything mounting the opportunities fetch, so the RUNEPool row balance and overview modal relied on persisted state - wiped by the savers-removal migration, leaving an infinite spinner. Mount useFetchOpportunities alongside the section (deduped with the earn dashboard by the shared query key). View position now routes to the asset account page instead of the legacy chain account page, whose sidebar has never laid out beside the content. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
📝 WalkthroughWalkthroughThe change fetches earn opportunities when the opportunities section renders independently. RunePool deposit and withdraw status handlers now route positions to account pages that include both account and asset identifiers. ChangesEarn opportunities and position navigation
Estimated code review effort: 2 (Simple) | ~10 minutes Suggested reviewers: Poem
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In
`@src/features/defi/providers/runepool/components/RunePoolManager/Deposit/components/Status.tsx`:
- Around line 100-103: Update both Status navigation handlers in
src/features/defi/providers/runepool/components/RunePoolManager/Deposit/components/Status.tsx
(lines 100-103) and
src/features/defi/providers/runepool/components/RunePoolManager/Withdraw/components/Status.tsx
(lines 101-104) to URL-encode accountId and assetId before constructing the
/accounts navigation path, preserving the existing guard and navigate behavior.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro Plus
Run ID: 727b09d5-0b90-406f-94da-e20c17239c6a
📒 Files selected for processing (3)
src/components/StakingVaults/EarnOpportunities.tsxsrc/features/defi/providers/runepool/components/RunePoolManager/Deposit/components/Status.tsxsrc/features/defi/providers/runepool/components/RunePoolManager/Withdraw/components/Status.tsx
| if (!accountId || !assetId) return | ||
| // The full-page earn dashboard is mobile-only - the asset account page shows the position on both layouts | ||
| navigate(`/accounts/${accountId}/${assetId}`) | ||
| }, [accountId, assetId, navigate]) |
There was a problem hiding this comment.
🎯 Functional Correctness | 🟠 Major | ⚡ Quick win
🧩 Analysis chain
🏁 Script executed:
#!/usr/bin/env bash
set -euo pipefail
rg -n -C 4 \
'accounts/:accountId/:assetId|handleViewPosition|encodeURIComponent|generatePath' \
src/features/defi/providers/runepool \
src/components/AssetAccounts \
src/hooks/useRouteAssetIdRepository: shapeshift/web
Length of output: 7457
🏁 Script executed:
#!/usr/bin/env bash
set -euo pipefail
printf 'Candidate files:\n'
fd -a 'Status.tsx|useRouteAssetId.ts|AssetAccountRow.tsx|Routing|Routes|react-router-dom' src | sed 's#^# #' | head -80
printf '\nAssetAccountRow generated path section:\n'
sed -n '60,95p' src/components/AssetAccounts/AssetAccountRow.tsx
printf '\nRouteAssetId hook:\n'
sed -n '1,120p' src/hooks/useRouteAssetId/useRouteAssetId.ts
printf '\nRunePool deposit/withdraw status navigation imports and handlers:\n'
for f in \
src/features/defi/providers/runepool/components/RunePoolManager/Deposit/components/Status.tsx \
src/features/defi/providers/runepool/components/RunePoolManager/Withdraw/components/Status.tsx
do
echo "--- $f"
sed -n '1,115p' "$f"
done
printf '\nReact Router usage around AssetAccountRow path:\n'
rg -n -C 5 'routesForAsset|Route|path=.*accountId|AssetAccountRow' src | head -200
printf '\nCAIP assetId/accountId references:\n'
rg -n 'type AssetId|AccountId.*= string|fromAccountId|toAccountId|assetId.*chain/asset|AccountId<|AssetId<' -g '*.{ts,tsx}' src | head -200Repository: shapeshift/web
Length of output: 50370
🏁 Script executed:
#!/usr/bin/env bash
set -euo pipefail
printf 'Assets definitions for CAIP types:\n'
fd -a 'assets.ts|index.ts' src | rg 'caip|assets' | head -80
printf '\nAccounts route definitions:\n'
rg -n -C 8 'path=.*accounts|Route.*Account|Link to /accounts|generatePath.*accountId|encodeURIComponent|useRouteAssetId' src/pages src/components src/Routes | head -220
printf '\nTest deterministic route matching for raw vs encoded path params via Node URL parsing only:\n'
node - <<'JS'
const accountId = 'eip155:1:0xabc/def'
const assetId = 'eip155:1/ERC20:0xdef/abc'
const raw = `/accounts/${accountId}/${assetId}`
console.log({ raw, segments: raw.split('/').filter(Boolean).length })
console.log({ encoded: `/accounts/${encodeURIComponent(accountId)}/${encodeURIComponent(assetId)}` })
JSRepository: shapeshift/web
Length of output: 17757
🏁 Script executed:
#!/usr/bin/env bash
set -euo pipefail
printf 'Accounts page route rendering:\n'
sed -n '1,170p' src/pages/Accounts/Accounts.tsx
printf '\nAccounts Account route params routing:\n'
sed -n '1,220p' src/pages/Accounts/Account.tsx
printf '\nAll direct /accounts/:accountId/:assetId generatePath/navigate calls:\n'
rg -n -C 3 "generatePath\\('/accounts/:accountId/:assetId'|generatePath\\(\\\"/accounts/:accountId/:assetId\"|navigate\\(`/accounts/\\$|navigate\\(`/accounts/${accountId}/${assetId}`|navigate\\(`/accounts/\\$\\{accountId\\}/\\$\\{assetId\\}`" srcRepository: shapeshift/web
Length of output: 5934
🏁 Script executed:
#!/usr/bin/env bash
set -euo pipefail
printf 'Navigations between RunePool status and asset account subroutes:\n'
rg -n -C 5 "navigate\\(`/accounts/\\$\\{accountId\\}/\\$\\{assetId\\}`|navigate\\(\\`/accounts/\\$\\{accountId\\}/\\$\\{assetId\\}\\`|navigate\\(/accounts/|Link\\|useLocation|useParams|assetId\\)" \
src/features/defi/providers/runepool \
src/pages/Accounts \
src/components/AssetAccountDetails \
src/hooks/useRouteAssetId \
src/components/AssetAccounts/AssetAccountRow.tsxRepository: shapeshift/web
Length of output: 43320
Encode account ID and asset ID in the account navigation.
Both RunePool status screens build /accounts/${accountId}/${assetId} with raw CAIP values. If either value contains /, React Router split that pathname into extra segments, and the :accountId/* / :accountId/:chainId/:assetSubId routes receive the wrong params. URL-encode accountId and assetId before navigation in both status handlers.
📍 Affects 2 files
src/features/defi/providers/runepool/components/RunePoolManager/Deposit/components/Status.tsx#L100-L103(this comment)src/features/defi/providers/runepool/components/RunePoolManager/Withdraw/components/Status.tsx#L101-L104
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In
`@src/features/defi/providers/runepool/components/RunePoolManager/Deposit/components/Status.tsx`
around lines 100 - 103, Update both Status navigation handlers in
src/features/defi/providers/runepool/components/RunePoolManager/Deposit/components/Status.tsx
(lines 100-103) and
src/features/defi/providers/runepool/components/RunePoolManager/Withdraw/components/Status.tsx
(lines 101-104) to URL-encode accountId and assetId before constructing the
/accounts navigation path, preserving the existing guard and navigate behavior.
Source: Learnings
Description
Two follow-up fixes to the savers/lending removal + RUNEPool extraction (#12511):
Infinite spinner opening the RUNEPool opportunity from account pages. Account/asset pages render the DeFi section (
EarnOpportunities) but nothing on those pages mounts the opportunities fetch — the only fetcher wasDeFiEarn(earn dashboard / wallet drawer). The row balance and overview modal previously worked off redux-persisteduserStakingentries from earlier earn-dashboard sessions; the savers-removal migration (v7) correctly wiped that state and exposed the gap, leaving the modal spinning forever onisLoaded: false. Fix: mountuseFetchOpportunities()alongside the section — fully deduped with the earn dashboard via the shared react-query key, so no extra fetches when both are mounted.Broken layout after "View Position". The deposit/withdraw status screens navigated to
/accounts/:accountId— the legacy chain-account page whose swap "sidebar" renders inside a plain blockContainerand has never laid out beside the content. Now routes to/accounts/:accountId/:assetId(the asset account page users actually browse, same targetAccountEntryRowuses).Issue (if applicable)
closes #
Risk
Low — one hook mount on account pages (deduped query, no new fetch volume when the earn dashboard is also mounted) and two navigation target changes. No transaction building or signing paths touched.
None — read-only opportunity data fetching and client-side routing only.
Testing
Engineering
/#/accounts/<thorchain accountId>/cosmos:thorchain-1/slip44:931) without visiting the earn dashboard first. The RUNEPool row should show a balance, and clicking it should resolve the overview modal (position or empty state) instead of an infinite spinner.Operations
Screenshots (if applicable)
🤖 Generated with Claude Code
Summary by CodeRabbit
New Features
Bug Fixes