diff --git a/src/avs/charts/TVLTabLineChart.jsx b/src/avs/charts/TVLTabLineChart.jsx index bc10269a..977aab29 100644 --- a/src/avs/charts/TVLTabLineChart.jsx +++ b/src/avs/charts/TVLTabLineChart.jsx @@ -3,7 +3,8 @@ import { AxisBottom, AxisRight } from '@visx/axis'; import { formatETH, formatNumber, formatUSD } from '../../shared/formatters'; import { getGrowthPercentage, reduceState } from '../../shared/helpers'; import { scaleLinear, scaleUtc } from '@visx/scale'; -import { Tab, Tabs } from '@nextui-org/react'; +import { Tab, Tabs, Tooltip } from '@nextui-org/react'; +import { tabs, tooltip } from '../../shared/slots'; import { useCallback, useEffect, useMemo } from 'react'; import { useTooltip, useTooltipInPortal } from '@visx/tooltip'; import { bisector } from '@visx/vendor/d3-array'; @@ -12,7 +13,6 @@ import { GridRows } from '@visx/grid'; import { Group } from '@visx/group'; import { LinearGradient } from '@visx/gradient'; import { localPoint } from '@visx/event'; -import { tabs } from '../../shared/slots'; import { useMutativeReducer } from 'use-mutative'; import { useTailwindBreakpoint } from '../../shared/hooks/useTailwindBreakpoint'; @@ -146,7 +146,37 @@ export default function TVLTabLineChart({ points, height, width }) {
- TVL over time +
+ TVL over time + + Due to the expanding pool of Liquid Staking Tokens (LST) and + Liquid Restaking Tokens (LRT), the TVL value on this dashboard + may not always match the actual TVL of the entire token pool. + Refer to the dashboard token list for the current LST and LRT + data included in the TVL calculation. + + } + isOpen={state.showTVLTooltip} + onOpenChange={open => dispatch({ showTVLTooltip: open })} + placement="bottom" + showArrow="true" + > + + dispatch({ showTVLTooltip: !state.showTVLTooltip }) + } + style={{ + fontVariationSettings: `'FILL' 0` + }} + > + info + + +
{getLatestTotals}
-
Volume trend
+
+ Volume trend + + Due to the expanding pool of Liquid Staking Tokens (LST) and + Liquid Restaking Tokens (LRT), the TVL value on this dashboard + may not always match the actual TVL of the entire token pool. + Refer to the dashboard token list for the current LST and LRT + data included in the TVL calculation. + + } + isOpen={state.showTVLTooltip} + onOpenChange={open => dispatch({ showTVLTooltip: open })} + placement="bottom" + showArrow="true" + > + + dispatch({ showTVLTooltip: !state.showTVLTooltip }) + } + style={{ + fontVariationSettings: `'FILL' 0` + }} + > + info + + +
+
{getLatestTotal}
-
Volume trend
+
+ Volume trend + + Due to the expanding pool of Liquid Staking Tokens (LST) and + Liquid Restaking Tokens (LRT), the TVL value on this + dashboard may not always match the actual TVL of the entire + token pool. Refer to the dashboard token list for the + current LST and LRT data included in the TVL calculation. + + } + isOpen={state.showTVLTooltip} + onOpenChange={open => dispatch({ showTVLTooltip: open })} + placement="bottom" + showArrow="true" + > + + dispatch({ showTVLTooltip: !state.showTVLTooltip }) + } + style={{ + fontVariationSettings: `'FILL' 0` + }} + > + info + + +
{getLatestTotal}
- TVL over time +
+ TVL over time + + Due to the expanding pool of Liquid Staking Tokens (LST) and + Liquid Restaking Tokens (LRT), the TVL value on this dashboard + may not always match the actual TVL of the entire token pool. + Refer to the dashboard token list for the current LST and LRT + data included in the TVL calculation. + + } + isOpen={state.showTVLTooltip} + onOpenChange={open => dispatch({ showTVLTooltip: open })} + placement="bottom" + showArrow="true" + > + + dispatch({ showTVLTooltip: !state.showTVLTooltip }) + } + style={{ + fontVariationSettings: `'FILL' 0` + }} + > + info + + +
{getLatestTotals} -
- - Powered by Nethermind + ); }