From cec3a726bbc28a0a4aaad4e02c3ab2ba9815c9cf Mon Sep 17 00:00:00 2001 From: xieqiancaosissi Date: Tue, 2 Jul 2024 16:51:44 +0800 Subject: [PATCH] Update meme chart (#557) * Update meme chart * Add meme config color * Fix meme chart * feat: add delta link * feat: fix mobile delta image * feat: change delta link --------- Co-authored-by: lq0-github <1441665200@qq.com> Co-authored-by: deep-path <476044723@qq.com> --- src/components/layout/Swiper.tsx | 38 ++++++++++++++++++++++++++-- src/components/meme/StakingChart.tsx | 18 ++++++++----- src/components/meme/memeConfig.tsx | 4 +++ 3 files changed, 52 insertions(+), 8 deletions(-) diff --git a/src/components/layout/Swiper.tsx b/src/components/layout/Swiper.tsx index fe64ad14d..8cff927e9 100644 --- a/src/components/layout/Swiper.tsx +++ b/src/components/layout/Swiper.tsx @@ -11,14 +11,14 @@ export default function AdSwiper() { const [closeStatus, setCloseStatus] = useState(true); useEffect(() => { const popupSwiper = localStorage.getItem('ad-announcement'); - if (popupSwiper == '13') { + if (popupSwiper == '14') { setCloseStatus(true); } else { setCloseStatus(false); } }, []); const closePop = (e: any) => { - localStorage.setItem('ad-announcement', '13'); + localStorage.setItem('ad-announcement', '14'); e.stopPropagation(); setCloseStatus(true); }; @@ -69,6 +69,22 @@ export default function AdSwiper() { {is_mobile ? : } + +
+ +
+
{ + window.open('https://www.deltatrade.ai/activity/home'); + }} + > + {is_mobile ? : } +
+
)} @@ -107,3 +123,21 @@ function FRAXUSDCFARMMobile() { /> ); } + +function DeltaMobile() { + return ( + + ); +} + +function DeltaPC() { + return ( + + ); +} diff --git a/src/components/meme/StakingChart.tsx b/src/components/meme/StakingChart.tsx index 9373e3d37..fb60ec4cb 100644 --- a/src/components/meme/StakingChart.tsx +++ b/src/components/meme/StakingChart.tsx @@ -42,17 +42,16 @@ const StakingChart = ({ chartType }) => { const { MEME_TOKEN_XREF_MAP } = getMemeContractConfig(); const memeDataConfig = getMemeDataConfig(); const meme_winner_tokens = memeDataConfig.meme_winner_tokens; - const displaySeeds = useMemo(() => { if (emptyObject(seeds)) return {}; - return meme_winner_tokens.reduce( + return Object.keys(MEME_TOKEN_XREF_MAP).reduce( (acc, memeTokenId) => ({ ...acc, ...{ [memeTokenId]: seeds[memeTokenId] }, }), {} ) as Record; - }, [meme_winner_tokens, seeds]); + }, [seeds]); useEffect(() => { if (!seeds) { @@ -112,20 +111,27 @@ const StakingChart = ({ chartType }) => { } }); - return dataItems + const MIN_DISPLAY_PERCENT = 1; + + const adjustedDataItems = dataItems .map((item) => { const value = chartType === 'meme' ? Big(item.seedTvl) : Big(item.xrefSeedTvl); const percent = totalTvlForCalculation.gt(0) ? value.div(totalTvlForCalculation).mul(100).toFixed(2) : 0; + const displayPercent = Number(percent) < 0.01 ? '<0.01' : percent; return { ...item, value: Number(percent), - percent, + displayValue: Math.max(Number(percent), MIN_DISPLAY_PERCENT), + percent: displayPercent, }; }) + // .filter((item) => item.value > 0) .sort((a, b) => b.value - a.value); + + return adjustedDataItems; }, [displaySeeds, xrefSeeds, allTokenMetadatas, chartType]); const onPieEnter = (_, index) => { @@ -204,7 +210,7 @@ const StakingChart = ({ chartType }) => { activeIndex={activeIndex} activeShape={customActiveShape} data={chartData} - dataKey="value" + dataKey="displayValue" nameKey="symbol" cx="50%" cy="50%" diff --git a/src/components/meme/memeConfig.tsx b/src/components/meme/memeConfig.tsx index 2de59c9af..c2502a998 100644 --- a/src/components/meme/memeConfig.tsx +++ b/src/components/meme/memeConfig.tsx @@ -440,6 +440,10 @@ export function getMemeDataConfig(): any { 'bean.tkn.near': '#984D2E', 'token.0xshitzu.near': '#50ED99', 'ftv2.nekotoken.near': '#FFFFFF', + 'marmaj.tkn.near': '#92D5EC', + 'babyblackdragon.tkn.near': '#FF8F00', + 'hat.tkn.near': '#F7AE07', + 'intel.tkn.near': '#2C3D4C', }, meme_cap_tokens: [ 'token.lonkingnearbackto2024.near',