diff --git a/apps/wallet/src/ui/app/pages/accounts/manage/AccountGroup.tsx b/apps/wallet/src/ui/app/pages/accounts/manage/AccountGroup.tsx index 3a481c121c6..5bba5dd2486 100644 --- a/apps/wallet/src/ui/app/pages/accounts/manage/AccountGroup.tsx +++ b/apps/wallet/src/ui/app/pages/accounts/manage/AccountGroup.tsx @@ -56,6 +56,7 @@ export function AccountGroup({ }) { const [isDropdownOpen, setDropdownOpen] = useState(false); const [isCollapsibleGroupOpen, setIsCollapsibleGroupOpen] = useState(true); + const [expandedWalletNames, setExpandedWalletNames] = useState | null>(null); const navigate = useNavigate(); const activeAccount = useActiveAccount(); const createAccountsMutation = useCreateAccountsMutation(); @@ -81,9 +82,25 @@ export function AccountGroup({ sourceID: accountSource.id, }); setSourceFlow(AmpliSourceFlow.ManageAccounts); - createAccountsMutation.mutate({ - type: accountsFormType, - }); + try { + const accountCreationResult = await createAccountsMutation.mutateAsync({ + type: accountsFormType, + }); + const newAccount = accountCreationResult?.[0]; + if ( + newAccount && + (isMnemonicSerializedUiAccount(newAccount) || isSeedSerializedUiAccount(newAccount)) + ) { + const { accountIndex } = parseDerivationPath(newAccount.derivationPath); + const newWalletName = `Wallet ${accountIndex + 1}`; + setExpandedWalletNames( + (prev) => + new Set([...(prev ?? accountGroupsByIndex.map(([n]) => n)), newWalletName]), + ); + } + } catch { + // errors are already handled by the mutation + } } function getUrlForLedgerDerivedAccounts(url: string) { @@ -151,6 +168,8 @@ export function AccountGroup({ ); } + const accountGroupsByIndex = Object.entries(groupAccountsByAccountIndex(accounts)); + return (
{hasLegacyAccount ? (
- {Object.entries(groupAccountsByAccountIndex(accounts)).map( - ([walletName, walletAccounts], index) => ( - ( -
-
- From {walletName} -
- - + {accountGroupsByIndex.map(([walletName, walletAccounts]) => ( + + setExpandedWalletNames((prev) => { + const accountGroupSet: Set = + prev === null + ? new Set(accountGroupsByIndex.map(([n]) => n)) + : new Set(prev); + if (isOpen) accountGroupSet.add(walletName); + else accountGroupSet.delete(walletName); + return accountGroupSet; + }) + } + hideArrow + hideBorder + render={({ isOpen }) => ( +
+
+ From {walletName}
- )} - > - {walletAccounts.map((account, index) => ( - + - ))} - - ), - )} +
+ )} + > + {walletAccounts.map((account, index) => ( + + ))} +
+ ))}
) : ( accounts.map((account, index) => (