Skip to content

feat: v4 phase 3#5413

Open
therealemjy wants to merge 11 commits intomainfrom
feat/v4-phase-3
Open

feat: v4 phase 3#5413
therealemjy wants to merge 11 commits intomainfrom
feat/v4-phase-3

Conversation

@therealemjy
Copy link
Member

Jira ticket(s)

VPD-464
VPD-577
VPD-576
VPD-465

Changes

  • v4 phase 3: updated Markets and Market page

@vercel
Copy link

vercel bot commented Feb 25, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
dapp-preview Ready Ready Preview Mar 6, 2026 10:54am
dapp-testnet Ready Ready Preview Mar 6, 2026 10:54am
venus.io Ready Ready Preview Mar 6, 2026 10:54am

Request Review

@changeset-bot
Copy link

changeset-bot bot commented Feb 25, 2026

🦋 Changeset detected

Latest commit: 8c15f62

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 2 packages
Name Type
@venusprotocol/evm Minor
@venusprotocol/ui Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@github-actions
Copy link
Contributor

github-actions bot commented Feb 25, 2026

Coverage Report for ./apps/evm

Status Category Percentage Covered / Total
🔵 Lines 75.87% 36122 / 47608
🔵 Statements 75.87% 36122 / 47608
🔵 Functions 59.64% 603 / 1011
🔵 Branches 72.12% 4359 / 6044
File Coverage
File Stmts Branches Functions Lines Uncovered Lines
Changed Files
apps/evm/src/clients/api/index.ts 0% 0% 0% 0% 1-239
apps/evm/src/clients/api/queries/getTopMarkets/index.ts 95.23% 75% 100% 95.23% 1
apps/evm/src/clients/api/queries/getTopMarkets/useGetTopMarkets.ts 0% 0% 0% 0% 1-26
apps/evm/src/clients/api/queries/useGetPools/getPools/formatOutput/index.ts 98.55% 90.56% 100% 98.55% 1, 82, 95, 362
apps/evm/src/components/AccountHealthBar/index.tsx 99.09% 64.7% 100% 99.09% 117
apps/evm/src/components/AreaChart/index.tsx 94.62% 60% 0% 94.62% 69-71, 118-119
apps/evm/src/components/ButtonGroup/index.tsx 100% 85.71% 100% 100%
apps/evm/src/components/Carousel/index.tsx 0% 0% 0% 0% 1-90
apps/evm/src/components/EModeIcon/index.tsx 86.66% 0% 100% 86.66% 13-15
apps/evm/src/components/Icon/icons/closedEye.tsx 100% 50% 100% 100%
apps/evm/src/components/Icon/icons/crown.tsx 100% 50% 100% 100%
apps/evm/src/components/Icon/icons/eye.tsx 100% 50% 100% 100%
apps/evm/src/components/Icon/icons/index.ts 100% 100% 100% 100%
apps/evm/src/components/Icon/icons/innerArrows.tsx 8.82% 100% 0% 8.82% 5-36
apps/evm/src/components/Icon/icons/isolated.tsx 17.64% 100% 0% 17.64% 5-19
apps/evm/src/components/Icon/icons/outerArrows.tsx 8.82% 100% 0% 8.82% 5-36
apps/evm/src/components/Icon/icons/pending.tsx 100% 50% 100% 100%
apps/evm/src/components/Icon/icons/pendingOutline.tsx 100% 50% 100% 100%
apps/evm/src/components/Modal/index.tsx 100% 50% 100% 100%
apps/evm/src/components/Modal/styles.ts 97.72% 94.11% 100% 97.72% 1
apps/evm/src/components/SelectTokenTextField/index.tsx 98.78% 80% 66.66% 98.78% 56
apps/evm/src/components/SelectTokenTextField/styles.ts 95.65% 85.71% 100% 95.65% 1
apps/evm/src/components/Table/Head.tsx 100% 94.73% 50% 100%
apps/evm/src/components/Table/index.tsx 90.9% 87.5% 33.33% 90.9% 59-67, 112-117, 146
apps/evm/src/components/Table/styles.ts 91.02% 95.45% 90% 91.02% 1, 75-89
apps/evm/src/components/Table/RowControl/index.tsx 100% 0% 100% 100%
apps/evm/src/components/Table/TableCards/index.tsx 0% 0% 0% 0% 1-94
apps/evm/src/components/Table/TableCards/MarketCard/index.tsx 0% 0% 0% 0% 1-73
apps/evm/src/components/TokenIcon/index.tsx 100% 78.57% 100% 100%
apps/evm/src/components/TokenIconWithSymbol/index.tsx 100% 87.5% 100% 100%
apps/evm/src/components/TokenListWrapper/index.tsx 95.93% 91.3% 33.33% 95.93% 83-87
apps/evm/src/constants/placeholders.ts 100% 0% 100% 100%
apps/evm/src/containers/AccountData/index.tsx 98.33% 83.33% 100% 98.33% 59
apps/evm/src/containers/AssetAccessor/index.tsx 91.22% 73.33% 100% 91.22% 37-39, 63-65
apps/evm/src/containers/AssetCard/index.tsx 100% 0% 100% 100%
apps/evm/src/containers/ConnectWallet/index.tsx 100% 75% 100% 100%
apps/evm/src/containers/Controls/index.tsx 100% 88.88% 100% 100%
apps/evm/src/containers/EModeGroupList/index.tsx 89.69% 71.42% 0% 89.69% 60-69, 107
apps/evm/src/containers/EModeGroupList/EModeGroupItem/index.tsx 100% 87.5% 100% 100%
apps/evm/src/containers/EModeGroupList/EModeGroupItem/EModeGroupCard/index.tsx 100% 80% 100% 100%
apps/evm/src/containers/EModeGroupList/EModeGroupItem/EModeGroupCard/Asset/index.tsx 100% 25% 0% 100%
apps/evm/src/containers/EModeGroupList/EModeGroupItem/Header/index.tsx 98.61% 93.47% 66.66% 98.61% 52-53
apps/evm/src/containers/EModeGroupList/EModeGroupItem/Header/BlockingPositionModal/index.tsx 100% 100% 100% 100%
apps/evm/src/containers/EModeGroupList/EModeGroupItem/Header/BlockingPositionModal/BlockingPosition/index.tsx 100% 100% 100% 100%
apps/evm/src/containers/EModeGroupList/EModeGroupItem/Header/HealthFactorUpdate/index.tsx 100% 0% 100% 100%
apps/evm/src/containers/EModeGroupList/formatEModeGroups/index.ts 96.09% 77.14% 100% 96.09% 3, 30, 135-138, 160
apps/evm/src/containers/EModeGroupList/useColumns/index.tsx 80.24% 78.57% 63.63% 80.24% 33-34, 47-48, 66-71, 80-85
apps/evm/src/containers/HidableUserBalance/index.tsx 85.71% 0% 100% 85.71% 1
apps/evm/src/containers/Layout/Header/MarketInfo/index.tsx 0% 0% 0% 0% 1-161
apps/evm/src/containers/Layout/Header/usePathNodes/PoolName/index.tsx 36.84% 0% 0% 36.84% 13-29
apps/evm/src/containers/Layout/Header/usePathNodes/VTokenSymbol/index.tsx 29.41% 0% 0% 29.41% 10-23
apps/evm/src/containers/Layout/NavBar/useMenuItems/index.tsx 0% 0% 0% 0% 1-114
apps/evm/src/containers/Link/index.tsx 100% 83.33% 100% 100%
apps/evm/src/containers/MarketTable/index.tsx 94.08% 71.87% 60% 94.08% 96-104, 192
apps/evm/src/containers/MarketTable/styles.ts 96% 66.66% 100% 96% 1
apps/evm/src/containers/MarketTable/useColumns/index.tsx 90.55% 81.81% 66.66% 90.55% 145-146, 192, 346, 350, 354-358, 377-395
apps/evm/src/containers/MarketTable/useControls/index.tsx 97.77% 93.75% 100% 97.77% 1
apps/evm/src/containers/PoolStats/index.tsx 91.22% 83.33% 100% 91.22% 57-58, 68-69, 80, 115-124, 228-229
apps/evm/src/containers/SwitchChain/index.tsx 100% 83.33% 100% 100%
apps/evm/src/containers/TopMarkets/index.tsx 95.16% 79.16% 33.33% 95.16% 41-46
apps/evm/src/containers/TopMarkets/TypeButton/index.tsx 100% 50% 100% 100%
apps/evm/src/hooks/useConvertMantissaToReadableTokenString.ts 93.75% 80% 100% 93.75% 1
apps/evm/src/hooks/useFormatTokensToReadableValue.ts 83.33% 50% 100% 83.33% 1
apps/evm/src/hooks/useFormatTo/index.ts 96.66% 90.9% 100% 96.66% 2
apps/evm/src/hooks/useMarketPageTo/index.ts 95.45% 50% 100% 95.45% 3
apps/evm/src/hooks/useMarketsPagePath/index.tsx 90% 0% 100% 90% 1
apps/evm/src/hooks/useUserChainSettings/index.tsx 93.1% 33.33% 100% 93.1% 1, 24
apps/evm/src/pages/Dashboard/index.tsx 86.25% 20% 100% 86.25% 40, 55-58, 63-66, 72-74
apps/evm/src/pages/Dashboard/Guide/index.tsx 79% 60% 0% 79% 47-48, 53-58, 90-104
apps/evm/src/pages/Dashboard/Guide/StepCard/index.tsx 100% 70% 100% 100%
apps/evm/src/pages/Dashboard/Markets/index.tsx 100% 83.33% 100% 100%
apps/evm/src/pages/Dashboard/Markets/Positions/Tables/index.tsx 97.88% 75% 100% 97.88% 89-91
apps/evm/src/pages/Dashboard/Markets/Positions/Tables/IsolatedModeHeader/index.tsx 100% 100% 100% 100%
apps/evm/src/pages/Dashboard/Overview/index.tsx 97.27% 74.5% 66.66% 97.27% 196, 227, 231, 262, 271-274
apps/evm/src/pages/Dashboard/Overview/testIds.ts 100% 0% 100% 100%
apps/evm/src/pages/Dashboard/Overview/DollarValueChange/index.tsx 100% 71.42% 100% 100%
apps/evm/src/pages/Dashboard/Overview/GridCellGroup/index.tsx 100% 0% 100% 100%
apps/evm/src/pages/Dashboard/Overview/PerformanceChart/index.tsx 94.64% 50% 0% 94.64% 43-44, 47
apps/evm/src/pages/Dashboard/Overview/useExtractData/index.tsx 97.95% 54.54% 100% 97.95% 1
apps/evm/src/pages/Dashboard/Overview/useExtractData/calculateNetApy/index.ts 100% 33.33% 100% 100%
apps/evm/src/pages/Dashboard/Placeholder/index.tsx 100% 50% 100% 100%
apps/evm/src/pages/Dashboard/Transactions/index.tsx 89.65% 75% 16.66% 89.65% 62-64, 68-72, 74-76, 83-90, 105
apps/evm/src/pages/Landing/Governance/index.tsx 0% 0% 0% 0% 1-64
apps/evm/src/pages/Landing/Markets/index.tsx 0% 0% 0% 0% 1-87
apps/evm/src/pages/Market/index.tsx 100% 50% 100% 100%
apps/evm/src/pages/Market/AssetWarning/index.tsx 98.66% 83.33% 66.66% 98.66% 38
apps/evm/src/pages/Market/EModeInfo/index.tsx 95.34% 62.5% 100% 95.34% 40-41
apps/evm/src/pages/Market/EModeInfo/Mode/index.tsx 97.95% 50% 25% 97.95% 44
apps/evm/src/pages/Market/EModeInfo/Mode/ModeCard/index.tsx 100% 60% 0% 100%
apps/evm/src/pages/Market/EModeInfo/Mode/useColumns/index.tsx 80% 78.57% 63.63% 80% 31-32, 45-46, 64-69, 78-83
apps/evm/src/pages/Market/MarketCard/index.tsx 100% 33.33% 100% 100%
apps/evm/src/pages/Market/MarketHistory/Card/ApyChart/index.tsx 17.24% 100% 0% 17.24% 25-77
apps/evm/src/pages/Market/MarketInfo/index.tsx 90.44% 54.54% 100% 90.44% 65, 103-112, 140-142
apps/evm/src/pages/Market/OperationForm/index.tsx 83.87% 25% 25% 83.87% 87-106
apps/evm/src/pages/Market/OperationForm/BoostForm/TokenSelectField/index.tsx 0% 0% 0% 0% 1-42
apps/evm/src/pages/Market/OperationForm/BorrowForm/index.tsx 92.88% 87.75% 85.71% 92.88% 101-104, 238-254
apps/evm/src/pages/Market/OperationForm/BorrowForm/EModeBanner/index.tsx 100% 100% 100% 100%
apps/evm/src/pages/Market/OperationForm/Repay/RepayWithCollateralForm/index.tsx 96.52% 93.47% 90% 96.52% 162-165, 297-307, 376
apps/evm/src/pages/Market/OperationForm/Repay/RepayWithWalletBalanceForm/index.tsx 97.44% 91% 87.5% 97.44% 99, 185, 475-485, 498
apps/evm/src/pages/Market/OperationForm/SupplyForm/index.tsx 90.84% 85.33% 77.77% 90.84% 100, 194, 332-347, 358-359, 384-385, 442-452, 467, 506-509
apps/evm/src/pages/Market/OperationForm/WithdrawForm/index.tsx 92.92% 89.85% 88.88% 92.92% 82-85, 160, 249-265, 289, 473-478
apps/evm/src/pages/Markets/index.tsx 93.93% 50% 100% 93.93% 30-32
apps/evm/src/pages/Markets/Header/index.tsx 100% 0% 100% 100%
apps/evm/src/pages/Markets/Tabs/index.tsx 100% 90.9% 50% 100%
apps/evm/src/pages/Markets/Tabs/EMode/index.tsx 87.5% 71.42% 0% 87.5% 48-57, 87
apps/evm/src/pages/Markets/Tabs/EMode/EModeGroup/index.tsx 100% 87.5% 100% 100%
apps/evm/src/pages/Markets/Tabs/EMode/EModeGroup/EModeGroupCard/index.tsx 100% 80% 100% 100%
apps/evm/src/pages/Markets/Tabs/EMode/EModeGroup/EModeGroupCard/Asset/index.tsx 100% 25% 100% 100%
apps/evm/src/pages/Markets/Tabs/EMode/EModeGroup/Header/index.tsx 98.61% 93.47% 66.66% 98.61% 52-53
apps/evm/src/pages/Markets/Tabs/EMode/EModeGroup/Header/BlockingPositionModal/index.tsx 100% 100% 100% 100%
apps/evm/src/pages/Markets/Tabs/EMode/EModeGroup/Header/BlockingPositionModal/BlockingPosition/index.tsx 100% 100% 100% 100%
apps/evm/src/pages/Markets/Tabs/EMode/EModeGroup/Header/HealthFactorUpdate/index.tsx 100% 0% 100% 100%
apps/evm/src/pages/Markets/Tabs/EMode/filterEModeGroups/index.ts 96.96% 92.85% 100% 96.96% 2
apps/evm/src/pages/Markets/Tabs/EMode/useColumns/index.tsx 82.41% 80% 63.63% 82.41% 45-46, 59-60, 78-83, 92-97
apps/evm/src/pages/Markets/Tabs/Markets/index.tsx 100% 0% 100% 100%
apps/evm/src/pages/Markets/Tabs/formatEModeGroups/getHypotheticalAssetValues/index.ts 100% 85.71% 100% 100%
apps/evm/src/pages/Swap/SwapDetails/index.tsx 98.05% 91.3% 100% 98.05% 73, 83
apps/evm/src/pages/Vai/Borrow/index.tsx 95.29% 86.27% 100% 95.29% 63, 86-87, 102, 112, 214-218, 235-236
apps/evm/src/pages/Voter/Holding/index.tsx 100% 25% 100% 100%
apps/evm/src/store/index.ts 97.5% 85.71% 100% 97.5% 1
apps/evm/src/types/index.ts 97.36% 83.33% 100% 97.36% 8
apps/evm/src/utilities/formatCentsToReadableValue/index.ts 97.95% 95.65% 100% 97.95% 1
apps/evm/src/utilities/formatPercentageToReadableValue/index.ts 97.05% 93.75% 100% 97.05% 1
apps/evm/src/utilities/formatTokensToReadableValue/index.ts 97.72% 94.73% 100% 97.72% 1
Generated in workflow #12796 for commit 8c15f62 by the Vitest Coverage Report Action

