Hi everyone,
I'm getting this error at Step 6: "The BoatDetails component must use force:recordData to load the appropriate list of fields from Boat__c into the boat attribute of the component."

I believe it's because my "auraMethodResult" happens to be undefined for some reason.. Can anyone help me with this, please? Thank you so much :-)

BoatSearch:
<aura:handler name="formsubmit" event="c:FormSubmit" action="{!c.onFormSubmit}"  phase="capture"/>
   
 
    <div>
    <lightning:card class="findBoatCard" title="Find a Boat">
        <c:BoatSearchForm />    
    </lightning:card>     
    </div>
    
    <lightning:card title="Matching Boats">
        <c:BoatSearchResults aura:id="child"/>
    </lightning:card>
</aura:component>


BoatSearchController:
({

    onFormSubmit : function(component, event, helper){
 
        var formData = event.getParam("formData");
        var boatTypeId = formData.boatTypeId;
        var child = component.find("child");
        var auraMethodResult = child.search(boatTypeId);
        console.log("auraMethodResult: " + auraMethodResult);
    },

})

BoatSearchResults:
 	<aura:attribute name="boat" type="BoatType__c"/> 
    <aura:attribute name="boats" type="Boat__c[]"/> 
    <aura:attribute name="selectedBoatId" type="Object"/> 
    
<aura:handler name="boatClickEvent" event="c:BoatSelect" action="{!c.onBoatSelect}" />

    <aura:method name="search" action="{!c.doSearch}"> 
        <aura:attribute name="boatTypeId" type="Object" /> 
    </aura:method>
    
<lightning:layout multipleRows="true" horizontalAlign="center">

    <aura:iteration items="{!v.boats}" var="boat"> 
        <lightning:layoutItem   flexibility="grow" class="slds-m-right_small" >   
        
                <c:BoatTile boat="{!boat}" selected="{! boat.Id == v.selectedBoatId ? true : false }"/> 
            
        </lightning:layoutItem>
    </aura:iteration>

    
    <aura:if isTrue="{! empty(v.boats)}"> 
        <lightning:layoutItem class="slds-align_absolute-center" flexibility="auto" padding="around-small">   
            <ui:outputText value="No boats found" />
        </lightning:layoutItem>
 
    </aura:if>
    
    </lightning:layout>

BoatSearchResultsController:
({
	doSearch : function(component, event, helper) {
      
        var params = event.getParam('arguments');
        
        component.set("v.boatTypeId", params.boatTypeId);
        helper.onSearch(component);
     
    },
    
    onBoatSelect: function(component, event, helper){
        var selectedBoatId = event.getParam('boatId');
        component.set("v.selectedBoatId", selectedBoatId);
    }
})

 

BoatTile
	<aura:attribute name="boat" type="Boat__c"/> 
    <aura:attribute name="selected" type="Boolean" default="false"/> 

      <aura:registerEvent name="boatClickEvent" type="c:BoatSelect"/>
     <aura:registerEvent name="boatSelected" type="c:BoatSelected"/>
    

    
    <lightning:button aura:id="boatTileButton" class="{!v.selected == 'true' ? 'tile selected' : 'tile'}" onclick="{!c.onBoatClick}">
        <div style="{! 'background-image:url(\'' + v.boat.Picture__c + '\'); '}" class="innertile">
            
            <div class="lower-third">
                <h1 class="slds-truncate">{!v.boat.Contact__r.Name}</h1>

            </div>
        </div>
    </lightning:button>  
BoatTileController:

({
    onBoatClick : function(component, event, helper) {
      
       var boatType = component.get("v.boat");
        console.log('Boat asd'+boatType);
        var boatSelectEvt = component.getEvent("boatClickEvent");
        boatSelectEvt.setParams({"boatId" :boatType.Id});
        boatSelectEvt.fire();
        
 
        var appEvent = $A.get("e.c:BoatSelected");
        var boat = component.get("v.boat");  
        appEvent.setParams({
            "boat": boat
        });
        appEvent.fire();    
     }
})