# Auth0 integration guide

This document will guide you through configuring Sinch as a Multi-Factor authentication provider in Auth0.

Reminder:
This is not a replacement for built-in Auth0's Multi-Factor authentication but rather an alternative.

## What you need

- [Auth0 account](https://auth0.com/signup)
- [Sinch account](https://dashboard.sinch.com/signup) with enough credits


## Collect Sinch application key and secret

1. Navigate to `Apps` in the `Verification` section of the [Sinch Build Dashboard](https://dashboard.sinch.com/).
2. Locate and save the `Key` and `Secret` of the application you intend to use with Auth0. You will need them in the next steps.


![sinch-dashboard](/assets/sinch-dashboard.9d575ae56e8bfd9fd363c8463828d5e627c7fc7b7bebc3e6c5bab96eabb83f2c.4326727c.png)

## Install Sinch Verification Action

1. Log into your [Auth0 dashboard](https://manage.auth0.com/).
2. In the Marketplace find `Sinch Verification`.
![auth-marketplace](/assets/auth0-marketplace.7a74ca10e7c856fa25e501ac951e103153f7d691c7091877c8905db17d193969.4326727c.png)
3. In the next window click `Add integration`.
![auth-marketplace](/assets/auth0-marketplace-sinch.7914e95616bcf04ff0f929073fc314a0e632db4ae113ca721975bf2f4f334f82.4326727c.png)
4. Grant the action access it requires. You'll be prompted for `App Key` and `App Secret`. Enter the values that were obtained from the Sinch dashboard in the previous section.
5. Click `Create`.
![add-integration-form](/assets/add-integrration-form.fdb88a0389707868c4a35908237170472e29ecc47e2d71a59dc07aab8ce4df1e.4326727c.png)


## Configure `post-login` trigger

1. Navigate to `Actions` -> `Triggers` in the lefthand menu.
2. Find a `post-login` trigger and drag and drop `Sinch Verification` from installed actions as shown in the picture.
![configure-trigger](/assets/configure-trigger.af00f5732112d06032e22f1e682feb3d00a9baf9407f8a81fb331f395c2918e0.4326727c.png)


## Pass additional metadata

Since Sinch is a plug-in into Auth0's Multi-Factor authentication system, it requires additional setup with regards to the user's phone number collection.

Important!
**The requirement is that the user's phone number is passed to user metadata under the name `phone_number`.**

The following section is one way to achieve this, but there may be more depending on your setup.

### Custom sign up screen

1. Navigate to `Branding` -> `Universal Login` and find `Advanced Options`
![branding-universal-login](/assets/branding-universal-login.e0c11c393a88cb28b8a3df4e4370f1db0213c7c629c0bfee174c61438f3a6b3d.4326727c.png)
2. Locate `HTML` in the `Login` tab.
![ul-advanced-options](/assets/ul-advanced-options.2f6bff9e047e133770479472a7ae39599e2f54db6262405d62edc8340eb9f599.4326727c.png)
3. Find `Auth0Lock` and add `additionalSignUpFields` with the following data. You might want to add more, for instance, `icon` to customize the screen to your liking. Refer to [official documentation](https://auth0.com/docs/libraries/lock/lock-configuration#additionalsignupfields-array-) for all available options.



```js
var lock = new Auth0Lock(config.clientID, config.auth0Domain, {
  ...
  additionalSignUpFields: [{
    name: "phone_number",
    placeholder: "phone number",
  }]
});
```

Once this is done, the Sinch Verification integration is ready for use.