Version Packages (#1121)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

packages/auth/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @thirdweb-dev/auth
 
+## 3.1.1
+
+### Patch Changes
+
+- [#1126](https://github.com/thirdweb-dev/js/pull/1126) [`ab14cd89`](https://github.com/thirdweb-dev/js/commit/ab14cd89385aefad7f32e20a22baa9fce42b98e2) Thanks [@adam-maj](https://github.com/adam-maj)! - Add expiration date to cookie
+
+- Updated dependencies [[`2a443365`](https://github.com/thirdweb-dev/js/commit/2a443365bdc3d47d0f41fc895f70256dcde423f5), [`197a6838`](https://github.com/thirdweb-dev/js/commit/197a6838f69ae8b9ad46524e7c469fc757d0a2cb)]:
+  - @thirdweb-dev/wallets@0.2.26
+
 ## 3.1.0
 
 ### Minor Changes

packages/auth/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thirdweb-dev/auth",
-  "version": "3.1.0",
+  "version": "3.1.1",
   "main": "dist/thirdweb-dev-auth.cjs.js",
   "module": "dist/thirdweb-dev-auth.esm.js",
   "browser": {

packages/auth/src/core/auth.ts

@@ -14,6 +14,7 @@ import {
   User,
   Json,
   LoginOptionsSchema,
+  AuthenticationPayload,
 } from "./schema";
 import { isBrowser } from "./utils";
 import type { GenericAuthWallet } from "@thirdweb-dev/wallets";
@@ -286,12 +287,7 @@ export class ThirdwebAuth {
     const parsedOptions = AuthenticateOptionsSchema.parse(options);
     const domain = parsedOptions?.domain || this.domain;
 
-    const encodedPayload = token.split(".")[1];
-    const encodedSignature = token.split(".")[2];
-    const payload: AuthenticationPayloadData = JSON.parse(
-      Buffer.from(encodedPayload, "base64").toString(),
-    );
-    const signature = Buffer.from(encodedSignature, "base64").toString();
+    const { payload, signature } = this.parseToken(token);
 
     // Check that the payload unique ID is valid
     if (parsedOptions?.validateTokenId !== undefined) {
@@ -359,6 +355,20 @@ export class ThirdwebAuth {
     };
   }
 
+  public parseToken(token: string): AuthenticationPayload {
+    const encodedPayload = token.split(".")[1];
+    const encodedSignature = token.split(".")[2];
+    const payload: AuthenticationPayloadData = JSON.parse(
+      Buffer.from(encodedPayload, "base64").toString(),
+    );
+    const signature = Buffer.from(encodedSignature, "base64").toString();
+
+    return {
+      payload,
+      signature,
+    };
+  }
+
   private async verifySignature(
     message: string,
     signature: string,

packages/auth/src/express/routes/login.ts

@@ -64,6 +64,10 @@ export default async function handler(
     }
   }
 
+  const {
+    payload: { exp },
+  } = ctx.auth.parseToken(token);
+
   // Securely set httpOnly cookie on request to prevent XSS on frontend
   // And set path to / to enable thirdweb_auth_token usage on all endpoints
   res.setHeader(
@@ -72,6 +76,7 @@ export default async function handler(
       domain: ctx.cookieOptions?.domain,
       path: ctx.cookieOptions?.path || "/",
       sameSite: ctx.cookieOptions?.sameSite || "none",
+      expires: new Date(exp * 1000),
       httpOnly: true,
       secure: true,
     }),

packages/auth/src/next/routes/login.ts

@@ -64,6 +64,10 @@ export default async function handler(
     }
   }
 
+  const {
+    payload: { exp },
+  } = ctx.auth.parseToken(token);
+
   // Securely set httpOnly cookie on request to prevent XSS on frontend
   // And set path to / to enable thirdweb_auth_token usage on all endpoints
   res.setHeader(
@@ -72,6 +76,7 @@ export default async function handler(
       domain: ctx.cookieOptions?.domain,
       path: ctx.cookieOptions?.path || "/",
       sameSite: ctx.cookieOptions?.sameSite || "none",
+      expires: new Date(exp * 1000),
       httpOnly: true,
       secure: true,
     }),

packages/chains/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @thirdweb-dev/chains
 
+## 0.1.20
+
+### Patch Changes
+
+- [#1140](https://github.com/thirdweb-dev/js/pull/1140) [`16232de9`](https://github.com/thirdweb-dev/js/commit/16232de9eab9966e24e335929b2a3919346af265) Thanks [@kumaryash90](https://github.com/kumaryash90)! - Update chains
+
+- [#1138](https://github.com/thirdweb-dev/js/pull/1138) [`645b0303`](https://github.com/thirdweb-dev/js/commit/645b0303cc1a9cbb0a0e9cbd67d11c3b865e4584) Thanks [@jcstein](https://github.com/jcstein)! - feat: create Taro Testnet
+
 ## 0.1.19
 
 ### Patch Changes

packages/chains/chains/111000.ts

@@ -0,0 +1,40 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "Siberium Test Network",
+  "chain": "SBR",
+  "rpc": [
+    "https://siberium-test-network.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://rpc.test.siberium.net"
+  ],
+  "faucets": [],
+  "nativeCurrency": {
+    "name": "TestSIBR",
+    "symbol": "SIBR",
+    "decimals": 18
+  },
+  "infoURL": "https://siberium.net",
+  "shortName": "testsbr",
+  "chainId": 111000,
+  "networkId": 111000,
+  "icon": {
+    "url": "ipfs://QmYeMdWDZ1iaBFeSPorRyPi7RuSXTdDKTgW3rfnUf3W5ne",
+    "width": 512,
+    "height": 512,
+    "format": "svg"
+  },
+  "explorers": [
+    {
+      "name": "Siberium Testnet Explorer - blockscout",
+      "url": "https://explorer.test.siberium.net",
+      "icon": {
+        "url": "ipfs://QmYeMdWDZ1iaBFeSPorRyPi7RuSXTdDKTgW3rfnUf3W5ne",
+        "width": 512,
+        "height": 512,
+        "format": "svg"
+      },
+      "standard": "EIP3091"
+    }
+  ],
+  "testnet": true,
+  "slug": "siberium-test-network"
+} as const satisfies Chain;

packages/chains/chains/1440.ts

@@ -0,0 +1,28 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "Living Assets Mainnet",
+  "chain": "LAS",
+  "icon": {
+    "url": "ipfs://QmRidubY7BVwC737BQwGEttenP1npAXN7ZNryktE416uUW",
+    "width": 500,
+    "height": 500,
+    "format": "jpg"
+  },
+  "rpc": [
+    "https://living-assets.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://beta.mainnet.livingassets.io/rpc",
+    "https://gamma.mainnet.livingassets.io/rpc"
+  ],
+  "faucets": [],
+  "nativeCurrency": {
+    "name": "LAS",
+    "symbol": "LAS",
+    "decimals": 18
+  },
+  "infoURL": "https://dev.livingassets.io/",
+  "shortName": "LAS",
+  "chainId": 1440,
+  "networkId": 1440,
+  "testnet": false,
+  "slug": "living-assets"
+} as const satisfies Chain;

packages/chains/chains/1582.ts

@@ -0,0 +1,36 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "Taro Testnet",
+  "chain": "gETH",
+  "shortName": "Taro",
+  "chainId": 1582,
+  "testnet": true,
+  "icon": {
+    "format": "svg",
+    "url": "ipfs://bafybeibfpls2ealp4e5fdeoxessfjjkldgjnrcx2erph7524pg7alskk6a/1f9cb.svg",
+    "width": 512,
+    "height": 512
+  },
+  "rpc": [
+    "https://taro-testnet.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://taro-testnet.calderachain.xyz/http"
+  ],
+  "nativeCurrency": {
+    "decimals": 18,
+    "name": "Ether",
+    "symbol": "gETH"
+  },
+  "explorers": [
+    {
+      "url": "https://explorer.tarotestnet.com",
+      "name": "Taro Testnet Explorer",
+      "standard": "EIP3091"
+    }
+  ],
+  "faucets": [
+    "https://tarotestnet.com"
+  ],
+  "infoURL": "https://tarotestnet.com",
+  "networkId": 1582,
+  "slug": "taro-testnet"
+} as const satisfies Chain;

packages/chains/chains/167004.ts

@@ -1,34 +0,0 @@
-import type { Chain } from "../src/types";
-export default {
-  "name": "Taiko (Alpha-2 Testnet)",
-  "chain": "ETH",
-  "icon": {
-    "url": "ipfs://QmcHdmVr5VRUJq13jnM6tgah5Ge7hn3Dm14eY6vwivJ5ui",
-    "width": 288,
-    "height": 258,
-    "format": "png"
-  },
-  "rpc": [
-    "https://taiko-alpha-2-testnet.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
-    "https://rpc.a2.taiko.xyz"
-  ],
-  "faucets": [],
-  "nativeCurrency": {
-    "name": "Ether",
-    "symbol": "ETH",
-    "decimals": 18
-  },
-  "infoURL": "https://taiko.xyz",
-  "shortName": "taiko-a2",
-  "chainId": 167004,
-  "networkId": 167004,
-  "explorers": [
-    {
-      "name": "blockscout",
-      "url": "https://explorer.a2.taiko.xyz",
-      "standard": "EIP3091"
-    }
-  ],
-  "testnet": true,
-  "slug": "taiko-alpha-2-testnet"
-} as const satisfies Chain;

packages/chains/chains/3141.ts

@@ -1,59 +0,0 @@
-import type { Chain } from "../src/types";
-export default {
-  "name": "Filecoin - Hyperspace testnet",
-  "chain": "FIL",
-  "icon": {
-    "url": "ipfs://QmS9r9XQkMHVomWcSBNDkKkz9n87h9bH9ssabeiKZtANoU",
-    "width": 1000,
-    "height": 1000,
-    "format": "png"
-  },
-  "rpc": [
-    "https://filecoin-hyperspace-testnet.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
-    "https://api.hyperspace.node.glif.io/rpc/v1",
-    "https://rpc.ankr.com/filecoin_testnet",
-    "https://filecoin-hyperspace.chainstacklabs.com/rpc/v1"
-  ],
-  "faucets": [
-    "https://hyperspace.yoga/#faucet"
-  ],
-  "nativeCurrency": {
-    "name": "testnet filecoin",
-    "symbol": "tFIL",
-    "decimals": 18
-  },
-  "infoURL": "https://filecoin.io",
-  "shortName": "filecoin-hyperspace",
-  "chainId": 3141,
-  "networkId": 3141,
-  "slip44": 1,
-  "explorers": [
-    {
-      "name": "Filfox - Hyperspace",
-      "url": "https://hyperspace.filfox.info/en",
-      "standard": "none"
-    },
-    {
-      "name": "Glif Explorer - Hyperspace",
-      "url": "https://explorer.glif.io/?network=hyperspace",
-      "standard": "none"
-    },
-    {
-      "name": "Beryx",
-      "url": "https://beryx.zondax.ch",
-      "standard": "none"
-    },
-    {
-      "name": "Dev.storage",
-      "url": "https://dev.storage",
-      "standard": "none"
-    },
-    {
-      "name": "Filscan - Hyperspace",
-      "url": "https://hyperspace.filscan.io",
-      "standard": "none"
-    }
-  ],
-  "testnet": true,
-  "slug": "filecoin-hyperspace-testnet"
-} as const satisfies Chain;

packages/chains/chains/31415.ts

@@ -1,31 +0,0 @@
-import type { Chain } from "../src/types";
-export default {
-  "name": "Filecoin - Wallaby testnet",
-  "chain": "FIL",
-  "icon": {
-    "url": "ipfs://QmS9r9XQkMHVomWcSBNDkKkz9n87h9bH9ssabeiKZtANoU",
-    "width": 1000,
-    "height": 1000,
-    "format": "png"
-  },
-  "rpc": [
-    "https://filecoin-wallaby-testnet.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
-    "https://wallaby.node.glif.io/rpc/v1"
-  ],
-  "faucets": [
-    "https://wallaby.yoga/#faucet"
-  ],
-  "nativeCurrency": {
-    "name": "testnet filecoin",
-    "symbol": "tFIL",
-    "decimals": 18
-  },
-  "infoURL": "https://filecoin.io",
-  "shortName": "filecoin-wallaby",
-  "chainId": 31415,
-  "networkId": 31415,
-  "slip44": 1,
-  "explorers": [],
-  "testnet": true,
-  "slug": "filecoin-wallaby-testnet"
-} as const satisfies Chain;

packages/chains/chains/314159.ts

@@ -10,7 +10,10 @@ export default {
   },
   "rpc": [
     "https://filecoin-calibration-testnet.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
-    "https://api.calibration.node.glif.io/rpc/v1"
+    "https://api.calibration.node.glif.io/rpc/v1",
+    "https://rpc.ankr.com/filecoin_testnet",
+    "https://filecoin-calibration.chainstacklabs.com/rpc/v1",
+    "https://filecoin-calibration.chainup.net/rpc/v1"
   ],
   "faucets": [
     "https://faucet.calibration.fildev.network/"
@@ -40,6 +43,16 @@ export default {
       "name": "Filfox - Calibration",
       "url": "https://calibration.filfox.info",
       "standard": "none"
+    },
+    {
+      "name": "Glif Explorer - Calibration",
+      "url": "https://explorer.glif.io/?network=calibration",
+      "standard": "none"
+    },
+    {
+      "name": "Beryx",
+      "url": "https://beryx.zondax.ch",
+      "standard": "none"
     }
   ],
   "testnet": true,

packages/chains/chains/333331.ts

@@ -0,0 +1,48 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "Aves Testnet",
+  "chain": "AVST",
+  "rpc": [
+    "https://aves-testnet.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://test.rpc.avescoin.io"
+  ],
+  "faucets": [],
+  "nativeCurrency": {
+    "name": "AvesT",
+    "symbol": "AVST",
+    "decimals": 18
+  },
+  "features": [
+    {
+      "name": "EIP155"
+    },
+    {
+      "name": "EIP1559"
+    }
+  ],
+  "infoURL": "https://ethereum.org",
+  "shortName": "avst",
+  "chainId": 333331,
+  "networkId": 333331,
+  "icon": {
+    "url": "ipfs://QmeKQVv2QneHaaggw2NfpZ7DGMdjVhPywTdse5RzCs4oGn",
+    "width": 232,
+    "height": 232,
+    "format": "png"
+  },
+  "explorers": [
+    {
+      "name": "avescan",
+      "url": "https://testnet.avescoin.io",
+      "icon": {
+        "url": "ipfs://QmeKQVv2QneHaaggw2NfpZ7DGMdjVhPywTdse5RzCs4oGn",
+        "width": 232,
+        "height": 232,
+        "format": "png"
+      },
+      "standard": "EIP3091"
+    }
+  ],
+  "testnet": true,
+  "slug": "aves-testnet"
+} as const satisfies Chain;

packages/chains/chains/471100.ts

@@ -0,0 +1,21 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "Patex Sepolia Testnet",
+  "chain": "ETH",
+  "rpc": [
+    "https://patex-sepolia-testnet.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://test-rpc.patex.io/"
+  ],
+  "faucets": [],
+  "nativeCurrency": {
+    "name": "Sepolia Ether",
+    "symbol": "ETH",
+    "decimals": 18
+  },
+  "infoURL": "https://patex.io/",
+  "shortName": "psep",
+  "chainId": 471100,
+  "networkId": 471100,
+  "testnet": true,
+  "slug": "patex-sepolia-testnet"
+} as const satisfies Chain;

packages/chains/chains/592.ts

@@ -4,6 +4,7 @@ export default {
   "chain": "ASTR",
   "rpc": [
     "https://astar.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://evm.astar.network",
     "https://rpc.astar.network:8545"
   ],
   "faucets": [],

packages/chains/chains/786.ts

@@ -0,0 +1,36 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "MAAL Sharia Chain",
+  "chain": "MAAL",
+  "icon": {
+    "url": "ipfs://bafkreiexfqfe2x4impvwhra3xxa5eb25gv25zi3kkaoatdnld7wbxdzf2a",
+    "width": 512,
+    "height": 512,
+    "format": "png"
+  },
+  "rpc": [
+    "https://maal-sharia-chain.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://node1-mainnet.maalscan.io/",
+    "https://node2-mainnet.maalscan.io/",
+    "https://node3-mainnet.maalscan.io/"
+  ],
+  "faucets": [],
+  "nativeCurrency": {
+    "name": "MAAL",
+    "symbol": "MAAL",
+    "decimals": 18
+  },
+  "infoURL": "https://www.maalblockchain.com/",
+  "shortName": "maal",
+  "chainId": 786,
+  "networkId": 786,
+  "explorers": [
+    {
+      "name": "maalscan",
+      "url": "https://maalscan.io",
+      "standard": "EIP3091"
+    }
+  ],
+  "testnet": false,
+  "slug": "maal-sharia-chain"
+} as const satisfies Chain;

packages/chains/chains/789.ts

@@ -0,0 +1,21 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "Patex",
+  "chain": "ETH",
+  "rpc": [
+    "https://patex.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://rpc.patex.io/"
+  ],
+  "faucets": [],
+  "nativeCurrency": {
+    "name": "Ether",
+    "symbol": "ETH",
+    "decimals": 18
+  },
+  "infoURL": "https://patex.io/",
+  "shortName": "peth",
+  "chainId": 789,
+  "networkId": 789,
+  "testnet": false,
+  "slug": "patex"
+} as const satisfies Chain;

packages/chains/chains/91002.ts

@@ -0,0 +1,37 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "Nautilus Chain",
+  "title": "Nautilus Trition Testnet",
+  "chain": "ETH",
+  "icon": {
+    "url": "ipfs://QmNutSgM7n6aJPPDiofe9Dm1epy1RcYTMvugukLUK2vmPM",
+    "width": 500,
+    "height": 500,
+    "format": "png"
+  },
+  "rpc": [
+    "https://nautilus-chain.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://triton.api.nautchain.xyz"
+  ],
+  "faucets": [
+    "https://faucet.eclipse.builders"
+  ],
+  "nativeCurrency": {
+    "name": "Nautilus Zebec Testnet Tokens",
+    "symbol": "tZBC",
+    "decimals": 18
+  },
+  "infoURL": "https://docs.nautchain.xyz",
+  "shortName": "NAUT",
+  "chainId": 91002,
+  "networkId": 91002,
+  "explorers": [
+    {
+      "name": "Nautscan",
+      "url": "https://triton.nautscan.com",
+      "standard": "EIP3091"
+    }
+  ],
+  "testnet": true,
+  "slug": "nautilus-chain"
+} as const satisfies Chain;

