Salesforce Knowledge

Today we will see how can we convert an existing Lightning Component to Lightning Web Component (LWC). I will convert the Org Limits Lightning component that I published in my last blog spot to a LWC component. The basic structure of a lightning web component consists of a HTML file, a JS file and a xml file. The .html file in LWC is equivalent to the .cmp file present in Aura.  The .js file in LWC is equivalent to the combination of controller.js and helper.js files present in Aura The xml file in LWC contains the meta information such as api version.  Lets see step by step how to convert the Org Limits component. First we will convert the OrgLimits.cmp to orgLimitsLWC.html <aura:component implements="flexipage:availableForAllPageTypes" controller="OrgLimitsCtrl"> The <aura:component> tag in LC gets replaced by <template> tag in LWC. The implements attribute containing value flexipage:availableForAllPageTypes gets shifted to the xm

In Summer 19, Salesforce introduced a new class named OrgLimit under the System namespace. The System.OrgLimit class contains methods that return the name, current value, and maximum limit for an instance. By utilizing information from this class, I have created a lightning component that will be useful for the Org admin and developers. This component lists down all the org limit, its current usage and the maximum limit. The component gets the org limits by making use of the OrgLimit class and displays the data in a tabular format. You can also refresh the component by clicking on the Refresh icon present at the top right corner. The refresh icon also displays the time when the component was last refreshed. Below is the code for the lightning component: OrgLimits.cmp <aura:component implements="flexipage:availableForAllPageTypes" controller="OrgLimitsCtrl">       <!-- Attributes -->     <aura:attribute name="orgLimitInfo"