Merge pull request #393 from Concordium/replace-jsonRPC-with-GRPC-in-…

…WCCD-dapp Replace jsonRPC with gRPC
Concordium · Oct 9, 2023 · b3ec062 · b3ec062
2 parents 7adb1cb + b77a3ba
commit b3ec062
Show file tree

Hide file tree

Showing 7 changed files with 103 additions and 136 deletions.
diff --git a/examples/wCCD/CHANGELOG.md b/examples/wCCD/CHANGELOG.md
@@ -1,5 +1,9 @@
 # Changelog
 
+# 4.1.0
+
+-   Migrate dApp from using deprecated JSON-RPC client to new gRPC client.
+
 ## 4.0.0
 
 ### Added

diff --git a/examples/wCCD/package.json b/examples/wCCD/package.json
@@ -1,10 +1,10 @@
 {
     "name": "wccd",
     "packageManager": "[email protected]",
-    "version": "4.0.0",
+    "version": "4.1.0",
     "license": "Apache-2.0",
     "dependencies": {
-        "@concordium/react-components": "^0.2.0",
+        "@concordium/react-components": "^0.3.0",
         "@concordium/web-sdk": "^6.3.0",
         "@thi.ng/leb128": "^2.1.18",
         "@walletconnect/types": "^2.1.4",
@@ -26,6 +26,9 @@
         "ts-node": "^10.8.0",
         "typescript": "^5.2.2"
     },
+    "resolutions": {
+        "@concordium/web-sdk": "^6.3.0"
+    },
     "scripts": {
         "build": "NETWORK='testnet' node --loader ts-node/esm ./esbuild.config.ts; cp ./src/assets/* ./dist",
         "build:prod": "NETWORK='mainnet' node --loader ts-node/esm ./esbuild.config.ts; cp ./src/assets/* ./dist",

diff --git a/examples/wCCD/src/Root.tsx b/examples/wCCD/src/Root.tsx
@@ -1,9 +1,9 @@
 import React from 'react';
-import { Network, WithWalletConnector } from '@concordium/react-components';
+import { Network, WithWalletConnector, MAINNET, TESTNET } from '@concordium/react-components';
 import { version } from '../package.json';
 
 import WCCD from './wCCD';
-import { MAINNET, TESTNET } from './constants';
+import { WCCD_CONTRACT_INDEX_MAINNET, WCCD_CONTRACT_INDEX_TESTNET } from './constants';
 
 /**
  * Connect to wallet, setup application state context, and render children when the wallet API is ready for use.
@@ -13,19 +13,24 @@ export default function Root() {
     const mainnet = 'mainnet';
 
     let NETWORK: Network;
+    let wCCDContractIndex: bigint;
 
     if (process.env.NETWORK === mainnet) {
         NETWORK = MAINNET;
+        wCCDContractIndex = WCCD_CONTRACT_INDEX_MAINNET;
     } else if (process.env.NETWORK === testnet) {
         NETWORK = TESTNET;
+        wCCDContractIndex = WCCD_CONTRACT_INDEX_TESTNET;
     } else {
         throw Error('Environmental variable NETWORK needs to be defined and set to either "mainnet" or "testnet"');
     }
 
     return (
         <div>
             <main className="wccd">
-                <WithWalletConnector network={NETWORK}>{(props) => <WCCD {...props} />}</WithWalletConnector>
+                <WithWalletConnector network={NETWORK}>
+                    {(props) => <WCCD walletConnectionProps={props} wCCDContractIndex={wCCDContractIndex} />}
+                </WithWalletConnector>
                 <div>
                     Version: {version} |{' '}
                     <a

diff --git a/examples/wCCD/src/constants.ts b/examples/wCCD/src/constants.ts
@@ -1,10 +1,5 @@
 // The TESTNET_GENESIS_BLOCK_HASH is used to check that the user has its browser wallet connected to testnet and not to mainnet.
-import {
-    Network,
-    BrowserWalletConnector,
-    ephemeralConnectorType,
-    WalletConnectConnector,
-} from '@concordium/react-components';
+import { BrowserWalletConnector, ephemeralConnectorType, WalletConnectConnector } from '@concordium/react-components';
 import { SignClientTypes } from '@walletconnect/types';
 
 export const CONTRACT_NAME = 'cis2_wCCD';
@@ -36,23 +31,6 @@ export const WALLET_CONNECT = ephemeralConnectorType(
     WalletConnectConnector.create.bind(undefined, WALLET_CONNECT_OPTS)
 );
 
-// The GENESIS_BLOCK_HASH is used to check that the user has its browser wallet connected to testnet and not to mainnet.
-export const MAINNET_GENESIS_BLOCK_HASH = '9dd9ca4d19e9393877d2c44b70f89acbfc0883c2243e5eeaecc0d1cd0503f478';
-export const TESTNET_GENESIS_BLOCK_HASH = '4221332d34e1694168c2a0c0b3fd0f273809612cb13d000d5c2e00e85f50f796';
-
-export const MAINNET: Network = {
-    name: 'mainnet',
-    genesisHash: MAINNET_GENESIS_BLOCK_HASH,
-    jsonRpcUrl: 'https://json-rpc.mainnet.concordium.software',
-    ccdScanBaseUrl: 'https://ccdscan.io',
-};
-export const TESTNET: Network = {
-    name: 'testnet',
-    genesisHash: TESTNET_GENESIS_BLOCK_HASH,
-    jsonRpcUrl: 'https://json-rpc.testnet.concordium.com',
-    ccdScanBaseUrl: 'https://testnet.ccdscan.io',
-};
-
 /** If you want to test admin functions of the wCCD contract,
  * it will be necessary to instantiate your own wCCD contract using an account available in the browser wallet,
  * and change these constants to match the indexes of the instances.

diff --git a/examples/wCCD/src/utils.ts b/examples/wCCD/src/utils.ts
@@ -1,6 +1,6 @@
 import { createContext } from 'react';
-import { AccountTransactionType, UpdateContractPayload, CcdAmount } from '@concordium/web-sdk';
-import { WalletConnection } from '@concordium/react-components';
+import { AccountTransactionType, CcdAmount } from '@concordium/web-sdk';
+import { WalletConnection, moduleSchemaFromBase64 } from '@concordium/react-components';
 import { CONTRACT_NAME, WRAP_FUNCTION_RAW_SCHEMA, UNWRAP_FUNCTION_RAW_SCHEMA } from './constants';
 
 /**
@@ -18,6 +18,13 @@ export async function wrap(
         throw new Error('invalid amount');
     }
 
+    const parameter = {
+        data: '',
+        to: {
+            Account: [receiver],
+        },
+    };
+
     return connection.signAndSendTransaction(
         account,
         AccountTransactionType.Update,
@@ -29,14 +36,11 @@ export async function wrap(
             },
             receiveName: `${CONTRACT_NAME}.wrap`,
             maxContractExecutionEnergy: 30000n,
-        } as UpdateContractPayload,
-        {
-            data: '',
-            to: {
-                Account: [receiver],
-            },
         },
-        WRAP_FUNCTION_RAW_SCHEMA
+        {
+            parameters: parameter,
+            schema: moduleSchemaFromBase64(WRAP_FUNCTION_RAW_SCHEMA),
+        }
     );
 }
 
@@ -55,6 +59,17 @@ export async function unwrap(
         throw new Error('invalid amount');
     }
 
+    const parameter = {
+        amount: amount.toString(),
+        data: '',
+        owner: {
+            Account: [account],
+        },
+        receiver: {
+            Account: [receiver],
+        },
+    };
+
     return connection.signAndSendTransaction(
         account,
         AccountTransactionType.Update,
@@ -68,16 +83,9 @@ export async function unwrap(
             maxContractExecutionEnergy: 30000n,
         },
         {
-            amount: amount.toString(),
-            data: '',
-            owner: {
-                Account: [account],
-            },
-            receiver: {
-                Account: [receiver],
-            },
-        },
-        UNWRAP_FUNCTION_RAW_SCHEMA
+            parameters: parameter,
+            schema: moduleSchemaFromBase64(UNWRAP_FUNCTION_RAW_SCHEMA),
+        }
     );
 }