Skip to content

fix(plugin-chart-table): allow numerical sorting on Time-series Table metrics#38828

Open
nireknj wants to merge 2 commits intoapache:masterfrom
nireknj:#38094
Open

fix(plugin-chart-table): allow numerical sorting on Time-series Table metrics#38828
nireknj wants to merge 2 commits intoapache:masterfrom
nireknj:#38094

Conversation

@nireknj
Copy link

@nireknj nireknj commented Mar 24, 2026

User description

SUMMARY

The Time-series Table visualization was previously locked to sorting only by the first column (dimensions). Clicking on metric headers (time-series values) displayed a sort indicator but did not actually re-order the rows.

This was caused by a failure in react-table value resolution when using complex/nested accessor keys (e.g., date-prefixed metric keys). The custom sortNumberWithMixedTypes utility was returning 0 (equality) because it couldn't resolve the cell data from the standard row.values lookup.

Changes introduced in this PR:

  1. Metric Resolution Fix: Updated sortNumberWithMixedTypes to resolve cell values from row.original as a fallback. This reliably sidesteps nested dot-notation parsing issues in React Table.
  2. String Fallback: Enhanced the compareValues helper to include an alphabetical fallback for dimension columns and mixed string-number data, preventing them from being treated as equivalent NaN values.
  3. Cross-Platform CI Support: Fixed a regex in jest.config.js that used leading slashes incompatible with Windows-style paths, allowing unit tests to run correctly on all OS environments.

TESTING INSTRUCTIONS

  1. Open a "Time-series Table" chart in Explore or a Dashboard.
  2. Click any metric column header (e.g., a date-prefixed metric).
  3. Verify that the table correctly re-orders rows numerically.
  4. Toggle the sort order (ASC/DESC) and verify consistency.
  5. Automated Verification: All 14 tests (original + regression suite) passed. Run:
    npm run test -- src/visualizations/TimeTable/utils/sortUtils/

ADDITIONAL INFORMATION

  • Changes UI
  • Includes unit tests

Signed-off-by: Nirek Jaiswal nirekjaiswal110106@gmail.com


CodeAnt-AI Description

Allow Time-series Table to sort metric columns correctly

What Changed

  • Clicking metric headers in the Time-series Table now reorders rows as expected, including columns with complex names that contain dots.
  • Text-only values now sort alphabetically instead of being treated as equal.
  • Unit tests now cover complex column names, mixed numeric/text values, and null values so sorting stays reliable.

Impact

✅ Correct metric sorting in time-series tables
✅ Clearer row ordering for text and mixed-value columns
✅ Fewer sorting regressions in table charts

💡 Usage Guide

Checking Your Pull Request

Every time you make a pull request, our system automatically looks through it. We check for security issues, mistakes in how you're setting up your infrastructure, and common code problems. We do this to make sure your changes are solid and won't cause any trouble later.

Talking to CodeAnt AI

Got a question or need a hand with something in your pull request? You can easily get in touch with CodeAnt AI right here. Just type the following in a comment on your pull request, and replace "Your question here" with whatever you want to ask:

@codeant-ai ask: Your question here 

This lets you have a chat with CodeAnt AI about your pull request, making it easier to understand and improve your code.

Example

@codeant-ai ask: Can you suggest a safer alternative to storing this secret? 

Preserve Org Learnings with CodeAnt

You can record team preferences so CodeAnt AI applies them in future reviews. Reply directly to the specific CodeAnt AI suggestion (in the same thread) and replace "Your feedback here" with your input:

@codeant-ai: Your feedback here 

This helps CodeAnt AI learn and adapt to your team's coding style and standards.

Example

@codeant-ai: Do not flag unused imports. 

Retrigger review

Ask CodeAnt AI to review the PR again, by typing:

@codeant-ai: review 

Check Your Repository Health

To analyze the health of your code repository, visit our dashboard at https://app.codeant.ai. This tool helps you identify potential issues and areas for improvement in your codebase, ensuring your repository maintains high standards of code health.

… metrics The 'Time-series Table' visualization was locked to sorting by the first column because react-table failed to resolve nested/dot-notation accessor keys for metric columns. This fix allows sorting by resolving cell values directly from row.original when the default lookup fails. - Update sortNumberWithMixedTypes to fallback to row.original - Update compareValues to handle string comparison for non-numeric data - Fix jest.config.js to support Windows-style paths for unit tests - Add regression tests for complex column identifiers Signed-off-by: Nirek Jaiswal , nirekjaiswal110106@gmail.com
@bito-code-review
Copy link
Contributor

bito-code-review bot commented Mar 24, 2026

Code Review Agent Run #2fa2d2

Actionable Suggestions - 0
Review Details
  • Files reviewed - 3 · Commit Range: 26d51a1..26d51a1
    • superset-frontend/jest.config.js
    • superset-frontend/src/visualizations/TimeTable/utils/sortUtils/sortUtils.regression.test.ts
    • superset-frontend/src/visualizations/TimeTable/utils/sortUtils/sortUtils.ts
  • Files skipped - 0
  • Tools
    • Whispers (Secret Scanner) - ✔︎ Successful
    • Detect-secrets (Secret Scanner) - ✔︎ Successful
    • Eslint (Linter) - ✔︎ Successful

Bito Usage Guide

Commands

Type the following command in the pull request comment and save the comment.

  • /review - Manually triggers a full AI review.

  • /pause - Pauses automatic reviews on this pull request.

  • /resume - Resumes automatic reviews.

  • /resolve - Marks all Bito-posted review comments as resolved.

  • /abort - Cancels all in-progress reviews.

Refer to the documentation for additional commands.

Configuration

This repository uses Superset You can customize the agent settings here or contact your Bito workspace admin at evan@preset.io.

Documentation & Help

AI Code Review powered by Bito Logo

@dosubot dosubot bot added the viz:charts:table Related to the Table chart label Mar 24, 2026
@codeant-ai-for-open-source codeant-ai-for-open-source bot added the size:L This PR changes 100-499 lines, ignoring generated files label Mar 24, 2026
@codeant-ai-for-open-source
Copy link
Contributor

Sequence Diagram

This PR fixes metric-column sorting by making the comparator read cell data from the original row when standard lookup fails, then applying numeric comparison with string fallback. As a result, clicking metric headers now correctly reorders rows for complex time-series column keys.

sequenceDiagram participant User participant TimeSeriesTable participant ReactTable participant SortUtils User->>TimeSeriesTable: Click metric column header TimeSeriesTable->>ReactTable: Request sort for selected metric column ReactTable->>SortUtils: Compare rows for column alt Cell found in original row SortUtils->>SortUtils: Resolve cell from row original else Otherwise SortUtils->>SortUtils: Resolve cell from row values end SortUtils->>SortUtils: Compare as numbers with string fallback SortUtils-->>ReactTable: Return comparison result ReactTable-->>TimeSeriesTable: Render sorted rows 
Loading

Generated by CodeAnt AI

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

size/L size:L This PR changes 100-499 lines, ignoring generated files viz:charts:table Related to the Table chart

1 participant