From 09c8d9f584e7bb376fe31deff349f6e6ee4ff85c Mon Sep 17 00:00:00 2001
From: Sunny Gleason <sunny.gleason@gmail.com>
Date: Wed, 31 Jul 2019 12:46:21 -0400
Subject: [PATCH] feat: show inactive validators, yarn lint

---
 api/api.js                                   |  2 +-
 src/v2/components/TourDeSol/Cards/index.jsx  |  7 ++++++-
 src/v2/components/Validators/Table/index.jsx | 20 +++++++++++---------
 src/v2/stores/nodes.js                       | 10 ++++++++++
 4 files changed, 28 insertions(+), 11 deletions(-)

diff --git a/api/api.js b/api/api.js
index af4a5f85..02045373 100644
--- a/api/api.js
+++ b/api/api.js
@@ -684,7 +684,7 @@ async function fetchValidatorIdentities(keys) {
  */
 function getNetworkInflationRate(slot) {
   const SLOTS_PER_SECOND = 1.0;
-  const SECONDS_PER_YEAR = (365.25 * 24.0 * 60.0 * 60.0);
+  const SECONDS_PER_YEAR = 365.25 * 24.0 * 60.0 * 60.0;
   const SLOTS_PER_YEAR = SLOTS_PER_SECOND * SECONDS_PER_YEAR;
   const DEFAULT_INITIAL = 0.15;
   const DEFAULT_TERMINAL = 0.015;
diff --git a/src/v2/components/TourDeSol/Cards/index.jsx b/src/v2/components/TourDeSol/Cards/index.jsx
index 65e14543..73b39c18 100644
--- a/src/v2/components/TourDeSol/Cards/index.jsx
+++ b/src/v2/components/TourDeSol/Cards/index.jsx
@@ -9,7 +9,12 @@ import useStyles from './styles';
 
 const Cards = () => {
   const classes = useStyles();
-  const {cluster, validators, inactiveValidators, totalStakedTokens} = NodesStore;
+  const {
+    cluster,
+    validators,
+    inactiveValidators,
+    totalStakedTokens,
+  } = NodesStore;
 
   const cards = [
     {
diff --git a/src/v2/components/Validators/Table/index.jsx b/src/v2/components/Validators/Table/index.jsx
index 47244e29..16157114 100644
--- a/src/v2/components/Validators/Table/index.jsx
+++ b/src/v2/components/Validators/Table/index.jsx
@@ -26,9 +26,9 @@ const ValidatorsTable = ({separate}: {separate: boolean}) => {
   const classes = useStyles();
   const theme = useTheme();
   const showTable = useMediaQuery(theme.breakpoints.up('md'));
-  const {validators} = NodesStore;
+  const {validators, inactiveValidators} = NodesStore;
   const renderRow = row => {
-    const uptime = getUptime(row);
+    const uptime = row.uptime && getUptime(row);
     const {identity = {}, nodePubkey, stake, commission} = row;
     return (
       <TableRow hover key={nodePubkey}>
@@ -42,14 +42,14 @@ const ValidatorsTable = ({separate}: {separate: boolean}) => {
             <div>{identity.name || nodePubkey}</div>
           </Link>
         </TableCell>
-        <TableCell>{stake} Lamports</TableCell>
-        <TableCell>{commission}</TableCell>
-        <TableCell>{uptime}%</TableCell>
+        <TableCell>{(stake && (stake + ' Lamports')) || 'N/A'}</TableCell>
+        <TableCell>{commission || 'N/A'}</TableCell>
+        <TableCell>{(uptime && (uptime + '%')) || 'Node Unavailable'}</TableCell>
       </TableRow>
     );
   };
   const renderCard = card => {
-    const uptime = getUptime(card);
+    const uptime = card.uptime && getUptime(card);
     const {identity = {}, nodePubkey, stake, commission} = card;
     return (
       <div
@@ -67,15 +67,15 @@ const ValidatorsTable = ({separate}: {separate: boolean}) => {
         <Grid container spacing={1}>
           <Grid item xs={4} zeroMinWidth>
             <div className={classes.cardTitle}>Stake</div>
-            <div>{stake} Lamports</div>
+            <div>{(stake && (stake + ' Lamports')) || 'N/A'}</div>
           </Grid>
           <Grid item xs={4} zeroMinWidth>
             <div className={classes.cardTitle}>Commission</div>
-            <div>{commission}</div>
+            <div>{commission || 'N/A'}</div>
           </Grid>
           <Grid item xs={4} zeroMinWidth>
             <div className={classes.cardTitle}>Uptime</div>
-            <div>{uptime}%</div>
+            <div>{(uptime && (uptime + '%')) || 'Node Unavailable'}</div>
           </Grid>
         </Grid>
       </div>
@@ -108,11 +108,13 @@ const ValidatorsTable = ({separate}: {separate: boolean}) => {
             }}
           >
             {map(renderRow)(validators)}
+            {map(renderRow)(inactiveValidators)}
           </TableBody>
         </Table>
       ) : (
         <div className={cn(classes.list, separate && classes.vertical)}>
           {map(renderCard)(validators)}
+          {map(renderCard)(inactiveValidators)}
         </div>
       )}
     </div>
diff --git a/src/v2/stores/nodes.js b/src/v2/stores/nodes.js
index e2193d57..284bba43 100644
--- a/src/v2/stores/nodes.js
+++ b/src/v2/stores/nodes.js
@@ -4,6 +4,7 @@ import {
   get,
   compose,
   keys,
+  filter,
   map,
   mapValues,
   pick,
@@ -72,6 +73,14 @@ class Store {
     })(this.cluster.votingNow);
   }
 
+  get inactiveValidators() {
+    let inactive = filter(
+      vote => !find({pubkey: vote.nodePubkey})(this.cluster.cluster),
+    )(this.cluster.votingAll);
+
+    return inactive;
+  }
+
   get totalStakedTokens() {
     return compose(
       sumBy('stake'),
@@ -85,6 +94,7 @@ decorate(Store, {
   updateClusterInfo: action.bound,
   mapMarkers: computed,
   validators: computed,
+  inactiveValidators: computed,
   fetchClusterInfo: action.bound,
 });