Sort list of items by specific status

user_11745572 0
Viewed 65

I'd like to sort a list of task by status, for example, tasks with status "active" should be grouped follow by tasks with completed, and then tasks with other status should be displayed in the order they were added:

it should display something like this:

 const taskToShows = [
    {task: "task7", status: "active"},
    {task: "task6", status: "active"},
    {task: "task5", status: "active"},
    {task: "task8", status: "completed"},
    {task: "task4", status: "completed"},
    {task: "task1", status: "pending"},
    {task: "task2", status: "other status"},
    {task: "task3", status: "progress"},
   ]

My Approach was using sort() I can ordered at first but then it ordered all the tasks, and just need the actives and the completed ones at the top and All other tasks in the order added by the user

if(this.status === 'active' || this.status === 'completed'){  
      this.tasksToShow = this.tasksList.sort((a, b) => (a.status.toLowerCase() > 
      b.status.toLowerCase()) ? 1 : (a.status.toLowerCase()  === b.status.toLowerCase() ) 
      ? ((a.status > b.status) ? 0 : -1) : -1 )
     }
sorting javascript
3 Answers

Try this-

 const taskToShows = [
    {task: "task7", status: "active"},
    {task: "task6", status: "active"},
    {task: "task5", status: "active"},
    {task: "task8", status: "completed"},
    {task: "task4", status: "completed"},
    {task: "task1", status: "pending"},
    {task: "task2", status: "other status"},
    {task: "task3", status: "progress"},
];



taskToShows.sort((a, b) => {
  const arr = ['active', 'completed'];
  return arr.includes(a.status) || arr.includes(b.status) ? 1 : -1;
});

console.log(taskToShows);
.as-console-wrapper{min-height: 100%!important; top: 0}

user_46107400
  • Using Array#reduce, iterate over the array while updating a Map whose initial values are three empty lists: active, completed, and other. In each iteration, get the corresponding list from the current status, other as the fallback, and push the current element to it.
  • Using Map#values, get the three lists
  • Using Array#flat, return a unified list where active shows first, then completed, then, other.

const taskToShows = [ {task: "task2", status: "other status"}, {task: "task7", status: "active"}, {task: "task5", status: "active"}, {task: "task8", status: "completed"}, {task: "task1", status: "pending"}, {task: "task3", status: "progress"}, {task: "task4", status: "completed"}, {task: "task6", status: "active"} ];

const res = [...
  taskToShows.reduce((lists, e) => {
    const list = lists.get(e.status) ?? lists.get('other');
    list.push(e);
    return lists;
  }, new Map([ ['active', []], ['completed', []], ['other', []] ]))
  .values()
].flat();

console.log(res);

user_74863130

Of couse you сan use sort():

const taskToShows = [{task: "task7", status: "completed"},{task: "task6", status: "active"},{task: "task5", status: "active"},{task: "task8", status: "completed"},{task: "task4", status: "completed"},{task: "task1", status: "pending"},{task: "task2", status: "other status"},{task: "task3", status: "progress"},{task: "task33", status: "active"},{task: "task77", status: "completed"}];

const statusOrder = {active: 0, completed: 1};

const result = taskToShows.sort(
  ({status: s1}, {status: s2}) => (statusOrder[s1] ?? Infinity) - (statusOrder[s2] ?? Infinity)
);

console.log(taskToShows);
.as-console-wrapper{min-height: 100%!important; top: 0}

user_877130
Related