Lightning Console Set Tab Label Dynamically

Salesforce console is one of the key areas for agents to boost service productivity.we will see how to set the console case tab label dynamically based on the case origin.we will append the case origin to the case number while setting the label.

Apex Class 

public class ChangeCaseLabel {
    public static ChangeCaseLabelService service = new ChangeCaseLabelService();
    @AuraEnabled 
    public static String getCaseOrigin(String caseId){
        return service.getCaseOrigin(caseId);
    }
    
    
}

Service Class 

public class ChangeCaseLabelService {
    
    public String getCaseOrigin(String caseId){
        Case c = [Select id ,CaseNumber , Origin from Case where Id = :caseId];
        return c.Origin+'-'+c.CaseNumber ; 
    }
}

Lightning Component 

<aura:component implements="flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId" access="global" controller="ChangeCaseLabel">
    <aura:handler name="init" value="this" action="{!c.doInit}"/>
    <aura:handler event="force:refreshView" action="{!c.doInit}" />  
    <lightning:workspaceAPI aura:id="workspace" />
</aura:component>

({
	doInit : function(component, event, helper) {
		helper.init(component, event, helper);
	}
})

({
    init : function(component, event, helper) {
        var action = component.get("c.getCaseOrigin");
        action.setParams({ caseId: component.get("v.recordId")});
        action.setCallback(this,$A.getCallback(function(response1)
         {
         var state = response1.getState();             
         if (state === "SUCCESS")  
         {
             var result= response1.getReturnValue();
         var workspaceAPI = component.find("workspace");
         workspaceAPI.getFocusedTabInfo().then(function(response) {
            var focusedTabId = response.tabId;
            workspaceAPI.setTabLabel({
                tabId: focusedTabId,
                label: result
            });
        })
        .catch(function(error) {
            console.log(error);
        });
         }
         }
        ));
        $A.enqueueAction(action);       
        
        
    }
})

The following line will return the workspace API library reference

 var workspaceAPI = component.find("workspace");

The following method of the workspace API will be used to set label.

workspaceAPI.setTabLabel({
                tabId: focusedTabId,
                label: result
            });

Now add this component to the Lightning record page as shown below.

Testing 

If the case is created form the web the case label is appended with the web and case number as shown below

If the case is created from the email, then case label will be changed to email – case number.

 

Using Background Utility Items on Lightning Console

In this blog, I am going to how to use the background utility items that the runs from the background of utility bar of a console. Utilities harness the power of Lightning components. When you set up a utility bar, you select which Lightning components to use as utilities. However, not all Lightning components can be utilities. To be added to a utility bar, a Lightning component must implement the flexipage:availableForAllPageTypes interface. To run the utility bar from the background we need to implement the lightning:backgroundUtilityItem interface. lightning: backgroundUtilityItem is used to create a component that fires and responds to events without rendering in the utility bar. Background utility items are added to an app the same way normal utility items are, but they don’t appear in the utility bar. In this example, the component implements lightning:backgroundUtilityItem and listens for lightning:tabCreated events when the app loads. The component prevents users not to open more than 3 cases tab. If the user is trying to open the more than 3 tabs then it will close the first open tab automatically.

Step 1: Create a component

Here is the simple component that will run background. this component will run at the background and close the tab automatically when user trying to open the fourth tab.

<aura:component implements="lightning:backgroundUtilityItem,force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId" access="global" >
    <aura:attribute name="limit" default="3" type="Integer" />
    <aura:handler event="lightning:tabCreated" action="{!c.onTabCreated}" />
    <lightning:workspaceAPI aura:id="workspace" />
</aura:component>

({
    onTabCreated: function(cmp) {
        var workspace = cmp.find("workspace");
        var limit = cmp.get("v.limit");
        workspace.getAllTabInfo().then(function (tabInfo) {
            console.log(tabInfo);
            if (tabInfo.length > limit) {
                workspace.closeTab({
                    tabId: tabInfo[1].tabId
                });
            }
        });
    }
})

Step 2: Add a Utility Bar to Lightning Apps

• From Setup, enter App in the Quick Find box, then select App Manager.
• To edit the existing app, click Edit in the drop-down menu next to your Lightning App.
• Click the Utility Items tab and add the above created component to utility bar

Select the component and save it

Testing

go to the console and try to open the more than three cases now it will close the first tab automatically.

Key Consideration  

When creating a utility bar for your app, keep these things in mind:

