feat: burn NFT missing block mana cost

packages/desktop/components/popups/BurnNftPopup.svelte

@@ -0,0 +1,91 @@
+<script lang="ts">
+    import { Button, Text, TextHint, FontWeight, TextType, ButtonVariant } from '@ui'
+    import { localize } from '@core/i18n'
+    import { closePopup } from '@auxiliary/popup'
+    import { handleError } from '@core/error/handlers'
+    import { onMount } from 'svelte'
+    import { burnNft, getDefaultTransactionOptions, selectedWallet } from '@core/wallet'
+    import { TextHintVariant } from '@ui/enums'
+    import { INft } from '@core/nfts'
+    import { ITransactionInfoToCalculateManaCost } from '@core/network'
+    import { checkActiveProfileAuth } from '@core/profile'
+    import { CollectiblesRoute, collectiblesRouter } from '@core/router'
+    import { ManaBox } from '@components'
+
+    export let nft: INft
+    export let _onMount: (..._: any[]) => Promise<void> = async () => {}
+
+    const transactionInfo: ITransactionInfoToCalculateManaCost = {}
+
+    let isBusy = false
+    let hasEnoughMana = false
+
+    async function prepareBurnNftTransaction(): Promise<void> {
+        try {
+            transactionInfo.preparedTransaction = await $selectedWallet.prepareBurnNft(
+                nft.id,
+                getDefaultTransactionOptions()
+            )
+        } catch (error) {
+            transactionInfo.preparedTransactionError = error
+        }
+    }
+
+    async function onBurnNftClick(): Promise<void> {
+        try {
+            isBusy = true
+            await checkActiveProfileAuth(
+                async () => {
+                    await burnNft(nft.id)
+                    $collectiblesRouter.goTo(CollectiblesRoute.Gallery)
+                    closePopup()
+                },
+                { stronghold: true }
+            )
+        } catch (err) {
+            handleError(err)
+        } finally {
+            isBusy = false
+        }
+    }
+
+    function onCancelClick(): void {
+        closePopup()
+    }
+
+    onMount(async () => {
+        try {
+            await _onMount()
+            await prepareBurnNftTransaction()
+        } catch (err) {
+            handleError(err)
+        }
+    })
+</script>
+
+<div class="w-full h-full space-y-6 flex flex-auto flex-col shrink-0">
+    <Text type={TextType.h3} fontWeight={FontWeight.semibold} classes="text-left">
+        {localize('actions.confirmNftBurn.title', {
+            values: {
+                nftName: nft.name,
+            },
+        })}
+    </Text>
+    <div class="space-y-4">
+        <Text fontSize="14" classes="text-left break-words">{localize('actions.confirmNftBurn.description')}</Text>
+        <ManaBox {transactionInfo} bind:hasEnoughMana />
+        <TextHint variant={TextHintVariant.Warning} text={localize('actions.confirmNftBurn.hint')} />
+    </div>
+    <popup-buttons class="flex flex-row flex-nowrap w-full space-x-4">
+        <Button classes="w-full" outline onClick={onCancelClick}>{localize('actions.cancel')}</Button>
+        <Button
+            classes="w-full"
+            variant={ButtonVariant.Warning}
+            disabled={$selectedWallet?.isTransferring || isBusy || !hasEnoughMana}
+            isBusy={$selectedWallet?.isTransferring || isBusy}
+            onClick={onBurnNftClick}
+        >
+            {localize('actions.burn')}
+        </Button>
+    </popup-buttons>
+</div>

packages/desktop/components/popups/Popup.svelte

@@ -64,6 +64,7 @@
     import CreateDelegationPopup from './CreateDelegationPopup.svelte'
     import ClaimDelegationRewardsPopup from './ClaimDelegationRewardsPopup.svelte'
     import ImplicitAccountAddressPopup from './ImplicitAccountAddressPopup.svelte'
+    import BurnNftPopup from './BurnNftPopup.svelte'
 
     export let id: PopupId
     export let props: any
@@ -159,6 +160,7 @@
         [PopupId.CreateDelegation]: CreateDelegationPopup,
         [PopupId.ClaimDelegationRewards]: ClaimDelegationRewardsPopup,
         [PopupId.ImplicitAccountAddress]: ImplicitAccountAddressPopup,
+        [PopupId.BurnNft]: BurnNftPopup,
     }
 
     function onKey(event: KeyboardEvent): void {

packages/shared/components/modals/CollectibleActionsModal.svelte

@@ -3,12 +3,8 @@
     import { openUrlInBrowser, time } from '@core/app'
     import { localize } from '@core/i18n'
     import { INft, rewriteIpfsUri } from '@core/nfts'
-    import { checkActiveProfileAuth } from '@core/profile/actions'
-    import { CollectiblesRoute, collectiblesRouter } from '@core/router'
-    import { burnNft } from '@core/wallet'
-    import { closePopup, openPopup, PopupId } from '@auxiliary/popup'
+    import { openPopup, PopupId } from '@auxiliary/popup'
     import { activeProfile, updateActiveProfile } from '@core/profile/stores'
-    import { TextHintVariant } from '@ui/enums'
     import { Icon as IconEnum } from '@auxiliary/icon'
 
     export let modal: Modal
@@ -43,30 +39,11 @@
             disabled: isLocked,
         },
     ]
-
     function openBurnNft(): void {
         openPopup({
-            id: PopupId.Confirmation,
+            id: PopupId.BurnNft,
             props: {
-                title: localize('actions.confirmNftBurn.title', {
-                    values: {
-                        nftName: nft.name,
-                    },
-                }),
-                description: localize('actions.confirmNftBurn.description'),
-                hint: localize('actions.confirmNftBurn.hint'),
-                variant: TextHintVariant.Warning,
-                confirmText: localize('actions.burn'),
-                onConfirm: async () => {
-                    await checkActiveProfileAuth(
-                        async () => {
-                            await burnNft(nft.id)
-                            $collectiblesRouter.goTo(CollectiblesRoute.Gallery)
-                            closePopup()
-                        },
-                        { stronghold: true }
-                    )
-                },
+                nft: nft,
             },
         })
     }

packages/shared/lib/auxiliary/popup/enums/popup-id.enum.ts

@@ -56,4 +56,5 @@ export enum PopupId {
     ActivateAccount = 'activateAccount',
     ClaimDelegationRewards = 'claimDelegationRewardsPopup',
     ImplicitAccountAddress = 'implicitAccountAddressPopup',
+    BurnNft = 'burnNft',
 }