Display a Panel Based on a User's Role

To display a panel based on a user's role, you have two options: one option for a simple hide/show of a panel and a second option for more complicated scenarios such as reordering panels.

First, let's configure the panel region so that the Hierarchy panel displays only to sales managers, not sales representatives. This example is a simple hide/show use case, so it's easiest to update the accounts-detail page's JSON with the condition.

In the accounts-detail page's JSON, indicate that the Hierarchy panel must not display for sales representatives.

1. In Visual Builder Studio, click the App UIs side tab.

2. Navigate CX Sales > cx-sales > accounts > accounts-detail.

3. On the accounts-detail page, click the JSON subtab.

4. Scroll to the "/PanelsContainerLayout" section.

5. Replace the "accountHierarchyPanel" panel with the following expression:

   "[[cxcore.utils.userInfo.getRoles().includes('ORA_ZBS_INSIDE_SALES_REPRESENTATIVE_JOB’) ? null: accountHierarchyPanel]]",

   

For more complex changes like reordering panels based on a user's role, you must create a panel layout with the new sequence and add a condition. For example, for the Case 1 (Copy) panel layout that we previously created, add the sales manager condition. This means that only sales managers can view the panel layout where the Activities panel displays after the Hierarchy panel.

1. Navigate to the Page Designer tab on the accounts-detail page.

2. On the Structure panel, click the Panel Container Layout node.

   

3. On the Properties pane, next to Case 1, click the Duplicate icon.

   

4. Next to the Case 1 (Copy) panel layout's condition, click the Expression Editor icon.

   

5. In the Expression Editor dialog, enter this expression:

   cxcore.utils.userInfo.getRoles().includes('ORA_ZBS_INSIDE_SALES_MANAGER_JOB')

   

6. Click Save.

7. Let's test the sales representative change.

   Click the Preview button to see your changes in your runtime test environment.

   

   The preview link must include the application/container segments in the URL. If not, then change the preview link using the following example URL:

   https://<servername>/fscmUI/redwood/cx-sales/application/container/accounts/accounts-detail?id=300000003513233&puid=7050&view=foldout

   Here's a screenshot where the logged-in user is a sales representative. Notice that, on the account detail page, the Hierarchy panel doesn't display. This is due to the JSON update that you made previously.

   

   Next, try signing in as a sales manager. On an account detail page, the Activities panel should display after the Hierarchy panel.