packages/chains/chains/999.ts

@@ -1,21 +1,26 @@
 import type { Chain } from "../src/types";
 export default {
-  "name": "Wanchain Testnet",
-  "chain": "WAN",
+  "name": "Zora Testnet",
+  "chain": "ETH",
   "rpc": [
-    "https://wanchain-testnet.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
-    "https://gwan-ssl.wandevs.org:46891/"
+    "https://zora-testnet.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://testnet.rpc.zora.co/"
   ],
   "faucets": [],
   "nativeCurrency": {
-    "name": "Wancoin",
-    "symbol": "WAN",
+    "name": "Ether",
+    "symbol": "GETH",
     "decimals": 18
   },
-  "infoURL": "https://testnet.wanscan.org",
-  "shortName": "twan",
+  "icon": {
+    "url": "ipfs://QmZ6qaRwTPFEZUspwMUjaxC6KhmzcELdRQcQzS3P72Dzts/Vector.svg",
+    "height": 512,
+    "width": 512,
+    "format": "svg"
+  },
+  "shortName": "Zora",
   "chainId": 999,
   "networkId": 999,
   "testnet": true,
-  "slug": "wanchain-testnet"
+  "slug": "zora-testnet"
 } as const satisfies Chain;

packages/chains/data/additional/1582.mjs

@@ -0,0 +1,33 @@
+// @ts-check
+/** @typedef { import("../../src/types").Chain } Chain */
+
+/** @type {Omit<Chain, "slug">} */
+export default {
+  name: "Taro Testnet",
+  chain: "gETH",
+  shortName: "Taro",
+  chainId: 1582,
+  testnet: true,
+  icon: {
+    format: "svg",
+    url: "ipfs://bafybeibfpls2ealp4e5fdeoxessfjjkldgjnrcx2erph7524pg7alskk6a/1f9cb.svg",
+    width: 512,
+    height: 512,
+  },
+  rpc: ["https://taro-testnet.calderachain.xyz/http"],
+  nativeCurrency: {
+    decimals: 18,
+    name: "Ether",
+    symbol: "gETH",
+  },
+  explorers: [
+    {
+      url: "https://explorer.tarotestnet.com",
+      name: "Taro Testnet Explorer",
+      standard: "EIP3091",
+    },
+  ],
+  faucets: ["https://tarotestnet.com"],
+  infoURL: "https://tarotestnet.com",
+  networkId: 1582,
+};

packages/chains/data/additional/999.mjs

@@ -0,0 +1,25 @@
+// @ts-check
+/** @typedef { import("../../src/types").Chain } Chain */
+
+/** @type {Omit<Chain, "slug">} */
+export default {
+  name: "Zora Testnet",
+  chain: "ETH",
+  rpc: ["https://testnet.rpc.zora.co/"],
+  faucets: [],
+  nativeCurrency: {
+    name: "Ether",
+    symbol: "GETH",
+    decimals: 18,
+  },
+  icon: {
+    url: "ipfs://QmZ6qaRwTPFEZUspwMUjaxC6KhmzcELdRQcQzS3P72Dzts/Vector.svg",
+    height: 512,
+    width: 512,
+    format: "svg",
+  },
+  shortName: "Zora",
+  chainId: 999,
+  networkId: 999,
+  testnet: true,
+};

packages/chains/data/overrides/592.mjs

@@ -0,0 +1,7 @@
+// @ts-check
+/** @typedef { import("../../src/types").Chain } Chain */
+
+/** @type {Partial<Chain>} */
+export default {
+  rpc: ["https://evm.astar.network"],
+};

