From 0b5ebccaa4ac4bc8ac7ba9702593580dc8d2297d Mon Sep 17 00:00:00 2001 From: Tom Jeatt Date: Mon, 24 Jun 2024 13:01:33 +0100 Subject: [PATCH 1/7] refactor: resort project cards by spice p/h --- apps/evm/src/pages/Fusion/Fusion.tsx | 2 +- .../PartnersSection/PartnerCard.tsx | 60 +++++++++++++++---- .../PartnersSection/PartnerSection.tsx | 25 ++------ apps/evm/src/utils/api-client.ts | 14 +++-- 4 files changed, 60 insertions(+), 41 deletions(-) diff --git a/apps/evm/src/pages/Fusion/Fusion.tsx b/apps/evm/src/pages/Fusion/Fusion.tsx index ca39a3d4a..f1a2bc80f 100644 --- a/apps/evm/src/pages/Fusion/Fusion.tsx +++ b/apps/evm/src/pages/Fusion/Fusion.tsx @@ -48,7 +48,7 @@ const Fusion = () => { return ( -
+
diff --git a/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx b/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx index b1d1935e2..d64a7bb86 100644 --- a/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx +++ b/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx @@ -1,5 +1,24 @@ -import { CardProps, Dd, Dl, DlGroup, Dt, Flex, H3, P } from '@gobob/ui'; +import { + Button, + CardProps, + Dd, + Dl, + DlGroup, + Dt, + Flex, + H3, + P, + Popover, + PopoverBody, + PopoverContent, + PopoverTrigger, + QuestionMarkCircle, + Tooltip, + useMediaQuery +} from '@gobob/ui'; import { ReactNode } from 'react'; +import { t } from 'i18next'; +import { useTheme } from 'styled-components'; import { StyledCategoryTag, StyledLiveTag, StyledPartnerCard } from './PartnerCard.style'; @@ -8,9 +27,7 @@ type Props = { logoSrc: string | ReactNode; name: string; url: string; - totalSpice?: string; distributedSpice?: string; - percentageDistributed?: string; harvest?: string; isLive?: boolean; }; @@ -26,13 +43,14 @@ const PartnerCard = ({ logoSrc, name, url, - totalSpice, distributedSpice, - percentageDistributed, harvest, isLive, ...props }: PartnerCardProps): JSX.Element => { + const theme = useTheme(); + const isMobile = useMediaQuery(theme.breakpoints.down('md')); + return (
-
Total Spice:
-
- {totalSpice} -
- - -
Distributed:
+
+ + Spice Distributed per Hour: + {isMobile ? ( + + + + + + +

This is the average amount of spice distributed by the project per hour.

+ + + + ) : ( + {t('fusion.userStats.revealCodeInfo')}

}> + + + )} + +
- {distributedSpice} ({percentageDistributed}) + {distributedSpice}
diff --git a/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerSection.tsx b/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerSection.tsx index 1c98a3d23..2cf3750d3 100644 --- a/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerSection.tsx +++ b/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerSection.tsx @@ -25,7 +25,9 @@ const PartnersSection = () => { queryFn: async () => { const partners = await apiClient.getPartners(); - return partners.partners.sort((a, b) => Number(b.total_points) - Number(a.total_points)); + return partners.partners.sort( + (a, b) => Number(b.points_distributed_per_hour) - Number(a.points_distributed_per_hour) + ); }, refetchOnWindowFocus: false, gcTime: INTERVAL.HOUR, @@ -45,21 +47,6 @@ const PartnersSection = () => { [locale, user] ); - const getPercentageDistributed = useCallback( - (total: string, distributed: string) => { - const percentageDistributed = Number(distributed) / Number(total); - - // If a project has 0 total and 0 distributed the result will be NaN - return isNaN(percentageDistributed) - ? '-' - : Intl.NumberFormat(locale, { - style: 'percent', - maximumFractionDigits: 2 - }).format(percentageDistributed); - }, - [locale] - ); - return (

@@ -87,7 +74,7 @@ const PartnersSection = () => { isPressable category={item?.category} distributedSpice={Intl.NumberFormat(locale, { maximumFractionDigits: 2, notation: 'compact' }).format( - Number(item.total_distributed_points) + Number(item.points_distributed_per_hour) )} elementType='a' gap='md' @@ -95,10 +82,6 @@ const PartnersSection = () => { isLive={item.live} logoSrc={getImageUrl(item.name)} name={item.name} - percentageDistributed={getPercentageDistributed(item.total_points, item.total_distributed_points)} - totalSpice={Intl.NumberFormat(locale, { maximumFractionDigits: 2, notation: 'compact' }).format( - Number(item.total_points) - )} url={item?.project_url} /> ))} diff --git a/apps/evm/src/utils/api-client.ts b/apps/evm/src/utils/api-client.ts index 10d79cbb1..3e9f7437a 100644 --- a/apps/evm/src/utils/api-client.ts +++ b/apps/evm/src/utils/api-client.ts @@ -32,16 +32,18 @@ type PartnersResponse = { }; type Partner = { - name: string; - ref_code: string; category: string; + current_points: string; + live: boolean; + name: string; + points_distributed_per_hour: string; project_url: string; - total_distributed_points: string; + ref_code: string; total_deposit_points: string; - total_referral_points: string; + total_distributed_points: string; total_points: string; - current_points: string; - live: boolean; + total_points_distributed_in_time_window: string; + total_referral_points: string; }; type LeaderboardItem = { From 48ff0678282fa7f1f2997e8c0f5bc8f33114bba5 Mon Sep 17 00:00:00 2001 From: Tom Jeatt Date: Mon, 24 Jun 2024 13:03:23 +0100 Subject: [PATCH 2/7] chore: copy update --- .../pages/Fusion/components/PartnersSection/PartnerCard.tsx | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx b/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx index d64a7bb86..1db5d7691 100644 --- a/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx +++ b/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx @@ -17,7 +17,6 @@ import { useMediaQuery } from '@gobob/ui'; import { ReactNode } from 'react'; -import { t } from 'i18next'; import { useTheme } from 'styled-components'; import { StyledCategoryTag, StyledLiveTag, StyledPartnerCard } from './PartnerCard.style'; @@ -109,7 +108,10 @@ const PartnerCard = ({ ) : ( - {t('fusion.userStats.revealCodeInfo')}

}> + This is the average amount of spice distributed by the project per hour.

} + > )} From fc02b7d3c3d0bf8781610cd7c4f3a5960a72e292 Mon Sep 17 00:00:00 2001 From: Tom Jeatt Date: Mon, 24 Jun 2024 13:21:59 +0100 Subject: [PATCH 3/7] fix: popover triggering redirect --- .../src/pages/Fusion/components/PartnersSection/PartnerCard.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx b/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx index 1db5d7691..b9afd1c9b 100644 --- a/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx +++ b/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx @@ -52,8 +52,8 @@ const PartnerCard = ({ return ( (window.location.href = url)} {...props} - {...{ href: url, target: '_blank', rel: 'noreferrer' }} style={{ textDecoration: 'none', width: '100%' }} > Date: Mon, 24 Jun 2024 13:27:50 +0100 Subject: [PATCH 4/7] chore: add noreferrer --- .../src/pages/Fusion/components/PartnersSection/PartnerCard.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx b/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx index b9afd1c9b..0f667235b 100644 --- a/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx +++ b/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx @@ -52,7 +52,7 @@ const PartnerCard = ({ return ( (window.location.href = url)} + onPress={() => window.open(url, '_blank', 'noreferrer')} {...props} style={{ textDecoration: 'none', width: '100%' }} > From 6ae75705d71b3b64a12e71fdfdaaa674a424849b Mon Sep 17 00:00:00 2001 From: Tom Jeatt Date: Mon, 24 Jun 2024 13:28:48 +0100 Subject: [PATCH 5/7] chore: add comment --- .../src/pages/Fusion/components/PartnersSection/PartnerCard.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx b/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx index 0f667235b..5f71448e7 100644 --- a/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx +++ b/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx @@ -52,6 +52,7 @@ const PartnerCard = ({ return ( window.open(url, '_blank', 'noreferrer')} {...props} style={{ textDecoration: 'none', width: '100%' }} From 31a0e4652a9d881de5120719a77b28fcc49850ef Mon Sep 17 00:00:00 2001 From: Tom Jeatt Date: Mon, 24 Jun 2024 14:35:44 +0100 Subject: [PATCH 6/7] chore: update label --- apps/evm/src/pages/Fusion/Fusion.tsx | 2 +- .../components/PartnersSection/PartnerCard.tsx | 12 +++++++++--- 2 files changed, 10 insertions(+), 4 deletions(-) diff --git a/apps/evm/src/pages/Fusion/Fusion.tsx b/apps/evm/src/pages/Fusion/Fusion.tsx index f1a2bc80f..ca39a3d4a 100644 --- a/apps/evm/src/pages/Fusion/Fusion.tsx +++ b/apps/evm/src/pages/Fusion/Fusion.tsx @@ -48,7 +48,7 @@ const Fusion = () => { return ( -
+
diff --git a/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx b/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx index 5f71448e7..258140bb6 100644 --- a/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx +++ b/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx @@ -94,7 +94,7 @@ const PartnerCard = ({
- Spice Distributed per Hour: + Spice per Hour: {isMobile ? ( @@ -104,14 +104,20 @@ const PartnerCard = ({ -

This is the average amount of spice distributed by the project per hour.

+

+ This is the average amount of spice distributed to all users by the project per hour. +

) : ( This is the average amount of spice distributed by the project per hour.

} + label={ +

+ This is the average amount of spice distributed to all users by the project per hour. +

+ } > From 146381f87b107dcd44cf6a9941a5579e6813957b Mon Sep 17 00:00:00 2001 From: Tom Jeatt Date: Mon, 24 Jun 2024 15:44:18 +0100 Subject: [PATCH 7/7] chore: update tooltip --- .../pages/Fusion/components/PartnersSection/PartnerCard.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx b/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx index 258140bb6..d779669f3 100644 --- a/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx +++ b/apps/evm/src/pages/Fusion/components/PartnersSection/PartnerCard.tsx @@ -105,7 +105,7 @@ const PartnerCard = ({

- This is the average amount of spice distributed to all users by the project per hour. + This is the average amount of spice distributed by the project per hour over the last 7 days.

@@ -115,7 +115,7 @@ const PartnerCard = ({ color='primary' label={

- This is the average amount of spice distributed to all users by the project per hour. + This is the average amount of spice distributed by the project per hour over the last 7 days.

} >