feat: add display during did-auth when acquire_asset

blocklet · Mar 24, 2021 · 9d03a16 · 9d03a16
1 parent 2bf362a
commit 9d03a16
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 15 deletions.
diff --git a/api/libs/nft/display/index.js b/api/libs/nft/display/index.js
@@ -1,4 +1,15 @@
-const create = data => `<svg width="100%" height="100%" viewBox="0 0 374 130" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+const getNftName = ({ type }) => {
+  const names = {
+    NodePurchaseCredential: 'ABT Node Purchase Receipt',
+    NodeOwnerCredential: 'Proof of ABT Node Ownership',
+    BlockletPurchaseCredential: 'Blocklet Purchase Receipt',
+  };
+
+  const key = Object.keys(names).find(x => type.includes(x));
+  return names[key];
+};
+
+const create = (vc, data) => `<svg width="100%" height="100%" viewBox="0 0 374 130" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
   <rect rx="4" ry="4" width="374" height="130" stroke="none" fill="#2f3036" />
   <svg x="3" y="3" width="368" height="124" fill="none">
     <defs>
@@ -19,7 +30,7 @@ const create = data => `<svg width="100%" height="100%" viewBox="0 0 374 130" ve
     </g>
   </svg>
   <text x="187" y="20" text-anchor="middle" font-size="10" font-family="Arial,Helvetica,sans-serif" fill="#4E6AF6">
-    ${data.name}
+    ${getNftName(vc)}
   </text>
   <svg x="146" y="24" width="82" height="1">
     <defs>

diff --git a/api/routes/auth/acquire_asset.js b/api/routes/auth/acquire_asset.js
@@ -5,6 +5,7 @@ const { preMintFromFactory } = require('@ocap/asset');
 
 const { formatFactoryState, factories, inputs } = require('../../libs/factory');
 const { wallet } = require('../../libs/auth');
+const { create } = require('../../libs/nft/display');
 
 const app = SDK.Wallet.fromJSON(wallet);
 
@@ -30,8 +31,22 @@ module.exports = {
 
       logger.info('preMint', { factory, preMint });
 
+      const vc = preMint.asset.data.value;
+      const display = {
+        type: 'svg',
+        content: create(vc, {
+          owner: userDid,
+          issuer: 'ocap-playground',
+          description: state.description,
+          date: vc.issuanceDate,
+        }),
+      };
+
+      console.log({ display });
+
       return {
         type: 'AcquireAssetV2Tx',
+        display: JSON.stringify(display), // Since the asset is not minted yet, we need to tell ABT Wallet how to display it
         data: {
           // The tx must from user
           from: userDid,

diff --git a/api/routes/nft.js b/api/routes/nft.js
@@ -6,17 +6,6 @@ const { create } = require('../libs/nft/display');
 
 const options = { ignoreFields: ['state.context'] };
 
-const getNftName = type => {
-  const names = {
-    NodePurchaseCredential: 'ABT Node Purchase Receipt',
-    NodeOwnerCredential: 'Proof of ABT Node Ownership',
-    BlockletPurchaseCredential: 'Blocklet Purchase Receipt',
-  };
-
-  const key = Object.keys(names).find(x => type.includes(x));
-  return names[key];
-};
-
 module.exports = {
   init(app) {
     app.get('/api/nft/display', async (req, res) => {
@@ -49,8 +38,7 @@ module.exports = {
 
       res.type('svg');
       res.send(
-        create({
-          name: getNftName(vc.type),
+        create(vc, {
           owner: ownerState.address,
           issuer: issuerState.moniker,
           description: factoryState.description,