diff --git a/src/common/store/constants.ts b/src/common/store/constants.ts index becaf04b..75c5b8d9 100644 --- a/src/common/store/constants.ts +++ b/src/common/store/constants.ts @@ -200,6 +200,7 @@ export const SESSION_IS_RLOGIN_DEFINED = 'SESSION_IS_RLOGIN_DEFINED'; // Flyover PegOut getters export const FLYOVER_PEGOUT_GET_PROVIDER_ID = 'FLYOVER_PEGOUT_GET_PROVIDER_ID'; export const FLYOVER_PEGOUT_GET_SELECTED_QUOTE = 'FLYOVER_PEGOUT_GET_SELECTED_QUOTE'; +export const FLYOVER_PEGOUT_GET_MIN_MAX_VALUES = 'FLYOVER_PEGOUT_GET_MIN_MAX_VALUES'; // environment export const BTC_NETWORK_MAINNET = 'main'; diff --git a/src/pegout/components/FlyoverRbtcInputAmount.vue b/src/pegout/components/FlyoverRbtcInputAmount.vue index e8ee0050..57d6021c 100644 --- a/src/pegout/components/FlyoverRbtcInputAmount.vue +++ b/src/pegout/components/FlyoverRbtcInputAmount.vue @@ -82,10 +82,8 @@ import { mdiArrowRight } from '@mdi/js'; import EnvironmentContextProviderService from '@/common/providers/EnvironmentContextProvider'; import * as constants from '@/common/store/constants'; import { isRBTCAmountValidRegex } from '@/common/utils'; -import { - PegOutTxState, SessionState, WeiBig, -} from '@/common/types'; -import { useAction, useState } from '@/common/store/helper'; +import { SessionState, WeiBig } from '@/common/types'; +import { useAction, useGetter, useState } from '@/common/store/helper'; export default defineComponent({ name: 'FlyoverRbtcInputAmount', @@ -101,7 +99,7 @@ export default defineComponent({ const stepState = ref<'unset' | 'valid' |'error'>('unset'); const web3SessionState = useState('web3Session'); - const pegOutTxState = useState('pegOutTx'); + const minMaxValues = useGetter<{minValue: WeiBig; maxValue: WeiBig}>('flyoverPegout', constants.FLYOVER_PEGOUT_GET_MIN_MAX_VALUES); const setRbtcAmount = useAction('flyoverPegout', constants.FLYOVER_PEGOUT_ADD_AMOUNT); const addAmount = useAction('pegOutTx', constants.PEGOUT_TX_ADD_AMOUNT); const calculateFee = useAction('pegOutTx', constants.PEGOUT_TX_CALCULATE_FEE); @@ -113,7 +111,7 @@ export default defineComponent({ const btcAmount = computed(() => rbtcAmount.value); const amountErrorMessage = computed(() => { - const { minValue, maxValue } = pegOutTxState.value.pegoutConfiguration; + const { minValue, maxValue } = minMaxValues.value; const { balance } = web3SessionState.value; if (rbtcAmount.value.toString() === '') { return 'Please, enter an amount'; @@ -140,12 +138,12 @@ export default defineComponent({ }); const insufficientAmount = computed(() => { - const { pegoutConfiguration } = pegOutTxState.value; + const { minValue, maxValue } = minMaxValues.value; const { balance } = web3SessionState.value; return safeAmount.value.lte('0') || safeAmount.value.gt(balance) - || safeAmount.value.lt(pegoutConfiguration.minValue) - || safeAmount.value.gt(pegoutConfiguration.maxValue); + || safeAmount.value.lt(minValue) + || safeAmount.value.gt(maxValue); }); const isWalletConnected = computed((): boolean => web3SessionState.value.account !== undefined); @@ -181,6 +179,8 @@ export default defineComponent({ function clearStateWhenWalletIsDisconnected() { if (!isWalletConnected.value) { rbtcAmount.value = ''; + amountStyle.value = ''; + stepState.value = 'unset'; isMaxValueZero.value = false; context.emit('walletDisconnected'); } diff --git a/src/pegout/store/FlyoverPegout/getters.ts b/src/pegout/store/FlyoverPegout/getters.ts index aa8fae12..a0df3daf 100644 --- a/src/pegout/store/FlyoverPegout/getters.ts +++ b/src/pegout/store/FlyoverPegout/getters.ts @@ -1,6 +1,7 @@ -import { FlyoverPegoutState, RootState } from '@/common/types'; +import { FlyoverPegoutState, RootState, WeiBig } from '@/common/types'; import { GetterTree } from 'vuex'; import * as constants from '@/common/store/constants'; +import { EnvironmentAccessorService } from '@/common/services/enviroment-accessor.service'; export const getters: GetterTree = { [constants.FLYOVER_PEGOUT_GET_PROVIDER_ID]: (state) => (quoteHash: string): number => { @@ -23,4 +24,15 @@ export const getters: GetterTree = { }); return quoteFound; }, + [constants.FLYOVER_PEGOUT_GET_MIN_MAX_VALUES]: (state) => { + if (state.liquidityProviders.length === 0) { + return { + minValue: new WeiBig(EnvironmentAccessorService.getEnvironmentVariables().pegoutMinValue, 'rbtc'), + maxValue: new WeiBig(EnvironmentAccessorService.getEnvironmentVariables().pegoutMaxValue, 'rbtc'), + }; + } + const { pegout } = state.liquidityProviders[0]; + const { minTransactionValue, maxTransactionValue } = pegout; + return { minValue: minTransactionValue, maxValue: maxTransactionValue }; + }, };