From 47a35edadee0c850dd5505cac157edc7a1a425be Mon Sep 17 00:00:00 2001 From: bgravenorst Date: Fri, 5 Sep 2025 07:42:58 +1000 Subject: [PATCH 01/11] Added prerequisites. Signed-off-by: bgravenorst --- .../ios/stepContent/iOSQuickStart.mdx | 31 ++++--------------- .../embedded-wallets/ios/stepContent/index.ts | 3 ++ .../ios/stepContent/prerequisites.mdx | 20 ++++++++++++ .../builder/embedded-wallets/ios/steps.ts | 4 +++ 4 files changed, 33 insertions(+), 25 deletions(-) create mode 100644 src/pages/quickstart/builder/embedded-wallets/ios/stepContent/prerequisites.mdx diff --git a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/iOSQuickStart.mdx b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/iOSQuickStart.mdx index abab66c992c..67cda43a577 100644 --- a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/iOSQuickStart.mdx +++ b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/iOSQuickStart.mdx @@ -1,28 +1,9 @@ -### MetaMask Embedded Wallets Swift/iOS Quick Start +### MetaMask Embedded Wallets iOS/Swift quickstart -This guide is designed to help you quickly integrate a basic instance of MetaMask Embedded Wallet SDKs in your Swift/iOS app. +This quickstart is designed to help you quickly integrate MetaMask Embedded Wallet SDKs in your +iOS or Swift app. -If you face any problem anytime, you can always find help in the [Web3Auth Community](https://web3auth.io/community/c/help-pnp/pnp-ios/17). +To view the quickstart for a different platform, select the dropdown in the menu bar and choose your target +platform. For example, Android, React, Flutter, Angular, and others. -:::tip building locally - -- Clone the MetaMask Embedded Wallets Swift/iOS Quick Start Application - - ```shell npm2yarn - npx degit Web3Auth/web3auth-ios-examples/ios-quick-start w3a-ios-quick-start - ``` - -- Install & Run - - ```shell npm2yarn - cd w3a-ios-quick-start - ### run project in Xcode - ``` - -::: - -:::note Requirements - -- iOS 14+, Xcode 11.4+ / 12.x & Swift 4.x / 5.x - -::: +If you need help, visit the [Web3Auth Community](https://web3auth.io/community/c/help-pnp/pnp-android/16). diff --git a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/index.ts b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/index.ts index b8ee0758dc8..48eaf5ba2be 100644 --- a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/index.ts +++ b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/index.ts @@ -7,10 +7,13 @@ import * as initialization from './initialize.mdx' import * as installation from './installation.mdx' import * as login from './login.mdx' import * as logout from './logout.mdx' + +import * as prerequisites from './prerequisites.mdx' import * as iOSQuickStart from './iOSQuickStart.mdx' const STEPS = toSteps({ iOSQuickStart, + prerequisites, installation, registerApp, whitelist, diff --git a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/prerequisites.mdx b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/prerequisites.mdx new file mode 100644 index 00000000000..2910fcaced3 --- /dev/null +++ b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/prerequisites.mdx @@ -0,0 +1,20 @@ +### Prerequisites + +- iOS 14+ +- Xcode 12+ +- Swift 5.x + +:::tip build locally + +To build the project locally: + +- Clone the MetaMask Embedded Wallets Swift/iOS quickstart application: + + ```shell npm2yarn + npx degit Web3Auth/web3auth-ios-examples/ios-quick-start w3a-ios-quick-start + ``` + +- Open the project in Xcode from the `w3a-ios-quick-start` directory and + [build the app](https://developer.apple.com/documentation/xcode/building-and-running-an-app). + +::: \ No newline at end of file diff --git a/src/pages/quickstart/builder/embedded-wallets/ios/steps.ts b/src/pages/quickstart/builder/embedded-wallets/ios/steps.ts index a1b4d4dbb19..2ffe1c0708c 100644 --- a/src/pages/quickstart/builder/embedded-wallets/ios/steps.ts +++ b/src/pages/quickstart/builder/embedded-wallets/ios/steps.ts @@ -11,6 +11,10 @@ export default function getSteps(steps, files, replacementAggregator) { 'Quick Start' ), }, + { + ...STEPS.prerequisites, + pointer: undefined, + }, { ...STEPS.installation, pointer: replacementAggregator.highlightRange( From db55e179b4a53be024b3094f7c051fad2ce78f91 Mon Sep 17 00:00:00 2001 From: bgravenorst Date: Mon, 8 Sep 2025 15:26:05 +1000 Subject: [PATCH 02/11] Fixed broken links. Signed-off-by: bgravenorst --- .../ios/stepContent/blockchainCalls.mdx | 8 +++++--- .../ios/stepContent/initialize.mdx | 15 +++++++++------ .../ios/stepContent/installation.mdx | 8 ++++---- .../embedded-wallets/ios/stepContent/login.mdx | 14 +++++--------- .../embedded-wallets/ios/stepContent/logout.mdx | 10 ++-------- .../ios/stepContent/prerequisites.mdx | 16 ++++++---------- .../ios/stepContent/whitelist.mdx | 6 +++--- 7 files changed, 34 insertions(+), 43 deletions(-) diff --git a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/blockchainCalls.mdx b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/blockchainCalls.mdx index 05b6e1bcbe6..88b13afc83e 100644 --- a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/blockchainCalls.mdx +++ b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/blockchainCalls.mdx @@ -1,9 +1,11 @@ -### Making Blockchain Calls +### Make blockchain calls -While using the Web3Auth Swift/iOS SDK, you get the private key within the user scope. This means that you can use it with any blockchain with their corresponding library within the Swift/iOS environment. +With the Web3Auth iOS/Swift SDK, you can derive the user's private key in memory for the current session. +Use that key for any blockchain using their corresponding library in the Swift/iOS environment. :::info Connect any Blockchain -Refer to the [Blockchain Documentation](/connect-blockchain/) to know more about how to make calls on any blockchain. +Refer to the [blockchain documentation](/embedded-wallets/connect-blockchain/) to learn more about making calls on +any supported blockchain. ::: diff --git a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/initialize.mdx b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/initialize.mdx index 6e5023dcf16..37b0bdade59 100644 --- a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/initialize.mdx +++ b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/initialize.mdx @@ -1,13 +1,16 @@ -### Create and initialize the Web3Auth instance +### Create and initialize Web3Auth -Let's now create an instance of the `Web3Auth`. +Create an instance of `web3Auth` for your app. -We need `clientId` and `network` to initialize the web3auth class. You can get your `clientId` from registering (above), whereas `network` signifies the type of network(`SAPPHIRE_MAINNET` or `SAPPHIRE_DEVNET` ) you want to initialize web3auth with. +You'll need two values: -Now, let's create an instance of the `Web3Auth` class. It can be initialized on-demand when the user interactions are input (like button click) or when the screen is initialized. +- `clientId` - from the Web3Auth dashboard after registration. +- `network` - choose `SAPPHIRE_MAINNET`or `SAPPHIRE_DEVNET` to initialize Web3Auth with. -:::info sdk reference +Initialize `web3Auth` on-demand (for example, on a button tap) or when the screen loads. -Read more about [iOS SDK](/embedded-wallets/sdk/ios). +:::info SDK reference + +Read more about the [iOS SDK](/embedded-wallets/sdk/ios). ::: diff --git a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/installation.mdx b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/installation.mdx index 4c90172bc47..e892b80aff3 100644 --- a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/installation.mdx +++ b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/installation.mdx @@ -2,7 +2,7 @@ Add the MetaMask Web3Auth iOS SDK to your project -1. In Xcode, with your app project open, navigate to **File > Add Packages**. +1. In Xcode, open your project and select **File > Add Packages**. 1. When prompted, add the Web3Auth iOS SDK repository: @@ -10,12 +10,12 @@ Add the MetaMask Web3Auth iOS SDK to your project https://github.com/Web3Auth/web3auth-swift-sdk ``` - From the `Dependency Rule` dropdown, select `Exact Version` and enter the [latest version](https://github.com/Web3Auth/web3auth-swift-sdk/releases). +1. For **Dependency Rule**, select **Exact Version**, then enter the [latest version](https://github.com/Web3Auth/web3auth-swift-sdk/releases). -1. When finished, Xcode will automatically begin resolving and downloading your dependencies in the background. +Xcode automatically resolves and downloads the dependencies in the background. :::tip SDK Reference -- [Installing Web3Auth](/embedded-wallets/sdk/ios/install). +See [installing Web3Auth](/embedded-wallets/sdk/ios#installation). ::: diff --git a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/login.mdx b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/login.mdx index 9d6b46e4c7c..ebe378ac838 100644 --- a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/login.mdx +++ b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/login.mdx @@ -1,11 +1,7 @@ -### Logging in your User +### Sign in the user -Use the `login` function in the Web3Auth Instance to log in the user. Just create a button that triggers the `login` for the user of the login method of their choice. +Use the [`login`](/embedded-wallets/sdk/ios/usage/login) function of the +`web3Auth` instance to sign in the user. You can trigger it from a button or other user action. -After a successful user login, Web3Auth will redirect back to your app, with a payload stored in the state of the Web3Auth Instance. - -:::info SDK Reference - -- [`login()` function](/embedded-wallets/sdk/react-native/usage#logging-in-a-user). - -::: +After a successful user sign-in, Web3Auth returns the user to your app, with a payload stored in the +state of the `web3Auth` instance. diff --git a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/logout.mdx b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/logout.mdx index 9ee657d8613..30ac5ba4401 100644 --- a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/logout.mdx +++ b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/logout.mdx @@ -1,9 +1,3 @@ -### Log the user out +### Sign out the user -Use the `logout` function of the Web3Auth Instance to log the user out. - -:::info SDK Reference - -- [`logout()` function](/embedded-wallets/sdk/react-native/usage#logging-out-a-user). - -::: +Use the [`logout`](/embedded-wallets/sdk/ios/usage/logout) function to sign the user out. \ No newline at end of file diff --git a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/prerequisites.mdx b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/prerequisites.mdx index 2910fcaced3..e9b8bf39900 100644 --- a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/prerequisites.mdx +++ b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/prerequisites.mdx @@ -4,17 +4,13 @@ - Xcode 12+ - Swift 5.x -:::tip build locally - To build the project locally: -- Clone the MetaMask Embedded Wallets Swift/iOS quickstart application: - - ```shell npm2yarn - npx degit Web3Auth/web3auth-ios-examples/ios-quick-start w3a-ios-quick-start - ``` +1. Clone the MetaMask Embedded Wallets Swift/iOS quickstart application: -- Open the project in Xcode from the `w3a-ios-quick-start` directory and - [build the app](https://developer.apple.com/documentation/xcode/building-and-running-an-app). + ```shell npm2yarn + npx degit Web3Auth/web3auth-ios-examples/ios-quick-start w3a-ios-quick-start + ``` -::: \ No newline at end of file +1. Open the project in Xcode from the `w3a-ios-quick-start` directory and + [build the app](https://developer.apple.com/documentation/xcode/building-and-running-an-app). \ No newline at end of file diff --git a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/whitelist.mdx b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/whitelist.mdx index 4551f92fe1a..561347b483f 100644 --- a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/whitelist.mdx +++ b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/whitelist.mdx @@ -1,7 +1,7 @@ ### Whitelist Bundle ID -To whitelist, you'll need to +To whitelist, your app: -- Select your Web3Auth project in the [Developer Dashboard](https://dashboard.web3auth.io). +1. In the [Web3Auth dashboard](https://dashboard.web3auth.io), select your project. -- Add `(bundleId)://auth` to **Whitelist URLs** section. +1. In **Whitelist URLs**, add `(bundleId)://auth`. From 0137bc9c1b7bc63bf37f88c8016fa332452d1159 Mon Sep 17 00:00:00 2001 From: bgravenorst Date: Mon, 8 Sep 2025 15:52:38 +1000 Subject: [PATCH 03/11] Fix link. Signed-off-by: bgravenorst --- .../builder/embedded-wallets/ios/stepContent/iOSQuickStart.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/iOSQuickStart.mdx b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/iOSQuickStart.mdx index 67cda43a577..c979c27c566 100644 --- a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/iOSQuickStart.mdx +++ b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/iOSQuickStart.mdx @@ -6,4 +6,4 @@ iOS or Swift app. To view the quickstart for a different platform, select the dropdown in the menu bar and choose your target platform. For example, Android, React, Flutter, Angular, and others. -If you need help, visit the [Web3Auth Community](https://web3auth.io/community/c/help-pnp/pnp-android/16). +If you need help, visit the [Web3Auth Community](https://web3auth.io/community/). From c325daa38077d112db6a1ea99f671c971fd92a13 Mon Sep 17 00:00:00 2001 From: bgravenorst Date: Tue, 9 Sep 2025 08:37:57 +1000 Subject: [PATCH 04/11] Address reviewer feedback. Signed-off-by: bgravenorst --- .../ios/stepContent/iOSQuickStart.mdx | 17 +++++++++++++++++ .../embedded-wallets/ios/stepContent/index.ts | 2 -- .../ios/stepContent/prerequisites.mdx | 16 ---------------- .../builder/embedded-wallets/ios/steps.ts | 4 ---- 4 files changed, 17 insertions(+), 22 deletions(-) delete mode 100644 src/pages/quickstart/builder/embedded-wallets/ios/stepContent/prerequisites.mdx diff --git a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/iOSQuickStart.mdx b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/iOSQuickStart.mdx index c979c27c566..fc10d4fcafc 100644 --- a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/iOSQuickStart.mdx +++ b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/iOSQuickStart.mdx @@ -7,3 +7,20 @@ To view the quickstart for a different platform, select the dropdown in the menu platform. For example, Android, React, Flutter, Angular, and others. If you need help, visit the [Web3Auth Community](https://web3auth.io/community/). + +#### Prerequisites + +- iOS 14+ +- Xcode 12+ +- Swift 5.x + +To build the project locally: + +1. Clone the MetaMask Embedded Wallets Swift/iOS quickstart application: + + ```shell npm2yarn + npx degit Web3Auth/web3auth-ios-examples/ios-quick-start w3a-ios-quick-start + ``` + +1. Open the project in Xcode from the `w3a-ios-quick-start` directory and + [build the app](https://developer.apple.com/documentation/xcode/building-and-running-an-app). diff --git a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/index.ts b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/index.ts index 48eaf5ba2be..7cd4f0bbe63 100644 --- a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/index.ts +++ b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/index.ts @@ -8,12 +8,10 @@ import * as installation from './installation.mdx' import * as login from './login.mdx' import * as logout from './logout.mdx' -import * as prerequisites from './prerequisites.mdx' import * as iOSQuickStart from './iOSQuickStart.mdx' const STEPS = toSteps({ iOSQuickStart, - prerequisites, installation, registerApp, whitelist, diff --git a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/prerequisites.mdx b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/prerequisites.mdx deleted file mode 100644 index e9b8bf39900..00000000000 --- a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/prerequisites.mdx +++ /dev/null @@ -1,16 +0,0 @@ -### Prerequisites - -- iOS 14+ -- Xcode 12+ -- Swift 5.x - -To build the project locally: - -1. Clone the MetaMask Embedded Wallets Swift/iOS quickstart application: - - ```shell npm2yarn - npx degit Web3Auth/web3auth-ios-examples/ios-quick-start w3a-ios-quick-start - ``` - -1. Open the project in Xcode from the `w3a-ios-quick-start` directory and - [build the app](https://developer.apple.com/documentation/xcode/building-and-running-an-app). \ No newline at end of file diff --git a/src/pages/quickstart/builder/embedded-wallets/ios/steps.ts b/src/pages/quickstart/builder/embedded-wallets/ios/steps.ts index 2ffe1c0708c..a1b4d4dbb19 100644 --- a/src/pages/quickstart/builder/embedded-wallets/ios/steps.ts +++ b/src/pages/quickstart/builder/embedded-wallets/ios/steps.ts @@ -11,10 +11,6 @@ export default function getSteps(steps, files, replacementAggregator) { 'Quick Start' ), }, - { - ...STEPS.prerequisites, - pointer: undefined, - }, { ...STEPS.installation, pointer: replacementAggregator.highlightRange( From 6d9496b97dbdfa83ee61aa89a63e61f6ffa1db5c Mon Sep 17 00:00:00 2001 From: bgravenorst Date: Tue, 9 Sep 2025 08:38:44 +1000 Subject: [PATCH 05/11] Improve step description. Signed-off-by: bgravenorst --- .../builder/embedded-wallets/ios/stepContent/whitelist.mdx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/whitelist.mdx b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/whitelist.mdx index 561347b483f..638af792d8c 100644 --- a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/whitelist.mdx +++ b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/whitelist.mdx @@ -1,7 +1,7 @@ -### Whitelist Bundle ID +### Whitelist your bundle ID To whitelist, your app: 1. In the [Web3Auth dashboard](https://dashboard.web3auth.io), select your project. -1. In **Whitelist URLs**, add `(bundleId)://auth`. +1. Select the **Domains** tab. In **Whitelist URLs**, add `://auth`. From 7abee072e18218164a4fced60bf523e13c6754a7 Mon Sep 17 00:00:00 2001 From: bgravenorst Date: Tue, 9 Sep 2025 08:49:03 +1000 Subject: [PATCH 06/11] Minor language edit. Signed-off-by: bgravenorst --- .../builder/embedded-wallets/ios/stepContent/iOSQuickStart.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/iOSQuickStart.mdx b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/iOSQuickStart.mdx index fc10d4fcafc..1c94812ce41 100644 --- a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/iOSQuickStart.mdx +++ b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/iOSQuickStart.mdx @@ -14,7 +14,7 @@ If you need help, visit the [Web3Auth Community](https://web3auth.io/community/) - Xcode 12+ - Swift 5.x -To build the project locally: +Build the project locally: 1. Clone the MetaMask Embedded Wallets Swift/iOS quickstart application: From 8f723cb0e5772895bfef00dd163782709b4b8851 Mon Sep 17 00:00:00 2001 From: Yashovardhan Agrawal Date: Wed, 10 Sep 2025 09:45:07 +0400 Subject: [PATCH 07/11] Update src/pages/quickstart/builder/embedded-wallets/ios/stepContent/whitelist.mdx Co-authored-by: Alexandra Carrillo <12214231+alexandratran@users.noreply.github.com> --- .../builder/embedded-wallets/ios/stepContent/whitelist.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/whitelist.mdx b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/whitelist.mdx index 638af792d8c..9a98ca3538f 100644 --- a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/whitelist.mdx +++ b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/whitelist.mdx @@ -1,6 +1,6 @@ ### Whitelist your bundle ID -To whitelist, your app: +To whitelist your app: 1. In the [Web3Auth dashboard](https://dashboard.web3auth.io), select your project. From 33cce7273d4b630ba53e1406290000a22889a922 Mon Sep 17 00:00:00 2001 From: Alexandra Carrillo <12214231+alexandratran@users.noreply.github.com> Date: Wed, 10 Sep 2025 08:05:09 -0700 Subject: [PATCH 08/11] Fix deeplink urls (#2293) --- sdk/guides/use-deeplinks.md | 20 ++++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/sdk/guides/use-deeplinks.md b/sdk/guides/use-deeplinks.md index e9445e7f790..ea6ea0382db 100644 --- a/sdk/guides/use-deeplinks.md +++ b/sdk/guides/use-deeplinks.md @@ -23,14 +23,14 @@ This page highlights deeplinks available for the MetaMask mobile app. ```text -https://metamask.app.link/dapp/{dappUrl} +https://link.metamask.io/dapp/{dappUrl} ``` ```text -https://metamask.app.link/dapp/app.uniswap.org +https://link.metamask.io/dapp/app.uniswap.org ``` @@ -51,14 +51,14 @@ The example navigates to `app.uniswap.org` in the in-app browser. ```text -https://metamask.app.link/send/{recipient}@{chainId} +https://link.metamask.io/send/{recipient}@{chainId} ``` ```text -https://metamask.app.link/send/0x0000000@137?value=1e16 +https://link.metamask.io/send/0x0000000@137?value=1e16 ``` @@ -84,14 +84,14 @@ The example displays the confirmation screen to send 0.01 POL (`1e16` wei) in Po ```text -https://metamask.app.link/send/{contractAddress}@{chainId}/transfer +https://link.metamask.io/send/{contractAddress}@{chainId}/transfer ``` ```text -https://metamask.app.link/send/0x176211869cA2b568f2A7D4EE941E073a821EE1ff@59144/transfer?address=0x0000000&uint256=1e6 +https://link.metamask.io/send/0x176211869cA2b568f2A7D4EE941E073a821EE1ff@59144/transfer?address=0x0000000&uint256=1e6 ``` @@ -118,14 +118,14 @@ The example displays the confirmation screen to send 1 USDC (`1e6` units, contra ```text -https://metamask.app.link/buy +https://link.metamask.io/buy ``` ```text -https://metamask.app.link/buy?chainId=59144&address=0x176211869cA2b568f2A7D4EE941E073a821EE1ff&amount=100 +https://link.metamask.io/buy?chainId=59144&address=0x176211869cA2b568f2A7D4EE941E073a821EE1ff&amount=100 ``` @@ -154,14 +154,14 @@ You can use the `/buy` or `/buy-crypto` path for this deeplink. ```text -https://metamask.app.link/sell +https://link.metamask.io/sell ``` ```text -https://metamask.app.link/sell?chainId=59144&amount=125 +https://link.metamask.io/sell?chainId=59144&amount=125 ``` From ec5afe6700029d3cb7e6bcf57da26336810594dd Mon Sep 17 00:00:00 2001 From: Byron Gravenorst <50852695+bgravenorst@users.noreply.github.com> Date: Thu, 11 Sep 2025 06:20:03 +1000 Subject: [PATCH 09/11] Edit the embedded wallets React builder component. (#2292) * Edit the React builder component. Signed-off-by: bgravenorst * Typo. Signed-off-by: bgravenorst --------- Signed-off-by: bgravenorst --- .../react/stepContent/config.mdx | 6 ++++-- .../react/stepContent/installation.mdx | 4 ++-- .../react/stepContent/login.mdx | 6 ++++-- .../react/stepContent/logout.mdx | 8 +++++--- .../react/stepContent/reactBundlerIssues.mdx | 8 +++++--- .../react/stepContent/reactQuickStart.mdx | 12 +++++++++--- .../react/stepContent/setupWagmiProvider.mdx | 9 ++++++--- .../stepContent/setupWeb3AuthProvider.mdx | 5 +++-- .../react/stepContent/wagmiCalls.mdx | 18 +++++++++--------- 9 files changed, 47 insertions(+), 29 deletions(-) diff --git a/src/pages/quickstart/builder/embedded-wallets/react/stepContent/config.mdx b/src/pages/quickstart/builder/embedded-wallets/react/stepContent/config.mdx index d4d7cbdfc32..0021adaf53e 100644 --- a/src/pages/quickstart/builder/embedded-wallets/react/stepContent/config.mdx +++ b/src/pages/quickstart/builder/embedded-wallets/react/stepContent/config.mdx @@ -1,9 +1,11 @@ ### Configure Web3Auth -Create a basic config for Web3Auth and pass the `clientId` & `web3AuthNetwork` from your Web3Auth Dashboard Project Settings. +Create a basic Web3Auth configuration and pass the client ID and network details from your project +settings in the Web3Auth dashboard. :::info -This is where you can also configure any major settings of your integration as well. Visit our [**configuration section**](/embedded-wallets/sdk/react) of the sdk reference to learn more about the different options available. +Configure other major settings here as needed. +See the [configuration section](/embedded-wallets/sdk/react/advanced/) for available options. ::: diff --git a/src/pages/quickstart/builder/embedded-wallets/react/stepContent/installation.mdx b/src/pages/quickstart/builder/embedded-wallets/react/stepContent/installation.mdx index 2bc582de315..64f0b5f0ccd 100644 --- a/src/pages/quickstart/builder/embedded-wallets/react/stepContent/installation.mdx +++ b/src/pages/quickstart/builder/embedded-wallets/react/stepContent/installation.mdx @@ -1,6 +1,6 @@ -### Install MetaMask Embedded Wallet SDK +### Install MetaMask Embedded Wallets SDK -Install the Web3Auth React SDK package in your project. +Install the MetaMask Embedded Wallets SDK (Web3Auth) package in your project. Additionally, for blockchain calls, we're using `wagmi` for this example. diff --git a/src/pages/quickstart/builder/embedded-wallets/react/stepContent/login.mdx b/src/pages/quickstart/builder/embedded-wallets/react/stepContent/login.mdx index 2dba8fda7d6..20f2850c35e 100644 --- a/src/pages/quickstart/builder/embedded-wallets/react/stepContent/login.mdx +++ b/src/pages/quickstart/builder/embedded-wallets/react/stepContent/login.mdx @@ -1,3 +1,5 @@ -### Logging in your User +### Sign in the user -Use the `useWeb3AuthConnect` hook to get access to the login functionality. The modal will prompt the user to login with their wallet and handle the authentication for you. +Use the [`useWeb3AuthConnect` hook](/embedded-wallets/sdk/react/hooks/useWeb3AuthConnect) to access +the login functionality. The modal prompts the user to sign in with their wallet and +handles the authentication. diff --git a/src/pages/quickstart/builder/embedded-wallets/react/stepContent/logout.mdx b/src/pages/quickstart/builder/embedded-wallets/react/stepContent/logout.mdx index 650b02bf70c..ed39e3e7797 100644 --- a/src/pages/quickstart/builder/embedded-wallets/react/stepContent/logout.mdx +++ b/src/pages/quickstart/builder/embedded-wallets/react/stepContent/logout.mdx @@ -1,9 +1,11 @@ -### Log the user out +### Sign out the user -Use the `useWeb3AuthDisconnect` hook to log the user out. This will also delete the session information from the local storage of the browser. +Use the [`useWeb3AuthDisconnect` hook](/embedded-wallets/sdk/react/hooks/useWeb3AuthDisconnect) to +sign out the user. This also clears the session information from the browser's local storage. :::info -There are multiple other hooks available in the Web3Auth React SDK. Visit our [**hooks section**](/embedded-wallets/sdk/react/hooks) of the sdk reference to learn more about the different hooks available. +The React SDK provides additional hooks. +See the [hooks reference](/embedded-wallets/sdk/react/hooks) for more information. ::: diff --git a/src/pages/quickstart/builder/embedded-wallets/react/stepContent/reactBundlerIssues.mdx b/src/pages/quickstart/builder/embedded-wallets/react/stepContent/reactBundlerIssues.mdx index bdd13a97aa5..684908938c6 100644 --- a/src/pages/quickstart/builder/embedded-wallets/react/stepContent/reactBundlerIssues.mdx +++ b/src/pages/quickstart/builder/embedded-wallets/react/stepContent/reactBundlerIssues.mdx @@ -1,11 +1,13 @@ ### Troubleshooting -While using any web3 library in React, you may run into issues building. This issue occurs because some core packages like `eccrypto` have certain dependencies which are not present within the browser build environment. +When using web3 libraries in React, you may encounter build errors. This happens because some packages +(for example, `eccrypto`) depend on Node.js modules that aren't available in the browser build +environment. -To solve this, please have a look at our troubleshooting pages about [Vite Issues](/troubleshooting/vite-issues) +To resolve these errors, see the [Vite issues](/embedded-wallets/troubleshooting/vite-issues/) page. :::info -If you face any problem anytime, you can always find help in the [**Web3Auth Community**](https://web3auth.io/community/c/help-pnp/pnp-web/7). +If you need help, visit the [**Web3Auth community**](https://web3auth.io/community/c/help-pnp/pnp-web/7). ::: diff --git a/src/pages/quickstart/builder/embedded-wallets/react/stepContent/reactQuickStart.mdx b/src/pages/quickstart/builder/embedded-wallets/react/stepContent/reactQuickStart.mdx index b2732133d84..547dfc559b1 100644 --- a/src/pages/quickstart/builder/embedded-wallets/react/stepContent/reactQuickStart.mdx +++ b/src/pages/quickstart/builder/embedded-wallets/react/stepContent/reactQuickStart.mdx @@ -1,9 +1,15 @@ -### MetaMask Embedded Wallets Quick Start +### MetaMask Embedded Wallets React quickstart -Add social login and wallet connection functionality to your React app using the MetaMask Embedded Wallet SDKs. +Add social login and wallet connection functionality to your React app with the MetaMask +Embedded Wallets SDK (Web3Auth). -Clone the Quick Start in your terminal. +To view the quickstart for a different platform, select the dropdown in the menu bar and choose +your target platform. For example, Android, Flutter, Angular, iOS,and others. + +Clone the quickstart: ```bash npx degit Web3Auth/web3auth-examples/quick-starts/react-quick-start w3a-quick-start ``` + +If you need help, visit the [Web3Auth community](https://web3auth.io/community/). \ No newline at end of file diff --git a/src/pages/quickstart/builder/embedded-wallets/react/stepContent/setupWagmiProvider.mdx b/src/pages/quickstart/builder/embedded-wallets/react/stepContent/setupWagmiProvider.mdx index be32f571f2b..c13ae7fb48d 100644 --- a/src/pages/quickstart/builder/embedded-wallets/react/stepContent/setupWagmiProvider.mdx +++ b/src/pages/quickstart/builder/embedded-wallets/react/stepContent/setupWagmiProvider.mdx @@ -1,9 +1,12 @@ -### Setup Wagmi Provider +### Set up the Wagmi provider -Since we're using `wagmi` for this example, we need to setup the `WagmiProvider` component. Please use the `WagmiProvider` component from `@web3auth/modal/react/wagmi` to wrap your application. +Since this example uses `wagmi`, wrap your app with the `WagmiProvider` from +`@web3auth/modal/react/wagmi`. ```tsx import { WagmiProvider } from '@web3auth/modal/react/wagmi' ``` -> Apart from that, the standard wagmi setup is being used. You do not need to create any wagmi config, since the Web3Auth config is being used directly. Refer to the [wagmi docs](https://wagmi.sh/react/getting-started) for more information. +This example uses the standard Wagmi setup. You don't need to create a Wagmi config; the Web3Auth +config is used directly. See the [Wagmi docs](https://wagmi.sh/react/getting-started) for more +information. \ No newline at end of file diff --git a/src/pages/quickstart/builder/embedded-wallets/react/stepContent/setupWeb3AuthProvider.mdx b/src/pages/quickstart/builder/embedded-wallets/react/stepContent/setupWeb3AuthProvider.mdx index d9b3e256748..6980428098b 100644 --- a/src/pages/quickstart/builder/embedded-wallets/react/stepContent/setupWeb3AuthProvider.mdx +++ b/src/pages/quickstart/builder/embedded-wallets/react/stepContent/setupWeb3AuthProvider.mdx @@ -1,3 +1,4 @@ -### Setup Web3Auth Provider +### Set up the Web3Auth provider -To enable the hooks across your application, you need to wrap your application with the `Web3AuthProvider` component. This involves using the configuration created in the previous step. +Wrap your app with the `Web3AuthProvider` to enable hooks across your application. Use the configuration +from the previous step. diff --git a/src/pages/quickstart/builder/embedded-wallets/react/stepContent/wagmiCalls.mdx b/src/pages/quickstart/builder/embedded-wallets/react/stepContent/wagmiCalls.mdx index 15ba70c76fb..99dc103cdb7 100644 --- a/src/pages/quickstart/builder/embedded-wallets/react/stepContent/wagmiCalls.mdx +++ b/src/pages/quickstart/builder/embedded-wallets/react/stepContent/wagmiCalls.mdx @@ -1,15 +1,15 @@ -### Making Blockchain Calls +### Make blockchain calls -Since Wagmi is configured in this application, you can directly use the wagmi hooks to make blockchain calls. We have demonstrated some commonly used hooks like `useBalance`, `useAccount`, `useSignMessage`, `useSendTransaction` and `useSwitchChain`. +Because Wagmi is configured in this application, you can use Wagmi hooks to make +blockchain calls. This example demonstrates common hooks: +`useBalance`, `useAccount`, `useSignMessage`, `useSendTransaction`, and `useSwitchChain`. -:::info +See the [Wagmi documentation](https://wagmi.sh/react/api/hooks) for more information on the +hooks. -You can refer to the [**wagmi docs**](https://wagmi.sh/react/api/hooks) for more information on the hooks. +:::tip Connect any blockchain -::: - -:::tip Other Blockchains - -Web3Auth supports all blockchains. Have a look at our [Connect Blockchain](/connect-blockchain/) section of the documentation and choose your blockchain to get started. +Refer to the [blockchain documentation](/embedded-wallets/connect-blockchain) +to learn more about making calls on any supported blockchain. ::: From 7f50a90e56e2d1545dfb26a7f6e18447b256bc6b Mon Sep 17 00:00:00 2001 From: bgravenorst Date: Thu, 11 Sep 2025 06:26:53 +1000 Subject: [PATCH 10/11] Address reviewer feedback. Signed-off-by: bgravenorst --- .../builder/embedded-wallets/ios/stepContent/iOSQuickStart.mdx | 3 --- 1 file changed, 3 deletions(-) diff --git a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/iOSQuickStart.mdx b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/iOSQuickStart.mdx index 1c94812ce41..c17e746fc22 100644 --- a/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/iOSQuickStart.mdx +++ b/src/pages/quickstart/builder/embedded-wallets/ios/stepContent/iOSQuickStart.mdx @@ -3,9 +3,6 @@ This quickstart is designed to help you quickly integrate MetaMask Embedded Wallet SDKs in your iOS or Swift app. -To view the quickstart for a different platform, select the dropdown in the menu bar and choose your target -platform. For example, Android, React, Flutter, Angular, and others. - If you need help, visit the [Web3Auth Community](https://web3auth.io/community/). #### Prerequisites From 96e2153833293fac246659a81aaa579e0301fb08 Mon Sep 17 00:00:00 2001 From: bgravenorst Date: Thu, 11 Sep 2025 06:30:21 +1000 Subject: [PATCH 11/11] Remove text. Signed-off-by: bgravenorst --- .../android/stepContent/androidQuickStart.mdx | 5 +---- .../angular/stepContent/angularQuickStart.mdx | 3 --- 2 files changed, 1 insertion(+), 7 deletions(-) diff --git a/src/pages/quickstart/builder/embedded-wallets/android/stepContent/androidQuickStart.mdx b/src/pages/quickstart/builder/embedded-wallets/android/stepContent/androidQuickStart.mdx index ea395b7d95c..881bb18de7f 100644 --- a/src/pages/quickstart/builder/embedded-wallets/android/stepContent/androidQuickStart.mdx +++ b/src/pages/quickstart/builder/embedded-wallets/android/stepContent/androidQuickStart.mdx @@ -3,10 +3,7 @@ This quickstart is designed to help you quickly integrate MetaMask Embedded Wallet SDKs in your Android app. -To view the quickstart for a different platform, select the dropdown in the menu bar and choose your target -platform. For example, iOS/Swift, React, Flutter, Angular, and others. - -If you need help, visit the [Web3Auth Community](https://web3auth.io/community/c/help-pnp/pnp-android/16). +If you need help, visit the [Web3Auth community](https://web3auth.io/community/c/help-pnp/pnp-android/16). :::tip build locally diff --git a/src/pages/quickstart/builder/embedded-wallets/angular/stepContent/angularQuickStart.mdx b/src/pages/quickstart/builder/embedded-wallets/angular/stepContent/angularQuickStart.mdx index d5509cccff9..0b54c0856c8 100644 --- a/src/pages/quickstart/builder/embedded-wallets/angular/stepContent/angularQuickStart.mdx +++ b/src/pages/quickstart/builder/embedded-wallets/angular/stepContent/angularQuickStart.mdx @@ -2,9 +2,6 @@ Add Web3 authentication to your Angular app with the MetaMask Embedded Wallets SDK. -To view a quickstart for a different platform, select the dropdown in the menu bar and choose your -target (for example, Android, React, Flutter, iOS, or others). - Clone the Angular quickstart application: ```shell