feat: manage pending and main account when BIC is negative

packages/desktop/components/AccountManagementDetails.svelte

@@ -14,6 +14,8 @@
  Pill,
  Button,
  ButtonSize,
+ TextHint,
+ TextHintVariant,
  } from '@ui'
  import { Icon as IconEnum } from '@auxiliary/icon'
  import { AccountManagementMenu } from './modals'
@@ -52,21 +54,21 @@
  $: accountId = isAccountOutput(selectedOutput) ? (selectedOutput.output as AccountOutput)?.accountId : null
  $: address = accountId ? AddressConverter.addressToBech32(new AccountAddress(accountId)) : null
  $: isMainAccount = accountId && accountId === $selectedWalletMainAccountId
- $: balance = getAccountBalance(selectedOutput, isImplicitAccount)
- $: formattedBalance = balance ? formatTokenAmountBestMatch(balance, getBaseToken()) : '-'
+ $: implicitAccountBalance = isImplicitAccount ? getImplicitAccountBalance(selectedOutput) : undefined
+ $: formattedImplicitAccountBalance = implicitAccountBalance
+ ? formatTokenAmountBestMatch(implicitAccountBalance, getBaseToken())
+ : '-'
  $: hasStakingFeature = hasOutputStakingFeature(selectedOutput)
  $: rawStakedAmount = getStakedAmount(selectedOutput)
  $: formattedStakedAmount = formatTokenAmountBestMatch(rawStakedAmount, getBaseToken())
  $: primaryKey = $selectedWallet?.primaryKey
  $: listBlockKeysFeature(selectedOutput)
+ $: hasMainAccountNegativeBIC = $selectedWallet?.balances?.blockIssuanceCredits?.[$selectedWallet?.mainAccountId] < 0
+ $: hasAccountNegativeBIC =
+ $selectedWallet?.balances?.blockIssuanceCredits?.[(selectedOutput.output as AccountOutput)?.accountId] < 0
 
