Auto-refresh Case List Views in Salesforce Lightning Service Console Apps

A quite obvious and reasonable requirement for Service agents using Salesforce Service Cloud is to have the Case List they are working on refresh automatically on any new Case coming in, or on an important change to an existing Case in the list. There is an out-of-the-box feature for this (Push Notifications for Console), but it’s unfortunately not (yet) available in Lightning Experience (though an Idea exists).

Luckily, the requirement can be met using just a bit of coding. The idea is to create a Utility component, which uses the console API to refresh the list, and calls this API on a regular basis. The solution consists of a simple Lightning Component which is then added to the Lightning Console App as a Utility Item.

And here’s the code…

1. The component’s markup

<aura:component implements="lightning:utilityItem">
  <aura:attribute name="refreshInterval" type="Integer" 
                  default="60" />
  <aura:attribute name="refreshing" type="Boolean" 
                  default="false" access="private" />
  <aura:attribute name="intervalId" type="String" 
                  access="private" />
  <!-- Needed to refresh the list -->
  <lightning:navigationItemAPI aura:id="navigationItemAPI"/>

  <lightning:button label="{!if(v.refreshing, 'Stop', 'Start')}" 
                    onclick="{!c.toggleAutoRefresh}">
  </lightning:button>
</aura:component>

2. The component’s controller.js

({
   toggleAutoRefresh: function(component, event, helper) {
      let refreshing = component.get('v.refreshing');
        
      if (!refreshing) {
         const refreshInterval = component.get('v.refreshInterval');
         const intervalId = window.setInterval(() => {
            helper.refreshListView(component);
         }, refreshInterval * 1000);
         component.set('v.intervalId', intervalId);
         component.set('v.refreshing', true);
      }
      else {
         const intervalId = component.get('v.intervalId');
         window.clearInterval(intervalId);
         component.set('v.intervalId', null);
         component.set('v.refreshing', false);
      }
   }
})

3. The component’s helper.js

({
   refreshListView : function(component) {
      let navigationItemAPI = component.find("navigationItemAPI");
      navigationItemAPI.getSelectedNavigationItem()
         .then((response) => {
            // Only refresh if viewing an object-page
            const objPage = 'standard__objectPage';
            if (response.pageReference && 
                   response.pageReference.type === objPage) {
                // Do the refresh
                navigationItemAPI.refreshNavigationItem()
                    .catch(function(error) {
                        console.log('Error in auto-refresh', error);
                    });
            }
        });
    }
})

This component can be then just added in the Lightning Console App to the Utility Items, by:

1. Open the App Manager in the Setup
2. Click on Edit next to your Lightning Console App
3. Click on Utility Items
4. Add the created component.

That’s it - it’s now available in the app.

A few points on the code and usage:

• The code checks that the refresh happens only if the user is on a object page (where list views are shown), but not for example on the Home Page, where it would refresh the complete Home Page.
• Additional checks can be included, e.g. to only refresh “Case” list views, by checking the object-type in the response of navigationItemAPI.getSelectedNavigationItem().
• To make the component more user-friendly for the App Builder, the component’s design file should be created/updated to contain a label and attribute descriptions
• It’s currently not possible to achieve this using Lightning Web Components, as they do not provide access to the navigationItemAPI.
• The component in the given implementation needs to be actively started by the user. This can also be automated by marking the Utility Item as “Auto Start” and changing the code to start the refreshing on the “init” event

Conclusion

Although there is no out-of-the-box solution currently available for Lightning Console Apps to achieve auto-refreshes on Case List Views, a simple Lightning Component can help out.

Need help?

If you need help implementing this or any other functionality in Salesforce, feel free to reach out.