Hi Friends I am using the lightning Channel message in order to make two LWC talk one to another. The behaviour is very simple the first component has 3 picklists and the second component should display the ID of the selected item

I manage to make it work when the user change the picklist but I do not manage to make it work on the component are loaded and the default value is displayed

Another thing .. for some reason when I selected another picklist the ID value in the other disapear.. 

Could you please help me with those two issues ? please ? 

Here is my code : 
component 1 JS:
 

import { LightningElement,wire} from 'lwc';
import getRegion from '@salesforce/apex/PicklistHelper.getRegion';
import getCountry from '@salesforce/apex/PicklistHelper.getCountry';
import getMarket from '@salesforce/apex/PicklistHelper.getMarket';
import {publish, MessageContext} from 'lightning/messageService';
import RegionmessageChannel from '@salesforce/messageChannel/MarketMC__c';


export default class FilterPanel extends LightningElement {
    regionOptionsList;
    countryOptionsList;
    marketOptionsList;
    selectedCountry;
    selectedRegion;
    selectedMarket;

    @wire(MessageContext)
    messageContext;
    
    @wire(getRegion)
    retrieveRegion({error, data}){
        let tempArray = []
        let tempDefaultValueList = []
        if(data){
            for(let key in data){
                tempArray.push({label:data[key], value:key}); 
                tempDefaultValueList.push(key);
            }
        }
        this.regionOptionsList = tempArray;
        this.selectedRegion = tempDefaultValueList[0];

    }

    sendToother(){
        const payload = { regionID: tempDefaultValueList[0]};
        publish(this.messageContext, RegionmessageChannel, payload);
    }

    handleRegionChange(event){
        this.selectedRegion = event.target.value;
        const payload = { regionID: this.selectedRegion};
        publish(this.messageContext, RegionmessageChannel, payload);
    }


    @wire(getCountry, {RegionId: '$selectedRegion'})
    retrieveCountry({error, data}){
        let CountrytempArray = []
        let countryTempDefaultList = []
        if(data){
            for(let key in data){
                CountrytempArray.push({label:data[key], value:key}); 
                countryTempDefaultList.push(key);
                
            }
        }
        this.countryOptionsList = CountrytempArray;
        this.selectedCountry = countryTempDefaultList[0]
    }

    handleCountryChange(event){
        this.selectedCountry = event.target.value;
        const payload = { countryID: this.selectedCountry};
        publish(this.messageContext, RegionmessageChannel, payload);
    }

    @wire(getMarket, {CountryId: '$selectedCountry'})
    retrieveMarket({error, data}){
        let MarketempArray = []
        let marketTempDefaultList = []
        if(data){
            for(let key in data){
                MarketempArray.push({label:data[key], value:key}); 
                marketTempDefaultList.push(key);
                
            }
        }
        this.marketOptionsList = MarketempArray;
        this.selectedMarket = marketTempDefaultList[0]
    }

    handleMarketChange(event){
        this.selectedMarket = event.target.value;
        const payload = { marketID: this.selectedMarket};
        publish(this.messageContext, RegionmessageChannel, payload);
    }

    

}

Component 2 JS: 

import { LightningElement, api, wire } from 'lwc';
import { subscribe, MessageContext, APPLICATION_SCOPE } from 'lightning/messageService';
import RegionmessageChannel from '@salesforce/messageChannel/MarketMC__c';


export default class InlineDataTablePropertyQualification extends LightningElement {
    SelectedRegionID;
    SelectedCountryID;
    SelectedMarketID;

    subscription = null;
    @wire(MessageContext)
    messageContext;

    subscribeToMessageChannel() {
        if (!this.subscription) {
            this.subscription = subscribe(
                this.messageContext,
                RegionmessageChannel,
                (message) => this.handleMessage(message),
                { scope: APPLICATION_SCOPE }
            );
        }
    }

    handleMessage(message) {
        this.SelectedRegionID = message.regionID;
        this.SelectedCountryID = message.countryID;
        this.SelectedMarketID = message.marketID;
        
    }

    connectedCallback() {
        this.subscribeToMessageChannel();
    }

}

<?xml version="1.0" encoding="UTF-8"?>
<LightningMessageChannel xmlns="http://soap.sforce.com/2006/04/metadata">
    <description>This chanel get the makrket ID selected in the Project management filter component</description>
    <isExposed>true</isExposed>
    <lightningMessageFields>
        <description>Gewt the region ID</description>
        <fieldName>regionID</fieldName>
    </lightningMessageFields>
    <lightningMessageFields>
        <description>Get the country ID</description>
        <fieldName>countryID</fieldName>
    </lightningMessageFields>
    <lightningMessageFields>
        <description>Get the market ID</description>
        <fieldName>marketID</fieldName>
    </lightningMessageFields>
    <masterLabel>Market ID from filter component</masterLabel>
</LightningMessageChannel>