Merge pull request #958 from liquality/ext-238/Ethereum-nft-ipfs-image-fix

bradleySuira · web-flow · commit 0e16aeb45eec · 2022-12-13T07:12:09.000-05:00
Ext 238 | Ethereum nft IPFS image fix
diff --git a/src/views/Details/NFTAssetDetails.vue b/src/views/Details/NFTAssetDetails.vue
@@ -54,7 +54,11 @@
         <div class="nft-img">
           <img
             ref="nftImage"
-            :src="nftAsset?.image_original_url || nftAsset?.image_preview_url || thumbnailImage"
+            :src="
+              assetOriginalImageUrl(nftAsset?.image_original_url) ||
+              nftAsset?.image_preview_url ||
+              thumbnailImage
+            "
             :alt="nftAsset?.name || 'NFT Asset'"
             @error="imageError('nftImage')"
           />
@@ -331,6 +335,9 @@ export default {
       if (ref) {
         this.$refs[ref].src = this.thumbnailImage
       }
+    },
+    assetOriginalImageUrl(url) {
+      return url.replace('ipfs://', 'https://ipfs.io/ipfs/')
     }
   }
 }

Original file line number	Diff line number	Diff line change
`@@ -54,7 +54,11 @@`
`54`	`54`	`<div class="nft-img">`
`55`	`55`	`<img`
`56`	`56`	`ref="nftImage"`
`57`		`- :src="nftAsset?.image_original_url \|\| nftAsset?.image_preview_url \|\| thumbnailImage"`
	`57`	`+ :src="`
	`58`	`+ assetOriginalImageUrl(nftAsset?.image_original_url) \|\|`
	`59`	`+ nftAsset?.image_preview_url \|\|`
	`60`	`+ thumbnailImage`
	`61`	`+ "`
`58`	`62`	`:alt="nftAsset?.name \|\| 'NFT Asset'"`
`59`	`63`	`@error="imageError('nftImage')"`
`60`	`64`	`/>`
`@@ -331,6 +335,9 @@ export default {`
`331`	`335`	`if (ref) {`
`332`	`336`	`this.$refs[ref].src = this.thumbnailImage`
`333`	`337`	`}`
	`338`	`+ },`
	`339`	`+ assetOriginalImageUrl(url) {`
	`340`	`+ return url.replace('ipfs://', 'https://ipfs.io/ipfs/')`
`334`	`341`	`}`
`335`	`342`	`}`
`336`	`343`	`}`