fix: Webapps fail to load when the browser doesn't have MetaMask inst…

…alled (#419) Co-authored-by: Satyajeet Kolhapure <[email protected]>
Consensys · Nov 22, 2023 · b038a7e · b038a7e
1 parent 5bf528a
commit b038a7e
Show file tree

Hide file tree

Showing 7 changed files with 27 additions and 17 deletions.
diff --git a/sdk/src/VeraxSdk.ts b/sdk/src/VeraxSdk.ts
@@ -19,7 +19,7 @@ if (typeof window === "undefined") {
   const dotenv = require("dotenv");
   dotenv.config({ path: "./.env" });
   account = privateKeyToAccount(process.env.PRIVATE_KEY as Hex);
-} else {
+} else if (typeof window.ethereum !== "undefined") {
   window.ethereum.request({ method: "eth_requestAccounts" }).then((result: Address[]) => {
     account = result[0];
   });
@@ -57,7 +57,7 @@ export class VeraxSdk {
   };
 
   private readonly web3Client: PublicClient;
-  private readonly walletClient: WalletClient;
+  private readonly walletClient: WalletClient | undefined;
 
   public attestation: AttestationDataMapper;
   public schema: SchemaDataMapper;
@@ -71,18 +71,22 @@ export class VeraxSdk {
       transport: http(),
     });
 
-    this.walletClient =
-      conf.mode === SDKMode.BACKEND
-        ? createWalletClient({
-            chain: conf.chain,
-            account,
-            transport: http(),
-          })
-        : createWalletClient({
-            chain: conf.chain,
-            account,
-            transport: custom(window.ethereum),
-          });
+    if (typeof account === "undefined") {
+      this.walletClient = undefined;
+    } else {
+      this.walletClient =
+        conf.mode === SDKMode.BACKEND
+          ? createWalletClient({
+              chain: conf.chain,
+              account,
+              transport: http(),
+            })
+          : createWalletClient({
+              chain: conf.chain,
+              account,
+              transport: custom(window.ethereum),
+            });
+    }
 
     this.attestation = new AttestationDataMapper(conf, this.web3Client, this.walletClient, this);
     this.schema = new SchemaDataMapper(conf, this.web3Client, this.walletClient, this);

diff --git a/sdk/src/dataMapper/AttestationDataMapper.ts b/sdk/src/dataMapper/AttestationDataMapper.ts
@@ -166,6 +166,7 @@ export default class AttestationDataMapper extends BaseDataMapper<
   }
 
   private async simulateContract(functionName: string, args: unknown[]) {
+    if (!this.walletClient) throw new Error("Account not available");
     try {
       const { request } = await this.web3Client.simulateContract({
         address: this.conf.attestationRegistryAddress,

diff --git a/sdk/src/dataMapper/BaseDataMapper.ts b/sdk/src/dataMapper/BaseDataMapper.ts
@@ -8,12 +8,12 @@ import axios from "axios";
 export default abstract class BaseDataMapper<T, TFilter, TOrder> {
   protected readonly conf: Conf;
   protected readonly web3Client: PublicClient;
-  protected readonly walletClient: WalletClient;
+  protected readonly walletClient: WalletClient | undefined;
   protected readonly veraxSdk: VeraxSdk;
   protected abstract typeName: string;
   protected abstract gqlInterface: string;
 
-  constructor(_conf: Conf, _web3Client: PublicClient, _walletClient: WalletClient, _veraxSdk: VeraxSdk) {
+  constructor(_conf: Conf, _web3Client: PublicClient, _walletClient: WalletClient | undefined, _veraxSdk: VeraxSdk) {
     this.conf = _conf;
     this.web3Client = _web3Client;
     this.walletClient = _walletClient;

diff --git a/sdk/src/dataMapper/ModuleDataMapper.ts b/sdk/src/dataMapper/ModuleDataMapper.ts
@@ -129,6 +129,7 @@ export default class ModuleDataMapper extends BaseDataMapper<Module, Module_filt
   }
 
   private async simulateContract(functionName: string, args: unknown[]) {
+    if (!this.walletClient) throw new Error("Account not available");
     try {
       const { request } = await this.web3Client.simulateContract({
         address: this.conf.moduleRegistryAddress,

diff --git a/sdk/src/dataMapper/PortalDataMapper.ts b/sdk/src/dataMapper/PortalDataMapper.ts
@@ -209,6 +209,7 @@ export default class PortalDataMapper extends BaseDataMapper<Portal, Portal_filt
   }
 
   private async simulatePortalRegistryContract(functionName: string, args: unknown[]) {
+    if (!this.walletClient) throw new Error("Account not available");
     try {
       const { request } = await this.web3Client.simulateContract({
         address: this.conf.portalRegistryAddress,
@@ -225,6 +226,7 @@ export default class PortalDataMapper extends BaseDataMapper<Portal, Portal_filt
   }
 
   private async simulatePortalContract(portalAddress: Address, functionName: string, args: unknown[]) {
+    if (!this.walletClient) throw new Error("Account not available");
     try {
       const { request } = await this.web3Client.simulateContract({
         address: portalAddress,

diff --git a/sdk/src/dataMapper/SchemaDataMapper.ts b/sdk/src/dataMapper/SchemaDataMapper.ts
@@ -73,6 +73,7 @@ export default class SchemaDataMapper extends BaseDataMapper<Schema, Schema_filt
   }
 
   private async simulateContract(functionName: string, args: unknown[]) {
+    if (!this.walletClient) throw new Error("Account not available");
     try {
       const { request } = await this.web3Client.simulateContract({
         address: this.conf.schemaRegistryAddress,

diff --git a/sdk/src/utils/transactionSender.ts b/sdk/src/utils/transactionSender.ts
@@ -2,7 +2,8 @@ import { Hash, WalletClient } from "viem";
 
 // TODO: Use correct type for request
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-export async function executeTransaction(walletClient: WalletClient, request: any): Promise<Hash> {
+export async function executeTransaction(walletClient: WalletClient | undefined, request: any): Promise<Hash> {
+  if (walletClient === undefined) throw new Error("Account not available");
   const hash: Hash = await walletClient.writeContract(request);
   console.log(`Transaction sent with hash ${hash}`);
   return hash;