> For the complete documentation index, see [llms.txt](https://docs.leapwallet.io/leap-near/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.leapwallet.io/leap-near/leap-near-sdk/mint-nfts/mobile.md).

# Mobile

In Mobile, since we are in the web app authentication flow and web views are not recommended ways for authentication. We wrapped the implementation of authentication in our Leap auth web app (At present we support only web3auth for mobile).&#x20;

At present minting an NFT in mobile, we are supporting via few and far.

* Leap Stage  - [stage-auth.leapwallet.io](https://stage-auth.leapwallet.io)
* Leap Production  - [auth.leapwallet.io](https://auth.leapwallet.io)

To integrate into your mobile app, follow the below steps.

<figure><img src="https://2526449121-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fx1r9riKKZg3xhFobGg1Q%2Fuploads%2F5qQdAUEgNCKhcag21bWK%2FScreenshot%202023-01-11%20at%2011.00.17%20AM.png?alt=media&amp;token=94c1cb98-cc3a-4b12-9c30-6cc385220441" alt=""><figcaption></figcaption></figure>

### Step 1

We would recommend you open leap auth URLs in the following way.

* Android - [Chrome custom tabs](https://developer.chrome.com/docs/android/custom-tabs/#whatarethey)
* iOS - [Safari Services](https://developer.apple.com/documentation/safariservices) / [Authentication Services](https://developer.apple.com/documentation/authenticationservices)
* React Native - [In-app browser](https://www.npmjs.com/package/react-native-inappbrowser-reborn)

### Step 2

Open the Leap Auth URL with the leapConfig param.

```
https://stage-auth.leapwallet.io
```

1. Create a config JSON object of the below format

### Basic Config

```tsx
{ 
    auth_service: 'web3auth',
    authConfig: { 
      appName: "YOUR_APP_NAME",  
      theme: 'dark', 
      isRedirect: true,
      web3AuthNetwork: "mainnet", 
      domain: 'https://auth.leapwallet.io',
    },
    tenantId: "TENANT_ID",
    clientId: "CLIENT_ID",
    networkId: "mainnet",
    leapRedirectURL: "DEEP_LINK"
    collectionId: 2
    nftText: "NFT Name"
  }
```

{% hint style="info" %}

* auth\_service - The Auth service to be used, currently we are supporting web3auth in mobile view
* authConfig - The basic config information needs to be bassed to Web3auth
* appName - Name of your application
* theme - Theme of your application, based on it web3auth will apply the theme to their screen
* isRedirect - We need to redirect to web3auth login instead of pop-up mode which will not work on mobile
* Web3AuthNetwork - The network of web3auth to be used, it is recommended to use `testnet` and `aqua`
* tenantId - The tenantId provided by leap,  contact us at <admin@leapwallet.io>
* clientId - The clientId provided by leap,  contact us at <admin@leapwallet.io>
* networkId - `mainnet` or `testnet`
* leapRedirectURL - The deep link of your application to which the control needs to get back.
* collectionId - The few and far collection ids provided by leap, contact us at <admin@leapwallet.io>
  {% endhint %}

2. JSONStringify the Object.

```javascript
const stringified = JSON.stringify(config);
```

3. Encode the URIComponent in the String

```javascript
const encodedURIComponents = encodeURIComponent(stringified);
```

4. Encode the object from base64toASCII

```javascript
const encodedConfig = btoa(encodedURIComponents)
```

5. Add the param name `leapConfig`

```javascript
const url = `https://stage-auth.leapwallet.io/?leapConfig=${encodedConfig}`
```

### Step 3

Once the authentication is successful and the wallet is created, Leap auth will redirect the user to leapRedirectUrl with the following params

* LeapNearAddress - Wallet Address

### Advanced Config

In advanced config,  you can provide your own firebase and web3Auth configs

* Follow this link <https://web3auth.io/docs/guides/firebase> to generate your Firebase and Web3Auth configs.
* Pass the information below&#x20;

```javascript
{ 
    auth_service: "web3Auth" 
    ...   
    authConfig: { 
      firebaseConfig: {
        ...
      },
      Web3AuthClientId: 'WEB3_AUTH_CLIENT_ID',
      JWTVerifier: {
        name: "YOUR_APPLICATION_NAME",
        verifier: "VERIFIER_NAME",
        typeOfLogin: "jwt",
        clientId: 'WEB3_AUTH_CLIENT_ID'
      }
    },
    ...
  }

```

{% hint style="info" %}

* firebaseConfig - The firebase config which shows in your firebase login for web integration code.
* Web3AuthClientId - The client Id is shown in your web3Auth Plug\&Play section
* JWTVerifier.verifier - The Verifier name shown in your web3Auth CustomAuth section
  {% endhint %}

### Examples

* [React Native](https://github.com/leapwallet/leap-near-sdk-react-native-example)