@therealemjy
Copy link
Member Author

@greptile

@greptile-apps
Copy link

greptile-apps bot commented Mar 2, 2026

Greptile Summary

This PR implements v4 phase 3 updates to the Markets and Market pages. The changes include a major refactoring of the page structure with improved component organization and new features.

Key Changes:

  • New TopMarkets component displays the top 3 supply/borrow markets with interactive toggle
  • Extracted Controls component provides reusable search and filter functionality across tables
  • Refactored Markets page structure with new Header component and improved Tabs organization
  • E-Mode improvements including separated Isolation Mode tab and extracted filterEModeGroups and formatEModeGroups utilities
  • Enhanced MarketTable with modal functionality via rowControlOnClick for quick market actions
  • New table features including MarketCard for mobile view, RowControl component, and variant styling support
  • API consistency improvements changed small prop to buttonSize in ConnectWallet and SwitchChain for better flexibility
  • UI enhancements added crown and pendingOutline icons, updated ButtonGroup with variant support
  • Removed legacy banners (BinanceWallet, Boost, IsolatedPoolsSunset, Probable)
  • Translation restructuring moved keys under markets.tabs.* namespace

The refactoring follows good practices with proper separation of concerns, comprehensive test coverage, and consistent TypeScript typing throughout.

Confidence Score: 5/5

  • This PR is safe to merge with minimal risk
  • The refactoring is well-structured with comprehensive test coverage, consistent API changes throughout the codebase, proper TypeScript typing, and no breaking changes to core functionality. All component prop changes (small to buttonSize) were updated consistently across usages.
  • No files require special attention

