feat: display the proper pill for failed transactions (#7889)

* feat: display failed transtactions pill * fix: conflicting pill in tx --------- Co-authored-by: Begoña Álvarez de la Cruz <[email protected]>
iotaledger · Jan 25, 2024 · c523b02 · c523b02
1 parent ca652cd
commit c523b02
Showing 1 changed file with 17 additions and 4 deletions.
diff --git a/packages/shared/components/tiles/ActivityTile.svelte b/packages/shared/components/tiles/ActivityTile.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+    import { PopupId, openPopup } from '@auxiliary/popup'
     import { time } from '@core/app'
     import {
         Activity,
@@ -11,18 +12,19 @@
         selectedAccountAssets,
     } from '@core/wallet'
     import {
+        ActivityInclusionStatusPill,
         AliasActivityTileContent,
         AsyncActivityTileFooter,
         ClickableTile,
         ConsolidationActivityTileContent,
         FoundryActivityTileContent,
         GovernanceActivityTileContent,
         NftActivityTileContent,
+        TileFooter,
         TimelockActivityTileFooter,
         TransactionActivityTileContent,
         VestingActivityTileContent,
     } from 'shared/components'
-    import { PopupId, openPopup } from '@auxiliary/popup'
 
     export let activity: Activity
 
@@ -32,8 +34,10 @@
             activity.type === ActivityType.Basic || activity.type === ActivityType.Foundry
                 ? getTokenFromSelectedAccount(activity.assetId)
                 : undefined)
-    $: isTimelocked = activity?.asyncData?.timelockDate > $time
-    $: shouldShowAsyncFooter = activity.asyncData && activity.asyncData.asyncStatus !== ActivityAsyncStatus.Claimed
+    $: isConflicting = activity.inclusionState === InclusionState.Conflicting
+    $: isTimelocked = !isConflicting && activity?.asyncData?.timelockDate > $time
+    $: shouldShowAsyncFooter =
+        !isConflicting && activity.asyncData && activity.asyncData.asyncStatus !== ActivityAsyncStatus.Claimed
 
     function onTransactionClick(): void {
         if (asset?.verification?.status === NotVerifiedStatus.New) {
@@ -76,7 +80,16 @@
                 <FoundryActivityTileContent {activity} />
             {/if}
         </tile-content>
-        {#if isTimelocked}
+        {#if isConflicting}
+            <TileFooter>
+                <svelte:fragment slot="right">
+                    <ActivityInclusionStatusPill
+                        inclusionState={activity.inclusionState}
+                        localizationKey="external.outgoing"
+                    />
+                </svelte:fragment>
+            </TileFooter>
+        {:else if isTimelocked}
             <TimelockActivityTileFooter {activity} />
         {:else if shouldShowAsyncFooter}
             <AsyncActivityTileFooter {activity} />