From bf4f5cb4c654d9877aa8d1ee54698f11cf52838f Mon Sep 17 00:00:00 2001
From: Gamaliel Padillo <gamalielgad1234@gmail.com>
Date: Wed, 18 Dec 2024 14:03:40 -0800
Subject: [PATCH] fix: default image when nft to send has no image

---
 .../nft-select-list/components/nft-select-list-item.vue        | 3 ++-
 .../providers/common/ui/send-transaction/send-nft-select.vue   | 3 ++-
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/packages/extension/src/providers/common/ui/send-transaction/nft-select-list/components/nft-select-list-item.vue b/packages/extension/src/providers/common/ui/send-transaction/nft-select-list/components/nft-select-list-item.vue
index 06e126c82..455ba385e 100644
--- a/packages/extension/src/providers/common/ui/send-transaction/nft-select-list/components/nft-select-list-item.vue
+++ b/packages/extension/src/providers/common/ui/send-transaction/nft-select-list/components/nft-select-list-item.vue
@@ -1,7 +1,7 @@
 <template>
   <a class="nft-select-list__token" @click="$emit('selectNft', item)">
     <div class="nft-select-list__token-info">
-      <img :src="item.image" />
+      <img :src="item.image" @error="imageLoadError" />
 
       <div class="nft-select-list__token-info-name">
         <h4>
@@ -26,6 +26,7 @@
 <script setup lang="ts">
 import { PropType } from 'vue';
 import { NFTItemWithCollectionName } from '@/types/nft';
+import { imageLoadError } from '@/ui/action/utils/misc';
 
 defineEmits<{
   (e: 'selectNft', data: NFTItemWithCollectionName): void;
diff --git a/packages/extension/src/providers/common/ui/send-transaction/send-nft-select.vue b/packages/extension/src/providers/common/ui/send-transaction/send-nft-select.vue
index 809fcbb3d..65a951781 100644
--- a/packages/extension/src/providers/common/ui/send-transaction/send-nft-select.vue
+++ b/packages/extension/src/providers/common/ui/send-transaction/send-nft-select.vue
@@ -2,7 +2,7 @@
   <div class="send-nft-select__wrap">
     <a class="send-nft-select" @click="$emit('toggleSelect', item.id !== '')">
       <div class="send-nft-select__image">
-        <img v-if="item.image !== ''" :src="item.image" alt="" />
+        <img :src="item.image" alt="" @error="imageLoadError" />
       </div>
       <div class="send-nft-select__info">
         <h5>
@@ -43,6 +43,7 @@
 import { PropType } from 'vue';
 import SwitchArrow from '@action/icons/header/switch_arrow.vue';
 import { NFTItemWithCollectionName } from '@/types/nft';
+import { imageLoadError } from '@/ui/action/utils/misc';
 
 defineEmits<{
   (e: 'toggleSelect', val: boolean): void;