• Utility bars created using the Lightning App Wizard or in the Lightning App Builder can be assigned to only one Lightning app. However, utility bars created using the API can be assigned to multiple Lightning apps.
• The utility bar doesn’t support Visualforce pages or components.
• The utility bar doesn’t fully support the Chatter Publisher and Feed components.
• The History utility works in Lightning console apps only.
• The Omni-Channel utility works in the Lightning Service Console app only.

 

Lightning Console disabling tab closing

In this blog, I will show one of the coolest features of the console to disable the close record action on Lightning experience. In this example, if any high priority cases are created, case description is required to close the tab otherwise we will be disabling the close icon on the tab. we can use a console API to prevent agents from closing tabs until they’ve completed all required work on a case. The console API  can disable a tab from closing using the disableTabClose method. You can prevent tabs from being closed in two ways:

1. Disable a primary tab. Its subtabs remain unlocked unless disableTabClose is invoked on them individually.
2. Disable a subtab. This also disables its enclosing primary tab.

disableTabClose is fully supported when you click the close-tab icon or when invoked via API. Other ways of invoking it aren’t fully supported and may not behave as you want them to. Macros aren’t fully supported. If disableTabClose is invoked via a macro, the error message might not appear, but the agent still won’t be able to close the tab in most cases. And of course, we can only lead a horse to water. An agent can still close the browser window. But hey, can’t say we didn’t try!

Tab behavior when records are deleted

When a primary tab is disabled and its record is deleted, that whole set of tabs (primary + subtabs) automagically closes.

When a subtab is disabled and its record is deleted, the subtab remains open but refreshes as a blank tab (although any sidebar components will render).

Code

Here is the simple code.

public class DisableCloseTab {
    
    public static DisableCloseTabService service = new DisableCloseTabService();
    @AuraEnabled 
    public static boolean disableCase(String caseId){
        return service.getDisbaleStatus(caseId);
    }
    
}

public class DisableCloseTabService {
    public boolean getDisbaleStatus(String caseId){
        Case c = [Select id ,Priority , Description from Case where Id = :caseId];
        if(c.Priority=='High' && c.Description==null){
            return true ; 
        }else{
            return false ;
        }
    }
}

DisableTabClose.cmp

<aura:component implements="flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId" access="global" controller="DisableCloseTab">
    <aura:handler name="init" value="this" action="{!c.doInit}"/>
    <aura:handler event="force:refreshView" action="{!c.doInit}" />  
    <lightning:workspaceAPI aura:id="workspace" />
</aura:component>

({
	doInit : function(component, event, helper) {
		helper.init(component, event, helper);
	}
})

({
    init : function(component, event, helper) {
        var action = component.get("c.disableCase");
        action.setParams({ caseId: component.get("v.recordId")});
        action.setCallback(this,$A.getCallback(function(response1)
         {
         console.log('state'+response1);
         var state = response1.getState();             
         if (state === "SUCCESS")  
         {
             var result= response1.getReturnValue();
             var workspaceAPI = component.find("workspace");
             if(result===true){
                 workspaceAPI.getFocusedTabInfo().then(function(response) {
                     var focusedTabId = response.tabId;
                     workspaceAPI.disableTabClose({
                         tabId: focusedTabId,
                         disabled: true,
                         closeable:false
                         
                     })
                     .then(function(tabInfo) {
                         console.log(tabInfo);
                     })
                     .catch(function(error) {
                         console.log(error);
                     });
                 })
                 .catch(function(error) {
                     console.log(error);
                 });
             }else{
                 workspaceAPI.getFocusedTabInfo().then(function(response) {
                     var focusedTabId = response.tabId;
                     workspaceAPI.disableTabClose({
                         tabId: focusedTabId,
                         disabled: false,
                         closeable:true
                     })
                     .then(function(tabInfo) {
                         console.log(tabInfo);
                     })
                     .catch(function(error) {
                         console.log(error);
                     });
                 })
                 .catch(function(error) {
                     console.log(error);
                 });
                 
             }
             
         }
             else if (state === "ERROR") 
             {
                 var errors = response1.getError();
                 console.log(errors);
             }
         }
                                              ));
        $A.enqueueAction(action);       
        
        
    }
})

Include this component on Lightning Record Page 

Now add the DisableTabClose.cmp to the record page anywhere as shown below 

Testing

Now open any high priority record without description .the close tab button is disabled as shown below.

Now open any high priority record with description .the close tab button is enabled as shown below.