added wc2 changes

Web3Auth · Sep 19, 2023 · 0831052 · 0831052
1 parent eb71988
commit 0831052
Show file tree

Hide file tree

Showing 3 changed files with 58 additions and 49 deletions.
diff --git a/docs/pnp/migration-guides/modal-v6-to-v7.mdx b/docs/pnp/migration-guides/modal-v6-to-v7.mdx
@@ -128,3 +128,19 @@ const accounts = await this.provider.request<never, string[]>({
   method: "xrpl_getAccounts",
 });
 ```
+
+### `wallet-connect-v2-adapter` requires different parameters
+
+#### With the deprecation of `@wallet-connect/qr-code-modal`, `wallet-connect-v2-adapter` now requires `@walletconnect/modal`.
+
+```tsx
+import { WalletConnectModal } from "@walletconnect/modal";
+import { getWalletConnectV2Settings, WalletConnectV2Adapter } from "@web3auth/wallet-connect-v2-adapter";
+
+const defaultWcSettings = await getWalletConnectV2Settings("eip155", [1], "04309ed1007e77d1f119b85205bb779d");
+const walletConnectModal = new WalletConnectModal({ projectId: "04309ed1007e77d1f119b85205bb779d" });
+const walletConnectV2Adapter = new WalletConnectV2Adapter({
+  adapterSettings: { qrcodeModal: walletConnectModal, ...defaultWcSettings.adapterSettings },
+  loginSettings: { ...defaultWcSettings.loginSettings },
+});
+```
diff --git a/docs/pnp/migration-guides/no-modal-v6-to-v7.mdx b/docs/pnp/migration-guides/no-modal-v6-to-v7.mdx
@@ -93,3 +93,19 @@ const accounts = await this.provider.request<never, string[]>({
   method: "xrpl_getAccounts",
 });
 ```
+
+### `wallet-connect-v2-adapter` requires different parameters
+
+#### With the deprecation of `@wallet-connect/qr-code-modal`, `wallet-connect-v2-adapter` now requires `@walletconnect/modal`.
+
+```tsx
+import { WalletConnectModal } from "@walletconnect/modal";
+import { getWalletConnectV2Settings, WalletConnectV2Adapter } from "@web3auth/wallet-connect-v2-adapter";
+
+const defaultWcSettings = await getWalletConnectV2Settings("eip155", [1], "04309ed1007e77d1f119b85205bb779d");
+const walletConnectModal = new WalletConnectModal({ projectId: "04309ed1007e77d1f119b85205bb779d" });
+const walletConnectV2Adapter = new WalletConnectV2Adapter({
+  adapterSettings: { qrcodeModal: walletConnectModal, ...defaultWcSettings.adapterSettings },
+  loginSettings: { ...defaultWcSettings.loginSettings },
+});
+```
diff --git a/docs/sdk/pnp/web/adapters/wallet-connect-v2.mdx b/docs/sdk/pnp/web/adapters/wallet-connect-v2.mdx
@@ -12,7 +12,7 @@ import Tabs from "@theme/Tabs";
 
 ## [`@web3auth/wallet-connect-v2-adapter`](https://npmjs.com/package/@web3auth/wallet-connect-v2-adapter)
 
