diff --git a/dapp/src/components/TransactionModal/ActionDurationEstimation.tsx b/dapp/src/components/TransactionModal/ActionDurationEstimation.tsx new file mode 100644 index 000000000..cb076e733 --- /dev/null +++ b/dapp/src/components/TransactionModal/ActionDurationEstimation.tsx @@ -0,0 +1,25 @@ +import React from "react" +import { ActivityType } from "#/types" +import { getEstimatedDuration } from "#/utils" +import { useFormField } from "#/hooks" +import { TextMd } from "../shared/Typography" +import { TOKEN_AMOUNT_FIELD_NAME } from "../shared/TokenAmountForm/TokenAmountFormBase" + +export default function ActionDurationEstimation({ + type, +}: { + type: ActivityType +}) { + const { value: amount = 0n } = useFormField( + TOKEN_AMOUNT_FIELD_NAME, + ) + + return ( + + Estimated duration  + + ~ {getEstimatedDuration(amount, type)} + + + ) +} diff --git a/dapp/src/components/TransactionModal/ActiveStakingStep/StakeFormModal/index.tsx b/dapp/src/components/TransactionModal/ActiveStakingStep/StakeFormModal/index.tsx index 6233134bd..466283099 100644 --- a/dapp/src/components/TransactionModal/ActiveStakingStep/StakeFormModal/index.tsx +++ b/dapp/src/components/TransactionModal/ActiveStakingStep/StakeFormModal/index.tsx @@ -8,6 +8,7 @@ import { fixedPointNumberToString, getCurrencyByType } from "#/utils" import { featureFlags } from "#/constants" import StakeDetails from "./StakeDetails" import AcrePointsRewardEstimation from "./AcrePointsRewardEstimation" +import ActionDurationEstimation from "../../ActionDurationEstimation" function StakeFormModal({ onSubmitForm, @@ -35,6 +36,7 @@ function StakeFormModal({ )} Deposit + ) } diff --git a/dapp/src/components/TransactionModal/ActiveUnstakingStep/UnstakeFormModal/index.tsx b/dapp/src/components/TransactionModal/ActiveUnstakingStep/UnstakeFormModal/index.tsx index 5137be55e..252239214 100644 --- a/dapp/src/components/TransactionModal/ActiveUnstakingStep/UnstakeFormModal/index.tsx +++ b/dapp/src/components/TransactionModal/ActiveUnstakingStep/UnstakeFormModal/index.tsx @@ -10,6 +10,7 @@ import { } from "#/hooks" import { fixedPointNumberToString, getCurrencyByType } from "#/utils" import UnstakeDetails from "./UnstakeDetails" +import ActionDurationEstimation from "../../ActionDurationEstimation" function UnstakeFormModal({ onSubmitForm, @@ -39,6 +40,7 @@ function UnstakeFormModal({ > Withdraw + ) } diff --git a/dapp/src/components/shared/TokenAmountForm/index.tsx b/dapp/src/components/shared/TokenAmountForm/index.tsx index a1360ed8e..b3b157fec 100644 --- a/dapp/src/components/shared/TokenAmountForm/index.tsx +++ b/dapp/src/components/shared/TokenAmountForm/index.tsx @@ -36,7 +36,7 @@ const TokenAmountForm = withFormik( handleSubmit: (values, { props }) => { props.onSubmitForm(values) }, - validateOnBlur: false, + validateOnBlur: true, validateOnChange: false, }, )(TokenAmountFormBase)