diff --git a/packages/extension/src/ui/features/accounts/AccountListScreen.tsx b/packages/extension/src/ui/features/accounts/AccountListScreen.tsx
index 103eb548..f2520748 100644
--- a/packages/extension/src/ui/features/accounts/AccountListScreen.tsx
+++ b/packages/extension/src/ui/features/accounts/AccountListScreen.tsx
@@ -6,13 +6,12 @@ import {
} from "@argent/ui"
import { Flex } from "@chakra-ui/react"
import { partition } from "lodash-es"
-import { FC, useCallback, useEffect, useState } from "react"
+import { FC, useCallback } from "react"
import { useNavigate } from "react-router-dom"
import styled from "styled-components"
import { useReturnTo } from "../../routes"
import { P } from "../../theme/Typography"
-import { LoadingScreen } from "../actions/LoadingScreen"
import { useCurrentNetwork } from "../networks/useNetworks"
import { useBackupRequired } from "../recovery/backupDownload.state"
import { recover } from "../recovery/recovery.service"
@@ -25,7 +24,6 @@ import {
} from "./accounts.state"
import { HiddenAccountsBar } from "./HiddenAccountsBar"
import { routes } from "../../routes"
-import { discoverAccounts } from "../../services/backgroundAccounts"
const { AddIcon } = icons
@@ -36,7 +34,6 @@ const Paragraph = styled(P)`
export const AccountListScreen: FC = () => {
const navigate = useNavigate()
const returnTo = useReturnTo()
- const [accountsDiscovered, setAcccountsDiscovered] = useState(false)
const selectedAccount = useSelectedAccount()
const allAccounts = useAccounts({ showHidden: true })
const [hiddenAccounts, visibleAccounts] = partition(
@@ -45,7 +42,6 @@ export const AccountListScreen: FC = () => {
)
const { isBackupRequired } = useBackupRequired()
const currentNetwork = useCurrentNetwork()
-
const hasHiddenAccounts = hiddenAccounts.length > 0
const onClose = useCallback(async () => {
@@ -56,21 +52,6 @@ export const AccountListScreen: FC = () => {
}
}, [navigate, returnTo])
- useEffect(() => {
- if (allAccounts.length === 0) {
- discoverAccounts(currentNetwork.id)
- .then(() => setAcccountsDiscovered(true))
- .catch((e) => {
- console.error(e)
- setAcccountsDiscovered(true)
- })
- }
- }, [currentNetwork])
-
- if (allAccounts.length === 0 && !accountsDiscovered) {
- return
- }
-
return (
<>
void
- isDeploying?: boolean
}
export const AccountScreenEmpty: FC = ({
onAddAccount,
- isDeploying,
}) => {
const currentNetwork = useCurrentNetwork()
- const [accountsDiscovered, setAcccountsDiscovered] = useState(false)
+ const [discoveringAccount, setDiscoveringAccount] = useState(false)
+ const [accountDiscoveryFinished, setAccountDiscoveryFinished] = useState(false)
const allAccounts = useAccounts({ showHidden: true })
const [hiddenAccounts, visibleAccounts] = partition(
allAccounts,
@@ -30,24 +30,31 @@ export const AccountScreenEmpty: FC = ({
)
const hasVisibleAccounts = visibleAccounts.length > 0
const hasHiddenAccounts = hiddenAccounts.length > 0
+
+ const onDiscoverAccounts = () => {
+ setDiscoveringAccount(true)
+ discoverAccounts(currentNetwork.id)
+ .then(() => {
+ setDiscoveringAccount(false)
+ setAccountDiscoveryFinished(true)
+ })
+ .catch((e) => {
+ console.error(e)
+ setDiscoveringAccount(false)
+ })
+ }
+
useEffect(() => {
/** User made some account visible then returned to this screen */
if (hasVisibleAccounts) {
autoSelectAccountOnNetwork(currentNetwork.id)
}
+ }, [currentNetwork.id, hasVisibleAccounts, accountDiscoveryFinished])
- if (allAccounts.length === 0) {
- discoverAccounts(currentNetwork.id)
- .then(() => setAcccountsDiscovered(true))
- .catch((e) => {
- console.error(e)
- setAcccountsDiscovered(true)
- })
- }
- }, [currentNetwork.id, hasVisibleAccounts])
-
- if (allAccounts.length === 0 && !accountsDiscovered) {
+ if (allAccounts.length === 0 && discoveringAccount) {
return
+ } else if (allAccounts.length > 0) {
+ return
}
return (
@@ -59,14 +66,36 @@ export const AccountScreenEmpty: FC = ({
}`}
>
}
onClick={onAddAccount}
- isLoading={isDeploying}
- isDisabled={isDeploying}
loadingText={"Creating"}
>
- Create account
+ New account
+ {
+ accountDiscoveryFinished ? (
+ <>
+ No active accounts found
+ >
+ ) :
+ (<>
+ or
+ }
+ onClick={onDiscoverAccounts}
+ loadingText={"Discovering"}
+ >
+ Discover accounts
+
+ >
+ )
+ }
{hasHiddenAccounts && }
>
diff --git a/packages/extension/src/ui/features/recovery/recovery.service.ts b/packages/extension/src/ui/features/recovery/recovery.service.ts
index 21108bd7..9d762978 100644
--- a/packages/extension/src/ui/features/recovery/recovery.service.ts
+++ b/packages/extension/src/ui/features/recovery/recovery.service.ts
@@ -13,13 +13,11 @@ import { mapWalletAccountsToAccounts } from "../accounts/accounts.state"
interface RecoveryOptions {
networkId?: string
- showAccountList?: boolean
showHiddenAccountList?: boolean
}
export const recover = async ({
networkId,
- showAccountList,
showHiddenAccountList,
}: RecoveryOptions = {}) => {
try {
@@ -43,10 +41,6 @@ export const recover = async ({
await selectAccount(selectedAccount)
useAppState.setState({ switcherNetworkId: networkId })
- if (showAccountList || !selectedAccount) {
- return routes.accounts()
- }
-
if (showHiddenAccountList && networkId) {
return routes.accountsHidden(networkId)
}
diff --git a/packages/ui/src/components/Empty.tsx b/packages/ui/src/components/Empty.tsx
index 2e3ada13..72be6787 100644
--- a/packages/ui/src/components/Empty.tsx
+++ b/packages/ui/src/components/Empty.tsx
@@ -30,5 +30,10 @@ export const Empty: FC = ({
)
export const EmptyButton: FC> = (props) => (
-
+
)