Best practice to hide UI elements and Views based on roles?

Hello!

What is the best practice to hide access to parts of your app for certain roles? I am mostly thinking visually. The data is blocked using permissions.

Hi!

Hiding UI elements based on roles can be done under the property “Visible” on the right sidebar when editing a component.

Skjermbilde 2025-04-22 kl. 10.05.49

There, you can add a condition for when the element should be visible - e.g. when the current user’s role is “owner”:

Thank you. Is there any way to give a UI element a tag/id/group to ease the administration of these visibility conditions?

What about views? Is there any way to restrict access to them or do I need to use visibility on their outermost container? It would be nice if some views appeared not to exist for certain roles.

Unfortunately, there’s no straightforward way to manage visibility conditions in groups.

However, when working with views, there are several workarounds:

  • Redirect using “On view load”: You can set up an action in the “On view load” event handler to redirect users with specific roles to another view.
  • Hide navigation buttons: Another option is to hide the button that leads to the restricted view for certain user roles.
  • Hide the container: You can also hide the outermost container of the view and, for example, display a restricted access message using a visibility group based on the user’s role.

Hope this helps!