fix(dashboard): use theme border for chart tiles by YinkaMetrics · Pull Request #41661 · apache/superset

YinkaMetrics · 2026-07-02T02:56:27Z

SUMMARY

add a resting chart tile border using the active theme colorBorder token
keep the existing border radius token on chart holders
add DashboardBuilder coverage for the chart holder border styles

Closes #41618

SCREENSHOTS

Captured from a local Superset Sales Dashboard with example data loaded.

Before:

After:

TESTING INSTRUCTIONS

env NODE_ENV=test NODE_OPTIONS=--max-old-space-size=8192 node_modules/.bin/jest --config jest.config.js --silent --runInBand src/dashboard/components/DashboardBuilder/DashboardBuilder.test.tsx
superset-frontend/node_modules/.bin/prettier --check superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.tsx superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.test.tsx
git diff --check

bito-code-review · 2026-07-02T02:56:37Z

Code Review Agent Run #fe93f0

Actionable Suggestions - 0

Review Details

Files reviewed - 2 · Commit Range: c12a9be..c12a9be
- superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.test.tsx
- superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.tsx
Files skipped - 0
Tools
- Whispers (Secret Scanner) - ✔︎ Successful
- Detect-secrets (Secret Scanner) - ✔︎ 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

sadpandajoe · 2026-07-02T17:23:19Z

@YinkaMetrics can you add a before and after screenshot into the description

codecov · 2026-07-02T17:33:13Z

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 64.61%. Comparing base (46a153d) to head (744d526).
⚠️ Report is 20 commits behind head on master.

Additional details and impacted files

@@            Coverage Diff             @@
##           master   #41661      +/-   ##
==========================================
- Coverage   64.61%   64.61%   -0.01%     
==========================================
  Files        2684     2684              
  Lines      148514   148513       -1     
  Branches    34263    34262       -1     
==========================================
- Hits        95969    95962       -7     
- Misses      50786    50792       +6     
  Partials     1759     1759

Flag	Coverage Δ
javascript	`69.40% <100.00%> (-0.01%)`	⬇️

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

YinkaMetrics · 2026-07-02T20:05:24Z

Updated the PR description with real before/after screenshots captured from the local Superset Sales Dashboard. Thanks for the prompt.

aminghadersohi

Reviewed. Scans N/A (trivial TS/Emotion diff, +22/-2). theme.colorBorder matches the precedent from #35199 and is already used elsewhere in this file (empty-droptarget border, fade-out box-shadow), resolves correctly in both light/dark via antd's alias-token algorithm. box-sizing: border-box prevents layout shift from the new border. The border-radius consolidation into the base rule is a reasonable, disclosed DRY cleanup (both .fade-in/.fade-out used the same value). Test asserts the real themed values via supersetTheme and follows the file's existing toHaveStyleRule/target pattern — not vacuous. No findings.

bito-code-review · 2026-07-03T04:33:06Z

Code Review Agent Run #77c467

Actionable Suggestions - 0

Review Details

Files reviewed - 2 · Commit Range: 81caebd..81caebd
- superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.test.tsx
- superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.tsx
Files skipped - 0
Tools
- Whispers (Secret Scanner) - ✔︎ Successful
- Detect-secrets (Secret Scanner) - ✔︎ 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

aminghadersohi

Re-review at new HEAD (author force-pushed a rewritten implementation). The new version routes through the existing opt-in dashboardTileBorder/dashboardTileBorderRadius override tokens instead of hardcoding colorBorder — an improvement over the prior version since it respects operator overrides. Two items:

superset-frontend/packages/superset-core/src/theme/types.ts:254 documents these tokens' fallback as "no border" — this PR intentionally flips that default to a themed border (the fix for #41618) but doesn't update the now-stale comment. Not blocking, worth a one-line fix alongside.

See inline comment for the blocking item (failing required CI gate).

aminghadersohi · 2026-07-03T14:13:34Z

      width: 100%;
      height: 100%;
      background-color: ${theme.dashboardTileBg ?? theme.colorBgContainer};
