Angular 17 mat-table with sort on complicated data structure

Question

Mat-Table will not sort data

I all I am having trouble getting matSort to work on header (mat-sort-header).

The table headers show the arrows when I click them, and the data doesn't sort.

I have a complicated data structure so I am setting the mat-cell data with a method ex.(below).

//An Example column('name') not actual data structure but should get my point across
a(row, num){
  if(num == 1) { return row[0].typeA.nameObj; }
  if(num == 2) { return row[0].typeb.Something.dragonName; }
  return '';
}

I tried to follow the same kind of set up shown in this but doesnt seem to work with my table. (https://stackblitz.com/run?file=src%2Fapp%2Ftable-overview-example.ts)`

I tried to use sortingDataAccessor but not sure I am using it correctly.

this.dataSource.sortingDataAccessor = (item, property) => {
        switch(property) {
          case 'name': return a(item, property);
          case 'title' : return methodHere();
          case 'desc' : return methodHere();
          default: return item[property];
        }
      };

Any help would be appreciated.