) : (
diff --git a/src/components/composed/Balance/Balance.test.js b/src/components/composed/Balance/Balance.test.js
index 7acfca62..e57d970a 100644
--- a/src/components/composed/Balance/Balance.test.js
+++ b/src/components/composed/Balance/Balance.test.js
@@ -1,22 +1,24 @@
import { render, screen } from '@testing-library/react'
import Balance from './Balance'
-import { SettingsProvider, NetworkContext } from '@Contexts'
+import { SettingsProvider, MintlayerContext } from '@Contexts'
const BALANCE_SAMPLE = 1
const EXCHANGE_RATE_SAMPLE = 25000
test('Render account balance with ML', () => {
render(
-
,
)
const currantBalanceComponent = screen.getByTestId('current-balance')
const balanceParagraphs = screen.getAllByTestId('balance-paragraph')
@@ -32,16 +34,18 @@ test('Render account balance with ML', () => {
test('Render account balance with BTC', () => {
render(
-
,
)
const currantBalanceComponent = screen.getByTestId('current-balance')
const balanceParagraphs = screen.getAllByTestId('balance-paragraph')
@@ -57,16 +61,18 @@ test('Render account balance with BTC', () => {
test('renders balance with zero value when networkType is testnet', () => {
render(
-
,
)
const currantBalanceComponent = screen.getByTestId('current-balance')
diff --git a/src/components/composed/FeeField/FeeFieldML.js b/src/components/composed/FeeField/FeeFieldML.js
index 00579a4c..ff912cf6 100644
--- a/src/components/composed/FeeField/FeeFieldML.js
+++ b/src/components/composed/FeeField/FeeFieldML.js
@@ -1,19 +1,14 @@
-import React, {
- useContext,
-} from 'react'
+import React, { useContext } from 'react'
-import { NetworkContext } from '@Contexts'
+import { MintlayerContext } from '@Contexts'
import { Input } from '@BasicComponents'
import { OptionButtons } from '@ComposedComponents'
import './FeeField.css'
import { ML as MLHelpers } from '@Helpers'
-const FeeFieldML = ({
- value: parentValue,
- id,
-}) => {
- const { feerate } = useContext(NetworkContext)
+const FeeFieldML = ({ value: parentValue, id }) => {
+ const { feerate } = useContext(MintlayerContext)
const timeToFirstConfirmations = '~2 minutes'
const options = [{ name: 'norm', value: feerate }]
@@ -24,7 +19,11 @@ const FeeFieldML = ({
ML
diff --git a/src/components/composed/Header/Header.test.js b/src/components/composed/Header/Header.test.js
index 11fe8c7d..6ea93e0b 100644
--- a/src/components/composed/Header/Header.test.js
+++ b/src/components/composed/Header/Header.test.js
@@ -8,7 +8,7 @@ import {
useLocation,
} from 'react-router-dom'
-import { AccountProvider, SettingsProvider, NetworkProvider } from '@Contexts'
+import { AccountProvider, SettingsProvider, MintlayerProvider } from '@Contexts'
import Header from './Header'
const toggleNetworkType = jest.fn()
@@ -41,21 +41,21 @@ const setup = async (location) => {
await render(
-
-
-
-
-
-
+
+
+
+
+
+
,
)
diff --git a/src/components/composed/LockedBalanceList/LockedBalanceList.js b/src/components/composed/LockedBalanceList/LockedBalanceList.js
index c00b11ec..6f0c4234 100644
--- a/src/components/composed/LockedBalanceList/LockedBalanceList.js
+++ b/src/components/composed/LockedBalanceList/LockedBalanceList.js
@@ -1,5 +1,5 @@
import React, { useContext, useState, useEffect, useCallback } from 'react'
-import { NetworkContext } from '@Contexts'
+import { MintlayerContext } from '@Contexts'
import { Loading } from '@ComposedComponents'
import { Mintlayer } from '@APIs'
@@ -9,7 +9,7 @@ import './LockedBalanceList.css'
const LockedBalanceList = () => {
const { lockedUtxos, transactions, fetchingUtxos } =
- useContext(NetworkContext)
+ useContext(MintlayerContext)
const [loading, setLoading] = useState(false)
const [updatedUtxosList, setUpdatedUtxosList] = useState([])
diff --git a/src/components/composed/UpdateButton/UpdateButton.js b/src/components/composed/UpdateButton/UpdateButton.js
index 2582f536..fd8bfc94 100644
--- a/src/components/composed/UpdateButton/UpdateButton.js
+++ b/src/components/composed/UpdateButton/UpdateButton.js
@@ -4,26 +4,25 @@ import { Button } from '@BasicComponents'
import { ReactComponent as SuccessImg } from '@Assets/images/icon-success.svg'
import { ReactComponent as LoadingImg } from '@Assets/images/icon-loading.svg'
-import { NetworkContext } from '@Contexts'
+import { MintlayerContext, BitcoinContext } from '@Contexts'
import './UpdateButton.css'
-
const UpdateButton = () => {
- const { fetchAllData, fetchDelegations } =
- useContext(NetworkContext)
+ const { fetchAllData: fetchAllDataMintlayer, fetchDelegations } = useContext(MintlayerContext)
+ const { fetchAllData: fetchAllDataBitcoin } = useContext(BitcoinContext)
const [loading, setLoading] = useState(false)
const [showSuccess, setShowSuccess] = useState(false)
const handleClick = async () => {
try {
setLoading(true)
- await fetchAllData()
+ await fetchAllDataBitcoin()
+ await fetchAllDataMintlayer()
await fetchDelegations()
setLoading(false)
setShowSuccess(true)
- }
- catch (error) {
+ } catch (error) {
console.error(error)
setLoading(false)
}
@@ -43,9 +42,16 @@ const UpdateButton = () => {
alternate
extraStyleClasses={['update-button']}
>
- {loading &&
}
- {!loading && showSuccess &&
}
- {!loading && !showSuccess &&
}
+ {loading && (
+
+ )}
+ {!loading && showSuccess &&
}
+ {!loading && !showSuccess && (
+
+ )}
)
}
diff --git a/src/components/composed/UpdateButton/UpdateButton.test.js b/src/components/composed/UpdateButton/UpdateButton.test.js
index 33e0c1ee..14e6874f 100644
--- a/src/components/composed/UpdateButton/UpdateButton.test.js
+++ b/src/components/composed/UpdateButton/UpdateButton.test.js
@@ -1,7 +1,7 @@
import React from 'react'
import { render, fireEvent, waitFor, screen } from '@testing-library/react'
import UpdateButton from './UpdateButton'
-import { NetworkContext } from '@Contexts'
+import { MintlayerContext } from '@Contexts'
describe('UpdateButton', () => {
const mockFetchAllData = jest.fn()
@@ -14,9 +14,14 @@ describe('UpdateButton', () => {
it('should display the default loading icon initially', () => {
render(
-
+
+ ,
)
expect(screen.getByTestId('icon-loading-default')).toBeInTheDocument()
@@ -27,9 +32,14 @@ describe('UpdateButton', () => {
mockFetchDelegations.mockResolvedValueOnce()
render(
-
+
+ ,
)
fireEvent.click(screen.getByTestId('icon-loading-default'))
@@ -42,9 +52,14 @@ describe('UpdateButton', () => {
mockFetchDelegations.mockResolvedValueOnce()
render(
-
+
+ ,
)
fireEvent.click(screen.getByTestId('icon-loading-default'))
@@ -58,9 +73,14 @@ describe('UpdateButton', () => {
mockFetchDelegations.mockResolvedValueOnce()
render(
-
+
+ ,
)
fireEvent.click(screen.getByTestId('icon-loading-default'))
diff --git a/src/components/containers/Dashboard/CryptoList.js b/src/components/containers/Dashboard/CryptoList.js
index 21c171cb..34ea3ec0 100644
--- a/src/components/containers/Dashboard/CryptoList.js
+++ b/src/components/containers/Dashboard/CryptoList.js
@@ -3,7 +3,7 @@ import { ReactComponent as BtcLogo } from '@Assets/images/btc-logo.svg'
import { LogoRound, SkeletonLoader } from '@BasicComponents'
import { LineChart } from '@ComposedComponents'
import { AppInfo } from '@Constants'
-import { SettingsContext, NetworkContext } from '@Contexts'
+import { SettingsContext, MintlayerContext } from '@Contexts'
import './CryptoList.css'
import TokenLogoRound from '../../basic/TokenLogoRound/TokenLogoRound'
@@ -11,7 +11,7 @@ import TokenLogoRound from '../../basic/TokenLogoRound/TokenLogoRound'
export const CryptoItem = ({ colorList, onClickItem, item }) => {
const { networkType } = useContext(SettingsContext)
const fetchingBalances = item.fetchingBalances
- const { tokenBalances } = useContext(NetworkContext)
+ const { tokenBalances } = useContext(MintlayerContext)
const isTestnet = networkType === AppInfo.NETWORK_TYPES.TESTNET
const color = colorList[item.symbol.toLowerCase()]
const balance = item.balance
diff --git a/src/components/containers/Dashboard/CryptoList.test.js b/src/components/containers/Dashboard/CryptoList.test.js
index 9cf7a023..c079ae1a 100644
--- a/src/components/containers/Dashboard/CryptoList.test.js
+++ b/src/components/containers/Dashboard/CryptoList.test.js
@@ -1,6 +1,6 @@
import React from 'react'
import { render, fireEvent, screen } from '@testing-library/react'
-import { SettingsContext, NetworkContext } from '@Contexts'
+import { SettingsContext, MintlayerContext } from '@Contexts'
import { CryptoItem, ConnectItem } from './CryptoList'
import CryptoList from './CryptoList'
@@ -27,16 +27,17 @@ describe('CryptoItem', () => {
const renderComponent = (networkType, balanceLoading = false) =>
render(
-
-
-
-
- ,
+
+
+
+ ,
)
it('renders the crypto item correctly', () => {
@@ -64,16 +65,17 @@ describe('CryptoItem', () => {
}
render(
-
-
-
-
- ,
+
+
+
+ ,
)
expect(screen.getByTestId('logo-round')).toBeInTheDocument()
@@ -113,15 +115,16 @@ describe('ConnectItem', () => {
const renderComponent = (networkType) =>
render(
-
-
-
-
- ,
+
+
+
+ ,
)
it('renders the connect item correctly', () => {
@@ -139,15 +142,16 @@ describe('ConnectItem', () => {
}
render(
-
-
-
-
- ,
+
+
+
+ ,
)
expect(screen.getByTestId('logo-round')).toBeInTheDocument()
@@ -170,15 +174,16 @@ describe('ConnectItem', () => {
}
render(
-
-
-
-
- ,
+
+
+
+ ,
)
expect(screen.getByText('Add wallet')).toBeInTheDocument()
@@ -242,17 +247,18 @@ describe('CryptoList', () => {
const renderEmptyComponent = (networkType) =>
render(
-
-
-
-
- ,
+
+
+
+ ,
)
//TDOO: enable this test when mainnet is ready
diff --git a/src/components/containers/Dashboard/CryptoSharesChart.js b/src/components/containers/Dashboard/CryptoSharesChart.js
index 74a6fcc8..ff81313d 100644
--- a/src/components/containers/Dashboard/CryptoSharesChart.js
+++ b/src/components/containers/Dashboard/CryptoSharesChart.js
@@ -1,7 +1,7 @@
import { useContext } from 'react'
import { ArcChart } from '@ComposedComponents'
import { Format } from '@Helpers'
-import { NetworkContext, SettingsContext } from '@Contexts'
+import { MintlayerContext, SettingsContext } from '@Contexts'
import { AppInfo } from '@Constants'
import './CryptoSharesChart.css'
@@ -14,7 +14,7 @@ const CryptoSharesChart = ({
colorList,
}) => {
const { networkType } = useContext(SettingsContext)
- const { balanceLoading } = useContext(NetworkContext)
+ const { balanceLoading } = useContext(MintlayerContext)
const totalBalanceInFiat =
networkType === AppInfo.NETWORK_TYPES.TESTNET
? '0'
@@ -41,7 +41,8 @@ const CryptoSharesChart = ({
''
) : (
<>
- {totalBalanceInFiat}
{fiatSymbol}
+ {totalBalanceInFiat}
+
{fiatSymbol}
)}
{accountName}
diff --git a/src/components/containers/SendTransaction/SendTransaction.js b/src/components/containers/SendTransaction/SendTransaction.js
index 68f0f8e0..8202e07b 100644
--- a/src/components/containers/SendTransaction/SendTransaction.js
+++ b/src/components/containers/SendTransaction/SendTransaction.js
@@ -4,7 +4,7 @@ import { Button } from '@BasicComponents'
import { Loading, PopUp, TextField } from '@ComposedComponents'
import { CenteredLayout, VerticalGroup } from '@LayoutComponents'
import { BTC, Format, NumbersHelper } from '@Helpers'
-import { AccountContext, NetworkContext, TransactionContext } from '@Contexts'
+import { AccountContext, MintlayerContext, TransactionContext } from '@Contexts'
import { AppInfo } from '@Constants'
import SendTransactionConfirmation from './SendTransactionConfirmation'
@@ -57,10 +57,14 @@ const SendTransaction = ({
const [pass, setPass] = useState(null)
const [poolData, setPoolData] = useState(null)
const isBitcoinWallet = walletType.name === 'Bitcoin'
- const NC = useContext(NetworkContext)
+ const NC = useContext(MintlayerContext)
useEffect(() => {
- if (transactionMode === AppInfo.ML_TRANSACTION_MODES.DELEGATION && NC && addressTo) {
+ if (
+ transactionMode === AppInfo.ML_TRANSACTION_MODES.DELEGATION &&
+ NC &&
+ addressTo
+ ) {
const fetchPoolData = async () => {
const poolData = await NC.getPoolsData([addressTo])
setPoolData(poolData)
diff --git a/src/components/containers/SendTransaction/SendTransaction.test.js b/src/components/containers/SendTransaction/SendTransaction.test.js
index 9839e72b..4da672cf 100644
--- a/src/components/containers/SendTransaction/SendTransaction.test.js
+++ b/src/components/containers/SendTransaction/SendTransaction.test.js
@@ -3,7 +3,8 @@ import { render, screen, act, fireEvent } from '@testing-library/react'
import SendTransaction from './SendTransaction'
import {
- AccountProvider, NetworkContext,
+ AccountProvider,
+ MintlayerContext,
SettingsProvider,
TransactionProvider,
} from '@Contexts'
@@ -21,14 +22,14 @@ test('Send Transaction', async () => {
-
+
{}}
calculateTotalFee={() => {}}
walletType={{ name: 'Mintlayer' }}
/>
-
+
,
diff --git a/src/components/containers/Settings/SettingsAPI/SettingsAPIItem.css b/src/components/containers/Settings/SettingsAPI/SettingsAPIItem.css
index df698f32..2acafb19 100644
--- a/src/components/containers/Settings/SettingsAPI/SettingsAPIItem.css
+++ b/src/components/containers/Settings/SettingsAPI/SettingsAPIItem.css
@@ -33,4 +33,8 @@
.api-input {
padding: 1rem 1rem;
+}
+
+.success-api-icon path {
+ fill: #fff;
}
\ No newline at end of file
diff --git a/src/components/containers/Settings/SettingsAPI/SettingsAPIItem.js b/src/components/containers/Settings/SettingsAPI/SettingsAPIItem.js
index dab4f69d..333bed4f 100644
--- a/src/components/containers/Settings/SettingsAPI/SettingsAPIItem.js
+++ b/src/components/containers/Settings/SettingsAPI/SettingsAPIItem.js
@@ -1,7 +1,8 @@
-import { useState } from 'react'
+import { useState, useEffect } from 'react'
import { Button } from '@BasicComponents'
import { TextField } from '@ComposedComponents'
+import { ReactComponent as SuccessImg } from '@Assets/images/icon-success.svg'
import { StringHelpers } from '@Helpers'
@@ -20,6 +21,8 @@ const SettingsApiItem = ({
const [fieldValidity, setFieldValidity] = useState(false)
const [fieldPristinity, setFieldPristinity] = useState(true)
+ const [showSubmitFeedback, setShowSubmitFeedback] = useState(false)
+ const [showResetFeedback, setShowResetFeedback] = useState(false)
const checkFieldValidity = (fieldValidity) => {
const regex = /^https?:\/\/.{3,}\..+$/m
@@ -35,13 +38,29 @@ const SettingsApiItem = ({
const onSubmit = (data) => {
setFieldPristinity(false)
onSubmitClick(data)
+ setShowSubmitFeedback(true)
}
const onReset = (data) => {
setFieldPristinity(true)
onResetClick(data)
+ setShowResetFeedback(true)
}
+ useEffect(() => {
+ if (showSubmitFeedback) {
+ setTimeout(() => {
+ setShowSubmitFeedback(false)
+ }, 2000)
+ }
+ if (showResetFeedback) {
+ setTimeout(() => {
+ setShowResetFeedback(false)
+ }, 2000)
+ }
+ }
+ , [showSubmitFeedback, showResetFeedback])
+
const label = `${StringHelpers.capitalizeFirstLetter(walletData.wallet)} ${walletData.networkType} server`
return (
@@ -71,7 +90,11 @@ const SettingsApiItem = ({
extraStyleClasses={submitButtonExtraClasses}
disabled={!fieldValidity}
>
- Submit
+ {showSubmitFeedback ? (
+
@@ -83,7 +106,11 @@ const SettingsApiItem = ({
}
extraStyleClasses={resetButtonExtraClasses}
>
- Reset
+ {showResetFeedback ? (
+