Merge pull request #189 from Emurgo/fix/naming

fixing saturation naming

src/API/api.js

@@ -85,7 +85,7 @@ export const Sorting = Object.freeze({
   SCORE: 'score',
   ROA: 'roa',
   POOL_SIZE: 'poolSize',
-  SHARE: 'share',
+  SATURATION: 'saturation',
   COSTS: 'costs',
   PLEDGE: 'pledge',
   BLOCKS: 'blocks',

src/components/ColoursModal.js

@@ -3,7 +3,7 @@
 import React from 'react';
 import type { Node } from 'react';
 import styled from 'styled-components';
-import PoolSizeTag from './PoolSizeTag';
+import PoolSaturationTag from './PoolSaturationTag';
 import PledgeCard from './PledgeCard';
 
 const Wrapper = styled.div`
@@ -44,9 +44,9 @@ const Wrapper = styled.div`
 
 const colorsLegend = [
   {
-    text: 'Share / Pool Size',
+    text: 'Pool Size',
     piechart: true,
-    subtitle: 'Total share of all ADA being staked in pool / Entire Supply',
+    subtitle: 'How close the pool is to its limit / Total stake in the pool',
     ranges: [
       {
         id: 0,
@@ -124,7 +124,7 @@ function ColoursModal(): Node {
           {piechart ?
             ranges.map(({ id, value, description }) => (
               <div key={id} className="range-row">
-                <PoolSizeTag value={value} />
+                <PoolSaturationTag value={value} />
                 <p className="description">{description}</p>
               </div>
             )) :

src/components/DesktopTable.js

@@ -161,8 +161,8 @@ function DesktopTable({
     },
     {
       id: 2,
-      label: 'Share / Pool Size',
-      textInfo: 'Total share of all ada being staked in pool / Entire Supply',
+      label: 'Pool Size',
+      textInfo: 'How close the pool is to its limit / Total stake in the pool',
     },
     {
       id: 3,

src/components/DesktopTableRevamp.js

@@ -12,7 +12,7 @@ import { formatBigNumber, formatCostLabel } from '../utils/utils';
 import { ButtonRevamp } from './common/Button';
 import { TooltipRevamp } from './common/Tooltip';
 import StakingPoolCardRevamp from './StakingPoolCardRevamp';
-import { PoolSizeTagRevamp } from './PoolSizeTag';
+import { PoolSaturationTagRevamp } from './PoolSaturationTag';
 import Label from './common/Label';
 import NoStakePoolsFound from './NoStakePoolsFound';
 
@@ -152,14 +152,14 @@ function DesktopTableRevamp({
     {
       id: 2,
       label: 'Pool size',
-      textInfo: 'Entire Supply',
+      textInfo: 'Total stake in the pool',
       value: Sorting.POOL_SIZE,
     },
     {
       id: 3,
-      label: 'Share',
-      textInfo: 'Total share of all ada being staked in pool',
-      value: Sorting.SHARE,
+      label: 'Saturation',
+      textInfo: 'How close the pool is to its limit',
+      value: Sorting.SATURATION,
     },
     {
       id: 4,
@@ -228,7 +228,7 @@ function DesktopTableRevamp({
                     <ValueRevamp>{formatBigNumber(pool.total_stake)}</ValueRevamp>
                   </td>
                   <td>
-                    <PoolSizeTagRevamp value={pool.saturation} />
+                    <PoolSaturationTagRevamp value={pool.saturation} />
                   </td>
                   <td>
                     <CostsCardRevamp

src/components/MobileTableRevamp.js

@@ -11,7 +11,7 @@ import { ButtonRevamp } from './common/Button';
 import type { QueryState } from '../utils/types';
 import type { DelegationProps } from '../containers/Home';
 import StakingPoolCardRevamp from './StakingPoolCardRevamp';
-import { PoolSizeTagRevamp } from './PoolSizeTag';
+import { PoolSaturationTagRevamp } from './PoolSaturationTag';
 import { ValueRevamp } from './DesktopTableRevamp';
 import NoStakePoolsFound from './NoStakePoolsFound';
 
@@ -114,8 +114,8 @@ function MobileTableRevamp({
                   <ValueRevamp>{formatBigNumber(pool.total_stake)}</ValueRevamp>
                 </div>
                 <div className="item">
-                  <div className="label">Share</div>
-                  <PoolSizeTagRevamp value={pool.saturation} />
+                  <div className="label">Saturation</div>
+                  <PoolSaturationTagRevamp value={pool.saturation} />
                 </div>
               </WrapperContent>
               <WrapperContent style={{ display: 'flex' }}>

src/components/PoolSizeTag.js → src/components/PoolSaturationTag.js

@@ -42,7 +42,7 @@ type Props = {|
   +value: number,
 |};
 
-function PoolSizeTag({ value }: Props): Node {
+function PoolSaturationTag({ value }: Props): Node {
   const totalValue = 1
   function formatArray(percent) {
     return [
@@ -111,7 +111,7 @@ const TagRevamp = styled.div`
 
 `;
 
-function PoolSizeTagRevamp({ value }: Props): Node {
+function PoolSaturationTagRevamp({ value }: Props): Node {
   const totalValue = 1;
   function formatArray(percent) {
     return [
@@ -135,5 +135,5 @@ function PoolSizeTagRevamp({ value }: Props): Node {
   );
 }
 
-export default PoolSizeTag;
-export { PoolSizeTagRevamp };
+export default PoolSaturationTag;
+export { PoolSaturationTagRevamp };

src/components/PoolSizeCard.js

@@ -3,7 +3,7 @@
 import React from 'react';
 import styled from 'styled-components';
 import type { Node } from 'react';
-import PoolSizeTag from './PoolSizeTag';
+import PoolSaturationTag from './PoolSaturationTag';
 
 const Card = styled.div`
   display: flex;
@@ -34,7 +34,7 @@ type Props = {|
 function PoolSizeCard({ percentage, value }: Props): Node {
   return (
     <Card>
-      <PoolSizeTag value={percentage} />
+      <PoolSaturationTag value={percentage} />
       <p className="value">{value} ₳</p>
     </Card>
   );

src/components/SaturatedPoolAlert.js

@@ -44,7 +44,7 @@ function SaturatedPoolAlert({ delegation, onSuccess, close }: Props): Node {
     :
     `${delegation.stakepoolName} will be saturated after your delegation. If you continue, you will get less than the expected rewards.`
 
-  const poolShare = Number(delegation.stakepoolTotalStake) / 1000000; // divided in 1,000,000 to convert from Lovelace to ADA
+  const poolStake = Number(delegation.stakepoolTotalStake) / 1000000; // divided in 1,000,000 to convert from Lovelace to ADA
   const yourAda = delegation.totalAda == null ? '' : `Your ADA: ${new Intl.NumberFormat().format(delegation.totalAda)}`;
   const yourAdaNotEmpty = yourAda !== '';
 
@@ -55,7 +55,7 @@ function SaturatedPoolAlert({ delegation, onSuccess, close }: Props): Node {
         <h3 className="description">{text}</h3>
         {yourAdaNotEmpty && <h3 className="description">{yourAda} ADA</h3>}
         <h3 className="description">
-          Stakepool Size: {new Intl.NumberFormat().format(Number(poolShare.toFixed(0)))} ADA
+          Stakepool Size: {new Intl.NumberFormat().format(Number(poolStake.toFixed(0)))} ADA
         </h3>
       </div>
       <Button onClick={() => {onSuccess(delegation.id); close()}} disabled={false} className="upper-button">

src/components/SortSelect.js

@@ -57,7 +57,7 @@ export const sortingSelectDataRevamp = [
   { label: 'Ticker and name', value: Sorting.TICKER },
   { label: 'ROA', value: Sorting.ROA },
   { label: 'Pool size', value: Sorting.POOL_SIZE },
-  { label: 'Share', value: Sorting.SHARE },
+  { label: 'Saturation', value: Sorting.SATURATION },
   { label: 'Costs', value: Sorting.COSTS },
   { label: 'Pledge', value: Sorting.PLEDGE },
   { label: 'Blocks', value: Sorting.BLOCKS },

src/containers/HomeRevamp.js

@@ -125,8 +125,8 @@ const SORTING_FUNCTIONS = {
     a.total_size - b.total_size,
   [`${Sorting.POOL_SIZE}_${SortingDirections.DESC}`]: (a: Pool, b: Pool) =>
     b.total_size - a.total_size,
-  [`${Sorting.SHARE}_${SortingDirections.ASC}`]: (a: Pool, b: Pool) => a.saturation - b.saturation,
-  [`${Sorting.SHARE}_${SortingDirections.DESC}`]: (a: Pool, b: Pool) => b.saturation - a.saturation,
+  [`${Sorting.SATURATION}_${SortingDirections.ASC}`]: (a: Pool, b: Pool) => a.saturation - b.saturation,
+  [`${Sorting.SATURATION}_${SortingDirections.DESC}`]: (a: Pool, b: Pool) => b.saturation - a.saturation,
   [`${Sorting.PLEDGE}_${SortingDirections.ASC}`]: (a: Pool, b: Pool) =>
     Number(a.pledge) - Number(b.pledge),
   [`${Sorting.PLEDGE}_${SortingDirections.DESC}`]: (a: Pool, b: Pool) =>