I am trying to simplify my multiple array method calls into an if statement or something much more simple based on a condition

Question

I would like to simplify my code and have one array filtering method and then assign the const Alerts based upon the corresponding conditions, instead of 5 array filtering methods. Perhaps an if statement or something of the like would do the trick?

    const pendingAlerts = array.filter((a) => a.approval_status === approvalStatuses.pending && !a.canceled_at).sort(sortCommunicationsByDateRule);
    const deniedAlerts = array.filter((a) => a.approval_status === approvalStatuses.denied && !a.canceled_at).sort(sortCommunicationsByDateRule);
    const upcomingAlerts = array.filter((a) => isApproved(a) && !a.canceled_at && a.begin_at > today).sort(sortCommunicationsByDateRule);
    const activeAlerts = array.filter((a) => isApproved(a) && !a.canceled_at && a.begin_at <= today && a.end_at > today).sort(sortCommunicationsByDateRule);
    const expiredAlerts = array.filter((a) => (a.canceled_at || a.end_at < today)).sort(sortCommunicationsByDateRule); 

    
        <div className="comm-communication-list comm-alert-list wrapper">
          {this.renderNotificationUI()}
          {this.renderDefinitionList(pendingAlerts)}
          {this.renderDefinitionList(upcomingAlerts)}
          {this.renderDefinitionList(activeAlerts)}
          {this.renderDefinitionList(deniedAlerts)}
          {this.renderDefinitionList(expiredAlerts)}
        </div> 

  //The ReactJS list above is rendering the Alert variables  i.e.(pending, upcoming, active, denied, and expired)  based upon the robust multiple filter methods 

Answer 1

You can get this done with one trip through the input array, testing each of the criteria for inclusion in one of the output arrays. You can also use data to associate the criterion with the output array...

const pendingAlerts = [];
const deniedAlerts = [];
const upcomingAlerts = [];
// and so on...

const criteria = [
  {
    array: pendingAlerts,
    criterion: a => a.approval_status === approvalStatuses.pending && !a.canceled_at
  },
  {
    array: deniedAlerts,
    criterion: a => a.approval_status === approvalStatuses.denied && !a.canceled_at
  },
  {
    array: upcomingAlerts,
    criterion: a => isApproved(a) && !a.canceled_at && a.begin_at > today
  },
  // and so on
];

// this one loop pushes a into each of the output arrays where it matches the criterion
array.forEach(a => {
  criteria.forEach(c => if (c.criterion(a)) c.array.push(a));
});

// then sort the output arrays...
criteriaForEach(c => {
  c.array.sort(sortCommunicationsByDateRule)
});