fix: Time Comparison Feature Reverts Metric Labels to Metric Keys in Table Charts by fardin-developer · Pull Request #32665 · apache/superset

fardin-developer · 2025-03-14T09:09:13Z

Fixes: #32621
FEATURE_CHART_PLUGINS_EXPERIMENTAL=true

SUMMARY

This PR addresses an issue where, with Time Comparison enabled in the Table Chart, the metric name ignores the defined label and instead uses the metric key. This results in an unfriendly display name in the UI.

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

###Changes

Introduced originalLabel in the DataColumnMeta interface to retain the correct label.
Updated processComparisonColumns to store originalLabel before modifying the metric label.
Ensured renderGroupingHeaders retrieves and displays the originalLabel correctly in grouped headers.

BEFORE/AFTER SCREENSHOTS

Before

After

korbit-ai

Review by Korbit AI

Korbit automatically attempts to detect when you fix issues in new commits.

Category	Issue	Fix Detected
	Missing error logging for originalLabel fallback ▹ view	✅
	Unclear relationship between label properties ▹ view	✅

Files scanned

File Path	Reviewed
superset-frontend/plugins/plugin-chart-table/src/types.ts	✅
superset-frontend/plugins/plugin-chart-table/src/transformProps.ts	✅
superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx	✅

Explore our documentation to understand the languages and file types we support and the files we ignore.

Need a new review? Comment /korbit-review on this PR and I'll review your latest changes.

Korbit Guide: Usage and Customization

Interacting with Korbit

You can manually ask Korbit to review your PR using the /korbit-review command in a comment at the root of your PR.

You can ask Korbit to generate a new PR description using the /korbit-generate-pr-description command in any comment on your PR.

Too many Korbit comments? I can resolve all my comment threads if you use the /korbit-resolve command in any comment on your PR.

On any given comment that Korbit raises on your pull request, you can have a discussion with Korbit by replying to the comment.

Help train Korbit to improve your reviews by giving a 👍 or 👎 on the comments Korbit posts.

Customizing Korbit

Check out our docs on how you can make Korbit work best for you and your team.

Customize Korbit for your organization through the Korbit Console.

Feedback and Support

Tell us what you think of Korbit

Schedule a call with our team

Email us @ support@korbit.ai

…or label properties

geido · 2025-03-14T15:12:55Z

+        // Use a proper logging function if available
+        console.debug(
+          `originalLabel not found for column at index ${value[0]}, using key as fallback`,
+        );


Suggested change

// Use a proper logging function if available

console.debug(

`originalLabel not found for column at index ${value[0]}, using key as fallback`,

);

Antonio-RiveroMartnez

Adding extra processing using the label + the comparison ones like we do for the key and not include a new property is also an option, but I have not strong preference and these changes look like a less risky fix. Thanks for taking care of this!

geido · 2025-03-17T13:48:13Z

This looks good @fardin-developer. Can you please add a test for this change?

fardin-developer · 2025-03-17T15:14:21Z

This looks good @fardin-developer. Can you please add a test for this change?

Thank you, I’ll include a test with the PR.

…Chart.tsx

github-actions · 2025-03-21T11:54:09Z

@geido Processing your ephemeral environment request here. Action: up. More information on how to use or configure ephemeral environments

github-actions · 2025-03-21T12:06:12Z

@geido Ephemeral environment spinning up at http://35.94.39.180:8080. Credentials are 'admin'/'admin'. Please allow several minutes for bootstrapping and startup.

eschutho · 2025-03-21T20:50:16Z

Thanks @fardin-developer, I tested on the ephemeral and it looks great!

fardin-developer · 2025-03-21T21:07:49Z

Thanks @fardin-developer, I tested on the ephemeral and it looks great!

Glad to hear it worked out! Thanks for the update.

