function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Hetile Mabunda 8Hetile Mabunda 8 

Could not find a component named 'ResultsSection'.

Hi!

I'm trying to complete the challenge: Create a basic prototype of a Lightning app using Base Lightning Components and the Lightning Design System but keep getting this error: Challenge Not yet complete... here's what's wrong: Could not find a component named 'ResultsSection'.

screenshot of record page builder

This is the code I used:
    <aura:component implements="force:appHostable,
    flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,
    force:hasRecordId,forceCommunity:availableForAllPageTypes,
    force:lightningQuickAction" access="global" >
      <div class="slds-card">
        <h2 class="slds-text-heading--medium slds-p-left_small slds-p-vertical--medium">
          Accounts
        </h2>
        <div class="slds-grid">
           <ul class="slds-col slds-size--1-of-1">
      <li class="slds-size--1-of-3 slds-show--inline-block">
        <lightning:card variant="narrow" class="slds-m-around--small slds-card_boundary">
          <aura:set attribute="title">
            Compass Construction Inc.
          </aura:set>
          <div class="slds-tile slds-p-horizontal--large">
            <div class="slds-tile__detail slds-text-body--small">
              <dl class="slds-list--horizontal slds-wrap">  <dt class="slds-item--label slds-text-color--weak slds-truncate" title="First Label">Phone:</dt>
                <dd class="slds-item--detail slds-truncate">(123) 456-7890</dd>
                <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Second Label">Website:</dt>
                <dd class="slds-item--detail slds-truncate">compassinc@construction.com</dd>
                <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Third Label">Account Owner:</dt>
                <dd class="slds-item--detail slds-truncate">Amelia Abbott</dd>
              </dl>
            </div>
          </div>
        </lightning:card>
      </li>
      <li class="slds-size--1-of-3 slds-show--inline-block">
        <lightning:card variant="narrow"  class="slds-m-around--small slds-card_boundary">
          <aura:set attribute="title">
            Northern Trail Coalition
          </aura:set>
          <div class="slds-tile slds-p-horizontal--large">
            <div class="slds-tile__detail slds-text-body--small">
              <dl class="slds-list--horizontal slds-wrap">
                <dt class="slds-item--label slds-text-color--weak slds-truncate" title="First Label">Phone:</dt>
                <dd class="slds-item--detail slds-truncate">(555) 456-7890</dd>
                <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Second Label">Website:</dt>
                <dd class="slds-item--detail slds-truncate">trail@coalition.com</dd>
                <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Third Label">Account Owner:</dt>
                <dd class="slds-item--detail slds-truncate">Hadi Samara</dd>
              </dl>
            </div>
          </div>
        </lightning:card>
      </li>
      <li class="slds-size--1-of-3 slds-show--inline-block">
        <lightning:card variant="narrow" class="slds-m-around--small slds-card_boundary">
          <aura:set attribute="title">
              Coffee Corp
          </aura:set>
          <div class="slds-tile slds-p-horizontal--large">
            <div class="slds-tile__detail slds-text-body--small">
              <dl class="slds-list--horizontal slds-wrap">
                <dt class="slds-item--label slds-text-color--weak slds-truncate" title="First Label">Phone:</dt>
                <dd class="slds-item--detail slds-truncate">(123) 555-7890</dd>
                <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Second Label">Website:</dt>
                <dd class="slds-item--detail slds-truncate">coffee@corp.com</dd>
                <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Third Label">Account Owner:</dt>
                <dd class="slds-item--detail slds-truncate">Franz Jenkins</dd>
              </dl>
            </div>
          </div>
        </lightning:card>
      </li>
      <li class="slds-size--1-of-3 slds-show--inline-block">
        <lightning:card variant="narrow" class="slds-m-around--small slds-card_boundary">
          <aura:set attribute="title">
            Looper Coding Camp
          </aura:set>
          <div class="slds-tile slds-p-horizontal--large">
            <div class="slds-tile__detail slds-text-body--small">
              <dl class="slds-list--horizontal slds-wrap">
                <dt class="slds-item--label slds-text-color--weak slds-truncate" title="First Label">Phone:</dt>
                <dd class="slds-item--detail slds-truncate">(123) 456-0000</dd>
                <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Second Label">Website:</dt>
                <dd class="slds-item--detail slds-truncate">looper@codingcamp.com</dd>
                <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Third Label">Account Owner:</dt>
                <dd class="slds-item--detail slds-truncate">Carmen Morales</dd>
              </dl>
            </div>
          </div>
        </lightning:card>
      </li>
    </ul>
  
        </div>
        <h2 class="slds-text-heading--medium slds-p-left_small slds-p-vertical--medium">
          Contacts
        </h2>
        <div class="slds-grid">
        <ul class="slds-col slds-size--1-of-1">
  <li class="slds-size--1-of-3 slds-show--inline-block">
      <lightning:card variant="narrow" class="slds-m-around--small slds-card_boundary">
          <aura:set attribute="title">
              Isabel McCrory
          </aura:set>
          <div class="slds-tile slds-p-horizontal--large">
              <div class="slds-tile__detail slds-text-body--small">
                  <dl class="slds-list--horizontal slds-wrap">
                      <dt class="slds-item--label slds-text-color--weak slds-truncate" title="First Label">Email Address:</dt>
                      <dd class="slds-item--detail slds-truncate">isabel@codingcamp.com</dd>
                      <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Second Label">Title:</dt>
                      <dd class="slds-item--detail slds-truncate">CEO</dd>
                      <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Third Label">Phone:</dt>
                      <dd class="slds-item--detail slds-truncate">(456) 123-7890 </dd>
                  </dl>
              </div>
          </div>
      </lightning:card></li>
  <li class="slds-size--1-of-3 slds-show--inline-block">
      <lightning:card variant="narrow" class="slds-m-around--small slds-card_boundary">
          <aura:set attribute="title">
              Shanti Althaus
          </aura:set>
          <div class="slds-tile slds-p-horizontal--large">
              <div class="slds-tile__detail slds-text-body--small">
                  <dl class="slds-list--horizontal slds-wrap">
                      <dt class="slds-item--label slds-text-color--weak slds-truncate" title="First Label">Email Address:</dt>
                      <dd class="slds-item--detail slds-truncate">shanti@compass.com</dd>
                      <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Second Label">Title:</dt>
                      <dd class="slds-item--detail slds-truncate">Senior Vice President, Tech</dd>
                      <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Third Label">Phone:</dt>
                      <dd class="slds-item--detail slds-truncate">(555) 432-8765</dd>
                  </dl>
              </div>
          </div>
      </lightning:card>
  </li>
