[DDW-417]: Update number of stake pools included in color calculation

input-output-hk · Oct 20, 2020 · 27e5f4b · 27e5f4b
1 parent 5d3850d
commit 27e5f4b
Show file tree

Hide file tree

Showing 8 changed files with 53 additions and 34 deletions.
diff --git a/...er/app/components/staking/delegation-setup-wizard/DelegationStepsChooseStakePoolDialog.js b/...er/app/components/staking/delegation-setup-wizard/DelegationStepsChooseStakePoolDialog.js
@@ -21,7 +21,7 @@ import commonStyles from './DelegationSteps.scss';
 import styles from './DelegationStepsChooseStakePoolDialog.scss';
 import Wallet from '../../../domains/Wallet';
 import ThumbSelectedPool from '../widgets/ThumbSelectedPool';
-
+import { IS_RANKING_DATA_AVAILABLE } from '../../../config/stakingConfig';
 import StakePool from '../../../domains/StakePool';
 
 const messages = defineMessages({
@@ -308,6 +308,11 @@ export default class DelegationStepsChooseStakePoolDialog extends Component<
       searchValue
     );
 
+    const numberOfRankedStakePools: number = stakePoolsList.filter(
+      (stakePool) =>
+        IS_RANKING_DATA_AVAILABLE && stakePool.nonMyopicMemberRewards
+    ).length;
+
     return (
       <Dialog
         title={intl.formatMessage(messages.title)}
@@ -343,7 +348,7 @@ export default class DelegationStepsChooseStakePoolDialog extends Component<
           <div className={styles.selectStakePoolWrapper}>
             <ThumbSelectedPool
               stakePool={selectedPool}
-              numberOfStakePools={stakePoolsList.length}
+              numberOfRankedStakePools={numberOfRankedStakePools}
               alreadyDelegated={selectedPool && !canSubmit}
             />
 
@@ -368,7 +373,7 @@ export default class DelegationStepsChooseStakePoolDialog extends Component<
               containerClassName="Dialog_content"
               onSelect={this.handleSelect}
               selectedPoolId={selectedPoolId}
-              numberOfStakePools={stakePoolsList.length}
+              numberOfRankedStakePools={numberOfRankedStakePools}
               disabledStakePoolId={activeStakePoolId}
               showSelected
               highlightOnHover
@@ -398,7 +403,7 @@ export default class DelegationStepsChooseStakePoolDialog extends Component<
               onSelect={this.handleSelect}
               selectedPoolId={selectedPoolId}
               containerClassName="Dialog_content"
-              numberOfStakePools={stakePoolsList.length}
+              numberOfRankedStakePools={numberOfRankedStakePools}
               disabledStakePoolId={activeStakePoolId}
               showSelected
               highlightOnHover

diff --git a/source/renderer/app/components/staking/stake-pools/StakePools.js b/source/renderer/app/components/staking/stake-pools/StakePools.js
@@ -12,6 +12,7 @@ import Wallet from '../../../domains/Wallet';
 import styles from './StakePools.scss';
 import { getFilteredStakePoolsList } from './helpers';
 import StakePool from '../../../domains/StakePool';
+import { IS_RANKING_DATA_AVAILABLE } from '../../../config/stakingConfig';
 
 const messages = defineMessages({
   delegatingListTitle: {
@@ -111,6 +112,11 @@ export default class StakePools extends Component<Props, State> {
       search
     );
 
+    const numberOfRankedStakePools: number = stakePoolsList.filter(
+      (stakePool) =>
+        IS_RANKING_DATA_AVAILABLE && stakePool.nonMyopicMemberRewards
+    ).length;
+
     const listTitleMessage = search.trim().length
       ? messages.listTitleWithSearch
       : messages.listTitle;
@@ -177,7 +183,7 @@ export default class StakePools extends Component<Props, State> {
                   setListActive={this.handleSetListActive}
                   containerClassName="StakingWithNavigation_page"
                   onSelect={this.onDelegate}
-                  numberOfStakePools={stakePoolsList.length}
+                  numberOfRankedStakePools={numberOfRankedStakePools}
                   showWithSelectButton
                 />
               </Fragment>
@@ -202,7 +208,7 @@ export default class StakePools extends Component<Props, State> {
               setListActive={this.handleSetListActive}
               containerClassName="StakingWithNavigation_page"
               onSelect={this.onDelegate}
-              numberOfStakePools={stakePoolsList.length}
+              numberOfRankedStakePools={numberOfRankedStakePools}
             />
           </Fragment>
         )}

diff --git a/source/renderer/app/components/staking/stake-pools/StakePoolsList.js b/source/renderer/app/components/staking/stake-pools/StakePoolsList.js
@@ -20,7 +20,7 @@ type Props = {
   showWithSelectButton?: boolean,
   showSelected?: boolean,
   containerClassName: string,
-  numberOfStakePools: number,
+  numberOfRankedStakePools: number,
   selectedPoolId?: ?number,
   disabledStakePoolId?: ?string,
   /**
@@ -120,7 +120,7 @@ export class StakePoolsList extends Component<Props, State> {
       stakePoolsList,
       selectedPoolId,
       containerClassName,
-      numberOfStakePools,
+      numberOfRankedStakePools,
       disabledStakePoolId,
       listName,
     } = this.props;
@@ -155,7 +155,7 @@ export class StakePoolsList extends Component<Props, State> {
               isSelected={isSelected}
               showSelected={showSelected}
               containerClassName={containerClassName}
-              numberOfStakePools={numberOfStakePools}
+              numberOfRankedStakePools={numberOfRankedStakePools}
               disabledStakePoolId={disabledStakePoolId}
             />
           );

diff --git a/source/renderer/app/components/staking/widgets/ThumbPool.js b/source/renderer/app/components/staking/widgets/ThumbPool.js
@@ -24,7 +24,7 @@ type Props = {
   stakePool: StakePool,
   isSelected?: ?Function,
   containerClassName: string,
-  numberOfStakePools: number,
+  numberOfRankedStakePools: number,
   disabledStakePoolId: ?string,
 };
 
@@ -98,13 +98,13 @@ export class ThumbPool extends Component<Props, State> {
       showSelected,
       stakePool,
       containerClassName,
-      numberOfStakePools,
+      numberOfRankedStakePools,
       disabledStakePoolId,
     } = this.props;
     const { top, left } = this.state;
 
     const { ranking, id } = stakePool;
-    const color = getColorFromRange(ranking, numberOfStakePools);
+    const color = getColorFromRange(ranking, numberOfRankedStakePools);
     const isDisabled = disabledStakePoolId === id;
 
     const contentClassnames = classnames([
@@ -119,12 +119,12 @@ export class ThumbPool extends Component<Props, State> {
       isSelected && showSelected ? (
         <ThumbSelectedPool
           stakePool={stakePool}
-          numberOfStakePools={numberOfStakePools}
+          numberOfRankedStakePools={numberOfRankedStakePools}
         />
       ) : (
         <ThumbPoolContent
           stakePool={stakePool}
-          numberOfStakePools={numberOfStakePools}
+          numberOfRankedStakePools={numberOfRankedStakePools}
         />
       );
 
@@ -152,7 +152,7 @@ export class ThumbPool extends Component<Props, State> {
             onSelect={this.handleSelect}
             showWithSelectButton={showWithSelectButton}
             containerClassName={containerClassName}
-            numberOfStakePools={numberOfStakePools}
+            numberOfRankedStakePools={numberOfRankedStakePools}
           />
         )}
       </div>

diff --git a/source/renderer/app/components/staking/widgets/ThumbPoolContent.js b/source/renderer/app/components/staking/widgets/ThumbPoolContent.js
@@ -15,21 +15,21 @@ import {
 
 type Props = {
   stakePool: StakePool,
-  numberOfStakePools: number,
+  numberOfRankedStakePools: number,
 };
 
 @observer
 export default class ThumbPoolContent extends Component<Props> {
   render() {
-    const { stakePool, numberOfStakePools } = this.props;
+    const { stakePool, numberOfRankedStakePools } = this.props;
     const {
       ranking,
       nonMyopicMemberRewards,
       ticker,
       retiring,
       saturation,
     } = stakePool;
-    const color = getColorFromRange(ranking, numberOfStakePools);
+    const color = getColorFromRange(ranking, numberOfRankedStakePools);
 
     const componentClassnames = classnames([
       styles.component,

diff --git a/source/renderer/app/components/staking/widgets/ThumbSelectedPool.js b/source/renderer/app/components/staking/widgets/ThumbSelectedPool.js
@@ -14,18 +14,26 @@ import { IS_RANKING_DATA_AVAILABLE } from '../../../config/stakingConfig';
 type Props = {
   stakePool?: StakePool,
   alreadyDelegated?: boolean,
-  numberOfStakePools: number,
+  numberOfRankedStakePools: number,
 };
 
 @observer
 export default class ThumbSelectedPool extends Component<Props> {
   render() {
-    const { stakePool, alreadyDelegated, numberOfStakePools } = this.props;
+    const {
+      stakePool,
+      alreadyDelegated,
+      numberOfRankedStakePools,
+    } = this.props;
 
-    const { ticker, retiring, ranking } = stakePool || {};
+    const { ticker, retiring, ranking, nonMyopicMemberRewards } =
+      stakePool || {};
     const rankColor =
-      stakePool && !retiring && IS_RANKING_DATA_AVAILABLE
-        ? getColorFromRange(ranking, numberOfStakePools)
+      stakePool &&
+      !retiring &&
+      IS_RANKING_DATA_AVAILABLE &&
+      nonMyopicMemberRewards
+        ? getColorFromRange(ranking, numberOfRankedStakePools)
         : 'transparent';
 
     const selectedPoolBlockClasses = classnames([

diff --git a/source/renderer/app/components/staking/widgets/TooltipPool.js b/source/renderer/app/components/staking/widgets/TooltipPool.js
@@ -126,7 +126,7 @@ type Props = {
   left: number,
   color: string,
   containerClassName: string,
-  numberOfStakePools: number,
+  numberOfRankedStakePools: number,
 };
 
 type State = {
@@ -413,7 +413,7 @@ export default class TooltipPool extends Component<Props, State> {
       onOpenExternalLink,
       onSelect,
       showWithSelectButton,
-      numberOfStakePools,
+      numberOfRankedStakePools,
     } = this.props;
     const {
       componentStyle,
@@ -559,7 +559,7 @@ export default class TooltipPool extends Component<Props, State> {
                     background: getColorFromRange(ranking, {
                       darken,
                       alpha,
-                      numberOfItems: numberOfStakePools,
+                      numberOfItems: numberOfRankedStakePools,
                     }),
                   }}
                 >

diff --git a/source/renderer/app/i18n/locales/defaultMessages.json b/source/renderer/app/i18n/locales/defaultMessages.json
@@ -5157,55 +5157,55 @@
         "description": "\"delegatingListTitle\" for the Stake Pools page.",
         "end": {
           "column": 3,
-          "line": 21
+          "line": 22
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePools.js",
         "id": "staking.stakePools.delegatingListTitle",
         "start": {
           "column": 23,
-          "line": 17
+          "line": 18
         }
       },
       {
         "defaultMessage": "!!!Stake pools ({pools})",
         "description": "\"listTitle\" for the Stake Pools page.",
         "end": {
           "column": 3,
-          "line": 26
+          "line": 27
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePools.js",
         "id": "staking.stakePools.listTitle",
         "start": {
           "column": 13,
-          "line": 22
+          "line": 23
         }
       },
       {
         "defaultMessage": "!!!Stake pools. Search results: ({pools})",
         "description": "\"listTitle\" for the Stake Pools page.",
         "end": {
           "column": 3,
-          "line": 31
+          "line": 32
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePools.js",
         "id": "staking.stakePools.listTitleWithSearch",
         "start": {
           "column": 23,
-          "line": 27
+          "line": 28
         }
       },
       {
         "defaultMessage": "!!!Loading stake pools",
         "description": "Loading stake pool message for the Delegation center body section.",
         "end": {
           "column": 3,
-          "line": 37
+          "line": 38
         },
         "file": "source/renderer/app/components/staking/stake-pools/StakePools.js",
         "id": "staking.stakePools.loadingStakePoolsMessage",
         "start": {
           "column": 28,
-          "line": 32
+          "line": 33
         }
       }
     ],