Merge pull request #452 from Concordium/BRO-9-add-addcis2tokens-to-th…

…e-wccd-example [BRO-9] Add addCIS2Tokens to the wCCD example
Concordium · Apr 4, 2024 · 9a48168 · 9a48168
2 parents 0b99f6c + ad8fcb8
commit 9a48168
Show file tree

Hide file tree

Showing 8 changed files with 563 additions and 11 deletions.
diff --git a/examples/eSealing/package.json b/examples/eSealing/package.json
@@ -13,7 +13,9 @@
         "react": "^18.1.0",
         "react-dom": "^18.1.0",
         "react-switch": "^7.0.0",
-        "sha256": "^0.2.0"
+        "rollup-plugin-node-polyfills": "^0.2.1",
+        "sha256": "^0.2.0",
+        "vite-plugin-node-polyfills": "^0.21.0"
     },
     "devDependencies": {
         "@types/node": "^18.7.23",

diff --git a/examples/eSealing/vite.config.ts b/examples/eSealing/vite.config.ts
@@ -5,6 +5,7 @@ import svgr from 'vite-plugin-svgr';
 // @ts-ignore
 import wasm from 'vite-plugin-wasm';
 import topLevelAwait from 'vite-plugin-top-level-await';
+import { nodePolyfills } from 'vite-plugin-node-polyfills';
 
 export default defineConfig({
     plugins: [
@@ -13,9 +14,15 @@ export default defineConfig({
         wasm(),
         topLevelAwait(), // For legacy browser compatibility
     ],
+    build: {
+        rollupOptions: {
+            plugins: [nodePolyfills()],
+        },
+    },
     resolve: {
         alias: {
             '@concordium/rust-bindings': '@concordium/rust-bindings/bundler', // Resolve bundler-specific wasm entrypoints.
+            stream: 'rollup-plugin-node-polyfills/polyfills/stream',
         },
     },
 });
diff --git a/examples/voting/package.json b/examples/voting/package.json
@@ -13,6 +13,8 @@
         "react-dom": "^18.2.0",
         "react-qr-code": "^2.0.8",
         "react-router-dom": "^6.4.0",
+        "rollup-plugin-node-polyfills": "^0.2.1",
+        "vite-plugin-node-polyfills": "^0.21.0",
         "web-vitals": "^2.1.4"
     },
     "devDependencies": {

diff --git a/examples/voting/vite.config.ts b/examples/voting/vite.config.ts
@@ -5,6 +5,7 @@ import svgr from 'vite-plugin-svgr';
 // @ts-ignore
 import wasm from 'vite-plugin-wasm';
 import topLevelAwait from 'vite-plugin-top-level-await';
+import { nodePolyfills } from 'vite-plugin-node-polyfills';
 
 export default defineConfig({
     plugins: [
@@ -13,9 +14,15 @@ export default defineConfig({
         wasm(),
         topLevelAwait(), // For legacy browser compatibility
     ],
+    build: {
+        rollupOptions: {
+            plugins: [nodePolyfills()],
+        },
+    },
     resolve: {
         alias: {
             '@concordium/rust-bindings': '@concordium/rust-bindings/bundler', // Resolve bundler-specific wasm entrypoints.
+            stream: 'rollup-plugin-node-polyfills/polyfills/stream',
         },
     },
 });
diff --git a/examples/wCCD/package.json b/examples/wCCD/package.json
@@ -10,7 +10,9 @@
         "@walletconnect/types": "^2.1.4",
         "mathjs": "^11.4.0",
         "react": "^18.1.0",
-        "react-dom": "^18.1.0"
+        "react-dom": "^18.1.0",
+        "rollup-plugin-node-polyfills": "^0.2.1",
+        "vite-plugin-node-polyfills": "^0.21.0"
     },
     "devDependencies": {
         "@types/node": "^18.7.23",

diff --git a/examples/wCCD/src/wCCD.tsx b/examples/wCCD/src/wCCD.tsx
@@ -19,7 +19,13 @@ import {
 import * as leb from '@thi.ng/leb128';
 import { multiply, round } from 'mathjs';
 
-import { useGrpcClient, WalletConnectionProps, useConnect, useConnection } from '@concordium/react-components';
+import {
+    useGrpcClient,
+    WalletConnectionProps,
+    useConnect,
+    useConnection,
+    BrowserWalletConnector,
+} from '@concordium/react-components';
 import { wrap, unwrap } from './utils';
 import {
     CONTRACT_SUB_INDEX,
@@ -130,6 +136,18 @@ async function updateWCCDBalanceAccount(rpcClient: ConcordiumGRPCClient, account
     return BigInt(leb.decodeULEB128(toBuffer(ReturnValue.toHexString(res.returnValue).slice(4), 'hex'))[0]);
 }
 
+function addWCDToWallet(
+    _accountAddress: string,
+    connection: BrowserWalletConnector,
+    tokenIds: string[],
+    contractAddressSource: number | bigint,
+    contractSubindex: number | bigint
+) {
+    const accountAddress = AccountAddress.fromBase58(_accountAddress);
+    const contractAddress = ContractAddress.create(contractAddressSource, contractSubindex);
+    return connection.client.addCIS2Tokens(accountAddress, tokenIds, contractAddress);
+}
+
 interface ConnectionProps {
     walletConnectionProps: WalletConnectionProps;
     wCCDContractIndex: bigint;
@@ -430,6 +448,20 @@ export default function wCCD(props: ConnectionProps) {
                             {isWrapping ? 'Wrap' : 'Unwrap'}
                         </button>
                     )}
+                    {connection instanceof BrowserWalletConnector && activeConnectorType === BROWSER_WALLET && (
+                        <button
+                            style={account === undefined ? ButtonStyleDisabled : ButtonStyle}
+                            type="button"
+                            disabled={account === undefined}
+                            onClick={() => {
+                                if (account) {
+                                    addWCDToWallet(account, connection, [''], wCCDContractIndex, CONTRACT_SUB_INDEX);
+                                }
+                            }}
+                        >
+                            Add Token to wallet
+                        </button>
+                    )}
                 </label>
                 {connection && (
                     <>

diff --git a/examples/wCCD/vite.config.ts b/examples/wCCD/vite.config.ts
@@ -5,6 +5,7 @@ import svgr from 'vite-plugin-svgr';
 // @ts-ignore
 import wasm from 'vite-plugin-wasm';
 import topLevelAwait from 'vite-plugin-top-level-await';
+import { nodePolyfills } from 'vite-plugin-node-polyfills';
 
 export default defineConfig({
     plugins: [
@@ -13,12 +14,18 @@ export default defineConfig({
         wasm(),
         topLevelAwait(), // For legacy browser compatibility
     ],
+    build: {
+        rollupOptions: {
+            plugins: [nodePolyfills()],
+        },
+    },
     define: {
         'process.env.NETWORK': process.env.NETWORK ?? 'testnet',
     },
     resolve: {
         alias: {
             '@concordium/rust-bindings': '@concordium/rust-bindings/bundler', // Resolve bundler-specific wasm entrypoints.
+            stream: 'rollup-plugin-node-polyfills/polyfills/stream',
         },
     },
 });