[Ice] #70

Itheum · Aug 1, 2023 · f916a59 · f916a59
1 parent 3b74378
commit f916a59
Show file tree

Hide file tree

Showing 4 changed files with 39 additions and 5 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -27,6 +27,7 @@
     "react-dom": "18.2.0",
     "react-hot-toast": "2.4.0",
     "react-icons": "4.8.0",
+    "react-inlinesvg": "^3.0.2",
     "react-modal": "3.16.1",
     "react-router-dom": "6.4.2",
     "react-tooltip": "5.11.1",

diff --git a/src/libs/types/common.ts b/src/libs/types/common.ts
@@ -2,4 +2,5 @@ export enum BlobDataType {
   TEXT,
   IMAGE,
   AUDIO,
+  SVG,
 }
diff --git a/src/pages/MyWallet.tsx b/src/pages/MyWallet.tsx
@@ -5,6 +5,7 @@ import { useGetLoginInfo } from "@multiversx/sdk-dapp/hooks";
 import { ModalBody } from "react-bootstrap";
 import ModalHeader from "react-bootstrap/esm/ModalHeader";
 import { IoClose } from "react-icons/io5";
+import SVG from 'react-inlinesvg';
 import Modal from "react-modal";
 import { useNavigate, useParams } from "react-router-dom";
 import { DataNftCard, Loader, TrailBlazerModal } from "components";
@@ -111,10 +112,15 @@ export const MyWallet = () => {
     let blobDataType = BlobDataType.TEXT;
     if (!res.error) {
       if (res.contentType.search("image") >= 0) {
-        res.data = window.URL.createObjectURL(
-          new Blob([res.data], { type: res.contentType })
-        );
-        blobDataType = BlobDataType.IMAGE;
+        if (res.contentType == "image/svg+xml") {
+          blobDataType = BlobDataType.SVG;
+          res.data = await (res.data as Blob).text();
+        } else {
+          blobDataType = BlobDataType.IMAGE;
+          res.data = window.URL.createObjectURL(
+            new Blob([res.data], { type: res.contentType })
+          );
+        }
       } else if (res.contentType.search("audio") >= 0) {
         res.data = window.URL.createObjectURL(
           new Blob([res.data], { type: res.contentType })
@@ -371,6 +377,11 @@ export const MyWallet = () => {
                 >
                   <audio controls autoPlay src={viewDataRes.data} />
                 </div>
+              ) : viewDataRes.blobDataType === BlobDataType.SVG ? (
+                <SVG
+                  src={viewDataRes.data}
+                  style={{ width: "100%", height: "auto" }}
+                />
               ) : (
                 <p
                   className="p-2"
-Original file line number
+Diff line change
@@ Expand Up / @@ -2,4 +2,5 @@ export enum BlobDataType { @@
       TEXT,
       IMAGE,
       AUDIO,
+      SVG,
     }