Sort trials table metric columns numerically instead of as strings

[pujitha24]

What this PR does / why we need it:

The Trials table in the Katib UI sorts metric and hyperparameter columns lexicographically instead of numerically. Values with more than 6 significant digits are formatted into scientific notation (e.g. 1.3923e-2) by numberToExponential() before being handed to the table, and the shared kubeflow table component sorts by that formatted display string when no sortingPreprocessorFn is set. As a result "1.3923e-2" > "0.49713" as strings even though 0.013923 < 0.49713 numerically, so clicking a metric column header does not sort trials by value.

Approach:

TableColumn (from the kubeflow common library) supports an optional sortingPreprocessorFn used by MatTableDataSource.sortingDataAccessor instead of the raw display value when present. This PR adds a sortingPreprocessorFn to the generic (metric/hyperparameter) columns in TrialsTableComponent.setConfig() that converts the formatted string back to a Number for sorting, falling back to the original string for non-numeric values (e.g. categorical hyperparameters) and for empty values (missing metrics), so those continue to sort/group as before.

This is a display/sorting-only change: it does not affect the values shown in the table, only the order rows appear in when a numeric column is sorted.

Validation:

Reproduced the CI job defined in .github/workflows/test-node.yaml locally: cloned kubeflow/kubeflow at the pinned commit in pkg/ui/v1beta1/frontend/COMMIT, built and npm linked the kubeflow common library, then in pkg/ui/v1beta1/frontend:

• npm run test:prod (ng test --browsers=ChromeHeadless --watch=false) → TOTAL: 46 SUCCESS, exit code 0. This includes two new unit tests that call sortingPreprocessorFn directly and assert numeric strings (including scientific notation) sort numerically, and that an empty string (missing metric) is left as '' rather than becoming 0. Both are genuine failing-before/passing-after tests: before this change sortingPreprocessorFn is undefined on these columns, so calling it throws.
• npm run lint-check (ng lint) → all files pass linting.
• npm run format:check (prettier, matching the repo's make prettier-check) → all matched files use Prettier code style.

Not run: the Cypress UI test job (frontend-ui-tests), which requires serving the app live in Chrome and Firefox. This change has no DOM/interaction surface (it only changes a sort comparator function), so it is disclosed here rather than block on it.

Which issue(s) this PR fixes (optional, in fixes #<issue number>(, fixes #<issue_number>, ...) format, will close the issue(s) when PR gets merged):
Fixes #

Checklist:

• Docs included if any changes are user facing

Fixes #2715

[google-oss-prow]

[APPROVALNOTIFIER] This PR is NOT APPROVED

This pull-request has been approved by:
Once this PR has been reviewed and has the lgtm label, please assign kimwnasptd for approval. For more information see the Kubernetes Code Review Process.

The full list of commands accepted by this bot can be found here.

Details

Needs approval from an approver in each of these files:

• pkg/ui/v1beta1/OWNERS

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

[github-actions]

🎉 Welcome to the Kubeflow Katib repo! 🎉

Thanks for opening your first PR! We're excited to have you onboard 🚀

Next steps:

• Our team will review your PR soon! cc @kubeflow/wg-automl-leads
• Check out the Contributing Guide and the Kubeflow Contributor Guide
• Join the Kubeflow Slack channels: https://www.kubeflow.org/docs/about/community/#kubeflow-slack-channels
• Join the AutoML & Training WG meetings: https://bit.ly/2PWVCkV

Feel free to ask questions in the comments. Thanks again for contributing! 🙏