From 943ab672664a462d0f7cf48a5edf18d32b6a8663 Mon Sep 17 00:00:00 2001
From: cpl121 <100352899+cpl121@users.noreply.github.com>
Date: Mon, 20 May 2024 15:15:38 +0200
Subject: [PATCH] fix: reactivity issue after user gets enough mana to cover
 the block cost (#8529)

* fix: reactivity issue after user gets enough mana to cover the block cost

* fix: linter
---
 packages/desktop/components/ManaBox.svelte           | 12 +++++++++++-
 .../components/popups/ActivityDetailsPopup.svelte    |  2 +-
 .../desktop/components/popups/AllotManaPopup.svelte  |  2 +-
 .../popups/BurnNativeTokensConfirmationPopup.svelte  |  2 +-
 .../desktop/components/popups/BurnNftPopup.svelte    |  2 +-
 .../popups/ClaimDelegationRewardsPopup.svelte        |  2 +-
 .../components/popups/ConsolidateOutputsPopup.svelte |  2 +-
 .../components/popups/CreateDelegationPopup.svelte   |  2 +-
 .../popups/MintNativeTokenConfirmationPopup.svelte   |  2 +-
 .../popups/MintNftConfirmationPopup.svelte           |  2 +-
 .../popups/send/SendConfirmationPopup.svelte         |  2 +-
 .../AccountCreationView.svelte                       |  7 ++++++-
 .../FundConfirmationView.svelte                      |  8 +++++++-
 .../restore-profile/views/ClaimFinderView.svelte     |  2 +-
 14 files changed, 35 insertions(+), 14 deletions(-)

diff --git a/packages/desktop/components/ManaBox.svelte b/packages/desktop/components/ManaBox.svelte
index f0bbe47d6eb..d6d463cdae7 100644
--- a/packages/desktop/components/ManaBox.svelte
+++ b/packages/desktop/components/ManaBox.svelte
@@ -9,6 +9,7 @@
 
     export let transactionInfo: ITransactionInfoToCalculateManaCost
     export let hasEnoughMana: boolean
+    export let refreshTransactionInfo: () => Promise<void> = () => Promise.resolve()
     export let showCountdown: boolean = true
     export let outputId: string | undefined = undefined
 
@@ -57,6 +58,11 @@
                     secondsRemainingCountdownInterval = setInterval(() => {
                         secondsRemaining -= 1
                         if (secondsRemaining <= 0) {
+                            refreshTransactionInfo()
+                                .then(() => {
+                                    calculateManaCost()
+                                })
+                                .catch((err) => console.error(err))
                             clearInterval(secondsRemainingCountdownInterval)
                         }
                     }, MILLISECONDS_PER_SECOND)
@@ -92,7 +98,11 @@
         refreshManaCountdownInterval = setInterval(() => {
             secondsToRefreshManaCost -= 1
             if (secondsToRefreshManaCost <= 0) {
-                calculateManaCost()
+                refreshTransactionInfo()
+                    .then(() => {
+                        calculateManaCost()
+                    })
+                    .catch((err) => console.error(err))
                 secondsToRefreshManaCost = NUMBER_OF_EXTRA_SLOTS_MANA * DEFAULT_SECONDS_PER_SLOT
             }
         }, MILLISECONDS_PER_SECOND)
diff --git a/packages/desktop/components/popups/ActivityDetailsPopup.svelte b/packages/desktop/components/popups/ActivityDetailsPopup.svelte
index ddb2922373f..1a33c326a00 100644
--- a/packages/desktop/components/popups/ActivityDetailsPopup.svelte
+++ b/packages/desktop/components/popups/ActivityDetailsPopup.svelte
@@ -168,7 +168,7 @@
         </activity-details>
         {#if !isTimelocked && isActivityIncomingAndUnclaimed}
             <div class="flex flex-col space-y-4">
-                <ManaBox {transactionInfo} bind:hasEnoughMana />
+                <ManaBox {transactionInfo} bind:hasEnoughMana refreshTransactionInfo={prepareClaimOutput} />
                 {#if hasMainAccountNegativeBIC}
                     <TextHint variant={TextHintVariant.Danger} text={localize('popups.transaction.negativeBIC')} />
                 {/if}
diff --git a/packages/desktop/components/popups/AllotManaPopup.svelte b/packages/desktop/components/popups/AllotManaPopup.svelte
index b92ccaa95c7..6e1bfc646c1 100644
--- a/packages/desktop/components/popups/AllotManaPopup.svelte
+++ b/packages/desktop/components/popups/AllotManaPopup.svelte
@@ -159,7 +159,7 @@
                     <Text error>{error}</Text>
                 {/if}
                 {#if displayManaBox}
-                    <ManaBox {transactionInfo} bind:hasEnoughMana />
+                    <ManaBox {transactionInfo} bind:hasEnoughMana refreshTransactionInfo={preparedOutput} />
                 {/if}
             </div>
             <popup-buttons class="flex flex-row flex-nowrap w-full space-x-4">
diff --git a/packages/desktop/components/popups/BurnNativeTokensConfirmationPopup.svelte b/packages/desktop/components/popups/BurnNativeTokensConfirmationPopup.svelte
index ef6a3a09904..bc9b1aef46b 100644
--- a/packages/desktop/components/popups/BurnNativeTokensConfirmationPopup.svelte
+++ b/packages/desktop/components/popups/BurnNativeTokensConfirmationPopup.svelte
@@ -84,7 +84,7 @@
         <KeyValueBox keyText={localize('popups.nativeToken.property.assetId')} valueText={asset.id} isCopyable />
         <KeyValueBox keyText={localize('general.amount')} valueText={formattedAmount} />
         <TextHint variant={TextHintVariant.Warning} text={localize('actions.confirmTokenBurn.hint')} />
-        <ManaBox {transactionInfo} bind:hasEnoughMana />
+        <ManaBox {transactionInfo} bind:hasEnoughMana refreshTransactionInfo={prepareBurnFoundryTransaction} />
         {#if hasMainAccountNegativeBIC}
             <TextHint variant={TextHintVariant.Danger} text={localize('popups.transaction.negativeBIC')} />
         {/if}
diff --git a/packages/desktop/components/popups/BurnNftPopup.svelte b/packages/desktop/components/popups/BurnNftPopup.svelte
index c855132b699..a4945d86552 100644
--- a/packages/desktop/components/popups/BurnNftPopup.svelte
+++ b/packages/desktop/components/popups/BurnNftPopup.svelte
@@ -73,7 +73,7 @@
     </Text>
     <div class="space-y-4">
         <Text fontSize="14" classes="text-left break-words">{localize('actions.confirmNftBurn.description')}</Text>
-        <ManaBox {transactionInfo} bind:hasEnoughMana />
+        <ManaBox {transactionInfo} bind:hasEnoughMana refreshTransactionInfo={prepareBurnNftTransaction} />
         <TextHint variant={TextHintVariant.Warning} text={localize('actions.confirmNftBurn.hint')} />
     </div>
     <popup-buttons class="flex flex-row flex-nowrap w-full space-x-4">
diff --git a/packages/desktop/components/popups/ClaimDelegationRewardsPopup.svelte b/packages/desktop/components/popups/ClaimDelegationRewardsPopup.svelte
index 613a6483c06..8355cdb0343 100644
--- a/packages/desktop/components/popups/ClaimDelegationRewardsPopup.svelte
+++ b/packages/desktop/components/popups/ClaimDelegationRewardsPopup.svelte
@@ -98,7 +98,7 @@
             keyText={localize('popups.claimDelegationRewards.rewards')}
             valueText={formatTokenAmountBestMatch(Math.round(rewards), DEFAULT_MANA)}
         />
-        <ManaBox {transactionInfo} bind:hasEnoughMana />
+        <ManaBox {transactionInfo} bind:hasEnoughMana refreshTransactionInfo={prepareBurnDelegationOutput} />
         {#if hasMainAccountNegativeBIC}
             <TextHint variant={TextHintVariant.Danger} text={localize('popups.transaction.negativeBIC')} />
         {/if}
diff --git a/packages/desktop/components/popups/ConsolidateOutputsPopup.svelte b/packages/desktop/components/popups/ConsolidateOutputsPopup.svelte
index 9bafffeb983..be16412a44e 100644
--- a/packages/desktop/components/popups/ConsolidateOutputsPopup.svelte
+++ b/packages/desktop/components/popups/ConsolidateOutputsPopup.svelte
@@ -86,7 +86,7 @@
     <div class="space-y-4">
         <TextHint variant={TextHintVariant.Info} text={localize('popups.minimizeStorageDeposit.description')} />
         {#if displayManaBox}
-            <ManaBox {transactionInfo} bind:hasEnoughMana />
+            <ManaBox {transactionInfo} bind:hasEnoughMana refreshTransactionInfo={prepareConsolidateTransaction} />
         {/if}
         {#if hasMainAccountNegativeBIC}
             <TextHint variant={TextHintVariant.Danger} text={localize('popups.transaction.negativeBIC')} />
diff --git a/packages/desktop/components/popups/CreateDelegationPopup.svelte b/packages/desktop/components/popups/CreateDelegationPopup.svelte
index e020a018946..29e226285cc 100644
--- a/packages/desktop/components/popups/CreateDelegationPopup.svelte
+++ b/packages/desktop/components/popups/CreateDelegationPopup.svelte
@@ -166,7 +166,7 @@
                 <Text error>{addressError}</Text>
             {/if}
             {#if displayManaBox}
-                <ManaBox {transactionInfo} bind:hasEnoughMana />
+                <ManaBox {transactionInfo} bind:hasEnoughMana refreshTransactionInfo={updateTransactionInfo} />
             {/if}
             {#if hasMainAccountNegativeBIC}
                 <TextHint variant={TextHintVariant.Danger} text={localize('popups.transaction.negativeBIC')} />
diff --git a/packages/desktop/components/popups/MintNativeTokenConfirmationPopup.svelte b/packages/desktop/components/popups/MintNativeTokenConfirmationPopup.svelte
index 1142a21fa98..e00e67f2dbf 100644
--- a/packages/desktop/components/popups/MintNativeTokenConfirmationPopup.svelte
+++ b/packages/desktop/components/popups/MintNativeTokenConfirmationPopup.svelte
@@ -168,7 +168,7 @@
                         isCopyable={value.isCopyable}
                     />
                 {/each}
-                <ManaBox {transactionInfo} bind:hasEnoughMana />
+                <ManaBox {transactionInfo} bind:hasEnoughMana refreshTransactionInfo={prepareFoundryOutput} />
             </details-list>
         {/if}
     </div>
diff --git a/packages/desktop/components/popups/MintNftConfirmationPopup.svelte b/packages/desktop/components/popups/MintNftConfirmationPopup.svelte
index fb7340805a2..4aca4772a46 100644
--- a/packages/desktop/components/popups/MintNftConfirmationPopup.svelte
+++ b/packages/desktop/components/popups/MintNftConfirmationPopup.svelte
@@ -156,7 +156,7 @@
                         isPreText
                     />
                 {/if}
-                <ManaBox {transactionInfo} bind:hasEnoughMana />
+                <ManaBox {transactionInfo} bind:hasEnoughMana refreshTransactionInfo={prepareNftOutput} />
             </activity-details>
         </nft-details>
         {#if hasMainAccountNegativeBIC}
diff --git a/packages/desktop/components/popups/send/SendConfirmationPopup.svelte b/packages/desktop/components/popups/send/SendConfirmationPopup.svelte
index ad75ab4c9e7..7f7eb3f6b7b 100644
--- a/packages/desktop/components/popups/send/SendConfirmationPopup.svelte
+++ b/packages/desktop/components/popups/send/SendConfirmationPopup.svelte
@@ -269,7 +269,7 @@
                     />
                 </KeyValueBox>
             {/if}
-            <ManaBox {transactionInfo} bind:hasEnoughMana />
+            <ManaBox {transactionInfo} bind:hasEnoughMana refreshTransactionInfo={rebuildTransactionOutput} />
         {/if}
     </div>
     {#if surplus}
diff --git a/packages/desktop/views/dashboard/wallet/views/implicit-account-creation-multistep/AccountCreationView.svelte b/packages/desktop/views/dashboard/wallet/views/implicit-account-creation-multistep/AccountCreationView.svelte
index 3b5d175ef7d..e5bfa7ecd53 100644
--- a/packages/desktop/views/dashboard/wallet/views/implicit-account-creation-multistep/AccountCreationView.svelte
+++ b/packages/desktop/views/dashboard/wallet/views/implicit-account-creation-multistep/AccountCreationView.svelte
@@ -117,7 +117,12 @@
                         keyText={localize('views.implicit-account-creation.steps.step2.view.generatedMana')}
                         valueText={formattedManaBalance}
                     />
-                    <ManaBox {transactionInfo} bind:hasEnoughMana showCountdown={!$selectedWallet.isTransferring} />
+                    <ManaBox
+                        {transactionInfo}
+                        bind:hasEnoughMana
+                        showCountdown={!$selectedWallet.isTransferring}
+                        refreshTransactionInfo={() => prepareTransaction(selectedOutput?.outputId)}
+                    />
                 </div>
                 <PasswordInput
                     bind:error
diff --git a/packages/desktop/views/dashboard/wallet/views/implicit-account-creation-multistep/FundConfirmationView.svelte b/packages/desktop/views/dashboard/wallet/views/implicit-account-creation-multistep/FundConfirmationView.svelte
index d69d9230fbe..53bcff6e7d6 100644
--- a/packages/desktop/views/dashboard/wallet/views/implicit-account-creation-multistep/FundConfirmationView.svelte
+++ b/packages/desktop/views/dashboard/wallet/views/implicit-account-creation-multistep/FundConfirmationView.svelte
@@ -186,7 +186,13 @@
                         keyText={localize('views.implicit-account-creation.steps.step2.view.generatedMana')}
                         valueText={formattedManaBalance}
                     />
-                    <ManaBox {transactionInfo} bind:hasEnoughMana showCountdown={true} {outputId} />
+                    <ManaBox
+                        {transactionInfo}
+                        bind:hasEnoughMana
+                        showCountdown={true}
+                        {outputId}
+                        refreshTransactionInfo={() => prepareTransaction(selectedOutput.outputId)}
+                    />
                 </div>
             {/if}
         </div>
diff --git a/packages/desktop/views/onboarding/views/restore-profile/views/ClaimFinderView.svelte b/packages/desktop/views/onboarding/views/restore-profile/views/ClaimFinderView.svelte
index bb5227627b6..2959eed3021 100644
--- a/packages/desktop/views/onboarding/views/restore-profile/views/ClaimFinderView.svelte
+++ b/packages/desktop/views/onboarding/views/restore-profile/views/ClaimFinderView.svelte
@@ -286,7 +286,7 @@
                 {localize(`actions.${hasTriedClaimingRewards ? 'rerunClaimProcess' : 'claimRewards'}`)}
             </Button>
         {/if}
-        <ManaBox {transactionInfo} bind:hasEnoughMana />
+        <ManaBox {transactionInfo} bind:hasEnoughMana refreshTransactionInfo={prepareClaimOutput} />
         {#if hasMainAccountNegativeBIC}
             <TextHint variant={TextHintVariant.Danger} text={localize('popups.transaction.negativeBIC')} />
         {/if}