How to sort Alphanumeric strings in a lightning:datatable on the client-side controller?

Question

I have a field called Elapsed Time (Standard field from Approval Process) in a lightning datatable which is formatted as an alphanumeric string using a helper function. The original data received from the Apex Controller is of Decimal Type.

I need this to be sorted as Minutes > Hours > Days.

I'm using the standard sorting procedure that was provided in the documentation which is working fine for all the other columns.

sortData : function(cmp, fieldName, sortDirection){
    var data = cmp.get("v.data");
    var reverse = sortDirection !== 'asc';
    data = Object.assign([], data.sort(this.sortBy(fieldName, reverse ? -1 : 1)));
    cmp.set("v.data", data);
},
sortBy: function (field, reverse, primer){
    var key = primer ? function(x){ return primer(x[field]); } : function(x){ return x[field]; };
    
    return function (a, b) {
        var A = key(a);
        var B = key(b);
        return reverse * ((A > B) - (B > A));
    };
}

Answer 1

You can sort the original data when it comes in decimal form and then sort them and after that convert them to minutes, hours and days.

Answer 2

I was able to solve this as follows:

In the Apex Controller, I have an inner class which wraps all the fields/data for the lightning:datatable. In this inner class, I added a new attribute which will store the ElapsedTime when the constructor is called. At this point, both attributes have the same value.

@AuraEnabled public Decimal ElapsedTime {get; set;} //old attribute
@AuraEnabled public Decimal ElapsedTimeInDecimals {get; set;} //new attribute

public wrapperClass(String StepName, String RecordName, String RecordId,
                            String ApproverName, String CreatedDate, Decimal ElapsedTime){
                                this.StepName = StepName;
                                this.RecordName = RecordName;
                                this.RecordId = RecordId;
                                this.ApproverName = ApproverName;
                                this.CreatedDate = CreatedDate;
                                this.ElapsedTime = ElapsedTime;
                                this.ElapsedTimeInDecimals = ElapsedTime; //new addition
                            }

In the helper function, I added a simple condition which will sort the column based on the fieldName.

sortData : function(cmp, fieldName, sortDirection){
    if(fieldName === "ElapsedTime"){
        fieldName = "ElapsedTimeInDecimals";
    }
    var data = cmp.get("v.data");
    var reverse = sortDirection !== 'asc';
    data = Object.assign([], data.sort(this.sortBy(fieldName, reverse ? -1 : 1)));
    cmp.set("v.data", data);
}

It is now sorting as expected.