improve table header

autonomys · Aug 12, 2024 · 710c655 · 710c655
1 parent 143b6de
commit 710c655
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 5 deletions.
diff --git a/explorer/src/components/Leaderboard/LeaderboardList.tsx b/explorer/src/components/Leaderboard/LeaderboardList.tsx
@@ -39,6 +39,7 @@ type LeaderboardListProps = {
   idLink: (id: string) => string
   idLabel?: string
   valueType?: 'number' | 'bigNumber'
+  valueLabel?: string
   valueSuffix?: string
   showAccountIcon?: boolean
 }
@@ -51,6 +52,7 @@ export const LeaderboardList: FC<LeaderboardListProps> = ({
   idLink,
   idLabel = 'Account',
   valueType = 'bigNumber',
+  valueLabel = table.endsWith('count') ? 'Count' : 'Value',
   valueSuffix = '',
   showAccountIcon = true,
 }) => {
@@ -98,7 +100,7 @@ export const LeaderboardList: FC<LeaderboardListProps> = ({
       },
       {
         accessorKey: 'value',
-        header: 'Value',
+        header: valueLabel,
         enableSorting: true,
         cell: ({ row }: Cell<Row>) => (
           <div key={`value-${row.original.id}`}>

diff --git a/explorer/src/components/Leaderboard/index.tsx b/explorer/src/components/Leaderboard/index.tsx
@@ -60,6 +60,7 @@ export const AccountLeaderboard: FC = () => {
             query={Query.QUERY_ACCOUNT_TRANSFER_SENDER_TOTAL_VALUE}
             table='account_transfer_sender_total_value'
             idLink={(id) => INTERNAL_ROUTES.accounts.id.page(network, Routes.consensus, id)}
+            valueLabel='Total sent'
             valueSuffix={TOKEN.symbol}
           />
         </Tab>
@@ -78,6 +79,7 @@ export const AccountLeaderboard: FC = () => {
             query={Query.QUERY_ACCOUNT_TRANSFER_RECEIVER_TOTAL_VALUE}
             table='account_transfer_receiver_total_value'
             idLink={(id) => INTERNAL_ROUTES.accounts.id.page(network, Routes.consensus, id)}
+            valueLabel='Total received'
             valueSuffix={TOKEN.symbol}
           />
         </Tab>
@@ -123,6 +125,7 @@ export const AccountLeaderboard: FC = () => {
             query={Query.QUERY_ACCOUNT_TRANSACTION_FEE_PAID_TOTAL_VALUE}
             table='account_transaction_fee_paid_total_value'
             idLink={(id) => INTERNAL_ROUTES.accounts.id.page(network, Routes.consensus, id)}
+            valueLabel='Total fee paid'
             valueSuffix={TOKEN.symbol}
           />
         </Tab>
@@ -155,6 +158,7 @@ export const FarmerLeaderboard: FC = () => {
             table='farmer_vote_and_block_total_value'
             idLabel='Farmer'
             idLink={(id) => INTERNAL_ROUTES.accounts.id.page(network, Routes.consensus, id)}
+            valueLabel='Total reward'
             valueSuffix={TOKEN.symbol}
           />
         </Tab>
@@ -175,6 +179,7 @@ export const FarmerLeaderboard: FC = () => {
             table='farmer_vote_total_value'
             idLabel='Farmer'
             idLink={(id) => INTERNAL_ROUTES.accounts.id.page(network, Routes.consensus, id)}
+            valueLabel='Total reward'
             valueSuffix={TOKEN.symbol}
           />
         </Tab>
@@ -195,6 +200,7 @@ export const FarmerLeaderboard: FC = () => {
             table='farmer_block_total_value'
             idLabel='Farmer'
             idLink={(id) => INTERNAL_ROUTES.accounts.id.page(network, Routes.consensus, id)}
+            valueLabel='Total reward'
             valueSuffix={TOKEN.symbol}
           />
         </Tab>

diff --git a/explorer/src/components/layout/LeaderboardHeader.tsx b/explorer/src/components/layout/LeaderboardHeader.tsx
@@ -21,14 +21,14 @@ export const LeaderboardHeader: FC = () => {
 
   const menuList = useMemo(
     () => [
-      {
-        title: 'Top Accounts',
-        link: `/${network}/${Routes.leaderboard}/${INTERNAL_ROUTES.leaderboard.accounts}`,
-      },
       {
         title: 'Top Farmers',
         link: `/${network}/${Routes.leaderboard}/${INTERNAL_ROUTES.leaderboard.farmers}`,
       },
+      {
+        title: 'Top Accounts',
+        link: `/${network}/${Routes.leaderboard}/${INTERNAL_ROUTES.leaderboard.accounts}`,
+      },
       {
         title: 'Top Operators',
         link: `/${network}/${Routes.leaderboard}/${INTERNAL_ROUTES.leaderboard.operators}`,