---
title: Multiple Connection Auth
slug: bubble/multiple-connection-auth
docTags: 
createdAt: 2021-03-31T11:10:07.000Z
---

Pathfix allows you to add multiple connections against a single user. E.g  2 Twitter accounts or add 3 GMail accounts etc.

For Bubble users, Pathfix will render the auth UI and manage the connections for these multiple accounts. The process to Make Request in Bubble is slightly more complex but this documentation will walk you through the process.

Please note: For Bubble multi-connection auth, there is a new user concept called `Virtual User ID`. Virtual User ID's help associate each connected account for the user in case of multi-accounts.



## Pathfix Setup

Once you have registered your application with the provider you wish to integrate with:

- Login to your Pathfix account and click on `Add Application`
- Add the name of your web app and hit `Save`
- Select the provider you want to offer the integration from the list of providers. You can change the Display `Name` and `Description` in the `General` tab.
- Enter the `Client ID` and `Client Secret` received from provider and hit `Save `
- Copy your Pathfix Public Key and Private Key for use in the plugin



## Bubble Setup

### UI Setup

The Bubble auth UI is handled by Pathfix through our Pathfix OAuth Connector plugin. 

- Install the Pathfix OAuth plugin 
- If you already have the plugin installed, make sure you are on version 2.4.1 or above



::Image[]{src="https://api.archbee.com/api/presign/E6H_--BmYJWG_yGaOUOxt/8ELQWSkJXM8lFb4w1uwrW_image.png" size="92" caption="Image: Plugin version" position="center" showCaption="true"}



- Add your Pathfix Public Key under the Public Key section
- Under `x-partner-key`, add your Pathfix public key and private key separate by a dot (**public.private**). If you do not have a Pathfix account, enter the x-partner-key provided by the plugin in Bubble preview mode.
- Add the **Pathfix Connector** element to your page and select `All Providers configured in my Pathfix Account`
- Enable `Multiple Connections per user`  



::Image[]{src="https://api.archbee.com/api/presign/E6H_--BmYJWG_yGaOUOxt/l7VeI89ylJbOWAumyg5-R_image.png" size="42" caption="Image: Enable multi connection" position="center" showCaption="true"}



You will now see the the provider auth button listed with the ability for your users to connect multiple accounts. 

::Image[]{src="https://api.archbee.com/api/presign/E6H_--BmYJWG_yGaOUOxt/2L5c6W0vrO759yZP4U9xY_image.png" size="78" caption="Image: Multi connection UI" position="center" showCaption="true"}



### Make Request

For every user that connects multiple accounts for a single provider, Pathfix assigns a **Virtual User ID**. This Virtal User ID needs to be used across all your API calls, including workflow setup. 

To get the Virtual User ID, you will need to setup the following workflow in Bubble. 

On the page where you want to call the API, you need to do the following steps:

1. Get the list of connection names that have been authorized by the user
2. Pick a connection from the list for which you want to retrieve the Virtual User ID
3. Store the Virtual User ID to replace the user\_id parameter in all your API calls



1.To get the list of connection names:

- For the page where you want to to invoke the API, go to Workflow 
- **On page load** select **Get User Connection Names**
- This will insert the list of connection names in a Bubble state

::Image[]{src="https://api.archbee.com/api/presign/E6H_--BmYJWG_yGaOUOxt/6bFtsSoP9whDqs5d0e1EM_image.png" size="60" caption="Image: Get Connection Names" position="center" showCaption="true"}





2\. Pick a connection from the list for which you want to retrieve the Virtual User ID:

- You can offer your user to select from their multiple connections anywhere on your app. 
- Below is a sample configuration for a dropdown:

::Image[]{src="https://api.archbee.com/api/presign/E6H_--BmYJWG_yGaOUOxt/IfAL3Y_uumJ8vJg7KdtE-_image.png" size="46" caption="Image: Dropdown multi connection" position="center" showCaption="true"}



When the user makes a selection, you will need to setup a new workflow:

- Select **When Dropdown's value is changed** 
- Setup Step 1 to **Query Connection Property** as shown below:



::Image[]{src="https://api.archbee.com/api/presign/E6H_--BmYJWG_yGaOUOxt/zVZy7RojFFkB-NTND4y-X_image.png" size="96" caption="Image: Setup Query Connection Property" position="center" showCaption="true"}



3\. Store the Virtual User ID to replace the user\_id parameter in all your API calls

- Add another workflow **Do when condition is true** and choose the Pathfix Connector's **Requested Connection Property** is not empty
- This will generate the Virtual User ID that you can save to your database or use however you want



::Image[]{src="https://api.archbee.com/api/presign/E6H_--BmYJWG_yGaOUOxt/M8EVoS8iPSh02SNhVD6aV_image.png" size="82" caption="Image: Requested Connection Property" position="center" showCaption="true"}