diff --git a/web/cashtab/src/components/App.js b/web/cashtab/src/components/App.js --- a/web/cashtab/src/components/App.js +++ b/web/cashtab/src/components/App.js @@ -1,5 +1,7 @@ import React from 'react'; import 'antd/dist/antd.less'; +import { Spin } from 'antd'; +import { CashLoadingIcon } from '@components/Common/CustomIcons'; import '../index.css'; import styled, { ThemeProvider, createGlobalStyle } from 'styled-components'; import { theme } from '@assets/styles/theme'; @@ -201,7 +203,7 @@ const App = () => { const ContextValue = React.useContext(WalletContext); - const { wallet, tokens } = ContextValue; + const { wallet, loading, tokens } = ContextValue; const hasTab = checkForTokenById( tokens, @@ -215,84 +217,86 @@ return ( - - - - - - {hasTab && ( - - )} - - - - - - - - - - - - - - - - ( - + + + + + + + {hasTab && ( + )} - /> - - - - - - - - {wallet ? ( - + ) : null} + + + ); }; diff --git a/web/cashtab/src/components/Configure/Configure.js b/web/cashtab/src/components/Configure/Configure.js --- a/web/cashtab/src/components/Configure/Configure.js +++ b/web/cashtab/src/components/Configure/Configure.js @@ -1,7 +1,7 @@ /* eslint-disable react-hooks/exhaustive-deps */ import React, { useState, useEffect } from 'react'; import styled from 'styled-components'; -import { Collapse, Form, Input, Modal, Spin, Alert } from 'antd'; +import { Collapse, Form, Input, Modal, Alert } from 'antd'; import { PlusSquareOutlined, WalletFilled, @@ -20,7 +20,6 @@ } from '@components/Common/PrimaryButton'; import { CashLoader, - CashLoadingIcon, ThemedCopyOutlined, ThemedWalletOutlined, ThemedDollarOutlined, @@ -167,7 +166,7 @@ const Configure = () => { const ContextValue = React.useContext(WalletContext); - const { wallet, loading, apiError } = ContextValue; + const { wallet, apiError } = ContextValue; const { addNewSavedWallet, @@ -381,242 +380,230 @@ }; return ( - - - {walletToBeRenamed !== null && ( - cancelRenameWallet()} - > - -
- - } - placeholder="Enter new wallet name" - name="newName" - value={newWalletName} - onChange={e => handleWalletNameInput(e)} - /> - -
-
-
- )} - {walletToBeDeleted !== null && ( - cancelDeleteWallet()} - > - -
- - } - placeholder={`Type "delete ${walletToBeDeleted.name}" to confirm`} - name="walletToBeDeletedInput" - value={confirmationOfWalletToBeDeleted} - onChange={e => - handleWalletToDeleteInput(e) + + {walletToBeRenamed !== null && ( + cancelRenameWallet()} + > + + + + } + placeholder="Enter new wallet name" + name="newName" + value={newWalletName} + onChange={e => handleWalletNameInput(e)} + /> + + + + + )} + {walletToBeDeleted !== null && ( + cancelDeleteWallet()} + > + +
+ + } + placeholder={`Type "delete ${walletToBeDeleted.name}" to confirm`} + name="walletToBeDeletedInput" + value={confirmationOfWalletToBeDeleted} + onChange={e => handleWalletToDeleteInput(e)} + /> + +
+
+
+ )} +

+ Backup your wallet +

+ + {wallet && wallet.mnemonic && ( + + +

+ {wallet && wallet.mnemonic ? wallet.mnemonic : ''} +

+
+
+ )} + +

+ Manage Wallets +

+ {apiError ? ( + <> + +

+ An error occured on our end. Reconnecting... +

+ + ) : ( + <> + updateSavedWalletsOnCreate()}> + New Wallet + + openSeedInput(!seedInput)}> + Import Wallet + + {seedInput && ( + <> +

+ Copy and paste your mnemonic seed phrase below + to import an existing wallet +

+ +
+ - -
-
-
- )} -

- Backup your wallet -

