From 218a5b0b01f74bbec027d45f83d37e51803c3e51 Mon Sep 17 00:00:00 2001 From: antoncoding Date: Thu, 4 Dec 2025 13:15:56 +0800 Subject: [PATCH 1/2] feat: chainlink tier modal --- .../MarketOracle/ChainlinkFeedTooltip.tsx | 22 +++++- .../MarketOracle/ChainlinkRiskTiersModal.tsx | 77 +++++++++++++++++++ .../MarketOracle/CompoundFeedTooltip.tsx | 22 +++++- 3 files changed, 119 insertions(+), 2 deletions(-) create mode 100644 src/components/MarketOracle/ChainlinkRiskTiersModal.tsx diff --git a/src/components/MarketOracle/ChainlinkFeedTooltip.tsx b/src/components/MarketOracle/ChainlinkFeedTooltip.tsx index 2f72321f..d545f9db 100644 --- a/src/components/MarketOracle/ChainlinkFeedTooltip.tsx +++ b/src/components/MarketOracle/ChainlinkFeedTooltip.tsx @@ -1,12 +1,15 @@ import Image from 'next/image'; import Link from 'next/link'; +import { IoHelpCircleOutline } from 'react-icons/io5'; import { Address } from 'viem'; import { Badge } from '@/components/common/Badge'; import { ChainlinkOracleEntry, getChainlinkFeedUrl } from '@/constants/oracle/chainlink-data'; +import { useGlobalModal } from '@/contexts/GlobalModalContext'; import etherscanLogo from '@/imgs/etherscan.png'; import { getExplorerURL } from '@/utils/external'; import { PriceFeedVendors, OracleVendorIcons } from '@/utils/oracle'; import { OracleFeed } from '@/utils/types'; +import { ChainlinkRiskTiersModal } from './ChainlinkRiskTiersModal'; type ChainlinkFeedTooltipProps = { feed: OracleFeed; @@ -15,6 +18,7 @@ type ChainlinkFeedTooltipProps = { }; export function ChainlinkFeedTooltip({ feed, chainlinkData, chainId }: ChainlinkFeedTooltipProps) { + const { toggleModal, closeModal } = useGlobalModal(); const baseAsset = feed.pair?.[0] ?? chainlinkData?.baseAsset ?? 'Unknown'; const quoteAsset = feed.pair?.[1] ?? chainlinkData?.quoteAsset ?? 'Unknown'; @@ -75,7 +79,23 @@ export function ChainlinkFeedTooltip({ feed, chainlinkData, chainId }: Chainlink
Risk Tier: - {getRiskTierBadge(chainlinkData.feedCategory)} +
+ {getRiskTierBadge(chainlinkData.feedCategory)} + +
Deviation Threshold: diff --git a/src/components/MarketOracle/ChainlinkRiskTiersModal.tsx b/src/components/MarketOracle/ChainlinkRiskTiersModal.tsx new file mode 100644 index 00000000..4c941621 --- /dev/null +++ b/src/components/MarketOracle/ChainlinkRiskTiersModal.tsx @@ -0,0 +1,77 @@ +import Image from 'next/image'; +import { Badge } from '@/components/common/Badge'; +import { Modal, ModalHeader, ModalBody } from '@/components/common/Modal'; +import { PriceFeedVendors, OracleVendorIcons } from '@/utils/oracle'; + +type ChainlinkRiskTiersModalProps = { + isOpen: boolean; + onClose: () => void; +}; + +export function ChainlinkRiskTiersModal({ isOpen, onClose }: ChainlinkRiskTiersModalProps) { + const chainlinkIcon = OracleVendorIcons[PriceFeedVendors.Chainlink]; + + return ( + !open && onClose()} + zIndex="base" + size="xl" + > + : undefined} + onClose={onClose} + /> + + +
+ {/* Low Risk */} +
+
+ LOW RISK +
+

+ Data feeds following standardized workflows to report market prices. Highly resilient to disruption with many data sources. High trading volumes across large numbers of markets enable consistent price discovery. +

+
+ + {/* Medium Risk */} +
+
+ MEDIUM RISK +
+

+ Market price feeds for asset pairs that may have features making them more challenging to reliably price or subject to volatility. Risk factors include lower or inconsistent volume, spread between trading venues, market concentration on single exchanges, cross-rate pricing, or significant market events. +

+
+ + {/* High Risk */} +
+
+ HIGH RISK +
+

+ Asset pairs exhibiting heightened risk factors that make market prices subject to uncertainty or volatility. Risk factors include significant market events (hacks, bridge failures, major exchange delistings), asset or project deprecation, or extremely low trading volumes. +

+
+ + {/* Custom */} +
+
+ CUSTOM +
+

+ Feeds built to serve specific use cases and may not be suitable for general use. Categories include onchain single source feeds, proof of reserve feeds, exchange rate feeds, technical metric feeds, total value locked feeds, custom index feeds, and LP token feeds. Users must evaluate feed properties against their intended use case. +

+
+ +

+ Risk tier categories are assigned by Chainlink based on feed characteristics and market conditions. +

+
+ + + ); +} diff --git a/src/components/MarketOracle/CompoundFeedTooltip.tsx b/src/components/MarketOracle/CompoundFeedTooltip.tsx index 2a547bbf..11e4b86d 100644 --- a/src/components/MarketOracle/CompoundFeedTooltip.tsx +++ b/src/components/MarketOracle/CompoundFeedTooltip.tsx @@ -1,14 +1,17 @@ import { useMemo } from 'react'; import Image from 'next/image'; import Link from 'next/link'; +import { IoHelpCircleOutline } from 'react-icons/io5'; import { Address } from 'viem'; import { Badge } from '@/components/common/Badge'; import { getChainlinkFeedUrl, getChainlinkOracle } from '@/constants/oracle/chainlink-data'; import { CompoundFeedEntry } from '@/constants/oracle/compound'; +import { useGlobalModal } from '@/contexts/GlobalModalContext'; import etherscanLogo from '@/imgs/etherscan.png'; import { getExplorerURL } from '@/utils/external'; import { PriceFeedVendors, OracleVendorIcons } from '@/utils/oracle'; import { OracleFeed } from '@/utils/types'; +import { ChainlinkRiskTiersModal } from './ChainlinkRiskTiersModal'; type CompoundFeedTooltipProps = { feed: OracleFeed; @@ -17,6 +20,7 @@ type CompoundFeedTooltipProps = { }; export function CompoundFeedTooltip({ feed, compoundData, chainId }: CompoundFeedTooltipProps) { + const { toggleModal, closeModal } = useGlobalModal(); const baseAsset = compoundData.base; const quoteAsset = compoundData.quote; @@ -100,7 +104,23 @@ export function CompoundFeedTooltip({ feed, compoundData, chainId }: CompoundFee
Risk Tier: - {getRiskTierBadge(underlyingChainlinkData.feedCategory)} +
+ {getRiskTierBadge(underlyingChainlinkData.feedCategory)} + +
Deviation Threshold: From 2b6767671ef5a4d60f4a410d01d26dbd9af22e5e Mon Sep 17 00:00:00 2001 From: antoncoding Date: Thu, 4 Dec 2025 13:29:15 +0800 Subject: [PATCH 2/2] chore: update path mismatch error message --- src/utils/oracle.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/utils/oracle.ts b/src/utils/oracle.ts index 83abe476..cc0cf923 100644 --- a/src/utils/oracle.ts +++ b/src/utils/oracle.ts @@ -503,7 +503,7 @@ export function checkFeedsPath( const actualPath = `${remainingNumeratorAssets.join('*')}/${remainingDenominatorAssets.join( '*', )}`; - missingPath = `Feed path mismatch: got ${actualPath}, expected ${expectedPath}`; + missingPath = `Oracle uses ${actualPath.toUpperCase()} instead of ${expectedPath.toUpperCase()}. Depegs or divergence won't be reflected`; } return {