How to default sort with two columns in React Table v8

Question

How can I sort the table with two column wherein sort by status first and the priority secondary in sorting. Here's what I have done so far

columnHelper.accessor('status', {
  id: 'status',
  header: 'Status',
  sortingFn: 'statusSort'
}),
columnHelper.accessor('priority', {
  id: 'priority',
  header: 'Priority',
  sortingFn: 'prioritySort'
}),

///sortingFn
const statusSort: SortingFn<any> = (rowA: any, rowB: any, columnId: any) => {
  const ranking = (value: string): number => {
    if (value.toUpperCase() === 'READY') {
      return 1;
    } else if (value.toUpperCase() === 'In Progress') {
      return 2;
    } else if (value.toUpperCase() === 'Cancelled') {
      return 3;
    } else return 4;
  };

  if (ranking(rowA.getValue(columnId)) < ranking(rowB.getValue(columnId))) {
    return -1;
  } else if (ranking(rowA.getValue(columnId)) < ranking(rowB.getValue(columnId))) {
    return 0;
  } else {
    return 1;
  }
};

const prioritySort: SortingFn<any> = (rowA: any, rowB: any, columnId: any) => {
  const ranking = (value: string): number => {
    switch (value.toUpperCase()) {
      case 'URGENT':
        return 1;
      case 'HIGH':
        return 2;
      case 'NORMAL':
        return 3;
      case 'LOW':
        return 4;
      default:
        return 5;
    }
  };

  if (ranking(rowA.getValue(columnId)) < ranking(rowB.getValue(columnId))) {
    return -1;
  } else if (ranking(rowA.getValue(columnId)) == ranking(rowB.getValue(columnId))) {
    return 0;
  } else {
    return 1;
  }
};

Seems like I cant find it on the documentation. If there is a way, could you provide an example of an implementation?

Thanks