Design patterns for enabling user interface elements based on user permissions?

Question

We have a web application and its front end is implemented with GWT/GXT. Users can belong to various groups and these groups can then have various permissions. The permissions are quite fine grained, for example comment_create, comment_edit, comment_delete and comment_read.

What would be the best way to enable and disable user interface controls based on user permissions? We have an utility method that returns boolean value with given user and permission name. But at the moment each control is wrapped inside if clause and that makes the code bit messy.

Answer 1

I had the same problem, here my solution.

Each UI component has an on/off state (visible/hidden, enabled/disabled, editable/readonly) and the state can be bound to one or more permission. For example the edit button can be enabled if the user has an EDIT permission, or disabled otherwise.

I've created a binder class that binds the UI component to a permission. The binder knows the current user permissions (all the permissions) through a event bus where a set of permissions is sent using an event. Each time the event is received the binder check if the permission is present or not (an alternative is use a boolean for each permission) and apply the changes to the component (for example enabling or disabling it).

The event bus is the only connection between all the UI components.

Using Gin and some helper class I've ended up with something like this for the binding code:

FeatureBinder.bind(editButton, EDIT_PERMISSION);

Answer 2

I'm not sure how you'd implement this in GWT/GXT, but the old MFC way of enabling menus might be a place to start.

This had a separate ON_UPDATE_COMMAND_UI message which you gave a menu id and method name. The method would be called and you could enable or disable that menu option depending on your logic. In your case it would be based on the user id. This is on a per menu id basis and is therefore as fine grained as you need it to be.