Project: Client 360 Component
By the end of this lesson, you'll be able to:
- Combine multiple wire calls into one unified customer view
- Layer LDS record reads with an Apex-backed related-data summary
- Structure a component composed of clearly separated concerns
Prerequisites: "Project: Sales Pipeline Dashboard"
What We're Building
A client360 component giving a sales rep a single view of an Account: its core fields via LDS (Module 6), its Contacts via a child component (Module 5), and a summary of its open Opportunities via Apex (Module 7).
The Component
import { LightningElement, api, wire } from 'lwc';
import { getRecord, getFieldValue } from 'lightning/uiRecordApi';
import getOpenOpportunitySummary from '@salesforce/apex/ClientSummaryController.getOpenOpportunitySummary';
import NAME_FIELD from '@salesforce/schema/Account.Name';
import INDUSTRY_FIELD from '@salesforce/schema/Account.Industry';
export default class Client360 extends LightningElement {
@api recordId;
@wire(getRecord, { recordId: '$recordId', fields: [NAME_FIELD, INDUSTRY_FIELD] })
account;
@wire(getOpenOpportunitySummary, { accountId: '$recordId' })
opportunitySummary;
get accountName() {
return getFieldValue(this.account.data, NAME_FIELD);
}
}<div class="client-summary">
<h1>{accountName}</h1>
<p>Open pipeline: {opportunitySummary.data.totalOpenValue}</p>
</div>
<c-contact-list account-id={recordId}></c-contact-list>Two separate @wire calls run side by side — one via LDS (getRecord, free caching, Module 6) and one via a custom Apex aggregate (Module 7, for data LDS can't compute) — while the Contacts piece is delegated entirely to the contactList child from the earlier project, avoided re-implementing that logic here.
Exercise
Explain, as a comment, why this component uses getRecord for the Account's Name/Industry instead of a custom Apex method for those same two fields.
Show hint
Recall Module 7's decision checklist.
Exercise
Challenge: why does this component reuse c-contact-list rather than re-implementing Contact listing itself?
Show hint
Recall Module 16's separation-of-concerns and reuse principles.
Project: Client 360 Component Quiz
My Notes
Log in to keep private notes on this lesson.
Questions about this lesson
No questions yet — be the first to ask.
Log in to ask a question about this lesson.
Summary
A single "Client 360" view combining an Account's core fields, its Contacts, and its open Opportunities into one component — synthesizing LDS reads, Apex aggregation, and component composition together.