From 803f003cf9d14c3521bbcf070415ec25e77bcce1 Mon Sep 17 00:00:00 2001 From: michalsmiarowski Date: Tue, 21 Nov 2023 17:48:42 +0100 Subject: [PATCH 1/3] Change back the default error messages In 42bd97057c25f42d03b16996aaffc66cf2703866 we've changed the default messages in a way that they are related to Token staking. This is bad because now such messages were displayed in tbtc section (for example). This commit changes the default error message back to where it was before this commit. --- .../StakingApplicationForms/index.tsx | 4 ++-- src/utils/forms.ts | 18 +++++++++++------- 2 files changed, 13 insertions(+), 9 deletions(-) diff --git a/src/components/StakingApplicationForms/index.tsx b/src/components/StakingApplicationForms/index.tsx index 0e933f610..0b45eebbe 100644 --- a/src/components/StakingApplicationForms/index.tsx +++ b/src/components/StakingApplicationForms/index.tsx @@ -4,7 +4,7 @@ import { FormikErrors, FormikProps, withFormik } from "formik" import { FC, Ref, useEffect, useState } from "react" import { formatTokenAmount } from "../../utils/formatAmount" import { - defaultStakingLessThanMessage, + defaultLessThanMessage, defaultAmountValidationOptions, DEFAULT_MIN_VALUE, getErrorsObj, @@ -150,7 +150,7 @@ const deauthorizationValidation = ( { ...defaultAmountValidationOptions, lessThanValidationMessage(amount) { - return `${defaultStakingLessThanMessage( + return `${defaultLessThanMessage( amount )} or equal to ${formatTokenAmount(authorizedAmount.toString())} T` }, diff --git a/src/utils/forms.ts b/src/utils/forms.ts index ae1d395b5..c607616ed 100644 --- a/src/utils/forms.ts +++ b/src/utils/forms.ts @@ -19,21 +19,25 @@ type AmountValidationOptions = { } export const DEFAULT_MIN_VALUE = WeiPerEther.toString() -export const defaultStakingLessThanMessage: (maxAmount: string) => string = ( +export const defaultLessThanMessage: (maxAmount: string) => string = ( maxAmount ) => { - return `The maximum stake amount is ${formatTokenAmount(maxAmount)}.` + return `The value should be less than or equal ${formatTokenAmount( + maxAmount + )}` } -export const defaultStakingGreaterThanMessage: (minAmount: string) => string = ( +export const defaultGreaterThanMessage: (minAmount: string) => string = ( minAmount ) => { - return `The minimum stake amount is ${formatTokenAmount(minAmount)}.` + return `The value should be greater than or equal ${formatTokenAmount( + minAmount + )}` } export const defaultAmountValidationOptions: AmountValidationOptions = { - greaterThanValidationMessage: defaultStakingGreaterThanMessage, - lessThanValidationMessage: defaultStakingLessThanMessage, - requiredMessage: "The stake amount is required.", + greaterThanValidationMessage: defaultGreaterThanMessage, + lessThanValidationMessage: defaultLessThanMessage, + requiredMessage: "Required.", insufficientBalanceMessage: "Your wallet balance is insufficient.", } From ed3ae670abc6efd3a4090535432f8d3debeb2cc5 Mon Sep 17 00:00:00 2001 From: michalsmiarowski Date: Tue, 21 Nov 2023 17:51:57 +0100 Subject: [PATCH 2/3] Remove isWalletConnected property The property name change is not needed because we usually use default `active` property from `useWeb3React` hook anyway. --- src/pages/Staking/NewStakeCard.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/Staking/NewStakeCard.tsx b/src/pages/Staking/NewStakeCard.tsx index ed6ea8402..a28ac3d5b 100644 --- a/src/pages/Staking/NewStakeCard.tsx +++ b/src/pages/Staking/NewStakeCard.tsx @@ -13,7 +13,7 @@ const NewStakeCard: FC> = () => { const { openModal } = useModal() const tBalance = useTokenBalance(Token.T) const { minStakeAmount, isLoading, hasError } = useMinStakeAmount() - const { active: isWalletConnected } = useWeb3React() + const { active } = useWeb3React() const openStakingModal = async (stakeAmount: string) => { openModal(ModalType.StakingChecklist, { stakeAmount }) @@ -42,7 +42,7 @@ const NewStakeCard: FC> = () => { placeholder={placeholder} minTokenAmount={minStakeAmount} shouldDisableButton={false} - isDisabled={!isWalletConnected} + isDisabled={!active} /> From bb143c48034b30f9fae4db7d5934b8a4dddee857 Mon Sep 17 00:00:00 2001 From: michalsmiarowski Date: Tue, 21 Nov 2023 17:55:30 +0100 Subject: [PATCH 3/3] Refactor disabled button for token amount form The previosu commit introduces `shouldDisableButton` property which might get a little confusing, because when it's set to true someone might expect that the button is disabled no matter what, when in reality it relies on `isDisabled` property also. Instead of this, I've added `isDisabled` property for `Connect Wallet` button in SubmitTxButton component and set it to false. This overrides the `isDisabled` property from `...buttonProp`, because in this case we don't want ot have this button disabled anyway. This means that we can use `isDisabled` to disable token amount form if the account is not connected but keep the `Connect Wallet` button active. --- src/components/Forms/TokenAmountForm.tsx | 4 +--- src/components/SubmitTxButton.tsx | 1 + src/pages/Staking/NewStakeCard.tsx | 1 - 3 files changed, 2 insertions(+), 4 deletions(-) diff --git a/src/components/Forms/TokenAmountForm.tsx b/src/components/Forms/TokenAmountForm.tsx index 4b5e24dbe..bcc8a9404 100644 --- a/src/components/Forms/TokenAmountForm.tsx +++ b/src/components/Forms/TokenAmountForm.tsx @@ -25,7 +25,6 @@ export type TokenAmountFormBaseProps = { isDisabled?: boolean shouldValidateForm?: boolean shouldDisplayMaxAmountInLabel?: boolean - shouldDisableButton?: boolean token?: { decimals: number; symbol: string } placeholder?: string minTokenAmount?: string | number @@ -44,7 +43,6 @@ export const TokenAmountFormBase: FC< isDisabled = false, shouldValidateForm = true, shouldDisplayMaxAmountInLabel = false, - shouldDisableButton = true, placeholder, submitButtonVariant = "solid", ...formikProps @@ -81,7 +79,7 @@ export const TokenAmountFormBase: FC< mt="6" submitText={submitButtonText} variant={submitButtonVariant} - isDisabled={shouldDisableButton && isDisabled} + isDisabled={isDisabled} /> ) diff --git a/src/components/SubmitTxButton.tsx b/src/components/SubmitTxButton.tsx index 5214d511f..2d0c5e558 100644 --- a/src/components/SubmitTxButton.tsx +++ b/src/components/SubmitTxButton.tsx @@ -32,6 +32,7 @@ const SubmitTxButton: FC = ({ onClick={() => openModal(ModalType.SelectWallet)} {...buttonProps} type="button" + isDisabled={false} > Connect Wallet diff --git a/src/pages/Staking/NewStakeCard.tsx b/src/pages/Staking/NewStakeCard.tsx index a28ac3d5b..41079048d 100644 --- a/src/pages/Staking/NewStakeCard.tsx +++ b/src/pages/Staking/NewStakeCard.tsx @@ -41,7 +41,6 @@ const NewStakeCard: FC> = () => { maxTokenAmount={tBalance} placeholder={placeholder} minTokenAmount={minStakeAmount} - shouldDisableButton={false} isDisabled={!active} />