</ul>
        </div>
        <h2 class="slds-text-heading--medium slds-p-left_small slds-p-vertical--medium">
          Leads
        </h2>
        <div class="slds-grid">
          <ul class="slds-col slds-size--1-of-1">
    <li class="slds-size--1-of-3 slds-show--inline-block">
        <lightning:card variant="narrow" class="slds-m-around--small slds-card_boundary">
            <aura:set attribute="title">
                Jim Cooper
            </aura:set>
            <div class="slds-tile slds-p-horizontal--large">
                <div class="slds-tile__detail slds-text-body--small">
                    <dl class="slds-list--horizontal slds-wrap">
                        <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Second Label">Company:</dt>
                        <dd class="slds-item--detail slds-truncate">Einstein Accolades</dd>
                        <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Second Label">Email Address:</dt>
                        <dd class="slds-item--detail slds-truncate">jim@accolades.com</dd>
                        <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Third Label">Status:</dt>
                        <dd class="slds-item--detail slds-truncate">Qualified</dd>
                        <dt class="slds-item--label slds-text-color--weak slds-truncate" title="First Label">Phone:</dt>
                        <dd class="slds-item--detail slds-truncate">(555) 123-4567</dd>
                    </dl>
                </div>
            </div>
        </lightning:card></li>
    <li class="slds-size--1-of-3 slds-show--inline-block">
        <lightning:card variant="narrow" class="slds-m-around--small slds-card_boundary">
            <aura:set attribute="title">
                Collin Rhee
            </aura:set>
            <div class="slds-tile slds-p-horizontal--large">
                <div class="slds-tile__detail slds-text-body--small">
                    <dl class="slds-list--horizontal slds-wrap">
                        <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Second Label">Company:</dt>
                        <dd class="slds-item--detail slds-truncate">Badges &amp; Co.</dd>
                        <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Second Label">Email Address:</dt>
                        <dd class="slds-item--detail slds-truncate">colin@badges.com</dd>
                        <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Third Label">Status:</dt>
                        <dd class="slds-item--detail slds-truncate">Working - Contacted</dd>
                        <dt class="slds-item--label slds-text-color--weak slds-truncate" title="First Label">Phone:</dt>
                        <dd class="slds-item--detail slds-truncate">(123) 456-7890</dd>
                    </dl>
                </div>
            </div>
        </lightning:card>
    </li>
    <li class="slds-size--1-of-3 slds-show--inline-block">
        <lightning:card variant="narrow" class="slds-m-around--small slds-card_boundary">
            <aura:set attribute="title">
                Cora Sadik
            </aura:set>
            <div class="slds-tile slds-p-horizontal--large">
                <div class="slds-tile__detail slds-text-body--small">
                    <dl class="slds-list--horizontal slds-wrap">
                        <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Second Label">Company:</dt>
                        <dd class="slds-item--detail slds-truncate">Compass Construction Inc.</dd>
                        <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Second Label">Email Address:</dt>
                        <dd class="slds-item--detail slds-truncate">sadik@construction.com</dd>
                        <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Third Label">Status:</dt>
                        <dd class="slds-item--detail slds-truncate">Open - Not Contacted</dd>
                        <dt class="slds-item--label slds-text-color--weak slds-truncate" title="First Label">Phone:</dt>
                        <dd class="slds-item--detail slds-truncate">(123) 456-7777</dd>
                    </dl>
                </div>
            </div>
        </lightning:card>
    </li>
