diff --git a/web-frontend/src/pages/TransferCoins/SendCoins.tsx b/web-frontend/src/pages/TransferCoins/SendCoins.tsx index d25c250d7..04baad68b 100644 --- a/web-frontend/src/pages/TransferCoins/SendCoins.tsx +++ b/web-frontend/src/pages/TransferCoins/SendCoins.tsx @@ -17,8 +17,6 @@ function SendCoins() { const tabIndex = parseInt(query.get('tabIndex') || '0'); - console.log(tabIndex); - const { nickname } = useParams(); const { data: account } = useResource(`accounts/${nickname}`); diff --git a/web-frontend/src/pages/TransferCoins/SendCoins/Advanced.tsx b/web-frontend/src/pages/TransferCoins/SendCoins/Advanced.tsx index 0fe06c236..295aaa5ed 100644 --- a/web-frontend/src/pages/TransferCoins/SendCoins/Advanced.tsx +++ b/web-frontend/src/pages/TransferCoins/SendCoins/Advanced.tsx @@ -52,6 +52,8 @@ function Modal({ ...props }) { function handlePresetGas() { setCustomFees(false); setPresetGasFees(true); + handleFees('1000'); + setErrorAdvanced(null); } function handleCustomGas() { @@ -71,12 +73,18 @@ function Modal({ ...props }) { function handleClose() { setModal(!modal); setErrorAdvanced(null); + handleFees('1000'); + } + + function handleOpen() { + handleFees('1000'); } return ( @@ -119,8 +127,7 @@ function Modal({ ...props }) { type="text" placeholder="Gas fees amount (nMAS)" name="fees" - defaultValue="" - value={customGasFees ? fees : ''} + value={!customGasFees ? '' : fees} disabled={!customGasFees} onChange={(e) => handleFees(e.target.value)} error={errorAdvanced?.amount} diff --git a/web-frontend/src/pages/TransferCoins/SendCoins/Send.tsx b/web-frontend/src/pages/TransferCoins/SendCoins/Send.tsx index e1e26c74d..6a1a577f0 100644 --- a/web-frontend/src/pages/TransferCoins/SendCoins/Send.tsx +++ b/web-frontend/src/pages/TransferCoins/SendCoins/Send.tsx @@ -2,8 +2,8 @@ import { useState, ChangeEvent, FormEvent } from 'react'; import { validateInputs, - validateAmount, SendInputsErrors, + validateAmount, } from '../../../validation/sendInputs'; import { formatStandard, Unit } from '../../../utils/MassaFormating'; import { parseForm } from '../../../utils/parseForm'; @@ -46,7 +46,7 @@ function Send(props: SendProps) { const errors = validateInputs( amount, recipient, - 'recipient', + 'Recipient', unformattedBalance, ); setError(errors); diff --git a/web-frontend/src/pages/TransferCoins/SendCoins/SendForm.tsx b/web-frontend/src/pages/TransferCoins/SendCoins/SendForm.tsx index d2a64c3a9..f11ccabf5 100644 --- a/web-frontend/src/pages/TransferCoins/SendCoins/SendForm.tsx +++ b/web-frontend/src/pages/TransferCoins/SendCoins/SendForm.tsx @@ -46,76 +46,82 @@ export function SendForm({ ...props }) { }; return ( -
- {/* Balance Section */} -

{Intl.t('sendcoins.account-balance')}

- -
-

{Intl.t('sendcoins.send-action')}

-

- {Intl.t('sendcoins.available-balance')} {formattedBalance} +

+ + {/* Balance Section */} +

+ {Intl.t('sendcoins.account-balance')}

-
-
- handleChange(e)} - error={error?.amount} - /> -
-
-
    - - - - -
-
-

{Intl.t('sendcoins.recipient')}

-
- setRecipient(e.target.value)} - name="recipient" - error={error?.address} - /> -
-
-

setModalAccounts(!modalAccounts)} - > - - {Intl.t('sendcoins.transfer-between-acc')} - -

-
- {/* Button Section */} -
- - -
- + +
+ +
-
+
- {modal ? ( - - ) : modalAccounts ? ( - - ) : null} +
+ {modal ? ( + + ) : modalAccounts ? ( + + ) : null} +
- +
); } diff --git a/web-frontend/src/validation/sendInputs.tsx b/web-frontend/src/validation/sendInputs.tsx index 5a53ea3b1..6b7954dd8 100644 --- a/web-frontend/src/validation/sendInputs.tsx +++ b/web-frontend/src/validation/sendInputs.tsx @@ -9,6 +9,7 @@ export interface SendInputsErrors { unexpectedError?: string; amount?: string; address?: string; + fees?: string; } /** @@ -21,7 +22,7 @@ export interface SendInputsErrors { export function validateInputs( amount: string, address: string, - addressType = 'recipient', + addressType = 'Recipient', balance?: string, ): SendInputsErrors | null { let errorsAmount = null; @@ -46,8 +47,16 @@ export function validateAmount( balance?: string, amountType = 'Amount', ): SendInputsErrors | null { - let amountInNanoMassa = reverseFormatStandard(amount); let verb = amountType == 'Amount' ? 'is' : 'are'; + + if (Number.isNaN(+amount)) { + return { + amount: Intl.t('errors.send.invalid-amount', { type: amountType, verb }), + }; + } + + let amountInNanoMassa = reverseFormatStandard(amount); + if (Number.isNaN(amountInNanoMassa)) { return { amount: Intl.t('errors.send.invalid-amount', { type: amountType, verb }),