Actions library

The Actions library is a collection of actions that can be reused in your workspace apps and automations. Actions created in the library have the full power of the UI Bakery actions, including the ability to load and send data, trigger other actions, and execute JavaScript code.

Actions created in the library are not directly connected to any specific app. This means that you cannot access the app components or state variables, but can use the workspace data sources, and actions can accept parameters to customize the behaviour.

Actions created in the library are only accessible using the Execute Action step and are not directly available in the app actions code.

Tutorial

Let's review an example where we create a library action that will load data from the database, and use it across multiple apps.

Basic reusable SQL action

  • Go to your workspace and click the Actions library link.

  • Create a new action, name it loadUsers, and add your query.

  • Now the action is ready and can be used in any app in the workspace. Let's open the app and use the action using the Execute Action step.

  • Once the action is run, you can see the action is executed and the data is loaded. The action is complete and ready to be reused in multiple apps and automations.

Adding variable parameters

Let's make the action more flexible by adding a parameter that will allow us to filter the data.

  • Go back to the library and open the loadUsers action.

  • Observe the Default params section on the right side of the action. Parameters is an arbitrary JavaScript object that can be passed to the action in the runtime. In our case, we will pass a filter parameter that will be used in the query. We can also define the default value here so that the action can be executed without passing any parameters and will not fail during the development and debugging.

  • While testing the action, we can change the parameter value and see how it affects the query result.

  • Let's revert the filter to the default empty string value and get back to the app, select the already created Execute Action step, enable the Custom action params toggle, and pass a hardcoded parameter:

Click the reload button to synchronize the latest changes made in the Actions library.

Now, hardcode some filter value to pass it to the action and run the action to observe the filter being applied:

  • We can also use the component or state values as the arguments passed in the action.

  • Done! Now you can connect your action to a component to display the data:

Publishing and environments sync

To use the Actions library in the production or staging environments, you need to release the library. This will create a new version of the library that can be used in the production or staging environments, while you can still modify the library in the development environment.

To release the library:

  • Go to the Actions library;

  • Open the release popup, change the version, add a description, and click Publish release.

UI Bakery will remind you to release the Actions library upon the app release process:

The Actions library environment is linked to the app environment, which means that your actions will use the same data source environments as your app. For example, if your app is connected to the production database, your library actions will also use the production database in the production environment.

Moving the action to the library

In some cases, you might want to move an action from the app to the library to make it more abstract and reusable. To do this, you need to:

  • Select the action you'd like to extract and open the action settings menu.

  • Click on the Copy to Actions Library menu item - the Actions library will be opened in a new page.

  • Modify the action as necessary, and remove all references to the UI components or state variables.

  • Go back to the app and replace the action with the Execute Action and select the new action from the library.

Private actions

During the development, you might want to create an action that is not ready to be used in your apps. Or you might want to create an action that is not intended to be used in other apps and can be also used in the other actions in the library. In this case, you can uncheck the Shared checkbox in the action settings. This will make the action private and it will not be available in the app actions list.

Last updated