I'm implementing some button works in React. Suppose if I select bedroom 3 then it should show only the data of bedroom 3. If I select bedroom 2,3(multiple selections) then it will be an OR logic and show data of bedrooms 2,3 both. But if I select bedrooms 3 and bathrooms 2 that should be AND logic and show data that has exactly 3 bedrooms and 2 bathrooms. So in short if I select in the same section either bedrooms or bathrooms that will be OR logic and if any other section is selected(bathrooms along with bedrooms) that should be AND logic. Is it possible to do it dynamically? There are some other sections also like direction, available status, price range, sqft range, etc.
Only 3 bedroom is selected(OR logic will be applied)
2,3 Bedrooms are selected so it will show data either matches with 2 bedrooms or 3 bedrooms(OR logic will be applied as they are in a similar section)
3 bedrooms, and 2 bathrooms selected(AND logic will be applied as they are different section)
3 bedrooms and 2 bathrooms, available are selected so it will show data of only 3 bedrooms and 2 bathrooms and which are available( AND logic will be applied among them)
var filterArray = PropertyData? PropertyData.map((property) => { let DirectionArr = property.direction.split(","); let propertyPrice = parseInt(property.price.replace(/,/g, "")); let propertySqft = parseInt(property.sqft); if ( UnitFilterBedroomOnArr.includes(property.bedroom) || UnitFilterBathroomOnArr.includes(property.bathroom) || (propertyPrice >= UnitFilterPriceRangeMin && propertyPrice <= UnitFilterPriceRangeMax && UnitFilterPriceRangeMin < UnitFilterPriceRangeMax) || (propertySqft >= UnitFilterUnitSqftRangeMin && propertySqft <= UnitFilterUnitSqftRangeMax && UnitFilterUnitSqftRangeMin < UnitFilterUnitSqftRangeMax) || (DirectionArr.includes(DirectionStatusEnum.North) && KeyplanFilterNorthState) || (DirectionArr.includes(DirectionStatusEnum.South) && KeyplanFilterSouthState) || (DirectionArr.includes(DirectionStatusEnum.East) && KeyplanFilterEastState) || (DirectionArr.includes(DirectionStatusEnum.West) && KeyplanFilterWestState) || (property.status === SellingStatusEnum.ForSale && UnitFilterSellingStatusForSale) || (property.status === SellingStatusEnum.Sold && UnitFilterSellingStatusSold) || (property.status === SellingStatusEnum.NotAvailable && UnitFilterSellingStatusNotAvailable) ) { return property.modelUnitId; } return null; }): "";
Here is what I have tried. It's all in OR logic. I want to make it with the combination of AND and OR logic. If a different section(bedroom, bathroom) is selected it should be AND logic and in a similar(only bedroom or only bathroom) it should be OR.