add avg priority fees

FairCrypto · May 14, 2024 · c0f13ba · c0f13ba
1 parent 65d3376
commit c0f13ba
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 15 deletions.
diff --git a/app/leaderboard/StateStat.tsx b/app/leaderboard/StateStat.tsx
@@ -80,7 +80,7 @@ export default function StateStat({
         options={options}
         className="absolute -z-10 opacity-50"
       />
-      <div className="p-4">
+      <div className="p-3 sm:p-4">
         <div className="stat-title">{title}</div>
         <div className="stat-value text-sm md:text-2xl">{children}</div>
       </div>

diff --git a/app/leaderboard/StateStats.tsx b/app/leaderboard/StateStats.tsx
@@ -16,6 +16,7 @@ export interface State {
   nextAmpEta: Date;
   avgAmpSecs: number;
   createdAt: Date;
+  avgPriorityFee: number;
 }
 
 async function fetchStateHistory() {
@@ -72,6 +73,10 @@ export default function StateStats({
     return Intl.NumberFormat("en-US").format(state.lastAmpSlot);
   };
 
+  const avgPriorityFeeValue = () => {
+    return Intl.NumberFormat("en-US").format(state.avgPriorityFee);
+  };
+
   useEffect(() => {
     fetchStateHistory().then((data) => {
       setStateHistory(data);
@@ -81,7 +86,7 @@ export default function StateStats({
   return (
     <div
       id="solxen-stats"
-      className={`grid grid-cols-2 sm:grid-cols-3 gap-2 sm:gap-4 text-center mb-2 sm:mb-3 mx-4 opacity-0 h-[10rem] sm:h-[10rem] md:h-[13rem] ${!isLoadingStats ? "fade-in" : ""}`}
+      className={`grid grid-cols-2 sm:grid-cols-3 gap-2 sm:gap-4 text-center mb-2 sm:mb-3 mx-4 opacity-0 ${!isLoadingStats ? "fade-in" : ""}`}
     >
       <StateStat
         name="solXen"
@@ -97,35 +102,46 @@ export default function StateStats({
       >
         {totalHashesValue()}
       </StateStat>
+
       <StateStat
         name="superHashes"
         title="Total Super Hashes"
         stateHistory={stateHistory.map((entry) => entry.superHashes)}
       >
         {totalSuperHashesValue()}
       </StateStat>
+
+      <StateStat
+        name="txs"
+        title="Total TXs"
+        stateHistory={stateHistory.map((entry) => entry.txs)}
+      >
+        {txsValue()}
+      </StateStat>
+
       <StateStat
         name="amp"
         title="AMP"
         stateHistory={stateHistory.map((entry) => entry.amp)}
       >
         {ampValue()}
       </StateStat>
+
+      {/*<StateStat*/}
+      {/*  name="lastAmpSlot"*/}
+      {/*  title="Last AMP Slot"*/}
+      {/*  extraClassName="hidden sm:inline"*/}
+      {/*  stateHistory={stateHistory.map((entry) => Number(entry.lastAmpSlot))}*/}
+      {/*>*/}
+      {/*  {lastAmpSlotValue()}*/}
+      {/*</StateStat>*/}
+
       <StateStat
-        name="lastAmpSlot"
-        title="Last AMP Slot"
-        extraClassName="hidden sm:inline"
-        stateHistory={stateHistory.map((entry) => Number(entry.lastAmpSlot))}
-      >
-        {lastAmpSlotValue()}
-      </StateStat>
-      <StateStat
-        name="txs"
-        title="Total TXs"
-        stateHistory={stateHistory.map((entry) => entry.txs)}
-        extraClassName="hidden sm:inline"
+        name="avgPriorityFee"
+        title="Avg Priority Fee"
+        stateHistory={stateHistory.map((entry) => entry.avgPriorityFee)}
       >
-        {txsValue()}
+        {avgPriorityFeeValue()}
       </StateStat>
     </div>
   );