Floorplan is using the Lightning Message Service for some of its events. This means you could subscribe to two message channels that receive messages on the firing of a specific event.

  • The areaSelectedChannel publishes messages when an area is selected, and passes the selectedAreaId property;

  • The dateTimeSelectedChannel publishes messages when a datetime is selected, and passes the selectedDateTime property.

Sample code that listens to the areaSelected event:

import { LightningElement, wire } from 'lwc';
import {
    subscribe,
    unsubscribe,
    APPLICATION_SCOPE,
    MessageContext,
} from 'lightning/messageService';
import areaSelectedChannel from '@salesforce/messageChannel/FP25__Area_Selected__c';

export default class Floorplan extends LightningElement {
    subscription = null;
    selectedAreaId;
    areaSubscription;

    @wire(MessageContext)
    messageContext;
    
    // Encapsulate logic for Lightning message service subscribe and unsubsubscribe
    subscribeToMessageChannel() {
        if (!this.subscription) {
            this.subscription = subscribe(
                this.messageContext,
                areaSelectedChannel,
                (message) => this.handleMessage(message),
                { scope: APPLICATION_SCOPE }
            );
        }
    }
  
    unsubscribeToMessageChannel() {
        unsubscribe(this.subscription);
        this.subscription = null;
    }

    // Handler for message received by component
    handleMessage(message) {
        this.selectedAreaId = message.selectedAreaId;
    }

    // Standard lifecycle hooks used to subscribe and unsubsubscribe to the message channel
    connectedCallback() {
        this.subscribeToMessageChannel();
    }

    disconnectedCallback() {
        this.unsubscribeToMessageChannel();
    }
}
NONE