From 61b09f3927c36befc1723134714f6025e1c0ff2b Mon Sep 17 00:00:00 2001 From: Elias Date: Mon, 21 Jun 2021 12:05:56 +0200 Subject: [PATCH 1/5] Display 0 HEZ as reward of non eligible users at the end of the reward period --- .../rewards-card/rewards-card.view.jsx | 16 +++++++++++++--- .../rewards-sidenav/rewards-sidenav.view.jsx | 19 +++++++++++++++---- 2 files changed, 28 insertions(+), 7 deletions(-) diff --git a/src/views/my-account/components/rewards-card/rewards-card.view.jsx b/src/views/my-account/components/rewards-card/rewards-card.view.jsx index 09c2b1212..c694e857e 100644 --- a/src/views/my-account/components/rewards-card/rewards-card.view.jsx +++ b/src/views/my-account/components/rewards-card/rewards-card.view.jsx @@ -93,9 +93,19 @@ function RewardsCard ({

Thank you for participating in the Hermez reward program.

-

- Your total reward is {getFormattedEarnedReward(earnedRewardTask.data)} HEZ ({CurrencySymbol[preferredCurrency].symbol}{getRewardAmountInPreferredCurrency(earnedRewardTask.data)}) -

+ { + accountEligibilityTask.data + ? ( +

+ Your total reward is {getFormattedEarnedReward(earnedRewardTask.data)} HEZ ({CurrencySymbol[preferredCurrency].symbol}{getRewardAmountInPreferredCurrency(earnedRewardTask.data)}) +

+ ) + : ( +

+ Your total reward is 0.00 HEZ ({CurrencySymbol[preferredCurrency].symbol}0.00). +

+ ) + } ) : ( diff --git a/src/views/shared/rewards-sidenav/rewards-sidenav.view.jsx b/src/views/shared/rewards-sidenav/rewards-sidenav.view.jsx index 155ab501b..f10c9feb6 100644 --- a/src/views/shared/rewards-sidenav/rewards-sidenav.view.jsx +++ b/src/views/shared/rewards-sidenav/rewards-sidenav.view.jsx @@ -138,10 +138,21 @@ function RewardsSidenav ({

Your total reward

-

- {getFormattedEarnedReward(earnedRewardTask.data)} HEZ - (${getRewardAmountInPreferredCurrency(earnedRewardTask.data)}) -

+ { + accountEligibilityTask.data + ? ( +

+ {getFormattedEarnedReward(earnedRewardTask.data)} HEZ + (${getRewardAmountInPreferredCurrency(earnedRewardTask.data)}) +

+ ) + : ( +

+ 0.00 HEZ + ({CurrencySymbol[preferredCurrency].symbol}0.00) +

+ ) + } From bb21de2d46b4b254b3ac0f621da0dc2160609990 Mon Sep 17 00:00:00 2001 From: Elias Date: Mon, 21 Jun 2021 12:11:45 +0200 Subject: [PATCH 2/5] Format reward percentage --- src/utils/rewards.js | 15 ++++++++++++++- .../components/rewards-card/rewards-card.view.jsx | 4 ++-- .../rewards-sidenav/rewards-sidenav.view.jsx | 4 ++-- 3 files changed, 18 insertions(+), 5 deletions(-) diff --git a/src/utils/rewards.js b/src/utils/rewards.js index 7a3b0b3b4..97d3c0204 100644 --- a/src/utils/rewards.js +++ b/src/utils/rewards.js @@ -13,6 +13,15 @@ function getFormattedEarnedReward (earnedReward) { } } +/** + * Formats the percentage of a reward + * @param {String} earnedReward - Percentage of the reward + * @returns - Formatted reward percentage + */ +function getFormattedPercentage (percentage) { + return Number(percentage).toFixed(2) +} + /** * Checks if a reward has started or not * @param {Object} reward - Reward information @@ -25,4 +34,8 @@ function hasRewardStarted (reward) { return initRewardTime <= currentTime } -export { getFormattedEarnedReward, hasRewardStarted } +export { + getFormattedEarnedReward, + getFormattedPercentage, + hasRewardStarted +} diff --git a/src/views/my-account/components/rewards-card/rewards-card.view.jsx b/src/views/my-account/components/rewards-card/rewards-card.view.jsx index c694e857e..70d0b0364 100644 --- a/src/views/my-account/components/rewards-card/rewards-card.view.jsx +++ b/src/views/my-account/components/rewards-card/rewards-card.view.jsx @@ -2,7 +2,7 @@ import React from 'react' import useRewardsCardStyles from './rewards-card.styles' import { CurrencySymbol, getTokenAmountInPreferredCurrency } from '../../../../utils/currencies.js' -import { getFormattedEarnedReward } from '../../../../utils/rewards' +import { getFormattedEarnedReward, getFormattedPercentage } from '../../../../utils/rewards' function RewardsCard ({ rewardTask, @@ -111,7 +111,7 @@ function RewardsCard ({ : ( <>

- Reward during the program is {rewardPercentageTask.data || '--'}%.  + Reward during the program is {getFormattedPercentage(rewardPercentageTask.data) || '--'}%.  { accountEligibilityTask.data ? ( diff --git a/src/views/shared/rewards-sidenav/rewards-sidenav.view.jsx b/src/views/shared/rewards-sidenav/rewards-sidenav.view.jsx index f10c9feb6..ac2e5d271 100644 --- a/src/views/shared/rewards-sidenav/rewards-sidenav.view.jsx +++ b/src/views/shared/rewards-sidenav/rewards-sidenav.view.jsx @@ -11,7 +11,7 @@ import heztoken from '../../../images/heztoken.svg' import Sidenav from '../sidenav/sidenav.view' import * as date from '../../../utils/date' import { getTokenAmountInPreferredCurrency, CurrencySymbol } from '../../../utils/currencies' -import { getFormattedEarnedReward } from '../../../utils/rewards' +import { getFormattedEarnedReward, getFormattedPercentage } from '../../../utils/rewards' function RewardsSidenav ({ rewardTask, @@ -188,7 +188,7 @@ function RewardsSidenav ({

Reward during the program

- {rewardPercentageTask.data ? rewardPercentageTask.data : '--'}% + {rewardPercentageTask.data ? getFormattedPercentage(rewardPercentageTask.data) : '--'}%

From 767dc29be9671bf97101f47e591f6f7199c0b030 Mon Sep 17 00:00:00 2001 From: Elias Date: Mon, 21 Jun 2021 12:12:30 +0200 Subject: [PATCH 3/5] Always show the disclameir in the rewards sidenav --- .../rewards-sidenav/rewards-sidenav.view.jsx | 16 ++++++---------- 1 file changed, 6 insertions(+), 10 deletions(-) diff --git a/src/views/shared/rewards-sidenav/rewards-sidenav.view.jsx b/src/views/shared/rewards-sidenav/rewards-sidenav.view.jsx index ac2e5d271..77f4cb485 100644 --- a/src/views/shared/rewards-sidenav/rewards-sidenav.view.jsx +++ b/src/views/shared/rewards-sidenav/rewards-sidenav.view.jsx @@ -212,16 +212,12 @@ function RewardsSidenav ({ }
- { - accountEligibilityTask.data && ( -
- -

- Values are estimated and updated once per day. You will receive your reward at the end of the program. -

-
- ) - } +
+ +

+ Values are estimated and updated once per day. You will receive your reward at the end of the program. +

+
Date: Mon, 21 Jun 2021 12:22:46 +0200 Subject: [PATCH 4/5] Fix reward card title color --- .../my-account/components/rewards-card/rewards-card.styles.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/views/my-account/components/rewards-card/rewards-card.styles.js b/src/views/my-account/components/rewards-card/rewards-card.styles.js index 7948db710..75886692f 100644 --- a/src/views/my-account/components/rewards-card/rewards-card.styles.js +++ b/src/views/my-account/components/rewards-card/rewards-card.styles.js @@ -5,7 +5,6 @@ const useRewardsCardStyles = createUseStyles((theme) => ({ padding: `${theme.spacing(2)}px ${theme.spacing(2.5)}px ${theme.spacing(2.5)}px ${theme.spacing(4)}px `, borderRadius: theme.spacing(2), backgroundColor: theme.palette.black, - color: theme.palette.white, width: '100%' }, cardHeader: { @@ -14,7 +13,8 @@ const useRewardsCardStyles = createUseStyles((theme) => ({ alignItems: 'center', justifyContent: 'space-between', paddingBottom: theme.spacing(1.25), - marginBottom: theme.spacing(1) + marginBottom: theme.spacing(1), + color: theme.palette.grey.light }, cardHeading: { [theme.breakpoints.upSm]: { From 80a42906aae392b2650caac8149b0ca84f56709b Mon Sep 17 00:00:00 2001 From: Elias Date: Mon, 21 Jun 2021 12:27:33 +0200 Subject: [PATCH 5/5] Hide the more info button when the rewards sidenav is closed --- .../components/rewards-card/rewards-card.styles.js | 3 ++- .../components/rewards-card/rewards-card.view.jsx | 11 ++++++++--- src/views/my-account/my-account.view.jsx | 1 + 3 files changed, 11 insertions(+), 4 deletions(-) diff --git a/src/views/my-account/components/rewards-card/rewards-card.styles.js b/src/views/my-account/components/rewards-card/rewards-card.styles.js index 75886692f..427284d69 100644 --- a/src/views/my-account/components/rewards-card/rewards-card.styles.js +++ b/src/views/my-account/components/rewards-card/rewards-card.styles.js @@ -14,7 +14,8 @@ const useRewardsCardStyles = createUseStyles((theme) => ({ justifyContent: 'space-between', paddingBottom: theme.spacing(1.25), marginBottom: theme.spacing(1), - color: theme.palette.grey.light + color: theme.palette.grey.light, + minHeight: 44 }, cardHeading: { [theme.breakpoints.upSm]: { diff --git a/src/views/my-account/components/rewards-card/rewards-card.view.jsx b/src/views/my-account/components/rewards-card/rewards-card.view.jsx index 70d0b0364..a627e006b 100644 --- a/src/views/my-account/components/rewards-card/rewards-card.view.jsx +++ b/src/views/my-account/components/rewards-card/rewards-card.view.jsx @@ -5,6 +5,7 @@ import { CurrencySymbol, getTokenAmountInPreferredCurrency } from '../../../../u import { getFormattedEarnedReward, getFormattedPercentage } from '../../../../utils/rewards' function RewardsCard ({ + rewardSidenav, rewardTask, earnedRewardTask, rewardPercentageTask, @@ -66,9 +67,13 @@ function RewardsCard ({

Your earnings

- + { + rewardSidenav.status === 'closed' && ( + + ) + }
{ (() => { diff --git a/src/views/my-account/my-account.view.jsx b/src/views/my-account/my-account.view.jsx index 88ffd458b..2a2a8ed8e 100644 --- a/src/views/my-account/my-account.view.jsx +++ b/src/views/my-account/my-account.view.jsx @@ -100,6 +100,7 @@ function MyAccount ({ hasRewardStarted(rewards.rewardTask.data) && (