Updating If/Else statement from a Boolean value when a button is clicked

Question

I have a user input search bar where the user will input their "City", "Address", and "State". Then the user will click the search button, which will change to a Boolean value to equal 'true'. This Boolean value is then past to my function which will go though a If/Else condition. If the Boolean = 'true': then it includes the 'City' and 'State' (So I can get the 9 (or less) recent "Signed" opportunities from the 'city' & 'State' to the array). Else the Boolean will just set to the 9 most recent "Signed" opportunities to the array (without narrowing the array down via 'city' & 'state').

The error message:

mapping.js Code (with SearchClick button):

(UpdateOpportunities is the Boolean value)

// Method for when the search button is clicked in the "mappingBox" LWC.
    SearchClick(message) {

        if(message.operator == true){

            // The address entered into the search bar.
            const ArrStreet = SearchString.split(',');
            SearchStreet = ArrStreet[0];

            // The town or city entered into the search bar.
            const ArrCity = SearchString.split(',');
            SearchCity = ArrCity[1];

            UpdateOpportunities = true;

            // Updates and locates the location searched.
            this.mapMarkers = MapMarkers(SearchCity, SearchState, SearchStreet, ClickData, UpdateOpportunities);

        }

    }

MapMarkers.js Code:

export function MapMarkers(SearchCity, SearchState, SearchStreet, Opportunities, UpdateOpportunities){
   
   let NineRecentOpportunities;
   let validStages;
   let validCity;
   let validState;

   if(UpdateOpportunities == true){

       // Sets the 9 most recent "Signed" opportunities in the searched: 'City & State' to the array.
       validStages = ['Signed', 'Signed LOI'];
       validCity = [SearchCity];
       validState = [SearchState];
       NineRecentOpportunities = Opportunities.filter(
       (record) => validCity.indexOf(record.Service_City__c) > -1, validState.indexOf(record.Service_State__c) > -1, validStages.indexOf(record.StageName) > -1 ).slice(-9);


   } else {

       // Sets the 9 most recent "Signed" opportunities to the array.
       validStages = ['Signed', 'Signed LOI'];
       NineRecentOpportunities = Opportunities.filter(
       (record) => validStages.indexOf(record.StageName) > -1 ).slice(-9);

   }

Refined Question:

The Else-statement seems to be working for me giving me all the 9 most recent "Signed" opportunities to the array. But the If-statement isn't narrowing the array down by 'city' & 'state' of the 9 or less recent "Signed" opportunities. Is it because It will fail if their are less-then 9 "Signed" opportunities in that city, or is it the Boolean value that's not pasting correctly?

Answer 1

You need to use the && (and) operator to check more than one condition.

NineRecentOpportunities = Opportunities.filter(
    (record) => (
       validCity.indexOf(record.Service_City__c) > -1 && 
       validState.indexOf(record.Service_State__c) > -1 && 
       validStages.indexOf(record.StageName) > -1
    )
).slice(-9);

Comma has some special behavior based on context. Inside of a function call parameter list, the comma separates the individual parameters. Therefore, it was as if you were only filtering by one condition, the city. When the second parameter tried to be evaluated, it was undefined in any scope, because you were now outside the arrow function.

The outer parentheses after => avoids potentially ambiguous code reading, and the && operator evaluates the left-hand operand first, and only if that operand is truthy, it then evaluates the right-hand operand. This means that the code runs very slightly faster, since it knows that the right-hand operand can't make the result true.