lightning:treeGrid Row level actions

A lightning:treeGrid component displays hierarchical data in a table. Its appearance resembles lightning:datatable, with the exception that each row can be expanded to reveal a nested group of items. Rows that contain nested data display a chevron icon to denote that they can be expanded or collapsed. In this example, I will show how to use the row-level actions on the tree grid as shown below.

Apex Class 

public class TreeGridExamples {
    @AuraEnabled
    public static void deleteSobject(String id){
        Database.delete(id);        
    }
    
    @AuraEnabled
    public static String getTreeGridData(){
        List<Account> accs = [Select Id , Name,(Select Id , Name from Contacts) from Account];
        Map<Id , Contact> opps =new Map<Id , Contact>( [Select Id , Name,(Select Id ,Name From Opportunities) from Contact]);
        
        List<AccountWrapper> aooo = new List<AccountWrapper>();
        for(Account a : accs){
            AccountWrapper aWraper = new AccountWrapper() ; 
            aWraper.name =a.Name ;
            aWraper.id =a.id ;
            List<Items> co = new List<Items>();
            for(Contact c : a.Contacts){
                Items conWrapp = new Items();
                conWrapp.name =c.Name ;
                conWrapp.id =c.id ;
                
                List<Items> wrapperOooo = new List<Items>();
                for(Opportunity o : opps.get(c.Id).Opportunities){
                    Items ooo = new Items(); 
                    ooo.name = o.Name ;
                    ooo.id = o.id ;
                    wrapperOooo.add(ooo);
                }
                
                conWrapp.items =wrapperOooo ;
                co.add(conWrapp);
            }
            aWraper.items = co;
            aooo.add(aWraper);
            
        }
        return JSON.serializePretty(aooo) ;
    } 
    public Class AccountWrapper{
        @AuraEnabled
        public String name {get;set;}
        @AuraEnabled
        public String id {get;set;}
        @AuraEnabled
        public List<Items> items {get;set;}
    }
    public Class Items{
        @AuraEnabled
        public String name {get;set;}
        @AuraEnabled
        public String id {get;set;}
        @AuraEnabled
        public List<Items> items {get;set;}
    }
    
    
    
}

Lightning Component 

<aura:component controller="TreeGridExamples" implements="flexipage:availableForAllPageTypes,force:appHostable,flexipage:availableForRecordHome,force:hasRecordId,force:hasSObjectName">
    <aura:handler name="init" value="{!this}" action="{!c.doInit}" />
    <aura:attribute name="gridColumns" type="List" />
    <aura:attribute name="gridData" type="Object" />
    <aura:attribute name="gridExpandedRows" type="Object" />
    
    <lightning:treeGrid columns="{! v.gridColumns }"
                        data="{! v.gridData }"
                        keyField="name"
                        aura:id="mytree"
                        onrowaction="{!c.onRowSelect}" 
                        />
</aura:component>

 

({
    doInit: function (cmp, event, helper) {
        
        var actions = [
            { label: 'Show details', name: 'show_details' },
            { label: 'Delete', name: 'delete' }
        ];
        cmp.set('v.gridColumns', [
            
            {label:"name", fieldName:"name", type:"text"},
            {label:"id", fieldName:"id", type:"text"},
            { type: 'action', typeAttributes: { rowActions: actions } }            
        ]);
        helper.getData(cmp);
    },
    onRowSelect: function(cmp,event,helper){
        var action = event.getParam('action');
        var row = event.getParam('row');
        switch (action.name) {
            case 'show_details':
                var urlEvent = $A.get("e.force:navigateToURL");
                urlEvent.setParams({
                    "url": "/"+row.id
                });
                urlEvent.fire();
                break;
            case 'delete':
                var action = cmp.get("c.deleteSobject");
                action.setParams({id:row.id});
                action.setCallback(this, function(response) {
                    var state = response.getState();
                    if (state === "SUCCESS") {
                        $A.get('e.force:refreshView').fire();
                    }
                });
                $A.enqueueAction(action);
                break;
        }
    },
    
})

 

({
    getData : function (cmp) {
        var action = cmp.get("c.getTreeGridData");
        action.setCallback(this, function(response) {
            var state = response.getState();
            if (state === "SUCCESS") {
                var data = response.getReturnValue();
                var temojson = JSON.parse(JSON.stringify(data).split('items').join('_children'));
                console.log(temojson);
                cmp.set('v.gridData', JSON.parse(temojson));
            }
            // error handling when state is "INCOMPLETE" or "ERROR"
        });
        $A.enqueueAction(action);
    }
})