From 8e61009e8dd885976283ac73d4d454023ff1cd5f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rui=20Sim=C3=A3o?= Date: Tue, 16 May 2023 09:49:53 +0100 Subject: [PATCH 1/2] fix: replace T&C hidden CTA to AuthCTA --- .../PoolsInsights/PoolsInsights.tsx | 16 ++++---- .../LoansInsights/LoansInsights.tsx | 14 +++---- .../components/Rewards/Rewards.styles.tsx | 5 ++- .../Vault/components/Rewards/Rewards.tsx | 37 +++++++++---------- 4 files changed, 33 insertions(+), 39 deletions(-) diff --git a/src/pages/AMM/Pools/components/PoolsInsights/PoolsInsights.tsx b/src/pages/AMM/Pools/components/PoolsInsights/PoolsInsights.tsx index 09f41e7566..a845df1639 100644 --- a/src/pages/AMM/Pools/components/PoolsInsights/PoolsInsights.tsx +++ b/src/pages/AMM/Pools/components/PoolsInsights/PoolsInsights.tsx @@ -5,8 +5,8 @@ import { useMutation } from 'react-query'; import { toast } from 'react-toastify'; import { formatUSD } from '@/common/utils/utils'; -import { Card, CTA, Dl, DlGroup } from '@/component-library'; -import { IsAuthenticated } from '@/components'; +import { Card, Dl, DlGroup } from '@/component-library'; +import { AuthCTA } from '@/components'; import { calculateAccountLiquidityUSD, calculateTotalLiquidityUSD } from '@/pages/AMM/shared/utils'; import { submitExtrinsic } from '@/utils/helpers/extrinsic'; import { AccountPoolsData } from '@/utils/hooks/api/amm/use-get-account-pools'; @@ -87,13 +87,11 @@ const PoolsInsights = ({ pools, accountPoolsData, refetch }: PoolsInsightsProps) {t('rewards')} {formatUSD(totalClaimableRewardUSD, { compact: true })} - - {hasClaimableRewards && ( - - Claim - - )} - + {hasClaimableRewards && ( + + Claim + + )} ); diff --git a/src/pages/Loans/LoansOverview/components/LoansInsights/LoansInsights.tsx b/src/pages/Loans/LoansOverview/components/LoansInsights/LoansInsights.tsx index 1d62c7c1a5..ff56e4f6a0 100644 --- a/src/pages/Loans/LoansOverview/components/LoansInsights/LoansInsights.tsx +++ b/src/pages/Loans/LoansOverview/components/LoansInsights/LoansInsights.tsx @@ -5,7 +5,7 @@ import { toast } from 'react-toastify'; import { formatNumber, formatPercentage, formatUSD } from '@/common/utils/utils'; import { Card, CTA, Dl, DlGroup } from '@/component-library'; -import { IsAuthenticated } from '@/components'; +import { AuthCTA } from '@/components'; import ErrorModal from '@/legacy-components/ErrorModal'; import { submitExtrinsic } from '@/utils/helpers/extrinsic'; import { AccountLendingStatistics } from '@/utils/hooks/api/loans/use-get-account-lending-statistics'; @@ -75,13 +75,11 @@ const LoansInsights = ({ statistics }: LoansInsightsProps): JSX.Element => { Rewards {subsidyRewardsAmountLabel} - - {hasSubsidyRewards && ( - - Claim - - )} - + {hasSubsidyRewards && ( + + Claim + + )} {claimRewardsMutation.isError && ( diff --git a/src/pages/Vaults/Vault/components/Rewards/Rewards.styles.tsx b/src/pages/Vaults/Vault/components/Rewards/Rewards.styles.tsx index 2578dd98a8..78b2a83472 100644 --- a/src/pages/Vaults/Vault/components/Rewards/Rewards.styles.tsx +++ b/src/pages/Vaults/Vault/components/Rewards/Rewards.styles.tsx @@ -1,6 +1,7 @@ import styled from 'styled-components'; -import { CTA, H2, theme } from '@/component-library'; +import { H2, theme } from '@/component-library'; +import { AuthCTA } from '@/components'; const StyledRewardsTitleWrapper = styled.div` display: flex; @@ -19,7 +20,7 @@ type StyledCTAProps = { $loading: boolean; }; -const StyledCTA = styled(CTA)` +const StyledCTA = styled(AuthCTA)` position: relative; padding-left: ${(props) => props.$loading && theme.spacing.spacing8}; `; diff --git a/src/pages/Vaults/Vault/components/Rewards/Rewards.tsx b/src/pages/Vaults/Vault/components/Rewards/Rewards.tsx index 2b7be815f1..e2bc840f77 100644 --- a/src/pages/Vaults/Vault/components/Rewards/Rewards.tsx +++ b/src/pages/Vaults/Vault/components/Rewards/Rewards.tsx @@ -7,7 +7,6 @@ import { toast } from 'react-toastify'; import { formatNumber, formatUSD } from '@/common/utils/utils'; import { CardProps } from '@/component-library'; import { LoadingSpinner } from '@/component-library/LoadingSpinner'; -import { IsAuthenticated } from '@/components'; import { GOVERNANCE_TOKEN_SYMBOL, WRAPPED_TOKEN } from '@/config/relay-chains'; import ErrorModal from '@/legacy-components/ErrorModal'; import { ZERO_GOVERNANCE_TOKEN_AMOUNT } from '@/utils/constants/currency'; @@ -83,25 +82,23 @@ const Rewards = ({ const stakingTitle = ( Rewards - - {hasWithdrawRewardsBtn && ( - - {/* TODO: temporary approach. Loading spinner should be added to the CTA itself */} - {claimRewardsMutation.isLoading && ( - - - - )} - Withdraw all rewards - - )} - + {hasWithdrawRewardsBtn && ( + + {/* TODO: temporary approach. Loading spinner should be added to the CTA itself */} + {claimRewardsMutation.isLoading && ( + + + + )} + Withdraw all rewards + + )} {claimRewardsMutation.isError && ( Date: Wed, 17 May 2023 10:56:19 +0100 Subject: [PATCH 2/2] chore: fix linting error --- .../LoansOverview/components/LoansInsights/LoansInsights.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/Loans/LoansOverview/components/LoansInsights/LoansInsights.tsx b/src/pages/Loans/LoansOverview/components/LoansInsights/LoansInsights.tsx index ff56e4f6a0..41bfd6a148 100644 --- a/src/pages/Loans/LoansOverview/components/LoansInsights/LoansInsights.tsx +++ b/src/pages/Loans/LoansOverview/components/LoansInsights/LoansInsights.tsx @@ -4,7 +4,7 @@ import { useMutation } from 'react-query'; import { toast } from 'react-toastify'; import { formatNumber, formatPercentage, formatUSD } from '@/common/utils/utils'; -import { Card, CTA, Dl, DlGroup } from '@/component-library'; +import { Card, Dl, DlGroup } from '@/component-library'; import { AuthCTA } from '@/components'; import ErrorModal from '@/legacy-components/ErrorModal'; import { submitExtrinsic } from '@/utils/helpers/extrinsic';