Showing and Hiding Regions on Your Page Based on User Roles

In our previous tutorials we've explained to you how you can create a complete log-in system with user data, filtered by the logged user identity.

 We are currently working on one of the protected pages which every logged user has access to. We want to show a section of this site only when an admin is logged in. Note that you can also show or hide regions, based on other properties like: email, ID, name, etc. The role is just an example. We store user roles in our users table. Click on your page (1). Add a new component (2). Under data, select conditional region (3-4).

Click the conditional region component in the app connect tree (1). Click the dynamic data picker for the condition (2). Expand your server action, containing the filtered users data query. Here, we select role (3). Setup the condition by adding equals to admin (4). Note, the value must be wrapped in single quotes. Click select when you're done (5).

Add the content which should be visible by admins inside the conditional region. It will be only rendered when an admin is logged in.

And we're done! Let's preview the results.

We first log in using a simple user account. We're redirected to the protected page but the region is not being rendered. 

If we log out and use an admin account to log in, then you can see the special region which is now rendered on the page.