</ul>
        </div>
      </div>
</aura:component>
  
 
Raj VakatiRaj Vakati
Use this code
  
<aura:component controller="SearchResultsController" implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" access="global" >
    <aura:attribute name="accounts" type="Account[]"/>
    <aura:attribute name="contacts" type="Contact[]"/>
    <aura:attribute name="leads" type="Lead[]"/>

    <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>

    <div>
      <h2 class="slds-text-heading--medium slds-p-vertical--medium">Accounts</h2>
      <div class="slds-grid">
        <ul class="slds-col slds-size--1-of-1">
          <aura:iteration items="{!v.accounts}" var="account">
            <li class="slds-size--1-of-3 slds-show--inline-block">
              <lightning:card variant="narrow" iconName="standard:account" class="slds-m-around--small">
                <aura:set attribute="title">
                  {!account.Name}
                </aura:set>
                <div class="slds-tile slds-p-horizontal--large">
                  <div class="slds-tile__detail slds-text-body--small">
                    <dl class="slds-list--horizontal slds-wrap">
                      <dt class="slds-item--label slds-text-color--weak slds-truncate" title="First Label">Phone:</dt>
                      <dd class="slds-item--detail slds-truncate">{!account.Phone}</dd>
                      <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Second Label">Website:</dt>
                      <dd class="slds-item--detail slds-truncate">{!account.Website}</dd>
                      <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Third Label">Account Owner:</dt>
                      <dd class="slds-item--detail slds-truncate">{!account.OwnerId}</dd>
                    </dl>
                  </div>
                </div>
              </lightning:card>
            </li>
          </aura:iteration>
        </ul>
      </div>
      <h2 class="slds-text-heading--medium slds-p-vertical--medium">Contacts</h2>
      <div class="slds-grid">
        <ul class="slds-col slds-size--1-of-1">
          <aura:iteration items="{!v.contacts}" var="contact" indexVar="index">
            <li class="slds-size--1-of-3 slds-show--inline-block">
              <lightning:card variant="narrow" class="slds-m-around--small" iconName="standard:contact">
                <aura:set attribute="title">
                  {!contact.Name}
                </aura:set>
                <div class="slds-tile slds-p-horizontal--large">
                  <div class="slds-tile__detail slds-text-body--small">
                    <dl class="slds-list--horizontal slds-wrap">
                      <dt class="slds-item--label slds-text-color--weak slds-truncate" title="First Label">Email Address:</dt>
                      <dd class="slds-item--detail slds-truncate">{!contact.Email}</dd>
                      <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Second Label">Title:</dt>
                      <dd class="slds-item--detail slds-truncate">{!contact.Title}</dd>
                      <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Third Label">Phone:</dt>
                      <dd class="slds-item--detail slds-truncate">{!contact.Phone}</dd>
                    </dl>
                  </div>
                </div>
              </lightning:card>
            </li>
          </aura:iteration>
        </ul>
      </div>
      <h2 class="slds-text-heading--medium slds-p-vertical--medium">Leads</h2>
      <div class="slds-grid">
        <ul class="slds-col slds-size--1-of-1"> <aura:iteration items="{!v.leads}" var="lead" indexVar="index">
          <li class="slds-size--1-of-3 slds-show--inline-block">
            <lightning:card variant="narrow" class="slds-m-around--small" iconName="standard:lead">
              <aura:set attribute="title">
                {!lead.Name}
              </aura:set>
              <div class="slds-tile slds-p-horizontal--large">
                <div class="slds-tile__detail slds-text-body--small">
                  <dl class="slds-list--horizontal slds-wrap">
                    <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Second Label">Company:</dt>
                    <dd class="slds-item--detail slds-truncate">{!lead.Company}</dd>
                    <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Second Label">Email Address:</dt>
                    <dd class="slds-item--detail slds-truncate">{!lead.Email}</dd>
                    <dt class="slds-item--label slds-text-color--weak slds-truncate" title="Third Label">Status:</dt>
                    <dd class="slds-item--detail slds-truncate">{!lead.Status}</dd>
                    <dt class="slds-item--label slds-text-color--weak slds-truncate" title="First Label">Phone:</dt>
                    <dd class="slds-item--detail slds-truncate">{!lead.Phone}</dd>
                  </dl>
                </div>
              </div>
            </lightning:card>
          </li>
        </aura:iteration>
      </ul>
    </div>
  </div>