…Table Charts (#32665) Co-authored-by: Fardin Mustaque <fardinmustaque@Fardins-Mac-mini.local> (cherry picked from commit 7d77dc4)

…Table Charts (apache#32665) Co-authored-by: Fardin Mustaque <fardinmustaque@Fardins-Mac-mini.local> (cherry picked from commit 7d77dc4)

Table chart column headers were rendering with `id="header-undefined"` instead of meaningful IDs, breaking CSS customization and ARIA accessibility. **Root Cause:** PR #31590 (Ant Design v5) changed header IDs from `column.key` to `column.originalLabel`, but `originalLabel` is only set for time-comparison columns (added in PR #32665), leaving regular columns with undefined values. **Solution:** Implemented defensive fallback with sanitization: - Headers: `id="header-${sanitizeHeaderId(column.originalLabel || column.key)}"` - Cells: `aria-labelledby="header-${sanitizeHeaderId(column.originalLabel || column.key)}"` **Sanitization Required:** Column identifiers can contain CSS-unsafe characters (%, #, △, spaces), so added sanitization function to ensure valid CSS selectors and ARIA references. **Changes:** - Added `sanitizeHeaderId()` helper function - Updated header `id` attribute with fallback + sanitization - Updated cell `aria-labelledby` with fallback + sanitization - Added 2 comprehensive tests (regular + time-comparison columns) - Fixed test fixture mutation issue **Tests verify:** - No "undefined" in any header IDs - All IDs are CSS-safe (no spaces or special characters) - All ARIA relationships valid (cells reference existing headers) - Works for both regular and time-comparison columns Fixes #35783 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>

…Table Charts (apache#32665) Co-authored-by: Fardin Mustaque <fardinmustaque@Fardins-Mac-mini.local>

retain metric label in Table chart with Time Comparison enabled

e21c83b

pull-request-size Bot added the size/S label Mar 14, 2025

github-actions Bot added the plugins label Mar 14, 2025

dosubot Bot added the viz:charts:table Related to the Table chart label Mar 14, 2025

korbit-ai Bot reviewed Mar 14, 2025

View reviewed changes

Comment thread superset-frontend/plugins/plugin-chart-table/src/types.ts

Comment thread superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx Outdated

fardin-developer changed the title ~~Fix: Time Comparison Feature Reverts Metric Labels to Metric Keys in Table Charts~~ fix: Time Comparison Feature Reverts Metric Labels to Metric Keys in Table Charts Mar 14, 2025

Fardin Mustaque added 2 commits March 14, 2025 15:14

Fix linting issues, improve documentation and enhance error logging f…

65fe405

…or label properties

fix: use value[0] instead of undefined columnIndex

9db7efb

geido reviewed Mar 14, 2025

View reviewed changes

geido requested a review from Antonio-RiveroMartnez March 14, 2025 15:13

logging function removed as suggested

7f3abe0

Antonio-RiveroMartnez approved these changes Mar 17, 2025

View reviewed changes

geido added preset:bounty Issues that have been selected by Preset and have a bounty attached. hold! On hold labels Mar 17, 2025

eschutho added testenv-up and removed testenv-up labels Mar 18, 2025

Added test for originalLabel and unique keys to Footer th/td in Table…

4042a2b

…Chart.tsx

pull-request-size Bot added size/M and removed size/S labels Mar 21, 2025

apache deleted a comment from github-actions Bot Mar 21, 2025

geido added testenv-up and removed testenv-up labels Mar 21, 2025

fardin-developer requested a review from geido March 21, 2025 15:25

geido removed the hold! On hold label Mar 25, 2025

geido merged commit 7d77dc4 into apache:master Mar 25, 2025

michael-s-molina added the v5.0 Label added by the release manager to track PRs to be included in the 5.0 branch label Mar 25, 2025

geido mentioned this pull request Apr 2, 2025

Feat: Show Metric for Big Number chart types #32985

Closed

Antonio-RiveroMartnez mentioned this pull request Apr 16, 2025

feat: add metric name for big number chart types #33013 #33099

Merged

4 tasks

sadpandajoe removed the testenv-up label Jun 25, 2025

mistercrunch added 🍒 5.0.0 Cherry-picked to 5.0.0 🏷️ bot A label used by `supersetbot` to keep track of which PR where auto-tagged with release labels labels Jul 29, 2025

sadpandajoe mentioned this pull request Nov 4, 2025

fix(table-chart): fix missing table header IDs #35968

Merged

9 tasks

silveira-js mentioned this pull request Jan 7, 2026

Add MapLibre support to charts PortalTelemedicina/superset#4

Merged

9 tasks

This was referenced Jan 15, 2026

Point explicit service account to client PortalTelemedicina/superset#9

Merged

Fix margin parameters PortalTelemedicina/superset#10

Merged

silveira-js mentioned this pull request Jan 26, 2026

Adjust Styling Options PortalTelemedicina/superset#11

Closed

qfcwell pushed a commit to qfcwell/superset that referenced this pull request May 12, 2026

fix: Time Comparison Feature Reverts Metric Labels to Metric Keys in …

23274d5

…Table Charts (apache#32665) Co-authored-by: Fardin Mustaque <fardinmustaque@Fardins-Mac-mini.local>

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

fix: Time Comparison Feature Reverts Metric Labels to Metric Keys in Table Charts#32665

fix: Time Comparison Feature Reverts Metric Labels to Metric Keys in Table Charts#32665
geido merged 5 commits into
apache:masterfrom
fardin-developer:fix-metric-label-32621

fardin-developer commented Mar 14, 2025 •

edited by eschutho

Loading

Uh oh!

korbit-ai Bot left a comment •

edited

Loading

Uh oh!

Uh oh!

Uh oh!

geido Mar 14, 2025

Uh oh!

fardin-developer Mar 15, 2025

Uh oh!

Antonio-RiveroMartnez left a comment

Uh oh!

geido commented Mar 17, 2025

Uh oh!

fardin-developer commented Mar 17, 2025

Uh oh!

github-actions Bot commented Mar 21, 2025

Uh oh!

github-actions Bot commented Mar 21, 2025

Uh oh!

eschutho commented Mar 21, 2025

Uh oh!

fardin-developer commented Mar 21, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

7 participants

Conversation

fardin-developer commented Mar 14, 2025 • edited by eschutho Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

SUMMARY

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

BEFORE/AFTER SCREENSHOTS

Before

After

Uh oh!

korbit-ai Bot left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Review by Korbit AI

Korbit automatically attempts to detect when you fix issues in new commits.

Interacting with Korbit

Customizing Korbit

Feedback and Support

Uh oh!

Uh oh!

Uh oh!

geido Mar 14, 2025

Choose a reason for hiding this comment

Uh oh!

fardin-developer Mar 15, 2025

Choose a reason for hiding this comment

Uh oh!

Antonio-RiveroMartnez left a comment

Choose a reason for hiding this comment

Uh oh!

geido commented Mar 17, 2025

Uh oh!

fardin-developer commented Mar 17, 2025

Uh oh!

github-actions Bot commented Mar 21, 2025

Uh oh!

github-actions Bot commented Mar 21, 2025

Uh oh!

eschutho commented Mar 21, 2025

Uh oh!

fardin-developer commented Mar 21, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

7 participants

fardin-developer commented Mar 14, 2025 •

edited by eschutho

Loading

korbit-ai Bot left a comment •

edited

Loading