packages/chains/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thirdweb-dev/chains",
-  "version": "0.1.19",
+  "version": "0.1.20",
   "main": "dist/thirdweb-dev-chains.cjs.js",
   "module": "dist/thirdweb-dev-chains.esm.js",
   "browser": {

packages/chains/scripts/generate-package.mjs

@@ -54,6 +54,8 @@ for (const file of additionalChainsFiles) {
   const additionalChain = await import(
     path.join("file://", additionalChainsDir, file)
   );
+
+  chains = chains.filter((c) => c.chainId !== additionalChain.default.chainId);
   chains.push(additionalChain.default);
 }
 

packages/cli/CHANGELOG.md

@@ -1,5 +1,13 @@
 # thirdweb
 
+## 0.10.22
+
+### Patch Changes
+
+- Updated dependencies [[`3bf7f375`](https://github.com/thirdweb-dev/js/commit/3bf7f375933cbd7dd8c682a66e8c67bbcb268bf7), [`16232de9`](https://github.com/thirdweb-dev/js/commit/16232de9eab9966e24e335929b2a3919346af265), [`8687d6ac`](https://github.com/thirdweb-dev/js/commit/8687d6ac3a363eae63eeb1959a953cbcd282d353), [`645b0303`](https://github.com/thirdweb-dev/js/commit/645b0303cc1a9cbb0a0e9cbd67d11c3b865e4584), [`522453fd`](https://github.com/thirdweb-dev/js/commit/522453fd568b8c350141a96f9f1c6d5a3ef74493), [`6803c3e9`](https://github.com/thirdweb-dev/js/commit/6803c3e97ca74eed19cd90095afde25b02150d51), [`56f85e57`](https://github.com/thirdweb-dev/js/commit/56f85e57df84bfa93e3230639c95d12466f8aec7), [`6a91b6a0`](https://github.com/thirdweb-dev/js/commit/6a91b6a0253bab5914d4ebdad951dd1c5d141fbc), [`a5f16b6d`](https://github.com/thirdweb-dev/js/commit/a5f16b6dc50b37920a6e5210b60aa6a1682ceb63), [`b6728603`](https://github.com/thirdweb-dev/js/commit/b6728603972ccd6c95108b25e8562807f0f95e19), [`ed47fd53`](https://github.com/thirdweb-dev/js/commit/ed47fd5310d11323080d984bca18a96fdef3a977)]:
+  - @thirdweb-dev/sdk@3.10.21
+  - @thirdweb-dev/chains@0.1.20
+
 ## 0.10.21
 
 ### Patch Changes

packages/cli/package.json

@@ -1,7 +1,7 @@
 {
   "name": "thirdweb",
   "main": "dist/cli/index.js",
-  "version": "0.10.21",
+  "version": "0.10.22",
   "repository": "https://github.com/thirdweb-dev/js/tree/main/packages/cli",
   "author": "thirdweb eng <[email protected]>",
   "license": "Apache-2.0",

packages/react-core/CHANGELOG.md

@@ -1,5 +1,26 @@
 # @thirdweb-dev/react-core
 
+## 3.13.1
+
+### Patch Changes
+
+- [#1145](https://github.com/thirdweb-dev/js/pull/1145) [`6a194262`](https://github.com/thirdweb-dev/js/commit/6a19426200297b8da158c7d860d31efcc8c15822) Thanks [@nachoiacovino](https://github.com/nachoiacovino)! - Add hook to check if a smart wallet has been deployed for the given admin
+
+- [#1123](https://github.com/thirdweb-dev/js/pull/1123) [`54cfd6d8`](https://github.com/thirdweb-dev/js/commit/54cfd6d8916c42d87b6aa438e607ce525766b686) Thanks [@nachoiacovino](https://github.com/nachoiacovino)! - Update useCreateSmartWallet
+
+- [#1136](https://github.com/thirdweb-dev/js/pull/1136) [`9a015a23`](https://github.com/thirdweb-dev/js/commit/9a015a23cde09c8ba6c36593a84303ffe409a79a) Thanks [@MananTank](https://github.com/MananTank)! - Logout user on wallet account switch
+
+- [#1119](https://github.com/thirdweb-dev/js/pull/1119) [`0cba69ca`](https://github.com/thirdweb-dev/js/commit/0cba69ca40a8cf6f106344247d0082212cd169da) Thanks [@nachoiacovino](https://github.com/nachoiacovino)! - Export smart wallet factory hooks
+
+- [#1146](https://github.com/thirdweb-dev/js/pull/1146) [`e32faeb5`](https://github.com/thirdweb-dev/js/commit/e32faeb57a5c2193c40cb6129fab92b84069b12d) Thanks [@nachoiacovino](https://github.com/nachoiacovino)! - Fix return type for useIsSmartWalletDeployed
+
+- [#1144](https://github.com/thirdweb-dev/js/pull/1144) [`9ce3eb6a`](https://github.com/thirdweb-dev/js/commit/9ce3eb6aad957aff38fb4a25383ed17ff58e988f) Thanks [@MananTank](https://github.com/MananTank)! - Remove WalletConfig.config object from wallets
+
+- Updated dependencies [[`2a443365`](https://github.com/thirdweb-dev/js/commit/2a443365bdc3d47d0f41fc895f70256dcde423f5), [`3bf7f375`](https://github.com/thirdweb-dev/js/commit/3bf7f375933cbd7dd8c682a66e8c67bbcb268bf7), [`16232de9`](https://github.com/thirdweb-dev/js/commit/16232de9eab9966e24e335929b2a3919346af265), [`8687d6ac`](https://github.com/thirdweb-dev/js/commit/8687d6ac3a363eae63eeb1959a953cbcd282d353), [`645b0303`](https://github.com/thirdweb-dev/js/commit/645b0303cc1a9cbb0a0e9cbd67d11c3b865e4584), [`522453fd`](https://github.com/thirdweb-dev/js/commit/522453fd568b8c350141a96f9f1c6d5a3ef74493), [`6803c3e9`](https://github.com/thirdweb-dev/js/commit/6803c3e97ca74eed19cd90095afde25b02150d51), [`56f85e57`](https://github.com/thirdweb-dev/js/commit/56f85e57df84bfa93e3230639c95d12466f8aec7), [`197a6838`](https://github.com/thirdweb-dev/js/commit/197a6838f69ae8b9ad46524e7c469fc757d0a2cb), [`6a91b6a0`](https://github.com/thirdweb-dev/js/commit/6a91b6a0253bab5914d4ebdad951dd1c5d141fbc), [`a5f16b6d`](https://github.com/thirdweb-dev/js/commit/a5f16b6dc50b37920a6e5210b60aa6a1682ceb63), [`b6728603`](https://github.com/thirdweb-dev/js/commit/b6728603972ccd6c95108b25e8562807f0f95e19), [`ed47fd53`](https://github.com/thirdweb-dev/js/commit/ed47fd5310d11323080d984bca18a96fdef3a977)]:
+  - @thirdweb-dev/wallets@0.2.26
+  - @thirdweb-dev/sdk@3.10.21
+  - @thirdweb-dev/chains@0.1.20
+
 ## 3.13.0
 
 ### Minor Changes

packages/react-core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thirdweb-dev/react-core",
-  "version": "3.13.0",
+  "version": "3.13.1",
   "repository": "https://github.com/thirdweb-dev/js/tree/main/packages/react-core",
   "author": "thirdweb eng <[email protected]>",
   "license": "Apache-2.0",

packages/react-core/src/core/providers/thirdweb-provider.tsx

@@ -1,4 +1,4 @@
-import { ThirdwebAuthProvider } from "../../evm/contexts/thirdweb-auth";
+import { ThirdwebAuthProvider } from "../../evm/contexts/ThirdwebAuthProvider";
 import { useUpdateChainsWithApiKeys } from "../../evm/hooks/chain-hooks";
 import { ThirdwebSDKProvider } from "../../evm/providers/thirdweb-sdk-provider";
 import { ThirdwebSDKProviderProps } from "../../evm/providers/types";

packages/react-core/src/core/providers/thirdweb-wallet-provider.tsx

@@ -42,26 +42,23 @@ type WalletConnectParams<I extends WalletInstance> = Parameters<
 
 type ConnectionStatus = "unknown" | "connected" | "disconnected" | "connecting";
 
-type ConnectFnArgs<
-  I extends WalletInstance,
-  Config extends Record<string, any> | undefined,
-> =
+type ConnectFnArgs<I extends WalletInstance> =
   // if second argument is optional
   undefined extends WalletConnectParams<I>
     ? [
-        wallet: WalletConfig<I, Config>,
+        wallet: WalletConfig<I>,
         connectParams?: NonNullable<WalletConnectParams<I>>,
       ]
     : // if second argument is required
       [
-        wallet: WalletConfig<I, Config>,
+        wallet: WalletConfig<I>,
         connectParams: NonNullable<WalletConnectParams<I>>,
       ];
 
 // maps wallet instance to it's wallet config
 const walletInstanceToConfig: Map<
   WalletInstance,
-  WalletConfig<any, any>
+  WalletConfig<any>
 > = new Map();
 
 type ThirdwebWalletContextData = {
@@ -69,20 +66,12 @@ type ThirdwebWalletContextData = {
   signer?: Signer;
   activeWallet?: WalletInstance;
   activeWalletConfig?: WalletConfig;
-  connect: <
-    I extends WalletInstance,
-    Config extends Record<string, any> | undefined = undefined,
-  >(
-    ...args: ConnectFnArgs<I, Config>
-  ) => Promise<I>;
+  connect: <I extends WalletInstance>(...args: ConnectFnArgs<I>) => Promise<I>;
   disconnect: () => Promise<void>;
   connectionStatus: ConnectionStatus;
   setConnectionStatus: (status: ConnectionStatus) => void;
-  createWalletInstance: <
-    I extends WalletInstance,
-    Config extends Record<string, any> | undefined,
-  >(
-    Wallet: WalletConfig<I, Config>,
+  createWalletInstance: <I extends WalletInstance>(
+    Wallet: WalletConfig<I>,
   ) => I;
   createdWalletInstance?: WalletInstance;
   createWalletStorage: CreateAsyncStorage;
@@ -155,9 +144,7 @@ export function ThirdwebWalletProvider(
   }, [props.chains, props.dAppMeta, props.activeChain, theme]);
 
   const createWalletInstance = useCallback(
-    <I extends WalletInstance, Config extends Record<string, any> | undefined>(
-      walletConfig: WalletConfig<I, Config>,
-    ): I => {
+    <I extends WalletInstance>(walletConfig: WalletConfig<I>): I => {
       const walletInstance = walletConfig.create(walletParams);
       if (walletInstance.walletId === walletIds.magicLink) {
         // NOTE: removing this if statement causes the component to re-render
@@ -314,14 +301,7 @@ export function ThirdwebWalletProvider(
       const personalWalletInfo = walletInfo.connectParams?.personalWallet;
 
       if (personalWalletInfo) {
-        type Config = {
-          personalWallets: WalletConfig[];
-        };
-
-        const personalWallets =
-          "config" in walletObj
-            ? (walletObj.config as Config).personalWallets
-            : [];
+        const personalWallets = walletObj.personalWallets || [];
 
         const personalWalleObj = personalWallets.find(
           (W) => W.id === personalWalletInfo.walletId,
@@ -379,12 +359,7 @@ export function ThirdwebWalletProvider(
   ]);
 
   const connectWallet = useCallback(
-    async <
-      I extends WalletInstance,
-      Config extends Record<string, any> | undefined = undefined,
-    >(
-      ...args: ConnectFnArgs<I, Config>
-    ): Promise<I> => {
+    async <I extends WalletInstance>(...args: ConnectFnArgs<I>): Promise<I> => {
       const [WalletObj, connectParams] = args;
 
       const _connectedParams = {

packages/react-core/src/core/types/wallet.ts

@@ -23,32 +23,32 @@ export type WalletClass<I extends WalletInstance = WalletInstance> = {
   meta: (typeof AbstractClientWallet)["meta"];
 };
 
-export type WalletConfig<
-  I extends WalletInstance = WalletInstance,
-  Config extends Record<string, any> | undefined = undefined,
-> = {
+export type WalletConfig<I extends WalletInstance = WalletInstance> = {
   id: string;
   meta: (typeof AbstractClientWallet)["meta"];
   create: (options: WalletOptions) => I;
   /**
    * UI for connecting wallet
    */
-  connectUI?: React.FC<ConnectUIProps<I, Config>>;
+  connectUI?: React.FC<ConnectUIProps<I>>;
   /**
    * UI for selecting wallet - this UI is rendered in the wallet selection screen
    */
-  selectUI?: React.FC<SelectUIProps<I, Config>>;
+  selectUI?: React.FC<SelectUIProps<I>>;
   isInstalled?: () => boolean;
-} & (Config extends undefined
-  ? {}
-  : {
-      config: Config;
-    });
+  /**
+   * An array of `WalletConfig` that users can use as a personal wallet to connect to your wallet
+   *
+   * This is only required if your wallet requires a personal wallet to be connected such as a Safe Wallet or Smart Wallet
+   *
+   * providing the `personalWallets` ensures that autoconnect and ConnectWallet modal works properly for your wallet.
+   * * autoconnect will connect the last connected personal wallet first and then connect your wallet
+   * * ConnectWallet modal will reopen once the personal wallet is connected so that you can render UI for connecting your wallet as the next step
+   */
+  personalWallets?: WalletConfig[];
+};
 
-export type ConnectUIProps<
-  I extends WalletInstance = WalletInstance,
-  Config extends Record<string, any> | undefined = undefined,
-> = {
+export type ConnectUIProps<I extends WalletInstance = WalletInstance> = {
   /**
    * close the connect wallet modal
    * @param reset reset Connect Wallet Modal to initial state, so that if it's opened again, it will start from the wallet-selection screen
@@ -117,7 +117,7 @@ export type ConnectUIProps<
    * }
    * ```
    */
-  walletConfig: WalletConfig<I, Config>;
+  walletConfig: WalletConfig<I>;
 
   /**
    * selectionData passed from `selectUI`'s `onSelect` function
@@ -136,10 +136,7 @@ export type ConnectUIProps<
   supportedWallets: WalletConfig[];
 };
 
-export type SelectUIProps<
-  I extends WalletInstance = WalletInstance,
-  Config extends Record<string, any> | undefined = undefined,
-> = {
+export type SelectUIProps<I extends WalletInstance = WalletInstance> = {
   /**
    * Call this function to "select" your wallet and render the screen for connecting the wallet
    * @param selectionData - selectionData to be passed to `connectUI`'s `selectionData` prop
@@ -152,7 +149,7 @@ export type SelectUIProps<
    *
    * you can use this get metadata of your wallet by doing `walletConfig.meta`
    */
-  walletConfig: WalletConfig<I, Config>;
+  walletConfig: WalletConfig<I>;
 
   /**
    * List of all supported wallets including your wallet.

packages/react-core/src/evm/contexts/ThirdwebAuthProvider.tsx

@@ -0,0 +1,57 @@
+import React, { PropsWithChildren, useEffect, useMemo } from "react";
+import { useLogout, useUser } from "../hooks/auth";
+import { useWallet } from "../../core/hooks/wallet-hooks";
+import { ThirdwebAuthConfig, ThirdwebAuthContext } from "./thirdweb-auth";
+
+export const ThirdwebAuthProvider: React.FC<
+  PropsWithChildren<{ value?: ThirdwebAuthConfig }>
+> = ({ value, children }) => {
+  // Remove trailing slash from URL if present
+  const authContext = useMemo(() => {
+    if (!value) {
+      return undefined;
+    }
+
+    const context: ThirdwebAuthContext = {
+      ...value,
+      authUrl: value.authUrl?.replace(/\/$/, ""),
+    };
+
+    return context;
+  }, [value]);
+
+  return (
+    <ThirdwebAuthContext.Provider value={authContext}>
+      {children}
+      <DisconnectOnAccountSwitch />
+    </ThirdwebAuthContext.Provider>
+  );
+};
+function DisconnectOnAccountSwitch() {
+  const { logout } = useLogout();
+  const wallet = useWallet();
+  const { isLoggedIn } = useUser();
+
+  useEffect(() => {
+    const handleChange = (data: { address?: string; chainId?: number }) => {
+      // if the user changes their account, logout
+      if (data.address) {
+        logout();
+      }
+    };
+
+    const shouldAddListener = wallet && isLoggedIn;
+
+    if (shouldAddListener) {
+      wallet.addListener("change", handleChange);
+    }
+
+    return () => {
+      if (shouldAddListener) {
+        wallet.removeListener("change", handleChange);
+      }
+    };
+  }, [wallet, logout, isLoggedIn]);
+
+  return null;
+}

packages/react-core/src/evm/contexts/thirdweb-auth.tsx

@@ -1,9 +1,4 @@
-import React, {
-  PropsWithChildren,
-  createContext,
-  useContext,
-  useMemo,
-} from "react";
+import { createContext, useContext } from "react";
 
 export interface ISecureStorage {
   getItem(key: string): Promise<string | null>;
@@ -31,44 +26,21 @@ export interface ThirdwebAuthConfig {
 
   /**
    * Secure storage to use for storing the auth token when using JWT tokens.
-   * 
-   * Do not use a storage option that stores values accessible outside 
-   * your aplication (like localStorage on web environments) since you may 
+   *
+   * Do not use a storage option that stores values accessible outside
+   * your aplication (like localStorage on web environments) since you may
    * be exposing your auth token to malicious actors.
-   * 
+   *
    * ** By default auth uses cookies so no need to set this unless you want to specifically use JWT tokens **
    */
   secureStorage?: ISecureStorage;
 }
 
-interface ThirdwebAuthContext extends ThirdwebAuthConfig {}
+export interface ThirdwebAuthContext extends ThirdwebAuthConfig {}
 
-const ThirdwebAuthContext = createContext<ThirdwebAuthContext | undefined>(
-  undefined,
-);
-
-export const ThirdwebAuthProvider: React.FC<
-  PropsWithChildren<{ value?: ThirdwebAuthConfig }>
-> = ({ value, children }) => {
-  // Remove trailing slash from URL if present
-  const authContext = useMemo(() => {
-    if (!value) {
-      return undefined;
-    }
-
-    const context: ThirdwebAuthContext = {
-      ...value,
-      authUrl: value.authUrl?.replace(/\/$/, ""),
-    };
-
-    return context;
-  }, [value]);
-  return (
-    <ThirdwebAuthContext.Provider value={authContext}>
-      {children}
-    </ThirdwebAuthContext.Provider>
-  );
-};
+export const ThirdwebAuthContext = createContext<
+  ThirdwebAuthContext | undefined
+>(undefined);
 
 export function useThirdwebAuthContext() {
   return useContext(ThirdwebAuthContext);

packages/react-core/src/evm/hooks/async/smart-wallet-factory.ts

@@ -3,6 +3,7 @@ import {
   requiredParamInvariant,
 } from "../../../core/query-utils/required-param";
 import { useSDKChainId } from "../../providers/thirdweb-sdk-provider";
+import { WalletAddress } from "../../types";
 import {
   cacheKeys,
   invalidateContractAndBalances,
@@ -57,6 +58,41 @@ export function useSmartWallets(
   );
 }
 
+/**
+ * Check if a smart wallet has been deployed for the given admin
+ *
+ * @example
+ * ```javascript
+ * const { data: isSmartWalletDeployed, isLoading, error } = useIsSmartWalletDeployed(contract);
+ * ```
+ *
+ * @param contract - an instance of a smart wallet factory contract
+ * @returns a boolean indicating if a smart wallet has been deployed for the given admin
+ * @twfeature SmartWalletFactory
+ * @see {@link https://portal.thirdweb.com/react/react.useissmartwalletdeployed?utm_source=sdk | Documentation}
+ * @beta
+ */
+export function useIsSmartWalletDeployed(
+  contract: RequiredParam<SmartContract>,
+  admin: RequiredParam<WalletAddress>,
+  extraData?: BytesLike,
+): UseQueryResult<boolean> {
+  const contractAddress = contract?.getAddress();
+  return useQueryWithNetwork(
+    cacheKeys.contract.smartWalletFactory.getAll(contractAddress),
+    () => {
+      requiredParamInvariant(contract, "No Contract instance provided");
+      invariant(
+        contract.smartWalletFactory.isWalletDeployed,
+        "Contract instance does not support contract.smartWalletFactory.getAllWallets",
+      );
+      invariant(admin, "No wallet address provided");
+      return contract.smartWalletFactory.isWalletDeployed(admin, extraData);
+    },
+    { enabled: !!contract },
+  );
+}
+
 /** **********************/
 /**     WRITE HOOKS     **/
 /** **********************/
@@ -102,12 +138,12 @@ export function useCreateSmartWallet(
   const queryClient = useQueryClient();
 
   return useMutation(
-    async (data: { admin: string; extraData: BytesLike; }) => {
+    async (admin: string, extraData?: BytesLike) => {
       requiredParamInvariant(contract, "contract is undefined");
 
       return contract.smartWalletFactory.createWallet(
-        data.admin,
-        data.extraData,
+        admin,
+        extraData,
       );    
     },
     {

packages/react-core/src/evm/index.ts

@@ -47,10 +47,8 @@ export type {
 } from "../core/types/wallet";
 
 // auth
-export {
-  ThirdwebAuthProvider,
-  useThirdwebAuthContext,
-} from "./contexts/thirdweb-auth";
+export { useThirdwebAuthContext } from "./contexts/thirdweb-auth";
+export { ThirdwebAuthProvider } from "./contexts/ThirdwebAuthProvider";
 export type {
   ThirdwebAuthConfig,
   ISecureStorage,
@@ -194,6 +192,13 @@ export {
   useBurnToken,
 } from "./hooks/async/token";
 
+// smart wallet factory
+export {
+  useIsSmartWalletDeployed,
+  useSmartWallets,
+  useCreateSmartWallet,
+} from "./hooks/async/smart-wallet-factory";
+
 // thirdweb hooks (work as long as at least `<ThirdwebSdkProvider>` is used)
 
 // auth hooks

packages/react-native-compat/CHANGELOG.md

@@ -1,5 +1,7 @@
 # @thirdweb-dev/react-native-compat
 
+## 0.2.18
+
 ## 0.2.17
 
 ## 0.2.16

packages/react-native-compat/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@thirdweb-dev/react-native-compat",
   "description": "Shims for Thirdweb in React Native Projects",
-  "version": "0.2.17",
+  "version": "0.2.18",
   "author": "thirdweb eng <[email protected]>",
   "repository": "https://github.com/thirdweb-dev/js/tree/main/packages/react-native-compat",
   "license": "Apache-2.0",

packages/react-native/CHANGELOG.md

@@ -1,5 +1,84 @@
 # @thirdweb-dev/react-native
 
+## 0.2.18
+
+### Patch Changes
+
+- [#1137](https://github.com/thirdweb-dev/js/pull/1137) [`dec4c4a8`](https://github.com/thirdweb-dev/js/commit/dec4c4a8cfd3f3b257e537fa84ed038e781e6311) Thanks [@iketw](https://github.com/iketw)! - [ReactNative] Export WCV1 and WCV2 abstract classes to facilitate creation of wallet connect based wallets
+
+  You can now extend the abstract classes `WalletConnectV1` or `WalletConnectV2` and set your own metadata when implementing a wallet.
+
+  Find an example below implementing `MyWallet` that supports the `WalletConnectV2` protocol.
+
+  ```javascript
+  import {
+    WCMeta,
+    WalletConnectV2,
+    WalletOptions,
+    WalletConfig,
+  } from '@thirdweb-dev/react-native';
+
+  export class MyWallet extends WalletConnectV2 {
+    static id = 'mywallet' as const; // ID needed to identify your wallet in the SDK.
+    static meta = {
+      name: 'My Wallet', // Name that will show up in our Connect Modal.
+      iconURL:
+        'my-wallet-icon-url-ipfs-or-png', // Icon that will show up in our Connect Modal.
+      links: { // The WalletConnect mobile links.
+        native: 'mywallet://',
+        universal: 'https://mywallet.com',
+      },
+    };
+
+    getMeta(): WCMeta {
+      return MyWallet.meta;
+    }
+  }
+
+  /**
+   * The WalletConnectV2 projectId.
+   *
+   * We provide a default projectId but recommend you get your own
+   * when launching your app in production.
+   */
+  type MyWalletConfig = { projectId?: string };
+
+  export const myWallet = (config?: MyWalletConfig): WalletConfig<WalletConnectV2> => {
+    return {
+      id: MyWallet.id,
+      meta: MyWallet.meta,
+      create: (options: WalletOptions) =>
+        new MyWallet({
+          ...options,
+          projectId: config?.projectId,
+          walletId: MyWallet.id,
+        }),
+    };
+  };
+  ```
+
+  You can then use your new wallet in the `ThirdwebProvider`'s `supportedWallets` prop:
+
+  ```javascript
+  import { ThirdwebProvider } from "@thirdweb-dev/react-native";
+
+  <ThirdwebProvider supportedWallets={[myWallet()]}>
+    <App />
+  </ThirdwebProvider>;
+  ```
+
+- [#1151](https://github.com/thirdweb-dev/js/pull/1151) [`2a0294d8`](https://github.com/thirdweb-dev/js/commit/2a0294d8e67bbc08dcf59c79174a7626deb0e90a) Thanks [@MananTank](https://github.com/MananTank)! - Fix wrong balance in ConnectWallet
+
+- [#1135](https://github.com/thirdweb-dev/js/pull/1135) [`15ef4779`](https://github.com/thirdweb-dev/js/commit/15ef4779e0a95cbae3053bdecfd4d54e4c30b07b) Thanks [@iketw](https://github.com/iketw)! - [ReactNative] Exports base UI components (react-native/components/base). They can now be used in your application.
+
+- [#1144](https://github.com/thirdweb-dev/js/pull/1144) [`9ce3eb6a`](https://github.com/thirdweb-dev/js/commit/9ce3eb6aad957aff38fb4a25383ed17ff58e988f) Thanks [@MananTank](https://github.com/MananTank)! - Remove WalletConfig.config object from wallets
+
+- Updated dependencies [[`2a443365`](https://github.com/thirdweb-dev/js/commit/2a443365bdc3d47d0f41fc895f70256dcde423f5), [`3bf7f375`](https://github.com/thirdweb-dev/js/commit/3bf7f375933cbd7dd8c682a66e8c67bbcb268bf7), [`6a194262`](https://github.com/thirdweb-dev/js/commit/6a19426200297b8da158c7d860d31efcc8c15822), [`16232de9`](https://github.com/thirdweb-dev/js/commit/16232de9eab9966e24e335929b2a3919346af265), [`54cfd6d8`](https://github.com/thirdweb-dev/js/commit/54cfd6d8916c42d87b6aa438e607ce525766b686), [`8687d6ac`](https://github.com/thirdweb-dev/js/commit/8687d6ac3a363eae63eeb1959a953cbcd282d353), [`645b0303`](https://github.com/thirdweb-dev/js/commit/645b0303cc1a9cbb0a0e9cbd67d11c3b865e4584), [`522453fd`](https://github.com/thirdweb-dev/js/commit/522453fd568b8c350141a96f9f1c6d5a3ef74493), [`9a015a23`](https://github.com/thirdweb-dev/js/commit/9a015a23cde09c8ba6c36593a84303ffe409a79a), [`6803c3e9`](https://github.com/thirdweb-dev/js/commit/6803c3e97ca74eed19cd90095afde25b02150d51), [`0cba69ca`](https://github.com/thirdweb-dev/js/commit/0cba69ca40a8cf6f106344247d0082212cd169da), [`56f85e57`](https://github.com/thirdweb-dev/js/commit/56f85e57df84bfa93e3230639c95d12466f8aec7), [`197a6838`](https://github.com/thirdweb-dev/js/commit/197a6838f69ae8b9ad46524e7c469fc757d0a2cb), [`6a91b6a0`](https://github.com/thirdweb-dev/js/commit/6a91b6a0253bab5914d4ebdad951dd1c5d141fbc), [`e32faeb5`](https://github.com/thirdweb-dev/js/commit/e32faeb57a5c2193c40cb6129fab92b84069b12d), [`a5f16b6d`](https://github.com/thirdweb-dev/js/commit/a5f16b6dc50b37920a6e5210b60aa6a1682ceb63), [`b6728603`](https://github.com/thirdweb-dev/js/commit/b6728603972ccd6c95108b25e8562807f0f95e19), [`ed47fd53`](https://github.com/thirdweb-dev/js/commit/ed47fd5310d11323080d984bca18a96fdef3a977), [`9ce3eb6a`](https://github.com/thirdweb-dev/js/commit/9ce3eb6aad957aff38fb4a25383ed17ff58e988f)]:
+  - @thirdweb-dev/[email protected]
+  - @thirdweb-dev/[email protected]
+  - @thirdweb-dev/[email protected]
+  - @thirdweb-dev/[email protected]
+
 ## 0.2.17
 
 ### Patch Changes

packages/react-native/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thirdweb-dev/react-native",
-  "version": "0.2.17",
+  "version": "0.2.18",
   "repository": "https://github.com/thirdweb-dev/js/tree/main/packages/react-native",
   "author": "thirdweb eng <[email protected]>",
   "license": "Apache-2.0",

packages/react-native/src/evm/components/ConnectWallet.tsx

@@ -1,68 +1,26 @@
-import { ThemeProvider, ThemeProviderProps } from "../styles/ThemeProvider";
-import { ConnectWalletDetails } from "./ConnectWalletDetails/ConnectWalletDetails";
-import {
-  useAddress,
-  useConnectionStatus,
-  useWallets,
-} from "@thirdweb-dev/react-core";
-import React, { useEffect, useRef, useState } from "react";
-import { ActivityIndicator, Animated, StyleSheet } from "react-native";
-import BaseButton from "./base/BaseButton";
-import Text from "./base/Text";
-import { useModalState } from "../providers/ui-context-provider";
+import { ThemeProvider } from "../styles/ThemeProvider";
+import { WalletDetailsButton } from "./ConnectWalletDetails/WalletDetailsButton";
+import { useAddress } from "@thirdweb-dev/react-core";
+import React, { useEffect, useRef } from "react";
+import { Animated } from "react-native";
+import { ConnectWalletButton } from "./ConnectWalletFlow/ConnectWalletButton";
+import { ConnectWalletButtonProps } from "./ConnectWalletFlow/ConnectWalletButton";
 
 export type ConnectWalletProps = {
-  theme?: ThemeProviderProps["theme"];
-  /**
-   * Set a custom title for the button
-   * @default "Connect Wallet"
-   */
-  buttonTitle?: string;
-  /**
-   * Set a custom title for the Connect Wallet modal
-   * @default "Choose your wallet"
-   */
-  modalTitle?: string;
   /**
    * render a custom button to display the connected wallet details instead of the default button
    */
   detailsButton?: React.ReactElement;
-};
+} & ConnectWalletButtonProps;
 
 export const ConnectWallet = ({
-  buttonTitle,
   detailsButton,
-  modalTitle,
   theme,
+  buttonTitle,
+  modalTitle,
 }: ConnectWalletProps) => {
   const fadeAnim = useRef(new Animated.Value(0)).current;
   const address = useAddress();
-  const connectionStatus = useConnectionStatus();
-  const supportedWallets = useWallets();
-  const isWalletConnecting = connectionStatus === "connecting";
-  const [showButtonSpinner, setShowButtonSpinner] = useState(false);
-  const { setModalState } = useModalState();
-
-  useEffect(() => {
-    setShowButtonSpinner(isWalletConnecting);
-
-    if (!isWalletConnecting) {
-      setShowButtonSpinner(false);
-      return;
-    }
-
-    const timeout = setTimeout(() => {
-      if (isWalletConnecting) {
-        setShowButtonSpinner(false);
-      }
-    }, 5000);
-
-    return () => {
-      if (timeout) {
-        clearTimeout(timeout);
-      }
-    };
-  }, [isWalletConnecting]);
 
   useEffect(() => {
     Animated.timing(fadeAnim, {
@@ -72,60 +30,22 @@ export const ConnectWallet = ({
     }).start();
   }, [fadeAnim]);
 
-  const onConnectWalletPress = () => {
-    setModalState({
-      isOpen: true,
-      isSheet: true,
-      view: "ConnectWalletFlow",
-      data: {
-        modalTitle,
-        walletConfig:
-          supportedWallets.length === 1 ? supportedWallets[0] : undefined,
-      },
-      caller: "ConnectWallet",
-    });
-  };
-
   return (
     <ThemeProvider theme={theme}>
       <Animated.View style={{ opacity: fadeAnim }}>
         {address ? (
-          <ConnectWalletDetails
+          <WalletDetailsButton
             address={address}
             detailsButton={detailsButton}
           />
         ) : (
-          <BaseButton
-            backgroundColor="buttonBackgroundColor"
-            onPress={onConnectWalletPress}
-            style={styles.connectWalletButton}
-          >
-            <Text variant="bodyLarge" color="buttonTextColor">
-              {showButtonSpinner ? (
-                <ActivityIndicator size="small" color="buttonTextColor" />
-              ) : buttonTitle ? (
-                buttonTitle
-              ) : (
-                "Connect Wallet"
-              )}
-            </Text>
-          </BaseButton>
+          <ConnectWalletButton
+            modalTitle={modalTitle}
+            buttonTitle={buttonTitle}
+            theme={theme}
+          />
         )}
       </Animated.View>
     </ThemeProvider>
   );
 };
-
-const styles = StyleSheet.create({
-  connectWalletButton: {
-    display: "flex",
-    flexDirection: "row",
-    alignContent: "center",
-    alignItems: "center",
-    justifyContent: "center",
-    borderRadius: 8,
-    paddingHorizontal: 10,
-    paddingVertical: 10,
-    minWidth: 150,
-  },
-});

packages/react-native/src/evm/components/ConnectWalletDetails/SmartWalletAdditionalActions.tsx

@@ -7,7 +7,7 @@ import {
   SmartWallet,
   walletIds,
 } from "@thirdweb-dev/wallets";
-import { Address } from "../base/Address";
+import { AddressDisplay } from "../base/AddressDisplay";
 import Text from "../base/Text";
 import { usePersonalWalletAddress } from "../../wallets/hooks/usePersonalWalletAddress";
 import { useWalletContext, useWallet } from "@thirdweb-dev/react-core";
@@ -80,7 +80,7 @@ export const SmartWalletAdditionalActions = ({
             <WalletIcon size={32} iconUri={wallet?.getMeta().iconURL || ""} />
           ) : null}
           <View style={styles.walletInfo}>
-            <Address
+            <AddressDisplay
               variant="bodyLarge"
               address={
                 showSmartWallet ? smartWalletAddress : personalWalletAddress

packages/react-native/src/evm/components/ConnectWalletDetails/WalletDetailsButton.tsx

@@ -1,4 +1,4 @@
-import { Address } from "../base/Address";
+import { AddressDisplay } from "../base/AddressDisplay";
 import BaseButton from "../base/BaseButton";
 import { ChainIcon } from "../base/ChainIcon";
 import Text from "../base/Text";
@@ -15,7 +15,7 @@ export type ConnectWalletDetailsProps = {
   detailsButton?: React.ReactElement;
 };
 
-export const ConnectWalletDetails = ({
+export const WalletDetailsButton = ({
   address,
   detailsButton,
 }: ConnectWalletDetailsProps) => {
@@ -51,13 +51,18 @@ export const ConnectWalletDetails = ({
             <ChainIcon size={32} chainIconUrl={chain?.icon?.url} />
             <Box justifyContent="center" alignItems="flex-start">
               <Text variant="bodySmall">
-                {balanceQuery.data?.displayValue.slice(0, 5)}{" "}
+                {balanceQuery.data
+                  ? Number(balanceQuery.data.displayValue).toFixed(3)
+                  : ""}{" "}
                 {balanceQuery.data?.symbol}
               </Text>
               {activeWallet?.walletId === LocalWallet.id ? (
                 <Text variant="error">Guest</Text>
               ) : (
-                <Address variant="bodySmallSecondary" address={address} />
+                <AddressDisplay
+                  variant="bodySmallSecondary"
+                  address={address}
+                />
               )}
             </Box>
             <WalletIcon

packages/react-native/src/evm/components/ConnectWalletDetails/WalletDetailsModalHeader.tsx

@@ -1,6 +1,6 @@
 import { Icon } from "../../assets/icon";
 import { useAppTheme } from "../../styles/hooks";
-import { Address } from "../base/Address";
+import { AddressDisplay } from "../base/AddressDisplay";
 import BaseButton from "../base/BaseButton";
 import Text from "../base/Text";
 import { WalletIcon } from "../base/WalletIcon";
@@ -55,7 +55,7 @@ export const WalletDetailsModalHeader = ({
             justifyContent="center"
             alignItems="center"
           >
-            <Address mr="xs" address={address} />
+            <AddressDisplay mr="xs" address={address} />
             <CopyIcon
               width={14}
               height={14}
@@ -63,7 +63,9 @@ export const WalletDetailsModalHeader = ({
             />
           </Box>
           <Text variant="bodySmallSecondary">
-            {balanceQuery.data?.displayValue.slice(0, 5)}{" "}
+            {balanceQuery.data
+              ? Number(balanceQuery.data.displayValue).toFixed(3)
+              : ""}{" "}
             {balanceQuery.data?.symbol}
           </Text>
         </BaseButton>

packages/react-native/src/evm/components/ConnectWalletFlow/ChooseWallet/ChooseWallet.tsx

@@ -10,9 +10,9 @@ import { View } from "react-native";
 export type ChooseWalletProps = {
   headerText?: ReactNode | string;
   subHeaderText?: ReactNode | string;
-  onChooseWallet: (wallet: WalletConfig<any, any>, data?: any) => void;
+  onChooseWallet: (wallet: WalletConfig<any>, data?: any) => void;
   onClose: () => void;
-  wallets: WalletConfig<any, any>[];
+  wallets: WalletConfig<any>[];
   excludeWalletIds?: string[];
   showGuestWalletAsButton?: boolean;
 };

packages/react-native/src/evm/components/ConnectWalletFlow/ConnectWalletButton.tsx

@@ -0,0 +1,102 @@
+import { ActivityIndicator, StyleSheet } from "react-native";
+import { BaseButton, Text } from "../base";
+import { useConnectionStatus, useWallets } from "@thirdweb-dev/react-core";
+import { useState, useEffect } from "react";
+import { useModalState } from "../../providers/ui-context-provider";
+import { ThemeProvider, ThemeProviderProps } from "../../styles/ThemeProvider";
+
+export type ConnectWalletButtonProps = {
+  theme?: ThemeProviderProps["theme"];
+  /**
+   * Set a custom title for the button
+   * @default "Connect Wallet"
+   */
+  buttonTitle?: string;
+  /**
+   * Set a custom title for the Connect Wallet modal
+   * @default "Choose your wallet"
+   */
+  modalTitle?: string;
+};
+
+export const ConnectWalletButton = ({
+  modalTitle,
+  buttonTitle,
+  theme,
+}: ConnectWalletButtonProps) => {
+  const connectionStatus = useConnectionStatus();
+  const isWalletConnecting = connectionStatus === "connecting";
+
+  const supportedWallets = useWallets();
+  const [showButtonSpinner, setShowButtonSpinner] = useState(false);
+  const { setModalState } = useModalState();
+
+  useEffect(() => {
+    setShowButtonSpinner(isWalletConnecting);
+
+    if (!isWalletConnecting) {
+      setShowButtonSpinner(false);
+      return;
+    }
+
+    const timeout = setTimeout(() => {
+      if (isWalletConnecting) {
+        setShowButtonSpinner(false);
+      }
+    }, 5000);
+
+    return () => {
+      if (timeout) {
+        clearTimeout(timeout);
+      }
+    };
+  }, [isWalletConnecting]);
+
+  const onConnectWalletPress = () => {
+    setModalState({
+      isOpen: true,
+      isSheet: true,
+      view: "ConnectWalletFlow",
+      data: {
+        modalTitle,
+        walletConfig:
+          supportedWallets.length === 1 ? supportedWallets[0] : undefined,
+      },
+      caller: "ConnectWallet",
+    });
+  };
+
+  return (
+    <ThemeProvider theme={theme}>
+      <BaseButton
+        backgroundColor="buttonBackgroundColor"
+        onPress={onConnectWalletPress}
+        style={styles.connectWalletButton}
+      >
+        <Text variant="bodyLarge" color="buttonTextColor">
+          {showButtonSpinner ? (
+            <ActivityIndicator size="small" color="buttonTextColor" />
+          ) : buttonTitle ? (
+            buttonTitle
+          ) : (
+            "Connect Wallet"
+          )}
+        </Text>
+      </BaseButton>
+    </ThemeProvider>
+  );
+};
+
+const styles = StyleSheet.create({
+  connectWalletButton: {
+    display: "flex",
+    flexDirection: "row",
+    alignContent: "center",
+    alignItems: "center",
+    justifyContent: "center",
+    borderRadius: 8,
+    paddingHorizontal: 10,
+    paddingVertical: 10,
+    minWidth: 150,
+  },
+});

packages/react-native/src/evm/components/ConnectWalletFlow/SmartWallet/SmartWalletFlow.tsx

@@ -69,10 +69,10 @@ export const SmartWalletFlow = ({
   );
 
   useEffect(() => {
-    if (walletObj.config.personalWallets?.length === 1) {
-      onChoosePersonalWallet(walletObj.config.personalWallets[0]);
+    if (walletObj.personalWallets?.length === 1) {
+      onChoosePersonalWallet(walletObj.personalWallets[0]);
     }
-  }, [onChoosePersonalWallet, walletObj.config.personalWallets]);
+  }, [onChoosePersonalWallet, walletObj.personalWallets]);
 
   useEffect(() => {
     (async () => {
@@ -203,7 +203,7 @@ export const SmartWalletFlow = ({
           </Text>
         </Text>
       }
-      wallets={walletObj.config.personalWallets || DEFAULT_WALLETS}
+      wallets={walletObj.personalWallets || DEFAULT_WALLETS}
       onChooseWallet={onChoosePersonalWallet}
       onClose={onClose}
     />

packages/react-native/src/evm/components/base/AddressDisplay.tsx

@@ -7,7 +7,7 @@ type AddressProps = {
   variant?: keyof Theme["textVariants"];
 } & (typeof Text)["arguments"];
 
-export const Address = ({
+export const AddressDisplay = ({
   address,
   variant = "bodyLarge",
   ...props

packages/react-native/src/evm/components/base/index.ts

@@ -0,0 +1,13 @@
+export { ActiveDot } from "./ActiveDot";
+export { AddressDisplay } from "./AddressDisplay";
+export { default as BaseButton } from "./BaseButton";
+export { default as Box } from "./Box";
+export { ChainIcon } from "./ChainIcon";
+export { default as ImageSvgUri } from "./ImageSvgUri";
+export { Label } from "./Label";
+export { Link } from "./Link";
+export { default as Text } from "./Text";
+export { TextInput } from "./TextInput";
+export { Toast } from "./Toast";
+export { WalletButton } from "./WalletButton";
+export { WalletIcon } from "./WalletIcon";

packages/react-native/src/evm/constants/wallets.ts

@@ -3,7 +3,7 @@ import { metamaskWallet } from "../wallets/wallets/metamask-wallet";
 import { rainbowWallet } from "../wallets/wallets/rainbow-wallet";
 import { trustWallet } from "../wallets/wallets/trust-wallet";
 
-export const DEFAULT_WALLETS: WalletConfig<any, any>[] = [
+export const DEFAULT_WALLETS: WalletConfig<any>[] = [
   metamaskWallet(),
   rainbowWallet(),
   trustWallet(),

packages/react-native/src/evm/index.ts

@@ -17,6 +17,9 @@ export { localWallet } from "./wallets/wallets/local-wallet";
 export { LocalWallet } from "./wallets/wallets/LocalWallet";
 export { magicWallet } from "./wallets/wallets/magic-wallet";
 export { MagicWallet } from "./wallets/wallets/MagicWallet";
+export * from "./wallets/wallets/WalletConnectV1";
+export * from "./wallets/wallets/WalletConnectV2";
+export type { WCMeta } from "./wallets/types/wc";
 
 export { useCoinbaseWallet } from "./wallets/hooks/useCoinbaseWallet";
 export { useMetaMaskWallet } from "./wallets/hooks/useMetaMaskWallet";
@@ -33,6 +36,9 @@ export { createSyncStorage as createLocalStorage } from "../core/AsyncStorage";
 export { createAsyncLocalStorage } from "../core/AsyncStorage";
 export { createSecureStorage } from "../core/SecureStorage";
 
+// ui components
+export * from "./components/base";
+
 // providers
 // export * from "./providers/full";
 export * from "./providers/thirdweb-provider";

packages/react-native/src/evm/providers/thirdweb-provider.tsx

@@ -32,7 +32,7 @@ interface ThirdwebProviderProps<TChains extends Chain[]>
    * />
    * ```
    */
-  supportedWallets?: WalletConfig<any, any>[];
+  supportedWallets?: WalletConfig<any>[];
 }
 
 /**

packages/react-native/src/evm/utils/uri.ts

@@ -1,3 +1,5 @@
+import { WCMeta } from "../wallets/types/wc";
+
 /**
  * Build a WalletConnect display URI from a wc:// uri + a wallet specific link
  *
@@ -7,7 +9,7 @@
  */
 export function formatWalletConnectDisplayUri(
   uri: string,
-  links: { universal: string; native: string },
+  links: WCMeta["links"],
 ) {
   const encodedUri: string = encodeURIComponent(uri);
   return links.universal

packages/react-native/src/evm/wallets/types/wc.ts

@@ -0,0 +1,8 @@
+export type WCMeta = {
+  name: string;
+  iconURL: string;
+  links: {
+    native?: string;
+    universal?: string;
+  };
+};

packages/react-native/src/evm/wallets/wallets/LocalWallet.ts

@@ -1,13 +1,11 @@
 import {
   LocalWallet as LocalWalletCore,
   Connector,
-  walletIds,
 } from "@thirdweb-dev/wallets";
 import { ethers, utils } from "ethers";
 
 export class LocalWallet extends LocalWalletCore {
   static meta = {
-    id: walletIds.localWallet,
     name: "Guest Wallet",
     iconURL:
       "ipfs://QmQAyJG3y2wZf9u6JXxn8U9Kd1ZVfjtQkf5aua8FcWr8Gm/local-wallet-mobile.svg",

packages/react-native/src/evm/wallets/wallets/WalletConnectV1.ts

@@ -0,0 +1,52 @@
+import {
+  WalletOptions,
+  WalletConnectV1Options,
+  WalletConnectV1 as WalletConnectV1Wallets,
+} from "@thirdweb-dev/wallets";
+import { formatWalletConnectDisplayUri } from "../../utils/uri";
+import { Linking } from "react-native";
+import { ExtraCoreWalletOptions } from "@thirdweb-dev/react-core";
+import { WCMeta } from "../types/wc";
+import { createAsyncLocalStorage } from "../../../core/AsyncStorage";
+
+export type WC1Options = Omit<
+  WalletOptions<WalletConnectV1Options>,
+  "qrcode" | "walletId"
+> &
+  ExtraCoreWalletOptions & {
+    walletId: NonNullable<WalletOptions["walletId"]>;
+  };
+
+export abstract class WalletConnectV1 extends WalletConnectV1Wallets {
+  constructor(options: WC1Options) {
+    super({
+      ...options,
+      walletId: options.walletId,
+      walletStorage:
+        options.walletStorage || createAsyncLocalStorage(options.walletId),
+      qrcode: false,
+    });
+
+    this.on("open_wallet", this._onWCOpenWallet);
+
+    this.on("disconnect", () => {
+      this.removeListener("open_wallet", this._onWCOpenWallet);
+    });
+  }
+
+  abstract getMeta(): WCMeta;
+
+  _onWCOpenWallet(uri?: string) {
+    const links = this.getMeta().links;
+
+    if (uri) {
+      const fullUrl = formatWalletConnectDisplayUri(uri, links);
+
+      Linking.openURL(fullUrl);
+    } else {
+      const fullUrl = formatWalletConnectDisplayUri("", links);
+
+      Linking.openURL(fullUrl);
+    }
+  }
+}

packages/react-native/src/evm/wallets/wallets/WalletConnectV2.ts

@@ -0,0 +1,60 @@
+import { TW_WC_PROJECT_ID } from "../../constants/walletConnect";
+import { formatWalletConnectDisplayUri } from "../../utils/uri";
+import type {
+  WalletConnectOptions,
+  WalletOptions,
+} from "@thirdweb-dev/wallets";
+import { WalletConnect as WalletConnectV2Wallets } from "@thirdweb-dev/wallets";
+import { Linking } from "react-native";
+import { WCMeta } from "../types/wc";
+import { createAsyncLocalStorage } from "../../../core/AsyncStorage";
+
+export type WC2Options = {
+  /**
+   * The WalletConnectV2 projectId.
+   *
+   * We provide a default projectId but recommend you get your own
+   * when launching your app in production.
+   */
+  projectId?: string;
+} & Omit<
+  WalletOptions<WalletConnectOptions>,
+  "projectId" | "qrcode" | "qrModalOptions"
+> & {
+    walletId: NonNullable<WalletOptions["walletId"]>;
+  };
+
+export abstract class WalletConnectV2 extends WalletConnectV2Wallets {
+  constructor(options: WC2Options) {
+    super({
+      ...options,
+      walletId: options.walletId,
+      qrcode: false,
+      projectId: options.projectId ? options.projectId : TW_WC_PROJECT_ID,
+      walletStorage:
+        options.walletStorage || createAsyncLocalStorage(options.walletId),
+    });
+
+    this.on("open_wallet", this._onWCOpenWallet);
+
+    this.on("disconnect", () => {
+      this.removeListener("open_wallet", this._onWCOpenWallet);
+    });
+  }
+
+  abstract getMeta(): WCMeta;
+
+  _onWCOpenWallet(uri?: string) {
+    const links = this.getMeta().links;
+
+    if (uri) {
+      const fullUrl = formatWalletConnectDisplayUri(uri, links);
+
+      Linking.openURL(fullUrl);
+    } else {
+      const fullUrl = formatWalletConnectDisplayUri("", links);
+
+      Linking.openURL(fullUrl);
+    }
+  }
+}

packages/react-native/src/evm/wallets/wallets/coinbase-wallet.ts

@@ -22,7 +22,6 @@ type CoinbaseWalletOptions = Omit<
 
 export class CoinbaseWallet extends AbstractClientWallet<CoinbaseWalletConnectorOptions> {
   static meta = {
-    id: "coinbase",
     name: "Coinbase Wallet",
     iconURL:
       "ipfs://QmcJBHopbwfJcLqJpX2xEufSS84aLbF7bHavYhaXUcrLaH/coinbase.svg",
@@ -82,6 +81,5 @@ export const coinbaseWallet = (config?: { callbackURL?: URL }) => {
     meta: CoinbaseWallet.meta,
     create: (options: WalletOptionsRC) =>
       new CoinbaseWallet({ ...options, callbackURL: callbackURLNonNull }),
-    config: config || {},
-  } satisfies WalletConfig<CoinbaseWallet, { callbackURL?: URL }>;
+  } satisfies WalletConfig<CoinbaseWallet>;
 };

packages/react-native/src/evm/wallets/wallets/magic-wallet.tsx

@@ -19,26 +19,30 @@ import { ActivityIndicator } from "react-native";
 import { useMagicWallet } from "../../providers/context-provider";
 
 export const magicWallet = (
-  config: MagicLinkOptions,
-): WalletConfig<MagicWallet, MagicLinkOptions> => {
+  magicLinkOptions: MagicLinkOptions,
+): WalletConfig<MagicWallet> => {
   return {
     id: walletIds.magicLink,
     meta: MagicWallet.meta,
     create: (options: WalletOptions) => {
       return new MagicWallet({
         ...options,
-        ...config,
+        ...magicLinkOptions,
         chainId: options.chain.chainId,
       });
     },
     /**
      * UI for connecting wallet
      */
-    connectUI: MagicConnectionUI,
+    connectUI(props) {
+      return (
+        <MagicConnectionUI {...props} magicLinkOptions={magicLinkOptions} />
+      );
+    },
     /**
      * UI for selecting wallet - this UI is rendered in the wallet selection screen
      */
-    selectUI: (props: SelectUIProps<MagicWallet, MagicLinkOptions>) => {
+    selectUI: (props: SelectUIProps<MagicWallet>) => {
       return (
         <Box flex={1}>
           <TextInput
@@ -63,15 +67,12 @@ export const magicWallet = (
     isInstalled: () => {
       return true;
     },
-    config: {
-      ...config,
-    },
   };
 };
 
 const MagicConnectionUI: React.FC<
-  ConnectUIProps<MagicWallet, MagicLinkOptions>
-> = ({ selectionData, walletConfig, close }) => {
+  ConnectUIProps<MagicWallet> & { magicLinkOptions: MagicLinkOptions }
+> = ({ selectionData, walletConfig, close, magicLinkOptions }) => {
   const createWalletInstance = useCreateWalletInstance();
   const setConnectedWallet = useSetConnectedWallet();
   const chainToConnect = useWalletContext().chainToConnect;
@@ -98,7 +99,7 @@ const MagicConnectionUI: React.FC<
         setConnectionStatus("connecting");
         const connectParams = {
           chainId: chainToConnect?.chainId,
-          ...walletConfig.config,
+          ...magicLinkOptions,
           ...(isEmail
             ? { email: selectionData }
             : { phoneNumber: selectionData }),
@@ -122,6 +123,7 @@ const MagicConnectionUI: React.FC<
     setConnectedWallet,
     setConnectionStatus,
     chainToConnect?.chainId,
+    magicLinkOptions,
   ]);
 
   return (

packages/react-native/src/evm/wallets/wallets/metamask-wallet.ts

@@ -1,28 +1,11 @@
-import {
-  WalletOptions,
-  WalletConnectV1Options,
-  WalletConnectV1,
-  walletIds,
-} from "@thirdweb-dev/wallets";
-import { formatWalletConnectDisplayUri } from "../../utils/uri";
-import { Linking } from "react-native";
-import {
-  WalletOptions as WalletOptionsRC,
-  WalletConfig,
-  ExtraCoreWalletOptions,
-} from "@thirdweb-dev/react-core";
-import { createAsyncLocalStorage } from "../../../core/AsyncStorage";
-
-type WC1Options = Omit<
-  WalletOptions<WalletConnectV1Options>,
-  "qrcode" | "walletStorage"
-> &
-  ExtraCoreWalletOptions;
+import { walletIds } from "@thirdweb-dev/wallets";
+import { WalletOptions, WalletConfig } from "@thirdweb-dev/react-core";
+import { WalletConnectV1 } from "./WalletConnectV1";
+import { WCMeta } from "../types/wc";
 
 export class MetaMaskWallet extends WalletConnectV1 {
   static id = walletIds.metamask;
   static meta = {
-    id: walletIds.metamask,
     name: "MetaMask",
     iconURL:
       "ipfs://QmZZHcw7zcXursywnLDAyY6Hfxzqop5GKgwoq8NB9jjrkN/metamask.svg",
@@ -32,34 +15,8 @@ export class MetaMaskWallet extends WalletConnectV1 {
     },
   };
 
-  constructor(options: WC1Options) {
-    const storage = createAsyncLocalStorage(walletIds.metamask);
-    super({
-      ...options,
-      walletId: walletIds.metamask,
-      walletStorage: storage,
-      qrcode: false,
-    });
-
-    this.on("open_wallet", this._onWCOpenWallet);
-
-    this.on("disconnect", () => {
-      this.removeListener("open_wallet", this._onWCOpenWallet);
-    });
-  }
-
-  _onWCOpenWallet(uri?: string) {
-    const links = MetaMaskWallet.meta.links;
-
-    if (uri) {
-      const fullUrl = formatWalletConnectDisplayUri(uri, links);
-
-      Linking.openURL(fullUrl);
-    } else {
-      const fullUrl = formatWalletConnectDisplayUri("", links);
-
-      Linking.openURL(fullUrl);
-    }
+  getMeta(): WCMeta {
+    return MetaMaskWallet.meta;
   }
 }
 
@@ -67,6 +24,7 @@ export const metamaskWallet = () => {
   return {
     id: MetaMaskWallet.id,
     meta: MetaMaskWallet.meta,
-    create: (options: WalletOptionsRC) => new MetaMaskWallet(options),
+    create: (options: WalletOptions) =>
+      new MetaMaskWallet({ ...options, walletId: walletIds.metamask }),
   } satisfies WalletConfig;
 };

packages/react-native/src/evm/wallets/wallets/rainbow-wallet.ts

@@ -1,27 +1,12 @@
-import {
-  WalletOptions,
-  WalletConnectV1Options,
-  WalletConnectV1,
-} from "@thirdweb-dev/wallets";
-import { formatWalletConnectDisplayUri } from "../../utils/uri";
-import { Linking } from "react-native";
 import {
   WalletOptions as WalletOptionsRC,
   WalletConfig,
-  ExtraCoreWalletOptions,
 } from "@thirdweb-dev/react-core";
-import { createAsyncLocalStorage } from "../../../core/AsyncStorage";
-
-type WC1Options = Omit<
-  WalletOptions<WalletConnectV1Options>,
-  "qrcode" | "walletStorage"
-> &
-  ExtraCoreWalletOptions;
+import { WalletConnectV1 } from "./WalletConnectV1";
 
 export class RainbowWallet extends WalletConnectV1 {
   static id = "rainbow" as const;
   static meta = {
-    id: "rainbow",
     name: "Rainbow",
     iconURL:
       "https://registry.walletconnect.org/v2/logo/md/7a33d7f1-3d12-4b5c-f3ee-5cd83cb1b500",
@@ -31,33 +16,8 @@ export class RainbowWallet extends WalletConnectV1 {
     },
   };
 
-  constructor(options: WC1Options) {
-    const storage = createAsyncLocalStorage("rainbow");
-    super({
-      ...options,
-      walletId: "rainbow",
-      walletStorage: storage,
-      qrcode: false,
-    });
-    this.on("open_wallet", this._onWCOpenWallet);
-
-    this.on("disconnect", () => {
-      this.removeListener("open_wallet", this._onWCOpenWallet);
-    });
-  }
-
-  _onWCOpenWallet(uri?: string) {
-    const links = RainbowWallet.meta.links;
-
-    if (uri) {
-      const fullUrl = formatWalletConnectDisplayUri(uri, links);
-
-      Linking.openURL(fullUrl);
-    } else {
-      const fullUrl = formatWalletConnectDisplayUri("", links);
-
-      Linking.openURL(fullUrl);
-    }
+  getMeta() {
+    return RainbowWallet.meta;
   }
 }
 
@@ -65,6 +25,7 @@ export const rainbowWallet = () => {
   return {
     id: RainbowWallet.id,
     meta: RainbowWallet.meta,
-    create: (options: WalletOptionsRC) => new RainbowWallet(options),
+    create: (options: WalletOptionsRC) =>
+      new RainbowWallet({ ...options, walletId: RainbowWallet.id }),
   } satisfies WalletConfig;
 };

packages/react-native/src/evm/wallets/wallets/smart-wallet.ts

@@ -8,14 +8,14 @@ import { DEFAULT_WALLETS } from "../../constants/wallets";
 import { createSyncStorage } from "../../../core/AsyncStorage";
 
 type SmartWalletConfig = {
-  personalWallets?: WalletConfig<any, any>[];
+  personalWallets?: WalletConfig<any>[];
 } & Omit<SmartWalletConfigWallets, "chain">;
 
-export type SmartWalletObj = WalletConfig<SmartWallet, SmartWalletConfig>;
+export type SmartWalletObj = WalletConfig<SmartWallet>;
 
 export const smartWallet = (
   config: SmartWalletConfig,
-): WalletConfig<SmartWallet, SmartWalletConfig> => {
+): WalletConfig<SmartWallet> => {
   return {
     id: SmartWallet.id,
     meta: SmartWallet.meta,
@@ -26,9 +26,6 @@ export const smartWallet = (
         walletStorage: createAsyncLocalStorage("smart-wallet"),
         wcStorage: createSyncStorage("smart-wallet"),
       }),
-    config: {
-      ...config,
-      personalWallets: config.personalWallets || DEFAULT_WALLETS,
-    },
+    personalWallets: config.personalWallets || DEFAULT_WALLETS,
   };
 };

packages/react-native/src/evm/wallets/wallets/trust-wallet.ts

@@ -1,26 +1,10 @@
-import { createAsyncLocalStorage } from "../../../core/AsyncStorage";
-import { TW_WC_PROJECT_ID } from "../../constants/walletConnect";
-import { formatWalletConnectDisplayUri } from "../../utils/uri";
-import type {
-  WalletConnectOptions,
-  WalletOptions,
-} from "@thirdweb-dev/wallets";
-import {
-  WalletOptions as WalletOptionsRC,
-  WalletConfig,
-} from "@thirdweb-dev/react-core";
-import { WalletConnect } from "@thirdweb-dev/wallets";
-import { Linking } from "react-native";
+import { WalletOptions, WalletConfig } from "@thirdweb-dev/react-core";
+import { WC2Options, WalletConnectV2 } from "./WalletConnectV2";
+import { WCMeta } from "../types/wc";
 
-type WC2Options = { projectId?: string } & Omit<
-  WalletOptions<WalletConnectOptions>,
-  "projectId" | "qrcode" | "walletStorage" | "qrModalOptions"
->;
-
-export class TrustWallet extends WalletConnect {
+export class TrustWallet extends WalletConnectV2 {
   static id = "trust" as const;
   static meta = {
-    id: "trust",
     name: "Trust Wallet",
     iconURL:
       "https://registry.walletconnect.org/v2/logo/md/0528ee7e-16d1-4089-21e3-bbfb41933100",
@@ -31,48 +15,25 @@ export class TrustWallet extends WalletConnect {
   };
 
   constructor(options: WC2Options) {
-    const storage = createAsyncLocalStorage("trustwallet");
-    super({
-      ...options,
-      walletId: "trust",
-      qrcode: false,
-      projectId: options.projectId ? options.projectId : TW_WC_PROJECT_ID,
-      walletStorage: storage,
-    });
-
-    this.on("open_wallet", this._onWCOpenWallet);
-
-    this.on("disconnect", () => {
-      this.removeListener("open_wallet", this._onWCOpenWallet);
-    });
+    super(options);
   }
 
-  _onWCOpenWallet(uri?: string) {
-    const links = TrustWallet.meta.links;
-
-    if (uri) {
-      const fullUrl = formatWalletConnectDisplayUri(uri, links);
-
-      Linking.openURL(fullUrl);
-    } else {
-      const fullUrl = formatWalletConnectDisplayUri("", links);
-
-      Linking.openURL(fullUrl);
-    }
+  getMeta(): WCMeta {
+    return TrustWallet.meta;
   }
 }
 
 type TrustWalletConfig = { projectId?: string };
 
 export const trustWallet = (config?: TrustWalletConfig) => {
-  const projectId = config?.projectId ? config.projectId : TW_WC_PROJECT_ID;
   return {
     id: TrustWallet.id,
     meta: TrustWallet.meta,
-    create: (options: WalletOptionsRC) =>
-      new TrustWallet({ ...options, projectId: projectId }),
-    config: {
-      projectId: projectId,
-    },
-  } satisfies WalletConfig<WalletConnect, TrustWalletConfig>;
+    create: (options: WalletOptions) =>
+      new TrustWallet({
+        ...options,
+        walletId: "trust",
+        projectId: config?.projectId,
+      }),
+  } satisfies WalletConfig<WalletConnectV2>;
 };

packages/react/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @thirdweb-dev/react
 
+## 3.13.1
+
+### Patch Changes
+
+- [#1151](https://github.com/thirdweb-dev/js/pull/1151) [`2a0294d8`](https://github.com/thirdweb-dev/js/commit/2a0294d8e67bbc08dcf59c79174a7626deb0e90a) Thanks [@MananTank](https://github.com/MananTank)! - Fix wrong balance in ConnectWallet
+
+- [#1149](https://github.com/thirdweb-dev/js/pull/1149) [`65ecf072`](https://github.com/thirdweb-dev/js/commit/65ecf072eb810eaf850c0af94f3db5af51de8a28) Thanks [@MananTank](https://github.com/MananTank)! - Improve rendering of long network list in ConnectWallet Modal
+
+- [#1144](https://github.com/thirdweb-dev/js/pull/1144) [`9ce3eb6a`](https://github.com/thirdweb-dev/js/commit/9ce3eb6aad957aff38fb4a25383ed17ff58e988f) Thanks [@MananTank](https://github.com/MananTank)! - Remove WalletConfig.config object from wallets
+
+- Updated dependencies [[`2a443365`](https://github.com/thirdweb-dev/js/commit/2a443365bdc3d47d0f41fc895f70256dcde423f5), [`3bf7f375`](https://github.com/thirdweb-dev/js/commit/3bf7f375933cbd7dd8c682a66e8c67bbcb268bf7), [`6a194262`](https://github.com/thirdweb-dev/js/commit/6a19426200297b8da158c7d860d31efcc8c15822), [`16232de9`](https://github.com/thirdweb-dev/js/commit/16232de9eab9966e24e335929b2a3919346af265), [`54cfd6d8`](https://github.com/thirdweb-dev/js/commit/54cfd6d8916c42d87b6aa438e607ce525766b686), [`8687d6ac`](https://github.com/thirdweb-dev/js/commit/8687d6ac3a363eae63eeb1959a953cbcd282d353), [`645b0303`](https://github.com/thirdweb-dev/js/commit/645b0303cc1a9cbb0a0e9cbd67d11c3b865e4584), [`522453fd`](https://github.com/thirdweb-dev/js/commit/522453fd568b8c350141a96f9f1c6d5a3ef74493), [`9a015a23`](https://github.com/thirdweb-dev/js/commit/9a015a23cde09c8ba6c36593a84303ffe409a79a), [`6803c3e9`](https://github.com/thirdweb-dev/js/commit/6803c3e97ca74eed19cd90095afde25b02150d51), [`0cba69ca`](https://github.com/thirdweb-dev/js/commit/0cba69ca40a8cf6f106344247d0082212cd169da), [`56f85e57`](https://github.com/thirdweb-dev/js/commit/56f85e57df84bfa93e3230639c95d12466f8aec7), [`197a6838`](https://github.com/thirdweb-dev/js/commit/197a6838f69ae8b9ad46524e7c469fc757d0a2cb), [`6a91b6a0`](https://github.com/thirdweb-dev/js/commit/6a91b6a0253bab5914d4ebdad951dd1c5d141fbc), [`e32faeb5`](https://github.com/thirdweb-dev/js/commit/e32faeb57a5c2193c40cb6129fab92b84069b12d), [`a5f16b6d`](https://github.com/thirdweb-dev/js/commit/a5f16b6dc50b37920a6e5210b60aa6a1682ceb63), [`b6728603`](https://github.com/thirdweb-dev/js/commit/b6728603972ccd6c95108b25e8562807f0f95e19), [`ed47fd53`](https://github.com/thirdweb-dev/js/commit/ed47fd5310d11323080d984bca18a96fdef3a977), [`9ce3eb6a`](https://github.com/thirdweb-dev/js/commit/9ce3eb6aad957aff38fb4a25383ed17ff58e988f)]:
+  - @thirdweb-dev/wallets@0.2.26
+  - @thirdweb-dev/sdk@3.10.21
+  - @thirdweb-dev/react-core@3.13.1
+  - @thirdweb-dev/chains@0.1.20
+
 ## 3.13.0
 
 ### Patch Changes

packages/react/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thirdweb-dev/react",
-  "version": "3.13.0",
+  "version": "3.13.1",
   "repository": "https://github.com/thirdweb-dev/js/tree/main/packages/react",
   "author": "thirdweb eng <[email protected]>",
   "license": "Apache-2.0",

packages/react/src/evm/providers/thirdweb-provider.tsx

@@ -30,7 +30,7 @@ interface ThirdwebProviderProps<TChains extends Chain[]>
    * />
    * ```
    */
-  supportedWallets?: WalletConfig<any, any>[];
+  supportedWallets?: WalletConfig<any>[];
 }
 
 /**

packages/react/src/wallet/ConnectWallet/ConnectModal.tsx

@@ -57,9 +57,7 @@ export const ConnectModal = () => {
   const isWrapperConnected = !!wallet?.getPersonalWallet();
 
   const isWrapperScreen =
-    typeof screen !== "string" &&
-    "config" in screen &&
-    !!(screen.config as any).personalWallets;
+    typeof screen !== "string" && !!screen.personalWallets;
 
   const prevConnectionStatus = useRef(connectionStatus);
 

packages/react/src/wallet/ConnectWallet/Details.tsx

@@ -118,7 +118,7 @@ export const ConnectedWalletDetails: React.FC<{
       <ColFlex>
         {balanceQuery.data ? (
           <WalletBalance className={`${TW_CONNECTED_WALLET}__balance`}>
-            {balanceQuery.data.displayValue.slice(0, 5)}{" "}
+            {Number(balanceQuery.data.displayValue).toFixed(3)}{" "}
             {balanceQuery.data.symbol}
           </WalletBalance>
         ) : (
@@ -252,7 +252,11 @@ export const ConnectedWalletDetails: React.FC<{
           {/* row 2 */}
           <AccountBalance>
             {" "}
-            {balanceQuery.data?.displayValue.slice(0, 5)}{" "}
+            {balanceQuery.data ? (
+              Number(balanceQuery.data.displayValue).toFixed(3)
+            ) : (
+              <Skeleton height="1em" width="100px" />
+            )}{" "}
             {balanceQuery.data?.symbol}{" "}
           </AccountBalance>
         </div>

packages/react/src/wallet/ConnectWallet/NetworkSelector.tsx

@@ -36,6 +36,9 @@ import type { Chain } from "@thirdweb-dev/chains";
 import Fuse from "fuse.js";
 import { Button } from "../../components/buttons";
 import { isMobile } from "../../evm/utils/isMobile";
+import { useEffect } from "react";
+import { Flex } from "../../components/basic";
+import { SecondaryText } from "../../components/text";
 
 type RenderChain = React.FC<{
   chain: Chain;
@@ -398,6 +401,29 @@ const NetworkList = memo(function NetworkList(props: {
   };
   const RenderChain = props.renderChain;
 
+  const [isLoading, setIsLoading] = useState(props.chains.length > 100);
+
+  useEffect(() => {
+    if (isLoading) {
+      setIsLoading(false);
+    }
+  }, [isLoading]);
+
+  if (isLoading) {
+    return (
+      <Flex
+        justifyContent="center"
+        alignItems="center"
+        style={{
+          height: "250px",
+        }}
+      >
+        {/* Don't put a spinner here - it's gonna freeze */}
+        <SecondaryText>Loading</SecondaryText>
+      </Flex>
+    );
+  }
+
   return (
     <NetworkListUl>
       {props.chains.map((chain) => {

packages/react/src/wallet/wallets/defaultWallets.ts

@@ -3,7 +3,7 @@ import { coinbaseWallet } from "./coinbase/coinbaseWallet";
 import { metamaskWallet } from "./metamask/metamaskWallet";
 import { walletConnectV1 } from "./walletConnectV1";
 
-export const defaultWallets: WalletConfig<any, any>[] = [
+export const defaultWallets: WalletConfig<any>[] = [
   metamaskWallet(),
   coinbaseWallet(),
   walletConnectV1(),

packages/react/src/wallet/wallets/localWallet/CreateLocalWallet.tsx

@@ -22,6 +22,7 @@ export const CreateLocalWallet_Password: React.FC<{
   goBack: () => void;
   localWalletConf: LocalWalletConfig;
   renderBackButton: boolean;
+  persist: boolean;
 }> = (props) => {
   const [password, setPassword] = useState("");
   const [confirmPassword, setConfirmPassword] = useState("");
@@ -29,7 +30,10 @@ export const CreateLocalWallet_Password: React.FC<{
   const passwordMismatch = confirmPassword && password !== confirmPassword;
   const [isConnecting, setIsConnecting] = useState(false);
 
-  const { localWallet, meta } = useLocalWalletInfo(props.localWalletConf);
+  const { localWallet, meta } = useLocalWalletInfo(
+    props.localWalletConf,
+    props.persist,
+  );
 
   const { setConnectedWallet, setConnectionStatus } = useWalletContext();
   const [showImportScreen, setShowImportScreen] = useState(false);
@@ -55,6 +59,7 @@ export const CreateLocalWallet_Password: React.FC<{
         goBack={() => {
           setShowImportScreen(false);
         }}
+        persist={props.persist}
       />
     );
   }
@@ -192,8 +197,9 @@ export const CreateLocalWallet_Guest: React.FC<{
   onConnect: () => void;
   goBack: () => void;
   localWallet: LocalWalletConfig;
+  persist: boolean;
 }> = (props) => {
-  const { localWallet } = useLocalWalletInfo(props.localWallet);
+  const { localWallet } = useLocalWalletInfo(props.localWallet, props.persist);
   const { setConnectedWallet, setConnectionStatus } = useWalletContext();
   const { onConnect } = props;
 

packages/react/src/wallet/wallets/localWallet/ImportLocalWallet.tsx

@@ -22,9 +22,13 @@ export const ImportLocalWallet: React.FC<{
   onConnect: () => void;
   goBack: () => void;
   localWalletConf: LocalWalletConfig;
+  persist: boolean;
 }> = (props) => {
   const [jsonString, setJsonString] = useState<string | undefined>();
-  const { setLocalWallet, meta } = useLocalWalletInfo(props.localWalletConf);
+  const { setLocalWallet, meta } = useLocalWalletInfo(
+    props.localWalletConf,
+    props.persist,
+  );
   const createWalletInstance = useCreateWalletInstance();
   const [password, setPassword] = useState("");
   const [isWrongPassword, setIsWrongPassword] = useState(false);

packages/react/src/wallet/wallets/localWallet/LocalWalletConnectUI.tsx

@@ -6,18 +6,18 @@ import {
 import { ReconnectLocalWallet } from "./ReconnectLocalWallet";
 import { Flex } from "../../../components/basic";
 import { ConnectUIProps } from "@thirdweb-dev/react-core";
-import { LocalWalletConfigOptions } from "./types";
 import { useLocalWalletInfo } from "./useLocalWalletInfo";
 import type { LocalWallet } from "@thirdweb-dev/wallets";
 
 export const LocalWalletConnectUI = (
-  props: ConnectUIProps<LocalWallet, LocalWalletConfigOptions>,
+  props: ConnectUIProps<LocalWallet> & { persist: boolean },
 ) => {
-  const { walletData } = useLocalWalletInfo(props.walletConfig);
+  const { walletData } = useLocalWalletInfo(props.walletConfig, props.persist);
 
-  if (!props.walletConfig.config.persist) {
+  if (!props.persist) {
     return (
       <CreateLocalWallet_Guest
+        persist={props.persist}
         localWallet={props.walletConfig}
         goBack={props.goBack}
         onConnect={props.close}
@@ -47,6 +47,7 @@ export const LocalWalletConnectUI = (
         onConnect={props.close}
         goBack={props.goBack}
         localWallet={props.walletConfig}
+        persist={props.persist}
       />
     );
   }
@@ -57,6 +58,7 @@ export const LocalWalletConnectUI = (
       localWalletConf={props.walletConfig}
       onConnect={props.close}
       renderBackButton={props.supportedWallets.length > 1}
+      persist={props.persist}
     />
   );
 };

packages/react/src/wallet/wallets/localWallet/ReconnectLocalWallet.tsx

@@ -26,6 +26,7 @@ type ReconnectLocalWalletProps = {
   localWallet: LocalWalletConfig;
   supportedWallets: WalletConfig[];
   renderBackButton: boolean;
+  persist: boolean;
 };
 
 /**
@@ -44,6 +45,7 @@ export const ReconnectLocalWallet: React.FC<ReconnectLocalWalletProps> = (
   const [showExport, setShowExport] = useState(false);
   const { localWallet, meta, walletData } = useLocalWalletInfo(
     props.localWallet,
+    props.persist,
   );
 
   const savedAddress = walletData
@@ -95,6 +97,7 @@ export const ReconnectLocalWallet: React.FC<ReconnectLocalWalletProps> = (
           setShowCreate(false);
         }}
         onConnect={props.onConnect}
+        persist={props.persist}
       />
     );
   }

packages/react/src/wallet/wallets/localWallet/localWallet.tsx

@@ -9,12 +9,15 @@ export const localWallet = (
     id: LocalWallet.id,
     meta: { ...LocalWallet.meta, name: "Guest Wallet" },
     create: (options: WalletOptions) => new LocalWallet(options),
-    config: {
-      persist: config && config.persist !== undefined ? config.persist : true,
-    },
-    connectUI: LocalWalletConnectUI,
-    isInstalled() {
-      return false;
+    connectUI(props) {
+      return (
+        <LocalWalletConnectUI
+          {...props}
+          persist={
+            config && config.persist !== undefined ? config.persist : true
+          }
+        />
+      );
     },
   };
 };

packages/react/src/wallet/wallets/localWallet/types.ts

@@ -14,7 +14,4 @@ export type LocalWalletConfigOptions = {
   persist?: boolean;
 };
 
-export type LocalWalletConfig = WalletConfig<
-  LocalWallet,
-  LocalWalletConfigOptions
->;
+export type LocalWalletConfig = WalletConfig<LocalWallet>;

packages/react/src/wallet/wallets/localWallet/useLocalWalletInfo.tsx

@@ -4,7 +4,10 @@ import { LocalWallet } from "@thirdweb-dev/wallets";
 import { WalletData } from "@thirdweb-dev/wallets/src/evm/wallets/local-wallet";
 import { LocalWalletConfig } from "./types";
 
-export function useLocalWalletInfo(localWalletConfig: LocalWalletConfig) {
+export function useLocalWalletInfo(
+  localWalletConfig: LocalWalletConfig,
+  persist: boolean,
+) {
   const [walletData, setWalletData] = useState<WalletData | null | "loading">(
     "loading",
   );
@@ -15,18 +18,18 @@ export function useLocalWalletInfo(localWalletConfig: LocalWalletConfig) {
     const wallet = createWalletInstance(localWalletConfig) as LocalWallet;
     setLocalWallet(wallet);
 
-    if (localWalletConfig.config.persist) {
+    if (persist) {
       wallet.getSavedData().then((data) => {
         setWalletData(data);
       });
     }
-  }, [createWalletInstance, localWalletConfig]);
+  }, [createWalletInstance, localWalletConfig, persist]);
 
   return {
     setLocalWallet,
     localWallet,
     walletData,
     meta: localWalletConfig.meta,
-    persist: localWalletConfig.config.persist,
+    persist: persist,
   };
 }

packages/react/src/wallet/wallets/magic/magicLink.tsx

@@ -19,9 +19,16 @@ export function magicLink(
     meta: MagicLink.meta,
     create: (options: WalletOptions) =>
       new MagicLink({ ...options, ...config }),
-    config,
     connectUI: MagicConnectionUI,
-    selectUI: MagicSelectionUI,
+    selectUI(props) {
+      return (
+        <MagicSelectionUI
+          {...props}
+          emailLogin={config.emailLogin !== false}
+          smsLogin={config.smsLogin !== false}
+        />
+      );
+    },
     isInstalled() {
       return false;
     },
@@ -29,10 +36,13 @@ export function magicLink(
 }
 
 const MagicSelectionUI: React.FC<
-  SelectUIProps<MagicLink, MagicLinkAdditionalOptions>
+  SelectUIProps<MagicLink> & {
+    emailLogin: boolean;
+    smsLogin: boolean;
+  }
 > = (props) => {
-  const isEmailEnabled = props.walletConfig.config.emailLogin !== false;
-  const isSMSEnabled = props.walletConfig.config.smsLogin !== false;
+  const isEmailEnabled = props.emailLogin !== false;
+  const isSMSEnabled = props.smsLogin !== false;
 
   let placeholder = "Enter your email or phone number";
   let type = "text";
@@ -91,9 +101,13 @@ const MagicSelectionUI: React.FC<
   );
 };
 
-const MagicConnectionUI: React.FC<
-  ConnectUIProps<MagicLink, MagicLinkAdditionalOptions>
-> = ({ close, walletConfig, open, selectionData, supportedWallets }) => {
+const MagicConnectionUI: React.FC<ConnectUIProps<MagicLink>> = ({
+  close,
+  walletConfig,
+  open,
+  selectionData,
+  supportedWallets,
+}) => {
   const connectPrompted = useRef(false);
   const singleWallet = supportedWallets.length === 1;
   const connect = useConnect();

packages/react/src/wallet/wallets/magic/types.ts

@@ -3,7 +3,4 @@ import { MagicLink, MagicLinkAdditionalOptions } from "@thirdweb-dev/wallets";
 
 export type MagicLinkConfig = MagicLinkAdditionalOptions;
 
-export type ConfiguredMagicLinkWallet = WalletConfig<
-  MagicLink,
-  MagicLinkConfig
->;
+export type ConfiguredMagicLinkWallet = WalletConfig<MagicLink>;

packages/react/src/wallet/wallets/paperWallet.tsx

@@ -13,24 +13,19 @@ import { InputSelectionUI } from "./InputSelectionUI";
 
 type PaperConfig = { clientId: string };
 
-export const paperWallet = (
-  config: PaperConfig,
-): WalletConfig<PaperWallet, PaperConfig> => {
+export const paperWallet = (config: PaperConfig): WalletConfig<PaperWallet> => {
   return {
     id: PaperWallet.id,
     meta: PaperWallet.meta,
     create(options: WalletOptions) {
       return new PaperWallet({ ...options, ...config });
     },
-    config,
     selectUI: PaperSelectionUI,
     connectUI: PaperConnectionUI,
   };
 };
 
-const PaperSelectionUI: React.FC<SelectUIProps<PaperWallet, PaperConfig>> = (
-  props,
-) => {
+const PaperSelectionUI: React.FC<SelectUIProps<PaperWallet>> = (props) => {
   return (
     <InputSelectionUI
       onSelect={props.onSelect}
@@ -50,7 +45,7 @@ const PaperSelectionUI: React.FC<SelectUIProps<PaperWallet, PaperConfig>> = (
   );
 };
 
-const PaperConnectionUI: React.FC<ConnectUIProps<PaperWallet, PaperConfig>> = ({
+const PaperConnectionUI: React.FC<ConnectUIProps<PaperWallet>> = ({
   close,
   walletConfig,
   open,

packages/react/src/wallet/wallets/safe/SelectAccount.tsx

@@ -19,7 +19,7 @@ import {
   ExclamationTriangleIcon,
 } from "@radix-ui/react-icons";
 import {
-  useActiveChain,
+  useChain,
   useChainId,
   useConnect,
   useConnectionStatus,
@@ -48,7 +48,7 @@ export const SelectAccount: React.FC<{
 }> = (props) => {
   const activeWallet = useWallet();
   const connect = useConnect();
-  const activeChain = useActiveChain();
+  const activeChain = useChain();
   const connectedChainId = useChainId();
 
   const [safeAddress, setSafeAddress] = useState("");

packages/react/src/wallet/wallets/safe/safeWallet.tsx

@@ -16,22 +16,23 @@ import { HeadlessConnectUI } from "../headlessConnectUI";
 export const safeWallet = (
   config?: SafeWalletConfigOptions,
 ): SafeWalletConfig => {
+  const personalWallets = config?.personalWallets || defaultWallets;
   return {
     id: SafeWallet.id,
     meta: SafeWallet.meta,
     create: (options: WalletOptions) => new SafeWallet({ ...options }),
-    connectUI: SafeConnectUI,
+    connectUI(props) {
+      return <SafeConnectUI {...props} personalWallets={personalWallets} />;
+    },
     isInstalled() {
       return false;
     },
-    config: {
-      personalWallets: config?.personalWallets || defaultWallets,
-    },
+    personalWallets: personalWallets,
   };
 };
 
 export const SafeConnectUI = (
-  props: ConnectUIProps<SafeWallet, Required<SafeWalletConfigOptions>>,
+  props: ConnectUIProps<SafeWallet> & { personalWallets: WalletConfig[] },
 ) => {
   const activeWallet = useWallet();
   const [personalWalletConfig, setPersonalWalletConfig] = useState<
@@ -52,7 +53,7 @@ export const SafeConnectUI = (
       open: props.open,
       theme: props.theme,
       walletConfig: personalWalletConfig,
-      supportedWallets: props.walletConfig.config.personalWallets,
+      supportedWallets: props.personalWallets,
       selectionData: props.selectionData,
       setSelectionData: props.setSelectionData,
     };
@@ -67,7 +68,7 @@ export const SafeConnectUI = (
   if (!activeWallet) {
     return (
       <SelectpersonalWallet
-        personalWallets={props.walletConfig.config.personalWallets}
+        personalWallets={props.personalWallets}
         onBack={props.goBack}
         safeWallet={props.walletConfig}
         selectWallet={setPersonalWalletConfig}

packages/react/src/wallet/wallets/safe/types.ts

@@ -2,10 +2,7 @@ import { WalletConfig } from "@thirdweb-dev/react-core";
 import { SafeWallet } from "@thirdweb-dev/wallets";
 
 export type SafeWalletConfigOptions = {
-  personalWallets?: WalletConfig<any, any>[];
+  personalWallets?: WalletConfig<any>[];
 };
 
-export type SafeWalletConfig = WalletConfig<
-  SafeWallet,
-  Required<SafeWalletConfigOptions>
->;
+export type SafeWalletConfig = WalletConfig<SafeWallet>;

packages/react/src/wallet/wallets/smartWallet/smartWallet.tsx

@@ -15,24 +15,21 @@ import { HeadlessConnectUI } from "../headlessConnectUI";
 export const smartWallet = (
   config: SmartWalletConfigOptions,
 ): SmartWalletConfig => {
+  const personalWallets = config?.personalWallets || defaultWallets;
   return {
     id: SmartWallet.id,
     meta: SmartWallet.meta,
     create: (options: WalletOptions) =>
       new SmartWallet({ ...options, ...config }),
-    connectUI: SmartConnectUI,
-    isInstalled() {
-      return false;
-    },
-    config: {
-      ...config,
-      personalWallets: config?.personalWallets || defaultWallets,
+    connectUI(props) {
+      return <SmartConnectUI {...props} personalWallets={personalWallets} />;
     },
+    personalWallets,
   };
 };
 
 export const SmartConnectUI = (
-  props: ConnectUIProps<SmartWallet, SmartWalletConfigOptions>,
+  props: ConnectUIProps<SmartWallet> & { personalWallets: WalletConfig[] },
 ) => {
   const activeWallet = useWallet();
   const { walletConfig } = props;
@@ -53,8 +50,7 @@ export const SmartConnectUI = (
       open: props.open,
       theme: props.theme,
       walletConfig: personalWalletConfig,
-      supportedWallets: props.walletConfig.config
-        .personalWallets as WalletConfig[],
+      supportedWallets: props.personalWallets,
       selectionData: props.selectionData,
       setSelectionData: props.setSelectionData,
     };
@@ -69,7 +65,7 @@ export const SmartConnectUI = (
   if (!activeWallet) {
     return (
       <SelectPersonalWallet
-        personalWallets={walletConfig.config.personalWallets as WalletConfig[]}
+        personalWallets={props.personalWallets}
         onBack={props.goBack}
         smartWallet={walletConfig}
         selectWallet={setPersonalWalletConfig}

packages/react/src/wallet/wallets/smartWallet/types.ts

@@ -5,10 +5,7 @@ import {
 } from "@thirdweb-dev/wallets";
 
 export type SmartWalletConfigOptions = Omit<SmartWalletConfig_, "chain"> & {
-  personalWallets?: WalletConfig<any, any>[];
+  personalWallets?: WalletConfig<any>[];
 };
 
-export type SmartWalletConfig = WalletConfig<
-  SmartWallet,
-  SmartWalletConfigOptions
->;
+export type SmartWalletConfig = WalletConfig<SmartWallet>;

packages/react/src/wallet/wallets/walletConnect.tsx

@@ -22,7 +22,7 @@ type walletConnectConfig = {
 
 export const walletConnect = (
   config?: walletConnectConfig,
-): WalletConfig<WalletConnect, walletConnectConfig> => {
+): WalletConfig<WalletConnect> => {
   const projectId = config?.projectId || TW_WC_PROJECT_ID;
   return {
     id: WalletConnect.id,
@@ -35,9 +35,5 @@ export const walletConnect = (
         qrModalOptions: config?.qrModalOptions,
       });
     },
-    config: {
-      projectId,
-      qrModalOptions: config?.qrModalOptions,
-    },
   };
 };

packages/sdk/CHANGELOG.md

@@ -1,5 +1,30 @@
 # @thirdweb-dev/sdk
 
+## 3.10.21
+
+### Patch Changes
+
+- [#1131](https://github.com/thirdweb-dev/js/pull/1131) [`3bf7f375`](https://github.com/thirdweb-dev/js/commit/3bf7f375933cbd7dd8c682a66e8c67bbcb268bf7) Thanks [@kumaryash90](https://github.com/kumaryash90)! - Handle old released standard contracts
+
+- [#1127](https://github.com/thirdweb-dev/js/pull/1127) [`8687d6ac`](https://github.com/thirdweb-dev/js/commit/8687d6ac3a363eae63eeb1959a953cbcd282d353) Thanks [@kumaryash90](https://github.com/kumaryash90)! - add missing exports
+
+- [#1120](https://github.com/thirdweb-dev/js/pull/1120) [`522453fd`](https://github.com/thirdweb-dev/js/commit/522453fd568b8c350141a96f9f1c6d5a3ef74493) Thanks [@MananTank](https://github.com/MananTank)! - Reduce circular dependencies
+
+- [#1129](https://github.com/thirdweb-dev/js/pull/1129) [`6803c3e9`](https://github.com/thirdweb-dev/js/commit/6803c3e97ca74eed19cd90095afde25b02150d51) Thanks [@kumaryash90](https://github.com/kumaryash90)! - Fix any evm deployments
+
+- [#1124](https://github.com/thirdweb-dev/js/pull/1124) [`56f85e57`](https://github.com/thirdweb-dev/js/commit/56f85e57df84bfa93e3230639c95d12466f8aec7) Thanks [@MananTank](https://github.com/MananTank)! - Reduce circular dependencies
+
+- [#1016](https://github.com/thirdweb-dev/js/pull/1016) [`6a91b6a0`](https://github.com/thirdweb-dev/js/commit/6a91b6a0253bab5914d4ebdad951dd1c5d141fbc) Thanks [@kumaryash90](https://github.com/kumaryash90)! - Update publish flow
+
+- [#1125](https://github.com/thirdweb-dev/js/pull/1125) [`a5f16b6d`](https://github.com/thirdweb-dev/js/commit/a5f16b6dc50b37920a6e5210b60aa6a1682ceb63) Thanks [@kumaryash90](https://github.com/kumaryash90)! - Check standard deploy type
+
+- [#1128](https://github.com/thirdweb-dev/js/pull/1128) [`b6728603`](https://github.com/thirdweb-dev/js/commit/b6728603972ccd6c95108b25e8562807f0f95e19) Thanks [@kumaryash90](https://github.com/kumaryash90)! - enable zksync mainnet deployments
+
+- [#1152](https://github.com/thirdweb-dev/js/pull/1152) [`ed47fd53`](https://github.com/thirdweb-dev/js/commit/ed47fd5310d11323080d984bca18a96fdef3a977) Thanks [@MananTank](https://github.com/MananTank)! - Reduce circular dependencies
+
+- Updated dependencies [[`16232de9`](https://github.com/thirdweb-dev/js/commit/16232de9eab9966e24e335929b2a3919346af265), [`645b0303`](https://github.com/thirdweb-dev/js/commit/645b0303cc1a9cbb0a0e9cbd67d11c3b865e4584)]:
+  - @thirdweb-dev/chains@0.1.20
+
 ## 3.10.20
 
 ### Patch Changes

packages/sdk/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thirdweb-dev/sdk",
-  "version": "3.10.20",
+  "version": "3.10.21",
   "description": "The main thirdweb SDK.",
   "repository": "https://github.com/thirdweb-dev/js/tree/main/packages/sdk",
   "license": "Apache-2.0",

packages/sdk/src/evm/common/any-evm-utils/deployContractDeterministic.ts

@@ -1,7 +1,7 @@
 import { BigNumber, ethers, Signer } from "ethers";
 import invariant from "tiny-invariant";
 import { PrecomputedDeploymentTransaction } from "../../types/any-evm/deploy-data";
-import { DeployOptions } from "../../types";
+import type { DeployOptions } from "../../types/deploy";
 import { isContractDeployed } from "./isContractDeployed";
 
 /**

packages/sdk/src/evm/common/any-evm-utils/deployContractDeterministicRaw.ts

@@ -1,6 +1,6 @@
 import { BigNumber, BytesLike, ethers, Signer } from "ethers";
 import invariant from "tiny-invariant";
-import { DeployOptions } from "../../types";
+import type { DeployOptions } from "../../types/deploy";
 import { isContractDeployed } from "./isContractDeployed";
 import { getInitBytecodeWithSalt } from "./getInitBytecodeWithSalt";
 

packages/sdk/src/evm/common/any-evm-utils/deployCreate2Factory.ts

@@ -1,7 +1,7 @@
 import { BigNumber, Signer } from "ethers";
 import invariant from "tiny-invariant";
 import { toWei } from "../currency/toWei";
-import { DeployOptions } from "../../types";
+import type { DeployOptions } from "../../types/deploy";
 import { CUSTOM_GAS_FOR_CHAIN } from "../any-evm-constants";
 import { COMMON_FACTORY } from "./constants";
 import { isContractDeployed } from "./isContractDeployed";

packages/sdk/src/evm/common/any-evm-utils/deployWithThrowawayDeployer.ts

@@ -1,6 +1,6 @@
 import { ethers, Signer } from "ethers";
 import { PrecomputedDeploymentTransaction } from "../../types/any-evm/deploy-data";
-import { DeployOptions } from "../../types";
+import type { DeployOptions } from "../../types/deploy";
 import { DEPLOYER_ABI, DEPLOYER_BYTECODE } from "./constants";
 import { createTransactionBatches } from "./createTransactionBatches";
 

packages/sdk/src/evm/common/any-evm-utils/fetchAndCacheDeployMetadata.ts

@@ -1,7 +1,7 @@
 import { ThirdwebStorage } from "@thirdweb-dev/storage";
 import { fetchExtendedReleaseMetadata } from "../feature-detection/fetchExtendedReleaseMetadata";
 import { fetchPreDeployMetadata } from "../feature-detection/fetchPreDeployMetadata";
-import { DeployMetadata } from "../../types";
+import type { DeployMetadata } from "../../types/deploy";
 
 const deployMetadataCache: Record<string, any> = {};
 

packages/sdk/src/evm/common/any-evm-utils/fetchAndCachePublishedContractURI.ts

@@ -1,4 +1,8 @@
-import { ThirdwebSDK } from "../../core/sdk";
+import { Contract } from "ethers";
+import ContractPublisherAbi from "@thirdweb-dev/contracts-js/dist/abis/ContractPublisher.json";
+import type { ContractPublisher } from "@thirdweb-dev/contracts-js";
+import { getContractPublisherAddress } from "../../constants/addresses/getContractPublisherAddress";
+import { getChainProvider } from "../../constants/urls";
 
 const uriCache: Record<string, string> = {};
 
@@ -10,16 +14,25 @@ export async function fetchAndCachePublishedContractURI(
   if (uriCache[contractName]) {
     return uriCache[contractName];
   }
-  // fetch the publish URI from the ContractPublisher contract
-  const publishedContract = await new ThirdwebSDK("polygon")
-    .getPublisher()
-    .getVersion(THIRDWEB_DEPLOYER, contractName);
-  if (!publishedContract) {
+
+  const contract = new Contract(
+    getContractPublisherAddress(),
+    ContractPublisherAbi,
+    getChainProvider("polygon", {}),
+  ) as ContractPublisher;
+
+  const model = await contract.getPublishedContract(
+    THIRDWEB_DEPLOYER,
+    contractName,
+  );
+
+  if (!model) {
     throw new Error(
       `No published contract found for ${contractName} at version by '${THIRDWEB_DEPLOYER}'`,
     );
   }
-  const uri = publishedContract.metadataUri;
+
+  const uri = model.publishMetadataUri;
   uriCache[contractName] = uri;
 
   return uri;

packages/sdk/src/evm/common/claim-conditions/calculateClaimCost.ts

@@ -1,7 +1,7 @@
 import { NATIVE_TOKEN_ADDRESS } from "../../constants/currency";
 import { ContractWrapper } from "../../core/classes/contract-wrapper";
 import { Address } from "../../schema/shared/Address";
-import { Price } from "../../types";
+import type { Price } from "../../types/currency";
 import { BigNumberish, CallOverrides } from "ethers";
 import { approveErc20Allowance } from "../currency/approveErc20Allowance";
 import { normalizePriceValue } from "../currency/normalizePriceValue";

packages/sdk/src/evm/common/claim-conditions/prepareClaim.ts

@@ -1,5 +1,8 @@
 import { ContractWrapper } from "../../core/classes/contract-wrapper";
-import { ClaimCondition, ClaimVerification } from "../../types";
+import type {
+  ClaimCondition,
+  ClaimVerification,
+} from "../../types/claim-conditions/claim-conditions";
 import { SnapshotFormatVersion } from "../sharded-merkle-tree";
 import { ThirdwebStorage } from "@thirdweb-dev/storage";
 import { BigNumber, BigNumberish, constants, ethers, utils } from "ethers";

packages/sdk/src/evm/common/claim-conditions/processClaimConditionInputs.ts

@@ -3,11 +3,11 @@ import {
   AbstractClaimConditionContractStruct,
   ClaimConditionInputArray,
 } from "../../schema/contracts/common/claim-conditions";
-import {
+import type {
   ClaimConditionInput,
-  FilledConditionInput,
   SnapshotInfo,
-} from "../../types";
+  FilledConditionInput,
+} from "../../types/claim-conditions/claim-conditions";
 import { SnapshotFormatVersion } from "../sharded-merkle-tree";
 import { createSnapshot } from "../snapshots";
 import { ThirdwebStorage } from "@thirdweb-dev/storage";

packages/sdk/src/evm/common/claim-conditions/transformResultToClaimCondition.ts

@@ -2,7 +2,7 @@ import {
   AbstractClaimConditionContractStruct,
   ClaimConditionOutputSchema,
 } from "../../schema/contracts/common/claim-conditions";
-import { ClaimCondition } from "../../types";
+import type { ClaimCondition } from "../../types/claim-conditions/claim-conditions";
 import { ThirdwebStorage } from "@thirdweb-dev/storage";
 import { BigNumber, providers } from "ethers";
 import { fetchCurrencyValue } from "../currency/fetchCurrencyValue";

packages/sdk/src/evm/common/claim-conditions/updateExistingClaimConditions.ts

@@ -2,7 +2,10 @@ import {
   ClaimConditionInputSchema,
   ClaimConditionOutputSchema,
 } from "../../schema/contracts/common/claim-conditions";
-import { ClaimCondition, ClaimConditionInput } from "../../types";
+import type {
+  ClaimConditionInput,
+  ClaimCondition,
+} from "../../types/claim-conditions/claim-conditions";
 import { ethers } from "ethers";
 
 /**