</aura:component>
  
({
  doInit : function(component, event, helper) {
    helper.getAccounts(component);
    helper.getContacts(component);
    helper.getLeads(component);
  }
})
  
({
    getAccounts : function(cmp) {
        var action = cmp.get("c.getAccounts");
        action.setCallback(this, function(response){
            var state = response.getState();
            if (state === "SUCCESS") {
                cmp.set("v.accounts", response.getReturnValue());
            }
        });
        $A.enqueueAction(action);
    },
    
    getContacts : function(cmp) {
        var action = cmp.get("c.getContacts");
        action.setCallback(this, function(response){
            var state = response.getState();
            if (state === "SUCCESS") {
                cmp.set("v.contacts", response.getReturnValue());
            }
        });
        $A.enqueueAction(action);
    },
    
    getLeads : function(cmp) {
        var action = cmp.get("c.getLeads");
        action.setCallback(this, function(response){
            var state = response.getState();
            if (state === "SUCCESS") {
                cmp.set("v.leads", response.getReturnValue());
            }
        });
        $A.enqueueAction(action);
    },
})
  
public with sharing class SearchResultsController {
    @AuraEnabled
    public static List<Account> getAccounts() {
        List<Account> accounts = [SELECT Id, Name, Phone, Website, OwnerId FROM Account LIMIT 5];
        return accounts;
    }
    @AuraEnabled
    public static List<Contact> getContacts() {
        List<Contact> contacts = [SELECT Id, Name, Phone, Email, Title FROM Contact LIMIT 5];
        return contacts;
    }
    @AuraEnabled
    public static List<Lead> getLeads() {
        List<Lead> leads = [SELECT Id, Name, Company, Email, Status, Phone FROM Lead LIMIT 5];
        return leads;
    }
}

 
Hetile Mabunda 8Hetile Mabunda 8
Thank you for getting back to me. I tried to use this code and  got this error. User-added image

Should I be doing something differently?
Raj VakatiRaj Vakati
can you share the code