- - {wallet && wallet.mnemonic && ( + help={ + isValidMnemonic === null || + isValidMnemonic + ? '' + : 'Valid mnemonic seed phrase required' + } + > + } + type="email" + placeholder="mnemonic (seed phrase)" + name="mnemonic" + autoComplete="off" + onChange={e => handleChange(e)} + required + /> + + submit()} + > + Import + + + + + )} + + )} + {savedWallets && savedWallets.length > 0 && ( + <> - -

- {wallet && wallet.mnemonic - ? wallet.mnemonic - : ''} -

+ + +

{wallet.name}

+

Currently active

+
+
+ {savedWallets.map(sw => ( + + +

{sw.name}

+
+ + + + showPopulatedRenameWalletModal( + sw, + ) + } + /> + + showPopulatedDeleteWalletModal( + sw, + ) + } + /> + + +
+ ))} +
- )} - -

- Manage Wallets -

- {apiError ? ( - <> - -

- An error occured on our end. Reconnecting... -

- - ) : ( - <> - updateSavedWalletsOnCreate()} - > - New Wallet - - openSeedInput(!seedInput)} - > - Import Wallet - - {seedInput && ( - <> -

- Copy and paste your mnemonic seed phrase - below to import an existing wallet -

- -
- - } - type="email" - placeholder="mnemonic (seed phrase)" - name="mnemonic" - autoComplete="off" - onChange={e => handleChange(e)} - required - /> - - submit()} - > - Import - -
-
- - )} - - )} - {savedWallets && savedWallets.length > 0 && ( - <> - - - -

{wallet.name}

-

Currently active

-
-
- {savedWallets.map(sw => ( - - -

{sw.name}

-
- - - - showPopulatedRenameWalletModal( - sw, - ) - } - /> - - showPopulatedDeleteWalletModal( - sw, - ) - } - /> - - -
- ))} -
-
-
- - )} - -

- Fiat Currency -

- - - changeCashtabSettings('fiatCurrency', fiatCode) - } - /> - - [ - - Documentation - - ] -
-
+ + )} + +

+ Fiat Currency +

+ + + changeCashtabSettings('fiatCurrency', fiatCode) + } + /> + + [ + + Documentation + + ] + ); }; diff --git a/web/cashtab/src/components/Configure/__tests__/__snapshots__/Configure.test.js.snap b/web/cashtab/src/components/Configure/__tests__/__snapshots__/Configure.test.js.snap --- a/web/cashtab/src/components/Configure/__tests__/__snapshots__/Configure.test.js.snap +++ b/web/cashtab/src/components/Configure/__tests__/__snapshots__/Configure.test.js.snap @@ -2,79 +2,98 @@ exports[`Configure with a wallet 1`] = `
-
+

+ + + + Backup your wallet +

+
+ + +
- +
- - + Your seed phrase is the only way to restore your wallet. Write it down. Keep it safe. +
-

- - - - Backup your wallet -

-
-
-
- Your seed phrase is the only way to restore your wallet. Write it down. Keep it safe. -
-
+ Click to reveal seed phrase
-
+
+
+

+ +
-
- - - - Click to reveal seed phrase -
-
-

+ + + + Manage Wallets + + + +
+

+ + + + Fiat Currency +

+
+
-

- - - - Manage Wallets -

- - -
-

+

+ - Fiat Currency - -
-
-
- - - - - US Dollar ($) - -
- - - - - -
-
-
+ `; exports[`Configure without a wallet 1`] = `
-
+

+ + + + Backup your wallet +

+
+ + +
- +
- - + Your seed phrase is the only way to restore your wallet. Write it down. Keep it safe. +
+

+ + + + Manage Wallets +

+ + +
+

+ + + + Fiat Currency +

+
-

- - - - Backup your wallet -

- - -
-
-
- Your seed phrase is the only way to restore your wallet. Write it down. Keep it safe. -
-
-
-
-

- - - Manage Wallets -

- - -
-

- - Fiat Currency -

-
-
-
- - - - - US Dollar ($) - -
- - - - - -
-
-
+ `; diff --git a/web/cashtab/src/components/Wallet/Wallet.js b/web/cashtab/src/components/Wallet/Wallet.js --- a/web/cashtab/src/components/Wallet/Wallet.js +++ b/web/cashtab/src/components/Wallet/Wallet.js @@ -388,9 +388,7 @@ return ( <> {loading ? ( - - - + ) : ( <>{wallet.Path1899 ? : } )}