-Wallet connect v2 adapter allows you login with wallet connect v2. You can read more about wallet connect [here](https://docs.walletconnect.com/).
+Wallet connect v2 adapter allows you to log in with wallet connect v2. You can read more about Walletconnect [here](https://docs.walletconnect.com/).
 
 ## Basic Details
 
@@ -54,9 +54,11 @@ npm install --save @web3auth/wallet-connect-v2-adapter
 <TabItem value="interface">
 
 ```tsx
-interface WalletConnectV2AdapterOptions {
+interface WalletConnectV2AdapterOptions extends BaseAdapterSettings {
   adapterSettings?: IAdapterSettings;
   loginSettings?: EngineTypes.ConnectParams;
+}
+interface BaseAdapterSettings {
   clientId?: string;
   sessionTime?: number;
   chainConfig?: Partial<CustomChainConfig> & Pick<CustomChainConfig, "chainNamespace">;
@@ -75,8 +77,8 @@ interface WalletConnectV2AdapterOptions {
 
 :::caution
 
-While you can pass your `chainConfig` here, but it is not required since you can directly pass it over to the `Web3Auth`/ `Web3AuthNoModal`
-configuration while instantiating it.
+While you can pass your `chainConfig` here, it is not required since you can directly pass it over to the `Web3Auth`/ `Web3AuthNoModal` configuration
+while instantiating it.
 
 Read more about it in their respective sections:
 
@@ -101,15 +103,19 @@ interface IAdapterSettings {
   qrcodeModal?: IQRCodeModal;
 }
 
-export interface IQRCodeModal {
-  open(uri: string, cb: any, opts?: any): void;
-  close(): void;
+interface IQRCodeModal {
+  openModal: (options?: OpenOptions) => Promise<void>;
+  closeModal: () => void;
+}
+interface OpenOptions {
+  uri: string;
+  chains?: string[];
 }
 ```
 
 ## getWalletConnectV2Settings
 
-You can get walletConnectV2 settings by calling the `getWalletConnectV2Settings()` function with it's required arguments.
+You can get walletConnectV2 settings by calling the `getWalletConnectV2Settings()` function with its required arguments.
 
 ### Arguments
 
@@ -126,51 +132,26 @@ You can get walletConnectV2 settings by calling the `getWalletConnectV2Settings(
 | Parameter   | type                                                                   |
 | ----------- | ---------------------------------------------------------------------- |
 | `namespace` | `ChainNamespaceType`, e.g. (`eip155`)                                  |
-| `chainIds`  | `number[]` e.g. [1, 5, 137]                                            |
+| `chainIds`  | `number[]` e.g. [1]                                                    |
 | `projectID` | WalletConnect Project ID, get one from https://cloud.walletconnect.com |
 
 </TabItem>
 
 <TabItem value="function">
 
 ```tsx
-export const getWalletConnectV2Settings = async (
+export declare const getWalletConnectV2Settings: (
   namespace: ChainNamespaceType,
   chainIds: number[],
   projectID: string
-): Promise<{
+) => Promise<{
   adapterSettings: IAdapterSettings;
   loginSettings: EngineTypes.ConnectParams;
-}> => {
-  if (namespace === CHAIN_NAMESPACES.EIP155) {
-    const appMetadata = await getSiteMetadata();
-    const adapterSettings: IAdapterSettings = {
-      walletConnectInitOptions: {
-        projectId: projectID,
-        relayUrl: "wss://relay.walletconnect.com",
-        metadata: {
-          name: appMetadata.name,
-          description: appMetadata.name,
-          url: window.location.origin,
-          icons: [appMetadata.icon || ""],
-        },
-      },
-    };
-
-    const chainNamespaces = chainIds.map((chainId) => {
-      return `${namespace}:${chainId}`;
-    });
-
-    const loginSettings: EngineTypes.ConnectParams = {
-      requiredNamespaces: getRequiredNamespaces(chainNamespaces),
-    };
-    return {
-      adapterSettings,
-      loginSettings,
-    };
-  }
-  throw new Error(`Unsupported chain namespace: ${namespace}`);
-};
+}>;
+export interface IAdapterSettings {
+  walletConnectInitOptions?: SignClientTypes.Options;
+  qrcodeModal?: IQRCodeModal;
+}
 ```
 
 </TabItem>
@@ -180,18 +161,14 @@ export const getWalletConnectV2Settings = async (
 ## Example
 
 ```tsx
-import { WalletConnectV2Adapter } from "@web3auth/wallet-connect-v2-adapter";
 import { WalletConnectModal } from "@walletconnect/modal";
+import { getWalletConnectV2Settings, WalletConnectV2Adapter } from "@web3auth/wallet-connect-v2-adapter";
 
+const defaultWcSettings = await getWalletConnectV2Settings("eip155", [1], "04309ed1007e77d1f119b85205bb779d");
 const walletConnectModal = new WalletConnectModal({ projectId: "04309ed1007e77d1f119b85205bb779d" });
 const walletConnectV2Adapter = new WalletConnectV2Adapter({
-  adapterSettings: {
-    qrcodeModal: walletConnectModal,
-    ...defaultWcSettings.adapterSettings,
-  },
-  loginSettings: {
-    ...defaultWcSettings.loginSettings,
-  },
+  adapterSettings: { qrcodeModal: walletConnectModal, ...defaultWcSettings.adapterSettings },
+  loginSettings: { ...defaultWcSettings.loginSettings },
 });
 
 web3auth.configureAdapter(walletConnectV2Adapter);