+      border: ${theme.dashboardTileBorder ??


HIGH: the pre-commit (current) required check is failing at this HEAD — prettier-frontend reformats this file (files were modified by this hook). Run prettier --write (or the repo's pre-commit hook) locally and push the formatted version; this blocks merge as-is.

bito-code-review · 2026-07-03T14:13:44Z

To resolve the failing pre-commit check, you need to run the project's Prettier formatting command locally. Since the prettier-frontend hook identified that superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.tsx requires reformatting, please execute the following command in your terminal:

npm run prettier -- --write superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.tsx

After running this command, stage the changes and push them to your branch. This will ensure the file adheres to the project's style guidelines and allow the pre-commit check to pass.

netlify · 2026-07-03T18:35:35Z

✅ Deploy Preview for superset-docs-preview ready!

Name	Link
🔨 Latest commit	`744d526`
🔍 Latest deploy log	https://app.netlify.com/projects/superset-docs-preview/deploys/6a480087f900e400087b33bb
😎 Deploy Preview	https://deploy-preview-41661--superset-docs-preview.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
🤖 Make changes	Run an agent on this branch

To edit notification comments on pull requests, go to your Netlify project configuration.

bito-code-review · 2026-07-03T21:42:06Z

Code Review Agent Run #db62b3

Actionable Suggestions - 0

Additional Suggestions - 1

superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.tsx - 1
- Semantic behavior change · Line 339-341
  
  Removing `border` from `.fade-out` changes conditional behavior. Previously when `dashboardTileBorder` was undefined, `fade-out` had no border (fallback to `'none'`). Now it inherits the base `border: 1px solid ${theme.colorBorder}` by default. This regression may cause visual inconsistency in the `fade-out` state unless that was the intended change.

Review Details

Files reviewed - 3 · Commit Range: 744d526..744d526
- superset-frontend/packages/superset-core/src/theme/types.ts
- superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.test.tsx
- superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.tsx
Files skipped - 0
Tools
- Eslint (Linter) - ✔︎ Successful
- Whispers (Secret Scanner) - ✔︎ Successful
- Detect-secrets (Secret Scanner) - ✔︎ 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

aminghadersohi

Both prior findings addressed: border/border-radius are now single-line (79/80 chars, matches the file's existing style and prettier's 80-char default), and the types.ts:254 comment now correctly says "colorBorder border" instead of "no border". No new issues from a full re-scan.

On Bito's fade-out "regression" note: that's the intended behavior, not a bug — the whole point of this fix (#41618) is that the border should be consistent across all states (resting/fade-in/fade-out) rather than only appearing conditionally in .fade-out. Reverting that would reintroduce the original issue.

Note: CI hasn't actually executed at this HEAD yet (action_required — pending maintainer approval to run Actions for a first-time contributor's fork PR), so this isn't a green-CI confirmation, just a code-level check.

rusackas · 2026-07-05T06:10:11Z

Thanks @YinkaMetrics, you got to the right approach first here (the dashboardTileBorder ?? colorBorder fallback seems right). But #41731 landed the same change with green CI and a bit more test coverage, so we're likely to merge that one and close this. Let me know if I'm misconstruing anything, and thanks for this and future contributions!

rusackas · 2026-07-05T06:12:45Z

Merged #41731, so I'll indeed close this after all, but let me know if you think there's more to address, and we can certainly reopen/revisit this. Thanks again!

pull-request-size Bot added the size/S label Jul 2, 2026

dosubot Bot added change:frontend Requires changing the frontend dashboard:design Related to the Dashboard UI/UX labels Jul 2, 2026

sadpandajoe requested review from aminghadersohi and msyavuz July 2, 2026 17:23

aminghadersohi reviewed Jul 2, 2026

View reviewed changes

YinkaMetrics force-pushed the yinka/dashboard-chart-border branch from c12a9be to 81caebd Compare July 3, 2026 01:27

rish106-hub mentioned this pull request Jul 3, 2026

fix(dashboard): use theme colorBorder token for chart tile borders #41731

Merged

aminghadersohi reviewed Jul 3, 2026

View reviewed changes

fix(dashboard): use theme border for chart tiles

744d526

YinkaMetrics force-pushed the yinka/dashboard-chart-border branch from 81caebd to 744d526 Compare July 3, 2026 18:33

github-actions Bot added the packages label Jul 3, 2026

aminghadersohi reviewed Jul 4, 2026

View reviewed changes

rusackas closed this Jul 5, 2026

Uh oh!

Conversation

YinkaMetrics commented Jul 2, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

SUMMARY

SCREENSHOTS

TESTING INSTRUCTIONS

Uh oh!

bito-code-review Bot commented Jul 2, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Code Review Agent Run #fe93f0

Uh oh!

sadpandajoe commented Jul 2, 2026

Uh oh!

codecov Bot commented Jul 2, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

YinkaMetrics commented Jul 2, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

aminghadersohi left a comment

Choose a reason for hiding this comment

Uh oh!

bito-code-review Bot commented Jul 3, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Code Review Agent Run #77c467

Uh oh!

aminghadersohi left a comment

Choose a reason for hiding this comment

Uh oh!

aminghadersohi Jul 3, 2026

Choose a reason for hiding this comment

Uh oh!

bito-code-review Bot commented Jul 3, 2026

Uh oh!

netlify Bot commented Jul 3, 2026

✅ Deploy Preview for superset-docs-preview ready!

Uh oh!

bito-code-review Bot commented Jul 3, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Code Review Agent Run #db62b3

Uh oh!

aminghadersohi left a comment

Choose a reason for hiding this comment

Uh oh!

rusackas commented Jul 5, 2026

Uh oh!

rusackas commented Jul 5, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

YinkaMetrics commented Jul 2, 2026 •

edited

Loading

bito-code-review Bot commented Jul 2, 2026 •

edited

Loading

codecov Bot commented Jul 2, 2026 •

edited

Loading

YinkaMetrics commented Jul 2, 2026 •

edited

Loading

bito-code-review Bot commented Jul 3, 2026 •

edited

Loading

bito-code-review Bot commented Jul 3, 2026 •

edited

Loading