- function getAccountBalance(outputData: OutputData, isImplicitAccount: boolean): number | undefined {
- if (isImplicitAccount) {
- return Number(outputData.output.amount)
- } else {
- // TODO: Calculate the balance of an account output https://github.com/iotaledger/firefly/issues/8080
- return undefined
- }
+ function getImplicitAccountBalance(outputData: OutputData): number | undefined {
+ return Number(outputData.output.amount)
  }
 
  function onExplorerClick(): void {
@@ -123,126 +125,139 @@
 
 <right-pane class="w-full h-full min-h-96 flex-1 space-y-4 flex flex-col">
  <Pane height={Height.Full}>
- <right-pane-container class="flex flex-col space-y-8 h-full">
- <right-pane-title class="flex flex-col space-y-1">
- <title-container class="flex justify-between w-full items-center">
- <title-wrapper class="flex items-center space-x-2 py-1">
- <Text type={TextType.h2}>{localize('views.accountManagement.list.tile.title')}</Text>
+ <right-pane-container class="flex flex-col justify-between h-full">
+ <right-pane-wrapper class="flex flex-col space-y-8 h-full">
+ <right-pane-title class="flex flex-col space-y-1">
+ <title-container class="flex justify-between w-full items-center">
+ <title-wrapper class="flex items-center space-x-2 py-1">
+ <Text type={TextType.h2}>{localize('views.accountManagement.list.tile.title')}</Text>
+ {#if isImplicitAccount}
+ <Pill backgroundColor="yellow-200" textColor="yellow-900"
+ >{localize('views.accountManagement.list.tile.pill.pending')}</Pill
+ >
+ {:else if isMainAccount}
+ <Pill backgroundColor="blue-200" textColor="blue-600"
+ >{localize('views.accountManagement.list.tile.pill.main')}
+ </Pill>
+ {/if}
+ </title-wrapper>
+
+ {#if accountId}
+ <wallet-actions-button class="block relative">
+ <MeatballMenuButton onClick={modal?.toggle} />
+ <AccountManagementMenu
+ bind:modal
+ position={{ right: '0' }}
+ classes="mt-1.5"
+ {accountId}
+ {keys}
+ />
+ </wallet-actions-button>
+ {/if}
  {#if isImplicitAccount}
- <Pill backgroundColor="yellow-200" textColor="yellow-900"
- >{localize('views.accountManagement.list.tile.pill.pending')}</Pill
+ <Button size={ButtonSize.Small} onClick={handleActivateAccount}
+ >{localize('views.implicit-account-creation.steps.step2.view.action')}</Button
  >
- {:else if isMainAccount}
- <Pill backgroundColor="blue-200" textColor="blue-600"
- >{localize('views.accountManagement.list.tile.pill.main')}
- </Pill>
  {/if}
- </title-wrapper>
-
- {#if accountId}
- <wallet-actions-button class="block relative">
- <MeatballMenuButton onClick={modal?.toggle} />
- <AccountManagementMenu
- bind:modal
- position={{ right: '0' }}
- classes="mt-1.5"
- {accountId}
- {keys}
- />
- </wallet-actions-button>
+ </title-container>
+ {#if selectedOutput.outputId}
+ <button
+ class="action w-max flex justify-start text-center font-medium text-14 text-blue-500"
+ on:click={onExplorerClick}
+ >
+ {localize('general.viewOnExplorer')}
+ </button>
  {/if}
+ </right-pane-title>
+ <div class="flex flex-row space-x-2 w-1/2">
  {#if isImplicitAccount}
- <Button size={ButtonSize.Small} onClick={handleActivateAccount}
- >{localize('views.implicit-account-creation.steps.step2.view.action')}</Button
- >
+ <Tile>
+ <div class="flex flex-col space-y-2 items-center justify-center w-full">
+ <Text type={TextType.h3}>
+ {formattedImplicitAccountBalance}
+ </Text>
+ <Text color="gray-600" fontWeight={FontWeight.medium} fontSize="12" type={TextType.p}
+ >{localize('views.accountManagement.details.balance')}</Text
+ >
+ </div>
+ </Tile>
  {/if}
- </title-container>
- {#if selectedOutput.outputId}
- <button
- class="action w-max flex justify-start text-center font-medium text-14 text-blue-500"
- on:click={onExplorerClick}
- >
- {localize('general.viewOnExplorer')}
- </button>
- {/if}
- </right-pane-title>
- <div class="flex flex-row space-x-2 w-1/2">
- <!-- TODO: Remove this if when calculate the balance of an account output https://github.com/iotaledger/firefly/issues/8080 -->
- {#if !accountId}
- <Tile>
- <div class="flex flex-col space-y-2 items-center justify-center w-full">
- <Text type={TextType.h3}>
- {formattedBalance}
- </Text>
- <Text color="gray-600" fontWeight={FontWeight.medium} fontSize="12" type={TextType.p}
- >{localize('views.accountManagement.details.balance')}</Text
- >
- </div>
- </Tile>
- {/if}
 
- {#if hasStakingFeature}
- <Tile>
- <div class="flex flex-col space-y-2 items-center justify-center w-full">
- <Text type={TextType.h3}>{formattedStakedAmount}</Text>
- <Text color="gray-600" fontWeight={FontWeight.medium} fontSize="12" type={TextType.p}
- >{localize('views.accountManagement.details.staked')}</Text
- >
- </div>
- </Tile>
- {/if}
+  {#if hasStakingFeature}
+  <Tile>
+  <div class="flex flex-col space-y-2 items-center justify-center w-full">
+  <Text type={TextType.h3}>{formattedStakedAmount}</Text>
+  <Text color="gray-600" fontWeight={FontWeight.medium} fontSize="12" type={TextType.p}
+  >{localize('views.accountManagement.details.staked')}</Text
+  >
+  </div>
+  </Tile>
+  {/if}
 
+ {#if accountId}
+ <Tile>
+ <div class="flex flex-col space-y-2 items-center justify-center w-full">
+ <Text type={TextType.h3}>
+ {$selectedWallet?.balances?.blockIssuanceCredits?.[accountId] || 0}
+ </Text>
+ <Text color="gray-600" fontWeight={FontWeight.medium} fontSize="12" type={TextType.p}
+ >{localize('views.accountManagement.details.blockIssuanceCredits')}</Text
+ >
+ </div>
+ </Tile>
+ {/if}
+ </div>
  {#if accountId}
- <Tile>
- <div class="flex flex-col space-y-2 items-center justify-center w-full">
- <Text type={TextType.h3}>
- {$selectedWallet?.balances?.blockIssuanceCredits?.[accountId] || 0}
- </Text>
- <Text color="gray-600" fontWeight={FontWeight.medium} fontSize="12" type={TextType.p}
- >{localize('views.accountManagement.details.blockIssuanceCredits')}</Text
+ <div class="flex flex-col space-y-2">
+ <Text color="gray-600" fontWeight={FontWeight.medium} fontSize="12" type={TextType.p}
+ >{localize('views.accountManagement.details.address')}</Text
+ >
+ <CopyableBox
+ clearBackground
+ clearBoxPadding
+ isCopyable
+ value={address}
+ classes="flex space-x-2 items-center"
+ >
+ <Text type={TextType.pre} fontSize="13" lineHeight="leading-120" classes="text-start"
+ >{address}</Text
  >
- </div>
- </Tile>
+ <Icon icon={IconEnum.Copy} classes="text-blue-500" width={24} height={24} />
+ </CopyableBox>
+ </div>
  {/if}
- </div>
- {#if accountId}
- <div class="flex flex-col space-y-2">
- <Text color="gray-600" fontWeight={FontWeight.medium} fontSize="12" type={TextType.p}
- >{localize('views.accountManagement.details.address')}</Text
- >
- <CopyableBox
- clearBackground
- clearBoxPadding
- isCopyable
- value={address}
- classes="flex space-x-2 items-center"
- >
+ {#if isImplicitAccount}
+ <div class="flex flex-col space-y-2">
+ <Text color="gray-600" fontWeight={FontWeight.medium} fontSize="12" type={TextType.p}
+ >{localize('views.accountManagement.details.mana')}</Text
+ >
  <Text type={TextType.pre} fontSize="13" lineHeight="leading-120" classes="text-start"
- >{address}</Text
+ >{selectedOutput.output?.mana}</Text
  >
- <Icon icon={IconEnum.Copy} classes="text-blue-500" width={24} height={24} />
- </CopyableBox>
- </div>
- {/if}
- {#if isImplicitAccount}
- <div class="flex flex-col space-y-2">
- <Text color="gray-600" fontWeight={FontWeight.medium} fontSize="12" type={TextType.p}
- >{localize('views.accountManagement.details.mana')}</Text
- >
- <Text type={TextType.pre} fontSize="13" lineHeight="leading-120" classes="text-start"
- >{selectedOutput.output?.mana}</Text
- >
- </div>
+ </div>
+ {/if}
+ {#if accountId && primaryKey}
+ <div class="flex flex-col space-y-2">
+ <Text color="gray-600" fontWeight={FontWeight.medium} fontSize="12" type={TextType.p}
+ >{localize('views.accountManagement.details.key')}</Text
+ >
+ <Text type={TextType.pre} fontSize="13" lineHeight="leading-120" classes="text-start"
+ >{primaryKey}</Text
+ >
+ </div>
+ {/if}
+ </right-pane-wrapper>
+ {#if isMainAccount && hasMainAccountNegativeBIC}
+ <TextHint
+ variant={TextHintVariant.Danger}
+ text={localize('views.accountManagement.details.mainAccountNegativeBICHint')}
+ />
  {/if}
- {#if accountId && primaryKey}
- <div class="flex flex-col space-y-2">
- <Text color="gray-600" fontWeight={FontWeight.medium} fontSize="12" type={TextType.p}
- >{localize('views.accountManagement.details.key')}</Text
- >
- <Text type={TextType.pre} fontSize="13" lineHeight="leading-120" classes="text-start"
- >{primaryKey}</Text
- >
- </div>
+ {#if !isMainAccount && hasAccountNegativeBIC}
+ <TextHint
+ variant={TextHintVariant.Danger}
+ text={localize('views.accountManagement.details.accountNegativeBICHint')}
+ />
  {/if}
  </right-pane-container>
  </Pane>

packages/desktop/components/modals/AccountManagementMenu.svelte

@@ -38,7 +38,8 @@
  icon={Icon.Star}
  title={localize('views.accountManagement.details.modal.setMainAccount')}
  onClick={setAsMainAccount}
- disabled={accountId === $selectedWallet.mainAccountId}
+ disabled={accountId === $selectedWallet.mainAccountId ||
+ $selectedWallet?.balances?.blockIssuanceCredits[accountId] < 0}
  />
  </account-management-menu>
 </Modal>

packages/desktop/components/popups/send/SendConfirmationPopup.svelte

@@ -227,6 +227,8 @@
  function onCancelClick(): void {
  closePopup()
  }
+
+ $: hasMainAccountNegativeBIC = $selectedWallet?.balances?.blockIssuanceCredits?.[$selectedWallet?.mainAccountId] < 0
 </script>
 
 <send-confirmation-popup class="w-full h-full space-y-6 flex flex-auto flex-col shrink-0">
@@ -271,6 +273,9 @@
  {#if surplus}
  <TextHint variant={TextHintVariant.Warning} text={localize('popups.transaction.surplusIncluded')} />
  {/if}
+ {#if hasMainAccountNegativeBIC}
+ <TextHint variant={TextHintVariant.Danger} text={localize('popups.transaction.negativeBIC')} />
+ {/if}
  <popup-buttons class="flex flex-row flex-nowrap w-full space-x-4">
  {#if disableBack}
  <Button classes="w-full" outline onClick={onCancelClick} disabled={isTransferring}>
@@ -286,6 +291,7 @@
  classes="w-full"
  onClick={onConfirmClick}
  disabled={isTransferring ||
+ hasMainAccountNegativeBIC ||
  isPreparingOutput ||
  !hasEnoughMana ||
  (layer2Parameters?.networkAddress && !$newTransactionDetails?.layer2Parameters?.gasBudget)}

packages/desktop/views/dashboard/Dashboard.svelte

@@ -27,7 +27,7 @@
  resetNftDownloadQueue,
  selectedWalletNfts,
  } from '@core/nfts'
- import { clearBalanceSyncPoll, selectedWalletId, syncBalancePoll } from '@core/wallet'
+ import { selectedWallet, selectedWalletId, clearBalanceSyncPoll, syncBalancePoll } from '@core/wallet'
  import { get } from 'svelte/store'
  import features from '@features/features'
  import { isAwareOfMetricSystemDrop, showBalanceOverviewPopup } from '@contexts/dashboard/stores'
@@ -51,6 +51,14 @@
  $: $nftDownloadQueue, downloadNextNftInQueue()
  $: $downloadingNftId && interruptNftDownloadAfterTimeout(get(selectedWalletId))
  $: addselectedWalletNftsToDownloadQueue($selectedWalletId)
+ $: hasMainAccountNegativeBIC = $selectedWallet?.balances?.blockIssuanceCredits?.[$selectedWallet?.mainAccountId] < 0
+
+ $: if (hasMainAccountNegativeBIC) {
+ showAppNotification({
+ type: 'warning',
+ message: localize('views.accountManagement.hasMainAccountNegativeBIC'),
+ })
+ }
 
  $: if (features.analytics.dashboardRoute.enabled && $dashboardRoute)
  Platform.trackEvent('dashboard-route', { route: $dashboardRoute })

packages/shared/locales/en.json

@@ -711,10 +711,13 @@
  "primary": "Primary key",
  "setAsPrimary": "Set as primary",
  "unsetAsPrimary": "Unset as primary"
- }
+ },
+ "mainAccountNegativeBICHint": "Your main account has a negative Block Issuance Credit (BIC). Please select another account as the main one.",
+ "accountNegativeBICHint": "This account has a negative Block Issuance Credit (BIC)."
  },
  "notification": "Activate one account to access the dashboard.",
- "emptyAccounts": "There are no accounts to show, activate one first."
+ "emptyAccounts": "There are no accounts to show, activate one first.",
+ "hasMainAccountNegativeBIC": "There is a problem with the BIC of your account."
  },
  "delegation": {
  "title": "Delegation",
@@ -986,7 +989,8 @@
  "selectAmount": "Send {tokenName}",
  "selectRecipient": "Send {assetName} to",
  "transactionSummary": "Transaction to {recipient}",
- "surplusIncluded": "This transaction contains a surplus amount. Please double check this is the amount you want to send."
+ "surplusIncluded": "This transaction contains a surplus amount. Please double check this is the amount you want to send.",
+ "negativeBIC": "Unable to send transaction. Your account has a negative Block Issuance Credit (BIC)."
  },
  "balanceFinder": {
  "title": "Balance finder",