Fix account creation when connecting dapp

alephium · Jan 24, 2024 · be3443a · be3443a
1 parent 3f07ee1
commit be3443a
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 15 deletions.
diff --git a/packages/extension/src/shared/storage/hooks.ts b/packages/extension/src/shared/storage/hooks.ts
@@ -90,6 +90,5 @@ export function useArrayStorage<T>(
     return () => sub()
   }, [selector, storage, set])
 
-  const filteredValue = useMemo(() => value.filter(selector), [value, selector])
-  return filteredValue
+  return useMemo(() => value.filter(selector), [value, selector])
 }
diff --git a/packages/extension/src/ui/features/accounts/accounts.state.ts b/packages/extension/src/ui/features/accounts/accounts.state.ts
@@ -66,17 +66,11 @@ export const useAccountsOnNetwork = ({
 }) => {
   const accounts = useArrayStorage(accountStore)
 
-  const filteredAccounts = useMemo(
-    () =>
-      accounts
-        .filter(getNetworkSelector(networkId))
-        .filter(showHidden ? withHiddenSelector : withoutHiddenSelector),
-    [accounts, networkId, showHidden],
-  )
+  const filteredAccounts = accounts
+    .filter(getNetworkSelector(networkId))
+    .filter(showHidden ? withHiddenSelector : withoutHiddenSelector)
 
-  return useMemo(() => {
-    return mapWalletAccountsToAccounts(filteredAccounts)
-  }, [filteredAccounts])
+  return mapWalletAccountsToAccounts(filteredAccounts)
 }
 
 export const useAccount = (

diff --git a/packages/extension/src/ui/features/actions/connectDapp/ConnectDappScreen.tsx b/packages/extension/src/ui/features/actions/connectDapp/ConnectDappScreen.tsx
@@ -1,7 +1,7 @@
 import { KeyType } from "@alephium/web3"
 import { Flex } from "@chakra-ui/react"
 import { L2 } from "@argent/ui"
-import { FC, useCallback, useEffect, useMemo, useState } from "react"
+import { FC, useCallback, useMemo, useState } from "react"
 import styled from "styled-components"
 
 import {
@@ -20,7 +20,7 @@ import {
   getDefaultAccountNameByIndex,
   useAccountMetadata,
 } from "../../accounts/accountMetadata.state"
-import { useAccounts, useAccountsOnNetwork, useSelectedAccount } from "../../accounts/accounts.state"
+import { useAccountsOnNetwork, useSelectedAccount } from "../../accounts/accounts.state"
 import { AccountSelect } from "../../accounts/AccountSelect"
 import { useCurrentNetwork } from "../../networks/useNetworks"
 import {
@@ -219,11 +219,13 @@ export const ConnectDappScreen: FC<ConnectDappProps> = ({
   }
 
   const currentNetwork = useCurrentNetwork()
-  const visibleAccounts = useAccountsOnNetwork({
+  const initialVisibleAccounts = useAccountsOnNetwork({
     networkId: networkId || currentNetwork.id,
     showHidden: false
   })
 
+  const [visibleAccounts, setVisibleAccounts] = useState<Account[]>(initialVisibleAccounts)
+
   const visibleAccountsForGroup = (group === undefined && keyType === undefined) ? visibleAccounts : visibleAccounts.filter((account) => {
     return Wallet.checkAccount(account, networkId, keyType, group)
   })
@@ -256,6 +258,7 @@ export const ConnectDappScreen: FC<ConnectDappProps> = ({
     const walletAccounts = accountsOnNetwork(allAccounts, selectedNetworkId)
     const accountIndex = walletAccounts.length
     const account = await createAccount(selectedNetworkId, keyType ?? 'default', undefined, group)
+    setVisibleAccounts([account])
     setAccountName(account.networkId, account.address, getDefaultAccountNameByIndex(account, accountIndex))
     setConnectedAccount(account)
   }, [keyType, networkId, group, switcherNetworkId, setAccountName])