Grid 0.0.0.0.0001

GridLighntingComponent

<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes" access="global" controller="ApexMetadataUtility">
	<aura:attribute name="metadata" type="SobjectMetadataWrapper[]"/>
    <aura:handler name="init" value="{!this}" action="{!c.getresults}" />
    
   <div class="slds-tree_container" role="application">
  <h4 class="slds-text-title--caps" id="treeheading">Objects</h4>
  <aura:iteration items="{!v.metadata}" var="cardItem">
  <ul class="slds-tree" role="tree" aria-labelledby="treeheading">
    <li id="tree0-node0" role="treeitem" aria-level="1">
      <div class="slds-tree__item">
        <button class="slds-button slds-button--icon slds-m-right--x-small slds-is-disabled" disabled="" title="Toggle">
          <lightning:icon iconName="utility:chevronright" size="x-small" alternativeText="Indicates Search" class="slds-input__icon"/>
          <span class="slds-assistive-text">Toggle</span>
        </button><a href="javascript:void(0);" tabindex="-1" role="presentation" class="slds-truncate" title="Tree Item">{!cardItem.objectName}</a></div>
    </li>
    <li id="tree0-node1" role="treeitem" aria-level="1" aria-expanded="false">
      <div class="slds-tree__item">
        <button class="slds-button slds-button--icon slds-m-right--x-small" aria-controls="tree0-node1" title="Toggle" onclick="{!c.toggle}">
           <lightning:icon iconName="utility:chevronright" size="x-small" alternativeText="Indicates Search" class="slds-input__icon"/>
          <span class="slds-assistive-text">Toggle</span>
        </button><a id="tree0-node1__label" href="javascript:void(0);" tabindex="-1" role="presentation" class="slds-truncate" title="ChildRelationships">ChildRelationship</a></div>
      <aura:iteration items="{!cardItem.childrelationship}" var="relItem">
        <ul class="slds-is-collapsed" role="group" aria-labelledby="tree0-node1__label" aura:id="childTree">
        <li id="tree0-node1-0" role="treeitem" aria-level="2">
          <div class="slds-tree__item">
            <button class="slds-button slds-button--icon slds-m-right--x-small slds-is-disabled" disabled="" title="Toggle">
               <lightning:icon iconName="utility:chevronright" size="x-small" alternativeText="Indicates Search" class="slds-input__icon"/>
              <span class="slds-assistive-text">Toggle</span>
            </button><a href="javascript:void(0);" tabindex="-1" role="presentation" class="slds-truncate" title="Tree Item">{!relItem.childobjectName}</a>
            </div>
        </li>
      </ul>
       </aura:iteration>
    </li>
    <li id="tree0-node2" role="treeitem" aria-level="1">
      <div class="slds-tree__item">
        <button class="slds-button slds-button--icon slds-m-right--x-small" aria-controls="tree0-node2" title="Toggle" onclick="{!c.toggleField}">
           <lightning:icon iconName="utility:chevronright" size="x-small" alternativeText="Indicates Search" class="slds-input__icon"/>
          <span class="slds-assistive-text">Toggle</span>
        </button><a id="tree0-node2__label" href="javascript:void(0);" tabindex="-1" role="presentation" class="slds-truncate" title="Tree Branch">Fields</a></div>
        <aura:iteration items="{!cardItem.fieldmetadata}" var="fieldName">
      <ul class="slds-is-collapsed" role="group" aria-labelledby="tree0-node2__label" aura:id="fieldlist">
        <li id="tree0-node2-0" role="treeitem" aria-level="2">
          <div class="slds-tree__item">
            <button class="slds-button slds-button--icon slds-m-right--x-small slds-is-disabled" disabled="" title="Toggle">
             <lightning:icon iconName="utility:chevronright" size="x-small" alternativeText="Indicates Search" class="slds-input__icon"/>
              <span class="slds-assistive-text">Toggle</span>
            </button><a href="javascript:void(0);" tabindex="-1" role="presentation" class="slds-truncate" title="Tree Item">{!fieldName.fieldname}</a></div>
        </li>
      </ul>
        </aura:iteration>
    </li>
  </ul>
   </aura:iteration>
</div>
</aura:component>

GridLighntingComponentController.js

({
	getresults: function(component, event, helper) {
		//console.log('hello');
		helper.fetchmetadata(component,event);
	},
    
    toggle : function(component, event, helper) {
        helper.togglehelper(component,event,'childTree');
    },
    
    toggleField : function(component, event, helper) {
        helper.togglehelper(component,event,'fieldlist');
    }
})

GridLighntingComponentControllerHelper.js

({
    fetchmetadata: function(component,event) {
            var action = component.get("c.getSobjectMetadata");
            var self = this;
            var types = ["Account"];
            console.log(types);
            action.setParams({
                    "sobjectarray": types
            });
            action.setCallback(this, function(response) {
            var state = response.getState();
            //debugger;
            console.log('STATE'+response.getState());
                //debugger;
                if (component.isValid() && state === "SUCCESS") {
                    console.log('RESPONSE'+response.getReturnValue());
                    component.set("v.metadata",response.getReturnValue());
                    //debugger;
                }else if (state === "ERROR") {
                    var errors = response.getError();
                    if (errors) {
                        alert('Error');
                        if (errors[0] && errors[0].message) {
                          console.log(errors[0].message);
                        }
                    } else {
                        alert('Error');
                        console.log("Unknown error");
                    }
                }
            });
        $A.enqueueAction(action);
    },
    
    togglehelper : function(component,event,elementId) {
        var cmps = component.find(elementId);
        for(var index in cmps) {
            $A.util.toggleClass(cmps[index], 'slds-is-expanded');
            $A.util.toggleClass(cmps[index], 'slds-is-collapsed');
        }
    }
})

GridLightningComponentApp

<aura:application access="global" extends="force:slds">
    <c:GridLightningComponent/>
</aura:application>