Important Files Changed

Filename Overview
apps/evm/src/pages/Markets/index.tsx Simplified Markets page structure with new Header and Tabs components
apps/evm/src/pages/Markets/Tabs/index.tsx Restructured tabs logic with formatEModeGroups extracted and proper separation between E-Mode and Isolation Mode tabs
apps/evm/src/containers/MarketTable/index.tsx Added modal functionality with rowControlOnClick and integrated Controls component for cleaner separation of concerns
apps/evm/src/containers/TopMarkets/index.tsx New component displaying top 3 supply/borrow markets with toggle functionality
apps/evm/src/containers/Controls/index.tsx Extracted reusable Controls component with search and toggle functionality
apps/evm/src/pages/Markets/Tabs/formatEModeGroups/index.ts Moved formatEModeGroups logic up a level for sharing between tabs, calculates hypothetical health factors and blocking positions
apps/evm/src/pages/Markets/Tabs/EMode/filterEModeGroups/index.ts New filtering logic for E-Mode groups with search, paused assets, and user assets filters
apps/evm/src/components/Table/index.tsx Added rowControlOnClick prop, variant styling, and RowControl column support

Last reviewed commit: 91ac46d

Copy link

@greptile-apps greptile-apps bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

95 files reviewed, no comments

Edit Code Review Agent Settings | Greptile

"supplyButton": {
"label": "存款"
},
"textTitle": "焦点"
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I would recommend "聚焦". What do you think? @zed-venus

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think we can translate this from meaning perspective, "精选市场“ or “精选”

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

After discussion with @zed-venus , will settle it to "精选",and for zh-Hant, it is "精選"。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants