[Bug]: Table sorting broken for numerical cell values

[juanruitina]

Describe the bug

Sorting table columns doesn't work as expected for numerical values: given sorting is alphabetical, values like 1, 2, 10, 20 are sorted 1, 10, 2, 20 with the provided javascript. Sorting should be smart enough to account for this, including decimals and negative numbers and ignoring units if the same for all cells, both appended (e.g. GiB) and prepended (currency).

Probably should sort first any figures, then alphabetically, ascending. I wonder though if for numbers descending is a better default (it can be for instance in web analytics).

Split from #5736

To Reproduce

I edited the _table-sortable .html file, replacing the table code with this for better testing:

<table aria-label="Example of a sortable table">
  <thead>
    <tr>
      <th aria-sort="none">Status</th>
      <th aria-sort="none" class="u-align--right">Cores</th>
      <th aria-sort="none" class="u-align--right">RAM</th>
      <th aria-sort="none" class="u-align--right">Disks</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td role="rowheader">Ready</td>
      <td class="u-align--right">1</td>
      <td class="u-align--right">1.1 GiB</td>
      <td class="u-align--right">2</td>
    </tr>
    <tr>
      <td role="rowheader">Failed</td>
      <td class="u-align--right">10</td>
      <td class="u-align--right">1 GiB</td>
      <td class="u-align--right">Pending</td>
    </tr>
    <tr>
      <td role="rowheader">Pending</td>
      <td class="u-align--right">8</td>
      <td class="u-align--right">3.9 GiB</td>
      <td class="u-align--right">3</td>
    </tr>
    <tr>
      <td role="rowheader">Ready</td>
      <td class="u-align--right">8</td>
      <td class="u-align--right">10.9 GiB</td>
      <td class="u-align--right">Unknown</td>
    </tr>
  </tbody>
</table>

Example is available in /docs/examples/patterns/tables/table-sortable

Expected behavior

Numeric values are sorted correctly when clicking on the column header.

Screenshots

[syncronize-issues-to-jira]

Thank you for reporting your feedback to us!

The internal ticket has been created: https://warthogs.atlassian.net/browse/WD-33023.

This message was autogenerated

[jmuzina]

Developer's note: will require an update to React Components and Vanilla table example