AEM Granite Render Conditions

A Granite Render Condition is a way of conditionally rendering a component in an AEM Touch UI dialog.

There are many situation where you might want to conditionally display an element of a dialog. Some examples are:

• Displaying a field depending on the user group
• Displaying a field depending on the page path
• Displaying a field if the page is active

Out of the Box Render Conditions

AEM provides several OOTB render conditions that might be enough for your needs where the (probably) most used is the Simple render condition /libs/granite/ui/components/coral/foundation/renderconditions/simple

Using Simple Render Condition

<?xml version="1.0" encoding="UTF-8"?> 
... 
  <text 
    jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/form/textfield" 
    fieldLabel="Text" 
    name="./text"> 
      <granite:rendercondition jcr:primaryType="nt:unstructured" sling:resourceType="granite/ui/components/coral/foundation/renderconditions/simple" expression="${granite:containsIgnoreCase(requestPathInfo.suffix, '/foo/bar')}"/> 
   </text> 
...

In the example above the text field will only show if your url suffix ends in /foo/bar. e.g. http://localhost:4502/content/mysite/mypage.html/foo/bar

Custom Render Condition

Let’s create an example where you want to provide a list of user groups that can see/edit the field.

The examples in AEM use JSPs, however my recommendation is not to use JSPs as there are many disadvantages in the long run.

First let’s create a Sling Model.

@Model(adaptables = SlingHttpServletRequest.class) 
public class UserGroupRenderCondition { 
  @Self private SlingHttpServletRequest request;
  @SlingObject private ResourceResolver resourceResolver; 
  @ValueMapValue private String groups; 
  @PostConstruct 
  public void init() { 
    List<String> allowedGroups = Arrays.asList(groups.split(",")); 
    UserManager userManager = 
      resourceResolver.adaptTo(UserManager.class); 
    if (userManager == null) { 
      return; 
    } 
    boolean belongsToGroup = false; 
    try { Authorizable currentUser = 
      userManager.getAuthorizable(resourceResolver.getUserID());
      Iterator<Group> groupsIt = currentUser.memberOf(); 
      while (groupsIt.hasNext()) { 
        Group group = groupsIt.next(); 
        String groupId = group.getID(); 
        if (allowedGroups.stream()
            .anyMatch(g -> g.equals(groupId))) { 
          belongsToGroup = true; 
          break; 
        } 
       } 
    } catch (RepositoryException e) { 
      //LOG error 
    } 
    request.setAttribute(RenderCondition.class.getName(), 
      new SimpleRenderCondition(belongsToGroup)); } }

Now , let’s call the model in the HTL.

Create the following structure:

/apps/mysite 
            /renderconditions (nt:folder) 
                             /user-group (nt:folder) 
                                       /user-group.html (nt:file)

Then update user-group.html

<sly data-sly-use="com.mycompany.mysite.rendercontions.models.UserGroupRenderCondition"></sly>

Finally, update the render condition on your dialog:

<granite:rendercondition 
  jcr:primaryType="nt:unstructured" 
  sling:resourceType="mysite/renderconditions/user-group"
  groups="content-authors,admin"/>

You’ll see that the textfield only appears if you’re an admin or part of the Authors group.

Hope this was helpful. Get in touch on LinkedIn or leave comments for any questions or suggestions.

Originally published at https://joao.ws on June 1, 2021.