docs: optional dependencies required by WalletConnect

tien · Jun 15, 2024 · e53f747 · e53f747
1 parent 154861d
commit e53f747
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 1 deletion.
diff --git a/...s/docs/getting-started/connect-wallets.md → .../docs/getting-started/connect-wallets.mdx b/...s/docs/getting-started/connect-wallets.md → .../docs/getting-started/connect-wallets.mdx
@@ -2,10 +2,41 @@
 sidebar_position: 3
 ---
 
+import TabItem from "@theme/TabItem";
+import Tabs from "@theme/Tabs";
+
 # Connect wallets
 
 Wallets & accounts connection can by managed via [`useWallets`](/api/react/function/useWallets), [`useConnectedWallets`](/api/react/function/useConnectedWallets) & [`useAccounts`](/api/react/function/useAccounts) hooks.
 
+## Install optional dependencies
+
+Additional dependencies are required if you use any of be bellow wallet type.
+
+### [WalletConnect](https://walletconnect.com/)
+
+{/* prettier-ignore-start */}
+
+<Tabs>
+  <TabItem value="npm" label="npm" default>
+    ```sh
+    npm add @walletconnect/modal @walletconnect/universal-provider
+    ```
+  </TabItem>
+  <TabItem value="yarn" label="yarn">
+    ```sh
+    yarn add @walletconnect/modal @walletconnect/universal-provider
+    ```
+  </TabItem>
+    <TabItem value="pnpm" label="pnpm">
+    ```sh
+    pnpm add @walletconnect/modal @walletconnect/universal-provider
+    ```
+  </TabItem>
+</Tabs>
+
+{/* prettier-ignore-end */}
+
 ## Add wallets to the config
 
 ```ts title="config.ts"

diff --git a/apps/docs/docs/getting-started/mutation.md b/apps/docs/docs/getting-started/mutation.md
@@ -8,7 +8,7 @@ The `useMutation` hook allow you to sign & submit transaction to a chain.
 
 ## Connect wallet & accounts
 
-Follow the [Connect wallets](./connect-wallets.md) guide to get this set up.
+Follow the [Connect wallets](./connect-wallets.mdx) guide to get this set up.
 
 ## Choose the signer