From 7f354ed65748154d616a5ddc2cf98c4c2376b21a Mon Sep 17 00:00:00 2001 From: Ryan Miller Date: Wed, 4 Dec 2024 16:01:34 +1100 Subject: [PATCH 01/10] feat: add percent of points to testnet points module --- .../staking/app/mystakes/modules/TestnetPointsModule.tsx | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/apps/staking/app/mystakes/modules/TestnetPointsModule.tsx b/apps/staking/app/mystakes/modules/TestnetPointsModule.tsx index 6f44a908..123a7ee8 100644 --- a/apps/staking/app/mystakes/modules/TestnetPointsModule.tsx +++ b/apps/staking/app/mystakes/modules/TestnetPointsModule.tsx @@ -15,7 +15,7 @@ import { Address } from 'viem'; import { useQuery } from '@tanstack/react-query'; import { toast } from '@session/ui/lib/toast'; import { areHexesEqual } from '@session/util-crypto/string'; -import { formatNumber } from '@/lib/locale-client'; +import { formatNumber, formatPercentage } from '@/lib/locale-client'; const noPointsObject = { score: 0, @@ -56,7 +56,7 @@ export default function TestnetPointsModule(params?: { addressOverride?: Address }, }); - const points = data?.score ? `${formatNumber(data.score)} points` : null; + const points = `${formatNumber(data?.score ?? 0)} points`; return ( @@ -65,7 +65,10 @@ export default function TestnetPointsModule(params?: { addressOverride?: Address link: externalLink(URL.SESSION_TOKEN_COMMUNITY_SNAPSHOT), })} - {titleFormat('format', { title })} + + {titleFormat('format', { title })} + {` (${formatPercentage((data?.percent ?? 0) / 10000)})`} + Date: Wed, 4 Dec 2024 16:11:24 +1100 Subject: [PATCH 02/10] feat: create testnet incentive program points leaderboard --- apps/staking/app/leaderboard/page.tsx | 107 ++++++++++++++++++++++++++ packages/ui/components/ui/table.tsx | 4 +- 2 files changed, 109 insertions(+), 2 deletions(-) create mode 100644 apps/staking/app/leaderboard/page.tsx diff --git a/apps/staking/app/leaderboard/page.tsx b/apps/staking/app/leaderboard/page.tsx new file mode 100644 index 00000000..359a2003 --- /dev/null +++ b/apps/staking/app/leaderboard/page.tsx @@ -0,0 +1,107 @@ +'use client'; +import { useQuery } from '@tanstack/react-query'; +import { toast } from '@session/ui/lib/toast'; +import { PubKey } from '@session/ui/components/PubKey'; +import { formatNumber, formatPercentage } from '@/lib/locale-client'; +import { + Table, + TableBody, + TableCell, + TableHead, + TableHeader, + TableRow, +} from '@session/ui/ui/table'; +import Typography from '@session/ui/components/Typography'; +import { useWallet } from '@session/wallet/hooks/wallet-hooks'; +import { areHexesEqual } from '@session/util-crypto/string'; +import Link from 'next/link'; +import { Loading } from '@session/ui/components/loading'; + +// TODO: Delete route after testnet incentive program is over + +function smartFormatPercentage(decimalPercent: number) { + const maximumFractionDigits = decimalPercent > 0.0001 ? 4 : 6; + return formatPercentage(decimalPercent, { maximumFractionDigits }); +} + +export default function PointsPage() { + const { address } = useWallet(); + const { data, isLoading, isError } = useQuery({ + queryKey: ['points'], + queryFn: async () => { + const res = await fetch(process.env.NEXT_PUBLIC_POINTS_PROGRAM_API!); + + if (!res.ok) { + toast.error('Failed to fetch points'); + } + + const data = await res.json(); + + return ( + Object.entries(data.wallets) as Array< + [ + string, + { + score: number; + percent: number; + }, + ] + > + ).sort((a, b) => b[1].score - a[1].score); + }, + }); + + return ( +
+
+ Testnet Leaderboard + + Track the top-performing wallets in the{' '} + + Session Testnet Incentive Program + + . Rankings are based on total points earned through running and staking to nodes. + +
+ {isLoading ? ( + + ) : isError ? ( + Something went wrong + ) : ( + + + + Wallet Address + Points + Percent + + + + {data?.map(([wallet, { score, percent }]) => ( + + + + + {formatNumber(score)} + + {smartFormatPercentage(percent / 10000)} + + + ))} + +
+ )} +
+ ); +} diff --git a/packages/ui/components/ui/table.tsx b/packages/ui/components/ui/table.tsx index 0b1488d1..d5781f24 100644 --- a/packages/ui/components/ui/table.tsx +++ b/packages/ui/components/ui/table.tsx @@ -4,7 +4,7 @@ import { cn } from '../../lib/utils'; const Table = React.forwardRef>( ({ className, ...props }, ref) => ( -
+
) @@ -44,7 +44,7 @@ const TableRow = React.forwardRef Date: Wed, 4 Dec 2024 16:55:02 +1100 Subject: [PATCH 03/10] fix: text selection colours and mobile padding --- apps/staking/app/leaderboard/page.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/apps/staking/app/leaderboard/page.tsx b/apps/staking/app/leaderboard/page.tsx index 359a2003..67376701 100644 --- a/apps/staking/app/leaderboard/page.tsx +++ b/apps/staking/app/leaderboard/page.tsx @@ -52,7 +52,7 @@ export default function PointsPage() { }); return ( -
+
Testnet Leaderboard @@ -72,7 +72,7 @@ export default function PointsPage() { ) : isError ? ( Something went wrong ) : ( -
+
Wallet Address @@ -87,7 +87,7 @@ export default function PointsPage() { className={ areHexesEqual(wallet, address) ? 'bg-session-green text-session-black hover:bg-session-green-dark' - : 'hover:bg-session-green hover:text-session-black' + : 'hover:bg-session-green hover:text-session-black hover:selection:bg-session-black hover:selection:text-session-green' } > From 07d2102ac3a7eba9c45c9efc1e73c8a2fd313ed9 Mon Sep 17 00:00:00 2001 From: Ryan Miller Date: Wed, 4 Dec 2024 17:06:27 +1100 Subject: [PATCH 04/10] fix: add rank and metadata --- apps/staking/app/leaderboard/layout.tsx | 14 ++++++++++++++ apps/staking/app/leaderboard/page.tsx | 16 ++++++++++------ 2 files changed, 24 insertions(+), 6 deletions(-) create mode 100644 apps/staking/app/leaderboard/layout.tsx diff --git a/apps/staking/app/leaderboard/layout.tsx b/apps/staking/app/leaderboard/layout.tsx new file mode 100644 index 00000000..1e838f6e --- /dev/null +++ b/apps/staking/app/leaderboard/layout.tsx @@ -0,0 +1,14 @@ +import type { ReactNode } from 'react'; +import { siteMetadata } from '@/lib/metadata'; + +export function generateMetadata() { + return siteMetadata({ + title: 'Testnet Leaderboard', + description: + 'Track the top-performing wallets in the Session Testnet Incentive Program. Rankings are based on total points earned through running and staking to nodes.', + }); +} + +export default async function RootLayout({ children }: { children: ReactNode }) { + return children; +} diff --git a/apps/staking/app/leaderboard/page.tsx b/apps/staking/app/leaderboard/page.tsx index 67376701..6ec5eb87 100644 --- a/apps/staking/app/leaderboard/page.tsx +++ b/apps/staking/app/leaderboard/page.tsx @@ -16,6 +16,7 @@ import { useWallet } from '@session/wallet/hooks/wallet-hooks'; import { areHexesEqual } from '@session/util-crypto/string'; import Link from 'next/link'; import { Loading } from '@session/ui/components/loading'; +import { cn } from '@session/ui/lib/utils'; // TODO: Delete route after testnet incentive program is over @@ -72,25 +73,28 @@ export default function PointsPage() { ) : isError ? ( Something went wrong ) : ( -
+
- + + Rank Wallet Address Points Percent - {data?.map(([wallet, { score, percent }]) => ( + {data?.map(([wallet, { score, percent }], i) => ( td]:md:px-8', areHexesEqual(wallet, address) ? 'bg-session-green text-session-black hover:bg-session-green-dark' : 'hover:bg-session-green hover:text-session-black hover:selection:bg-session-black hover:selection:text-session-green' - } + )} > - + {i + 1} + {formatNumber(score)} From 0432ddb54b525e4126a21395b9cae89af9e52193 Mon Sep 17 00:00:00 2001 From: Ryan Miller Date: Wed, 4 Dec 2024 17:18:39 +1100 Subject: [PATCH 05/10] fix: font sizes --- apps/staking/app/leaderboard/page.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/apps/staking/app/leaderboard/page.tsx b/apps/staking/app/leaderboard/page.tsx index 6ec5eb87..468250c0 100644 --- a/apps/staking/app/leaderboard/page.tsx +++ b/apps/staking/app/leaderboard/page.tsx @@ -75,7 +75,7 @@ export default function PointsPage() { ) : (
- + Rank Wallet Address Points @@ -87,7 +87,7 @@ export default function PointsPage() { td]:md:px-8', + 'text-sm md:text-base [&>td]:md:px-8', areHexesEqual(wallet, address) ? 'bg-session-green text-session-black hover:bg-session-green-dark' : 'hover:bg-session-green hover:text-session-black hover:selection:bg-session-black hover:selection:text-session-green' From 341f397ca1896441029a01cdb41eccbcda4302df Mon Sep 17 00:00:00 2001 From: Ryan Miller Date: Wed, 4 Dec 2024 17:25:49 +1100 Subject: [PATCH 06/10] fix: cell alignment --- apps/staking/app/leaderboard/page.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/apps/staking/app/leaderboard/page.tsx b/apps/staking/app/leaderboard/page.tsx index 468250c0..22fb4471 100644 --- a/apps/staking/app/leaderboard/page.tsx +++ b/apps/staking/app/leaderboard/page.tsx @@ -87,18 +87,18 @@ export default function PointsPage() { td]:md:px-8', + 'text-sm md:text-base', areHexesEqual(wallet, address) ? 'bg-session-green text-session-black hover:bg-session-green-dark' : 'hover:bg-session-green hover:text-session-black hover:selection:bg-session-black hover:selection:text-session-green' )} > - {i + 1} + {i + 1} {formatNumber(score)} - + {smartFormatPercentage(percent / 10000)} From abb42a57d692d70a899925bda711a399bed15292 Mon Sep 17 00:00:00 2001 From: Ryan Miller Date: Wed, 4 Dec 2024 17:31:30 +1100 Subject: [PATCH 07/10] fix: header size --- apps/staking/app/leaderboard/page.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/staking/app/leaderboard/page.tsx b/apps/staking/app/leaderboard/page.tsx index 22fb4471..12a0a4b6 100644 --- a/apps/staking/app/leaderboard/page.tsx +++ b/apps/staking/app/leaderboard/page.tsx @@ -75,7 +75,7 @@ export default function PointsPage() { ) : (
- + Rank Wallet Address Points From 3f54ecebc3d3bad4f93cafe2770b55fe3d2bcb81 Mon Sep 17 00:00:00 2001 From: Ryan Miller Date: Wed, 4 Dec 2024 17:38:27 +1100 Subject: [PATCH 08/10] fix: iphone se screen size --- apps/staking/app/leaderboard/page.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/apps/staking/app/leaderboard/page.tsx b/apps/staking/app/leaderboard/page.tsx index 12a0a4b6..97d1b1fb 100644 --- a/apps/staking/app/leaderboard/page.tsx +++ b/apps/staking/app/leaderboard/page.tsx @@ -76,7 +76,7 @@ export default function PointsPage() {
- Rank + Rank Wallet Address Points Percent @@ -93,7 +93,7 @@ export default function PointsPage() { : 'hover:bg-session-green hover:text-session-black hover:selection:bg-session-black hover:selection:text-session-green' )} > - {i + 1} + {i + 1} From 8211a3b40f42acb534ac40be908ec9569a00d1a7 Mon Sep 17 00:00:00 2001 From: Ryan Miller Date: Wed, 4 Dec 2024 17:41:13 +1100 Subject: [PATCH 09/10] fix: header cell pad --- apps/staking/app/leaderboard/page.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/staking/app/leaderboard/page.tsx b/apps/staking/app/leaderboard/page.tsx index 97d1b1fb..e5f26700 100644 --- a/apps/staking/app/leaderboard/page.tsx +++ b/apps/staking/app/leaderboard/page.tsx @@ -76,7 +76,7 @@ export default function PointsPage() {
- Rank + Rank Wallet Address Points Percent From 6cfe59a4c60dfccff7e39f6f146e71e050b8ad17 Mon Sep 17 00:00:00 2001 From: Ryan Miller Date: Wed, 4 Dec 2024 17:42:47 +1100 Subject: [PATCH 10/10] fix: hide rank less than md --- apps/staking/app/leaderboard/page.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/apps/staking/app/leaderboard/page.tsx b/apps/staking/app/leaderboard/page.tsx index e5f26700..87771e5e 100644 --- a/apps/staking/app/leaderboard/page.tsx +++ b/apps/staking/app/leaderboard/page.tsx @@ -76,7 +76,7 @@ export default function PointsPage() {
- Rank + Rank Wallet Address Points Percent @@ -93,7 +93,7 @@ export default function PointsPage() { : 'hover:bg-session-green hover:text-session-black hover:selection:bg-session-black hover:selection:text-session-green' )} > - {i + 1} + {i + 1}