From 865a8307e2b47789a47e85732f3c98858b30a345 Mon Sep 17 00:00:00 2001
From: yung soosh <sooshisan@protonmail.com>
Date: Tue, 12 Apr 2022 01:17:26 -0700
Subject: [PATCH] Enable the explorer to render content from data URIs (#24235)

* Enable explorer to render images from data URIs

* Add regex to check for image mime type
---
 explorer/src/providers/accounts/index.tsx | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/explorer/src/providers/accounts/index.tsx b/explorer/src/providers/accounts/index.tsx
index da1060cd19..1618ccde7a 100644
--- a/explorer/src/providers/accounts/index.tsx
+++ b/explorer/src/providers/accounts/index.tsx
@@ -317,6 +317,8 @@ async function fetchAccountInfo(
   });
 }
 
+const IMAGE_MIME_TYPE_REGEX = /data:image\/(svg\+xml|png|jpeg|gif)/g;
+
 const getMetaDataJSON = async (
   id: string,
   metadata: programs.metadata.MetadataData
@@ -331,9 +333,11 @@ const getMetaDataJSON = async (
       }
 
       if (extended?.image) {
-        extended.image = extended.image.startsWith("http")
-          ? extended.image
-          : `${metadata.data.uri}/${extended.image}`;
+        extended.image =
+          extended.image.startsWith("http") ||
+          IMAGE_MIME_TYPE_REGEX.test(extended.image)
+            ? extended.image
+            : `${metadata.data.uri}/${extended.image}`;
       }
 
       return extended;