fix(tokens): Adding support for mutable token data, including icons

package-lock.json

@@ -28,6 +28,7 @@
         "gatsby-source-filesystem": "4.7.0",
         "gatsby-transformer-sharp": "4.7.0",
         "https-browserify": "1.0.0",
+        "is-ipfs": "6.0.2",
         "jsonrpc-lite": "2.2.0",
         "p-queue": "7.2.0",
         "p-retry": "5.0.0",
@@ -15844,6 +15845,22 @@
         "node": ">=8"
       }
     },
+    "node_modules/is-ipfs": {
+      "version": "6.0.2",
+      "resolved": "https://registry.npmjs.org/is-ipfs/-/is-ipfs-6.0.2.tgz",
+      "integrity": "sha512-RinUnsggL4hlLoHlZcvs2+92OE46Uflg/YVU1m5fXhyDBS/zh3bq+i6Aw7IbzJZ9oZXJx26TgxpqCuCr+LH/DA==",
+      "dependencies": {
+        "iso-url": "^1.1.3",
+        "mafmt": "^10.0.0",
+        "multiaddr": "^10.0.0",
+        "multiformats": "^9.0.0",
+        "uint8arrays": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=14.0.0",
+        "npm": ">=6.0.0"
+      }
+    },
     "node_modules/is-map": {
       "version": "2.0.2",
       "resolved": "http://94.130.170.209:4873/is-map/-/is-map-2.0.2.tgz",
@@ -17177,6 +17194,14 @@
         "es5-ext": "~0.10.2"
       }
     },
+    "node_modules/mafmt": {
+      "version": "10.0.0",
+      "resolved": "https://registry.npmjs.org/mafmt/-/mafmt-10.0.0.tgz",
+      "integrity": "sha512-K1bziJOXcnepfztu+2Xy9FLKVLaFMDuspmiyJIYRxnO0WOxFSV7XKSdMxMrVZxcvg1+YjlTIvSGTImUHU2k4Aw==",
+      "dependencies": {
+        "multiaddr": "^10.0.0"
+      }
+    },
     "node_modules/make-dir": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-2.1.0.tgz",
@@ -41903,6 +41928,18 @@
         "ip-regex": "^4.0.0"
       }
     },
+    "is-ipfs": {
+      "version": "6.0.2",
+      "resolved": "https://registry.npmjs.org/is-ipfs/-/is-ipfs-6.0.2.tgz",
+      "integrity": "sha512-RinUnsggL4hlLoHlZcvs2+92OE46Uflg/YVU1m5fXhyDBS/zh3bq+i6Aw7IbzJZ9oZXJx26TgxpqCuCr+LH/DA==",
+      "requires": {
+        "iso-url": "^1.1.3",
+        "mafmt": "^10.0.0",
+        "multiaddr": "^10.0.0",
+        "multiformats": "^9.0.0",
+        "uint8arrays": "^3.0.0"
+      }
+    },
     "is-map": {
       "version": "2.0.2",
       "resolved": "http://94.130.170.209:4873/is-map/-/is-map-2.0.2.tgz",
@@ -42948,6 +42985,14 @@
         "es5-ext": "~0.10.2"
       }
     },
+    "mafmt": {
+      "version": "10.0.0",
+      "resolved": "https://registry.npmjs.org/mafmt/-/mafmt-10.0.0.tgz",
+      "integrity": "sha512-K1bziJOXcnepfztu+2Xy9FLKVLaFMDuspmiyJIYRxnO0WOxFSV7XKSdMxMrVZxcvg1+YjlTIvSGTImUHU2k4Aw==",
+      "requires": {
+        "multiaddr": "^10.0.0"
+      }
+    },
     "make-dir": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-2.1.0.tgz",

package.json

@@ -42,6 +42,7 @@
     "gatsby-source-filesystem": "4.7.0",
     "gatsby-transformer-sharp": "4.7.0",
     "https-browserify": "1.0.0",
+    "is-ipfs": "6.0.2",
     "jsonrpc-lite": "2.2.0",
     "p-queue": "7.2.0",
     "p-retry": "5.0.0",

src/components/admin-lte/tokens/index.js

@@ -7,7 +7,13 @@ import Spinner from '../../../images/loader.gif'
 // import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import SendTokens from './send-tokens'
 // import { SlpMutableData } from 'slp-mutable-data'
+import axios from 'axios'
+
+const isIpfs = require('is-ipfs')
+
+
 let _this
+
 class Tokens extends React.Component {
   constructor (props) {
     super(props)
@@ -270,22 +276,46 @@ class Tokens extends React.Component {
   // try to get mutable data from token id
   async handleMutableData (tokensArr) {
     try {
+      const bchWalletLib = _this.props.bchWallet
+      const bchjs = bchWalletLib.bchjs
+
       const tokens = []
       // const slpMutableLib = new SlpMutableData()
 
       for (let i = 0; i < tokensArr.length; i++) {
         const token = tokensArr[i]
-        // try {
-        //   const data = await slpMutableLib.get.mutableData(token.tokenId)
-        //   token.mutableData = data
-        //   // console.log(`data: ${JSON.stringify(data, null, 2)}`)
-        // } catch (error) {
-        //   // console.warn(error)
-        //   // Skip error
-        //   console.log(
-        //     `Could not access mutable data for ${token.ticker} (${token.tokenId})`
-        //   )
-        // }
+
+        try {
+          // Get token data from bch-api.
+          const tokenData = await bchjs.PsfSlpIndexer.getTokenData(token.tokenId)
+          // console.log(`tokenData ${i}: ${JSON.stringify(tokenData, null, 2)}`)
+
+          // Extract the raw CID.
+          const immutableCid = tokenData.immutableData.slice(7)
+          const mutableCid = tokenData.mutableData.slice(7)
+          // console.log(`immutableCid: ${immutableCid}`)
+          // console.log(`mutableCid: ${mutableCid}`)
+
+          // Get mutable data from Filecoin.
+          if (isIpfs.cid(mutableCid)) {
+            const mutableData = await axios.get(`https://${mutableCid}.ipfs.dweb.link/data.json`)
+            token.mutableData = mutableData.data
+            // console.log('token.mutableData: ', token.mutableData)
+          }
+
+          if (isIpfs.cid(immutableCid)) {
+            // Get immutable data from Filecoin.
+            const immutableData = await axios.get(`https://${immutableCid}.ipfs.dweb.link/data.json`)
+            token.immutableData = immutableData.data
+            // console.log('token.immutableData: ', token.immutableData)
+          }
+        } catch (error) {
+          console.warn(error)
+          // Skip error
+          console.log(
+            `Could not access mutable data for ${token.ticker} (${token.tokenId})`
+          )
+        }
 
         tokens.push(token)
       }