Skip to main content

Bubble.io Plugin

The Warrant Bubble.io Plugin allows you to quickly add role-based access control to your bubble.io application without writing any code.

The following guide assumes that you already have a bubble.io application up and running in your bubble.io editor.

Installation & Configuration#

The first step is to install and configure the Warrant plugin in your bubble.io app.

  1. Open up your application in bubble.io. Click on 'Plugins' in the left navbar to bring up the Plugins page.
  2. On the 'Installed Plugins' page, click the 'Add plugins' button in the top right of your screen. This will bring up the plugin installer window. Search for 'warrant' in the search box and click 'Install' on the plugin.
  3. After exiting the plugin installer window, you'll see the Warrant plugin now installed. Make sure that the 'Currently installed version (latest version)' box has the latest version number selected.
  4. In the API Key box, paste your API key from your warrant.dev account as follows: ApiKey warrant_api_key (where warrant_api_key = your key)

That's it! Your plugin is now configured and ready for use. Next, we'll hook up the plugin to application actions.

Setting up User Creation#

In order to implement user authorization, each new user needs to be added into Warrant. This should be configured by adding the plugin into your app's user sign-up flow.

  1. Go to the 'Workflow' tab in your bubble.io application editor.

  2. Select your user sign-up page/popup using the page dropdown.

  3. Select the event corresponding to a user sign-up (ex. 'When Button SIGN UP is clicked'). This will bring up the action flow where you can add a new Warrant 'create user' action.

  4. In the 'new action popup,' select 'Plugins > Warrant API - Create User'. Bubble

  5. For 'userId' select 'current user's email' or 'current user's unique id'. You can also add a default 'roleId' for new users or leave it blank for now. Bubble

The user creation flow is now ready. You can test your change by previewing your application and signing up a dummy user. The new user should show up in your Warrant dashboard if the action has been properly integrated.

Implementing Authorization Actions#

Now that user creation is set up, you can start adding authorization checks in your application. These steps will walk you through an example.

  1. In the 'Workflow' tab, select the page and/or action that you'd like to gate behind Warrant user authorization.

  2. Click to add a new action. Select 'Plugins > Authorize User'. Bubble

  3. In the 'Authorize User' popup, select the same 'userId' as configured earlier (either current user email or unique id). Select the permissionId (from Warrant) that you'd like to validate for this action.

  4. Now, create your desired post-authorization action. In most cases, this will either be a navigation to another page or following a link. In the new action configuration popup, select 'Only when Result of step x (Authorize User)'s isAuthorized is "yes"'. This will ensure that the action is only taken if the user is authorized to do it. Bubble

All done! Remember that the 'Authorize User' action can be added anywhere that you'd like to verify user permissions using Warrant. If you have any other questions, feel free to email us at hello@warrant.dev.