Load user specific data with {{user.email}} variable

If you need to load data that belongs to a particular user, or hide/show certain elements based on a user role, you can use the {{user.email}} variable to manage it.

Load list of object that belongs to a current logged in user

Let's review the case when based on the user's email, the users can only have access to their specific data (e.g. about their orders).

1. Start with creating an action that will load the data about a current user. For instance, you can use a SQL query action that will reference current user email:

select * from customers where customers.email="{{user.email}}";

The action will return an array of users with a single item in it. To fix this, add return {{data[0]}} to the Transformer section of the action:

2. Once you loaded your user, you can fill their information, for example, user's orders, using a Load table action. To do so, you can directly reference a previously created action that holds the additional information about the current user:

Now, when different users login into the application, they will see the data only about their orders.

Manage component's visibility based on the user's role

You can also manage the component's visibility based on the user's role in UI Bakery.

Let's say that the admins of your workspace need to perform the search by customers to look for certain customers' records.

To do so, navigate the Condition setting of the component which visibility you'd like to configure and specify the following condition:

{{user.role}} === 'admin'

That's it. Any user with an admin role will see the customer search input, while for the regular users the component is hidden.