feat: update nft descriptor

Author: abarmat

contracts/base/SubgraphNFTDescriptor.sol

@@ -2,22 +2,79 @@
 
 pragma solidity ^0.7.6;
 
+import "base64-sol/base64.sol";
+import "@openzeppelin/contracts/utils/Strings.sol";
+
 import "./ISubgraphNFTDescriptor.sol";
 
 /// @title Describes subgraph NFT tokens via URI
 contract SubgraphNFTDescriptor is ISubgraphNFTDescriptor {
+    string private constant SUBGRAPH_ENDPOINT =
+        "https://api.thegraph.com/subgraphs/name/juanmardefago/dev-subgraph";
+
+    function generateSVGImage(uint256 _subgraphID) internal view returns (string memory) {
+        // TODO: remove whitespaces
+        return
+            string(
+                abi.encodePacked(
+                    '<svg id="svg">',
+                    '<script type="text/javascript">',
+                    '  fetch("',
+                    SUBGRAPH_ENDPOINT,
+                    '", {',
+                    '    "headers": {"accept": "*/*","content-type": "application/json"},',
+                    '    "body": "{\\"operationName\\":\\"subgraph\\", \\"variables\\":{\\"id\\":\\"',
+                    Strings.toString(_subgraphID),
+                    '\\"}, \\"query\\":\\"query subgraph($id: ID!) {subgraphs(where: { nftID: $id}) { id displayName image }}\\"}",',
+                    '    "method": "POST",',
+                    "  })"
+                    "  .then(res => { return res.json()})",
+                    "  .then(json => {",
+                    '    var svg = document.getElementById("svg");',
+                    '    var textContainer = document.createElementNS("http://www.w3.org/2000/svg", "text");',
+                    '    textContainer.setAttributeNS(null, "x", 5);',
+                    '    textContainer.setAttributeNS(null, "y", 15);',
+                    "    var txt = document.createTextNode(json?.data?.subgraphs[0]?.displayName);",
+                    "    textContainer.appendChild(txt);",
+                    '    var image = document.createElementNS("http://www.w3.org/2000/svg", "image");',
+                    '    image.setAttributeNS(null, "width", 200);',
+                    '    image.setAttributeNS(null, "href", json?.data?.subgraphs[0]?.image);',
+                    "    svg.appendChild(image);",
+                    "    svg.appendChild(textContainer);",
+                    "  })",
+                    "  </script>",
+                    "</svg>"
+                )
+            );
+    }
+
     /// @inheritdoc ISubgraphNFTDescriptor
     function tokenURI(IGNS _gns, uint256 _subgraphID)
         external
         view
         override
         returns (string memory)
     {
-        // TODO: fancy implementation
-        // uint256 signal = _gns.subgraphSignal(_subgraphID);
-        // uint256 tokens = _gns.subgraphTokens(_subgraphID);
-        // id
-        // owner
-        return "";
+        string memory image = Base64.encode(bytes(generateSVGImage(_subgraphID)));
+        return
+            string(
+                abi.encodePacked(
+                    "data:application/json;base64,",
+                    Base64.encode(
+                        bytes(
+                            abi.encodePacked(
+                                '{"name":"',
+                                "name",
+                                '", "description":"',
+                                "description"
+                                '", "image": "',
+                                "data:image/svg+xml;base64,",
+                                image,
+                                '"}'
+                            )
+                        )
+                    )
+                )
+            );
     }
 }

package.json

@@ -43,6 +43,7 @@
     "@typescript-eslint/typescript-estree": "^4.0.0",
     "@urql/core": "^2.1.3",
     "axios": "^0.21.1",
+    "base64-sol": "^1.1.0",
     "bignumber.js": "^9.0.0",
     "chai": "^4.3.4",
     "cli-table": "^0.3.6",

yarn.lock

@@ -2487,6 +2487,11 @@ base64-js@^1.3.1:
   resolved "https://registry.yarnpkg.com/base64-js/-/base64-js-1.5.1.tgz#1b1b440160a5bf7ad40b650f095963481903930a"
   integrity sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==
 
+base64-sol@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/base64-sol/-/base64-sol-1.1.0.tgz#39c3c91a35790b6eb3b8e73114b46bacf0fc2865"
+  integrity sha512-mksLxtFyBcXd3LYK5UxyMj29YR//zoaeXpJaKRbnLQC0E99oCJl7VpKaJDXWAuTvnhxBU9XNYzhxSL8umsrxWg==
+
 base@^0.11.1:
   version "0.11.2"
   resolved "https://registry.yarnpkg.com/base/-/base-0.11.2.tgz#7bde5ced145b6d551a90db87f83c558b4eb48a8f"