Merge pull request #47 from filecoin-saturn/aa/dashboard-updates

feat: modify payout eligiblity nomenclature
filecoin-saturn · Jun 30, 2023 · 4f6569f · 4f6569f
2 parents f20ecfe + aeb9543
commit 4f6569f
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 5 deletions.
diff --git a/src/pages/dashboard/components/NodesTable.tsx b/src/pages/dashboard/components/NodesTable.tsx
@@ -8,6 +8,7 @@ import { CopyIcon, ProjectRoadmapIcon, ListUnorderedIcon } from "@primer/octicon
 import copy from "copy-text-to-clipboard";
 import classNames from "classnames";
 import GridButton from "../../../components/StatsGrid/GridButton";
+import { PAYOUT_STATUS_MAPPING } from "..";
 
 // Chart config must take into account that earnings are calculated once per day
 export default function NodesTable(props: any) {
@@ -80,10 +81,12 @@ export default function NodesTable(props: any) {
     },
     {
       field: "payoutStatus",
-      headerName: "Payout Status",
+      headerName: "Payout Eligibility",
       width: 110,
       cellRenderer: (params: any) => {
-        return params.data.payoutStatus;
+        const payoutStatus = params.data.payoutStatus;
+
+        return PAYOUT_STATUS_MAPPING[payoutStatus];
       },
       tooltipValueGetter: (params: any) => {
         return [renderStatusTooltip(params.data.payoutStatus)];

diff --git a/src/pages/dashboard/index.tsx b/src/pages/dashboard/index.tsx
@@ -18,6 +18,12 @@ interface OverviewProps {
   children?: ReactNode;
 }
 
+const UPTIME_REQ_DOCS = "https://docs.saturn.tech/nodes-uptime-requirement";
+export const PAYOUT_STATUS_MAPPING: Record<string, string> = {
+  valid: "Eligible",
+  pending: "In Progress",
+};
+
 function createChartProps(period: TimePeriod) {
   let dateRange;
   let step: DurationUnitType; // group by this time unit
@@ -148,14 +154,22 @@ function Overview(props: OverviewProps) {
 
   const nodePayoutSection = nodeStats && (
     <>
-      <div>Payout Status</div>
-      <div>{nodeStats.payoutStatus}</div>
+      <div>
+        <a href={UPTIME_REQ_DOCS} target="_blank" rel="noopener noreferrer">
+          Payout Eligibility
+        </a>
+      </div>
+      <div>{PAYOUT_STATUS_MAPPING[nodeStats.payoutStatus]}</div>
     </>
   );
 
   const uptimeCompletionSection = !(nodeStats?.uptimeCompletion === undefined) && (
     <>
-      <div> Uptime Requirement </div>
+      <div>
+        <a href={UPTIME_REQ_DOCS} target="_blank" rel="noopener noreferrer">
+          Uptime Requirement
+        </a>
+      </div>
       {ProgressBar(nodeStats.uptimeCompletion * 100)}
     </>
   );