-
+
+
+
{t('send.estimatedGasFee')}
{isBitcoinBased
@@ -970,21 +972,21 @@ export const SendConfirm = () => {
{!isBitcoinBased && !basicTxValues.token?.isNft
? !isBitcoinBased &&
isEIP1559Compatible && (
- setIsOpenEditFeeModal(true)}
>
{' '}
-
+
)
: null}
-
-
+
+
{!basicTxValues.token?.isNft ? (
<>
Total ({t('send.amountAndFee')})
diff --git a/source/pages/Send/EditPriorityModal.tsx b/source/pages/Send/EditPriority.tsx
similarity index 56%
rename from source/pages/Send/EditPriorityModal.tsx
rename to source/pages/Send/EditPriority.tsx
index 042ab5357..13a7e82bb 100644
--- a/source/pages/Send/EditPriorityModal.tsx
+++ b/source/pages/Send/EditPriority.tsx
@@ -1,8 +1,9 @@
-import { Form, Input } from 'antd';
+import { Form } from 'antd';
import React, { useEffect, useState } from 'react';
import { useTranslation } from 'react-i18next';
-import { Modal, NeutralButton } from 'components/index';
+import { Button } from 'components/index';
+import { EditFeeModalBase } from 'components/Modal/EditFeeModalBase';
import { ICustomFeeParams, IFeeState } from 'types/transactions';
import removeScientificNotation from 'utils/removeScientificNotation';
@@ -189,7 +190,7 @@ export const EditPriorityModal = (props: IEditPriorityModalProps) => {
}, [priority, fee, showModal, gasPrice, isSendLegacyTransaction]);
return (
- {
setCustomFee((prevState) => ({
@@ -202,114 +203,156 @@ export const EditPriorityModal = (props: IEditPriorityModalProps) => {
setIsOpen(false);
}}
>
-
+
-
- {t('send.editFee')}
-
-
-
setPriority(value)}
- />
-
-
-
+
);
};
diff --git a/source/pages/Send/SendEth.tsx b/source/pages/Send/SendEth.tsx
index 23baf888f..5057383ba 100644
--- a/source/pages/Send/SendEth.tsx
+++ b/source/pages/Send/SendEth.tsx
@@ -1,6 +1,7 @@
import { Menu, Transition } from '@headlessui/react';
import { ChevronDoubleDownIcon } from '@heroicons/react/solid';
-import { Form, Input } from 'antd';
+import { Form } from 'antd';
+import { toSvg } from 'jdenticon';
import { uniqueId } from 'lodash';
import React, { useEffect } from 'react';
import { useState, Fragment } from 'react';
@@ -9,12 +10,12 @@ import { useSelector } from 'react-redux';
import { isValidEthereumAddress } from '@pollum-io/sysweb3-utils';
-import { Card, Layout, NeutralButton } from 'components/index';
+import { Card, Layout, Button } from 'components/index';
import { useUtils } from 'hooks/index';
import { RootState } from 'state/store';
import { IERC1155Collection, ITokenEthProps } from 'types/tokens';
import { getController } from 'utils/browser';
-import { getAssetBalance } from 'utils/index';
+import { ellipsis, getAssetBalance } from 'utils/index';
export const SendEth = () => {
const { alert, navigate } = useUtils();
@@ -34,9 +35,16 @@ export const SendEth = () => {
gasPrice: 0,
});
const [isMessageVisible, setIsMessageVisible] = useState(false);
+ const [inputValue, setInputValue] = useState({ address: '', amount: 0 });
+ const [isValidAddress, setIsValidAddress] = useState(null);
+ const [isValidAmount, setIsValidAmount] = useState(null);
+
const [form] = Form.useForm();
const { wallet } = getController();
+ const isAccountImported =
+ accounts[activeAccountMeta.type][activeAccountMeta.id]?.isImported;
+
const hasAccountAssets =
activeAccount && activeAccount.assets.ethereum?.length > 0;
@@ -45,6 +53,23 @@ export const SendEth = () => {
const messageOpacity = isMessageVisible ? 'opacity-100' : 'opacity-0';
+ const handleInputChange = (e) => {
+ const { name, value } = e.target;
+
+ setInputValue((prevState) => ({ ...prevState, [name]: value }));
+
+ if (name === 'address' && value.trim() !== '') {
+ const validAddress = isValidEthereumAddress(value);
+ setIsValidAddress(validAddress);
+ } else if (name === 'amount') {
+ const validAmount =
+ value <= Number(activeAccount?.balances.ethereum) && value > 0;
+ setIsValidAmount(validAmount);
+ } else {
+ setIsValidAddress(null);
+ }
+ };
+
const handleSelectedAsset = (item: string) => {
if (activeAccount.assets.ethereum?.length > 0) {
const getAsset = activeAccount.assets.ethereum.find(
@@ -158,17 +183,51 @@ export const SendEth = () => {
}
}, [isMessageVisible]);
+ useEffect(() => {
+ const placeholder = document.querySelector('.add-identicon');
+ if (!placeholder) return;
+
+ placeholder.innerHTML = toSvg(
+ accounts[activeAccountMeta.type][activeAccountMeta.id]?.xpub,
+ 50,
+ {
+ backColor: '#07152B',
+ padding: 1,
+ }
+ );
+ }, [accounts[activeAccountMeta.type][activeAccountMeta.id]?.address]);
+
return (
-
-
- {t('send.balance')}
-
-
- {finalBalance()}
-
-
+
+
+
+
+
+
+ {accounts[activeAccountMeta.type][activeAccountMeta.id]?.label}
+
+
+ {ellipsis(
+ accounts[activeAccountMeta.type][activeAccountMeta.id]
+ ?.address,
+ 4,
+ 4
+ )}
+
+
+ {isAccountImported && (
+
+ Imported
+
+ )}
+
+
+
Your balance:
+
{finalBalance()}
+
+