feat: handle implicit account not yet propagated to accounts legder

packages/desktop/views/dashboard/wallet/views/ImplicitAccountCreationView.svelte

@@ -26,18 +26,29 @@
         $dashboardRouter.goTo(DashboardRoute.AccountManagement)
     }
 
-    // TODO: Update this when we have enough mana to route to the next step
     $: {
         if (outputId === undefined) {
             if ($selectedWallet?.implicitAccountOutputs?.length === 1) {
-                $implicitAccountCreationRoute = ImplicitAccountCreationRoute.FundConfirmation
+                const outputId = $selectedWallet?.implicitAccountOutputs[0]?.outputId
+                if ($selectedWallet?.hasEnoughManaToCreateExplicitAccount?.[outputId]) {
+                    $implicitAccountCreationRoute = ImplicitAccountCreationRoute.AccountCreation
+                } else {
+                    $implicitAccountCreationRoute = ImplicitAccountCreationRoute.FundConfirmation
+                }
             } else if ($selectedWallet?.implicitAccountOutputs?.length >= 2) {
                 handleMultipleAccounts()
-            } else if ($selectedWallet?.implicitAccountOutputs?.length === 0) {
+            } else if (
+                $selectedWallet?.implicitAccountOutputs?.length === 0 &&
+                !$selectedWallet?.isImplicitAccountCreationStarted
+            ) {
                 $implicitAccountCreationRoute = ImplicitAccountCreationRoute.Init
             }
         } else {
-            $implicitAccountCreationRoute = ImplicitAccountCreationRoute.FundConfirmation
+            if ($selectedWallet?.hasEnoughManaToCreateExplicitAccount?.[outputId]) {
+                $implicitAccountCreationRoute = ImplicitAccountCreationRoute.AccountCreation
+            } else {
+                $implicitAccountCreationRoute = ImplicitAccountCreationRoute.FundConfirmation
+            }
         }
 
         if ($selectedWallet?.hasImplicitAccountCreationTransactionInProgress && $selectedWallet?.isTransferring) {

packages/desktop/views/dashboard/wallet/views/implicit-account-creation-multistep/FundConfirmationView.svelte

@@ -8,33 +8,44 @@
         getPassiveManaForOutput,
         DEFAULT_SECONDS_PER_SLOT,
     } from '@core/network'
-    import { activeProfile } from '@core/profile'
+    import { activeProfile, updateActiveWallet } from '@core/profile'
     import { implicitAccountCreationRouter } from '@core/router'
     import { MILLISECONDS_PER_SECOND, SECONDS_PER_MINUTE, getBestTimeDuration } from '@core/utils'
     import { IWalletState, formatTokenAmountBestMatch, selectedWallet, selectedWalletAssets } from '@core/wallet'
     import { OutputData } from '@iota/sdk/out/types'
-    import { Button, FontWeight, KeyValueBox, Text, TextType, TextHint, TextHintVariant, CopyableBox } from '@ui'
+    import {
+        Button,
+        FontWeight,
+        KeyValueBox,
+        Text,
+        TextType,
+        TextHint,
+        TextHintVariant,
+        CopyableBox,
+        Spinner,
+    } from '@ui'
     import { onDestroy, onMount } from 'svelte'
 
     export let outputId: string | undefined
 
     const LOW_MANA_GENERATION_SECONDS = 10 * SECONDS_PER_MINUTE
+    const transactionInfo: ITransactionInfoToCalculateManaCost = {}
 
     let walletAddress: string = ''
-    const transactionInfo: ITransactionInfoToCalculateManaCost = {}
     let hasEnoughMana = false
     let isLowManaGeneration = false
+    let isCongestionNotFound: boolean | null = null
+    let seconds: number = 10
+    let countdownInterval: NodeJS.Timeout
+    let timeRemaining: string
+    let totalAvailableMana: number
+    let formattedSelectedOutputBalance: string
 
     $: baseCoin = $selectedWalletAssets?.[$activeProfile?.network?.id]?.baseCoin
-
     $: selectedOutput = getSelectedOutput($selectedWallet, outputId)
-
-    let totalAvailableMana: number
     $: $selectedWallet, (totalAvailableMana = getTotalAvailableMana()), prepareTransaction(selectedOutput?.outputId)
-
-    let formattedSelectedOutputBlance: string
     $: selectedOutput,
-        (formattedSelectedOutputBlance = baseCoin
+        (formattedSelectedOutputBalance = baseCoin
             ? formatTokenAmountBestMatch(Number(selectedOutput?.output.amount), baseCoin.metadata)
             : '-')
     $: formattedWalletBalance =
@@ -44,6 +55,12 @@
     $: formattedManaBalance = totalAvailableMana
         ? formatTokenAmountBestMatch(Number(totalAvailableMana), DEFAULT_MANA)
         : '-'
+    $: timeRemaining = `${getBestTimeDuration(seconds * MILLISECONDS_PER_SECOND)} remaining`
+    $: async () => {
+        await prepareTransaction(selectedOutput.outputId)
+    }
+
+    $: if (isCongestionNotFound === false) startCountdown()
 
     function getSelectedOutput(_selectedWallet: IWalletState, _outputId: string | undefined): OutputData | undefined {
         return (
@@ -75,37 +92,51 @@
     async function prepareTransaction(outputId: string): Promise<void> {
         if (!outputId) return
         try {
-            transactionInfo.preparedTransaction = await $selectedWallet?.prepareImplicitAccountTransition(outputId)
+            if ($selectedWallet) {
+                transactionInfo.preparedTransaction = await $selectedWallet.prepareImplicitAccountTransition(outputId)
+                updateActiveWallet($selectedWallet.id, {
+                    hasEnoughManaToCreateExplicitAccount: { [outputId]: true },
+                })
+            }
+            isCongestionNotFound = false
             seconds = 0 // If we don't get an error, it's because we can follow on to the next step
         } catch (error) {
-            console.error(error.message)
+            if (error.message?.includes('congestion was not found')) {
+                isCongestionNotFound = true
+                await $selectedWallet
+                    ?.prepareImplicitAccountTransition(outputId)
+                    .then(() => {
+                        isCongestionNotFound = false
+                    })
+                    .catch((error) => {
+                        console.error(error)
+                    })
+            }
             if (error.message?.includes('slots remaining until enough mana')) {
                 transactionInfo.preparedTransactionError = error.message
                 const slotsRemaining = Number(error.message?.split(' ').reverse()[0].replace('`', ''))
                 seconds = slotsRemaining * DEFAULT_SECONDS_PER_SLOT
                 isLowManaGeneration = seconds >= LOW_MANA_GENERATION_SECONDS
+                isCongestionNotFound = false
             }
         }
     }
 
-    // ----------------------------------------------------------------
-    let seconds: number = 10
-    let countdownInterval: NodeJS.Timeout
-    let timeRemaining: string
-
-    $: timeRemaining = `${getBestTimeDuration(seconds * MILLISECONDS_PER_SECOND)} remaining`
+    function startCountdown(): void {
+        if (countdownInterval) clearInterval(countdownInterval)
 
-    onMount(async () => {
-        $selectedWallet?.address().then((address) => (walletAddress = address))
-        await prepareTransaction(selectedOutput.outputId)
-        if (seconds === 0) onTimeout()
         countdownInterval = setInterval(() => {
             seconds -= 1
             if (seconds <= 0) {
                 clearInterval(countdownInterval)
                 onTimeout()
             }
         }, MILLISECONDS_PER_SECOND)
+    }
+
+    onMount(() => {
+        $selectedWallet?.address().then((address) => (walletAddress = address))
+        if (seconds === 0) onTimeout()
     })
 
     onDestroy(() => {
@@ -115,7 +146,6 @@
     const onTimeout = (): void => {
         $implicitAccountCreationRouter.next()
     }
-    // ----------------------------------------------------------------
 </script>
 
 <step-content class={`flex flex-col items-center justify-between h-full ${isLowManaGeneration ? 'pt-8' : 'pt-20'}`}>
@@ -135,24 +165,35 @@
                 fontWeight={FontWeight.semibold}
                 >{localize('views.implicit-account-creation.steps.step2.view.subtitle')}</Text
             >
-            <Text type={TextType.h5} fontWeight={FontWeight.normal} color="gray-600" darkColor="gray-400">
-                {timeRemaining}
-            </Text>
+            {#if isCongestionNotFound}
+                <div class="flex items-center justify-center space-x-2">
+                    <Text type={TextType.h5} fontWeight={FontWeight.normal} color="gray-600" darkColor="gray-400">
+                        {localize('views.implicit-account-creation.steps.step2.view.calculating')}
+                    </Text>
+                    <Spinner size={16} />
+                </div>
+            {:else if seconds > 0}
+                <Text type={TextType.h5} fontWeight={FontWeight.normal} color="gray-600" darkColor="gray-400">
+                    {timeRemaining}
+                </Text>
+            {/if}
             <Text type={TextType.h3} fontWeight={FontWeight.semibold}>
                 {localize('views.implicit-account-creation.steps.step2.view.title')}
-                {formattedSelectedOutputBlance}
+                {formattedSelectedOutputBalance}
             </Text>
-            <div class="flex flex-col space-y-2">
-                <KeyValueBox
-                    keyText={localize('views.implicit-account-creation.steps.step2.view.eyebrow')}
-                    valueText={formattedWalletBalance}
-                />
-                <KeyValueBox
-                    keyText={localize('views.implicit-account-creation.steps.step2.view.generatedMana')}
-                    valueText={formattedManaBalance}
-                />
-                <ManaBox {transactionInfo} bind:hasEnoughMana showCountdown={false} />
-            </div>
+            {#if isLowManaGeneration}
+                <div class="flex flex-col space-y-2">
+                    <KeyValueBox
+                        keyText={localize('views.implicit-account-creation.steps.step2.view.eyebrow')}
+                        valueText={formattedWalletBalance}
+                    />
+                    <KeyValueBox
+                        keyText={localize('views.implicit-account-creation.steps.step2.view.generatedMana')}
+                        valueText={formattedManaBalance}
+                    />
+                    <ManaBox {transactionInfo} bind:hasEnoughMana showCountdown={false} />
+                </div>
+            {/if}
         </div>
         {#if isLowManaGeneration}
             <div class="flex flex-col space-y-2 w-2/3">

packages/desktop/views/dashboard/wallet/views/implicit-account-creation-multistep/OneTimeDepositView.svelte

@@ -3,6 +3,8 @@
     import { localize } from '@core/i18n'
     import { setClipboard } from '@core/utils'
     import { selectedWallet } from '@core/wallet'
+    import { updateActiveWallet } from '@core/profile'
+    import { onMount } from 'svelte'
 
     let isVisibleAddress: boolean = false
     let implicitAccountCreationAddress: string = ''
@@ -15,6 +17,12 @@
     function onCopyClick(): void {
         setClipboard(implicitAccountCreationAddress)
     }
+
+    onMount(() => {
+        updateActiveWallet($selectedWallet.id, {
+            isImplicitAccountCreationStarted: true,
+        })
+    })
 </script>
 
 <step-content class="flex flex-col items-center justify-between h-full pt-12">

packages/shared/lib/core/wallet/actions/events-handlers/handleNewOutputEvent.ts

@@ -100,6 +100,7 @@ export async function handleNewOutputEventInternal(walletId: string, payload: Ne
             } else {
                 updateActiveWallet(walletId, {
                     hasImplicitAccountCreationTransactionInProgress: false,
+                    isImplicitAccountCreationStarted: false,
                     isTransferring: false,
                 })
             }

packages/shared/lib/core/wallet/interfaces/wallet-state.interface.ts

@@ -12,6 +12,8 @@ export interface IWalletState extends IWallet, IPersistedWalletData {
     hasVotingTransactionInProgress: boolean
     hasConsolidatingOutputsTransactionInProgress: boolean
     hasImplicitAccountCreationTransactionInProgress: boolean
+    isImplicitAccountCreationStarted: boolean
+    hasEnoughManaToCreateExplicitAccount: Record<string, boolean>
     hasDelegationTransactionInProgress: boolean
     hasDelegationRewardClaimTransactionInProgress: boolean
     votingPower: string

packages/shared/locales/en.json

@@ -670,7 +670,8 @@
                             "description": "Send funds to your wallet address to speed up the Mana generation",
                             "show": "Show Address",
                             "copy": "Copy"
-                        }
+                        },
+                        "calculating": "Calculating..."
                     }
                 },
                 "step3": {