fix(themes): serve system themes with the algorithm of the slot they fill by msyavuz · Pull Request #42700 · apache/superset

msyavuz · 2026-08-03T08:44:49Z

SUMMARY

Picking a light theme as the system dark theme breaks dark mode: the UI renders a mix of light and dark tokens (black borders over otherwise unchanged styling) instead of a dark UI.

get_theme_bootstrap_data() merges the DB-selected theme over the config base (_THEME_DARK_BASE, algorithm: "dark"), and the DB theme's algorithm key wins the merge. So a theme authored with algorithm: "default" is served in the dark slot as default, and Ant Design derives light-mapped tokens from dark-leaning seed values.

merge(_THEME_DARK_BASE, {"token": {...}, "algorithm": "default"})
  -> before: {"token": {...}, "algorithm": "default"}   # dark mode renders light-mapped
  -> after:  {"token": {...}, "algorithm": "dark"}

Each system theme is now served with the algorithm of the slot it fills (modifiers like compact preserved), which also repairs deployments already in this state. The Themes list additionally warns admins when the theme they are assigning declares the opposite algorithm.

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

N/A — no visual change on correctly configured deployments; the fix restores the theme's normal dark rendering.

TESTING INSTRUCTIONS

Settings → Themes, set a light theme (e.g. THEME_DEFAULT) as the system dark theme. A warning now appears in the confirmation dialog.
Switch the theme mode to Dark. The UI renders fully dark instead of a half-themed mix.
pytest tests/unit_tests/themes/test_utils.py tests/unit_tests/views/test_base_theme_helpers.py
npm run test -- src/features/themes/utils.test.ts src/pages/ThemeList

ADDITIONAL INFORMATION

Has associated issue: No
Required feature flags: None — ENABLE_UI_THEME_ADMINISTRATION is on by default and is what exposes the broken path
Changes UI: Yes — a warning alert in the "Set System Default/Dark Theme" confirmation dialog
Includes DB Migration: No
Introduces new feature or API: No
Removes existing feature or API: No

…fill A theme picked as the system dark theme keeps its own algorithm when merged onto the config dark base, so a light theme in the dark slot was served with algorithm "default". Ant Design then derived a mix of light and dark tokens and dark mode rendered as a half-themed UI. Force each theme to carry the algorithm of the slot it fills, and warn admins in the confirmation dialog when the theme they pick contradicts the slot.

bito-code-review · 2026-08-03T08:44:59Z

Code Review Agent Run #c6de6f

Actionable Suggestions - 0

Additional Suggestions - 1

superset-frontend/src/pages/ThemeList/ThemeList.test.tsx - 1
- Test assertion message mismatch · Line 385-385
  
  The expected message on line 385 should match the actual alert text from the component. The `handleSetSystemDark` function at index.tsx line 327 renders the alert with the message 'This theme uses the light algorithm. It will be rendered with the dark algorithm instead, so its colors may not look as designed.' — the test expectation needs to reflect this exact wording (not just 'This theme uses the light algorithm').

Filtered by Review Rules

Bito filtered these suggestions based on rules created automatically for your feedback. Manage rules.

superset/themes/utils.py - 1
- Missing docstring on helper · Line 61-61

Review Details

Files reviewed - 8 · Commit Range: 68b04fc..68b04fc
- superset-frontend/src/features/themes/utils.test.ts
- superset-frontend/src/features/themes/utils.ts
- superset-frontend/src/pages/ThemeList/ThemeList.test.tsx
- superset-frontend/src/pages/ThemeList/index.tsx
- superset/themes/utils.py
- superset/views/base.py
- tests/unit_tests/themes/test_utils.py
- tests/unit_tests/views/test_base_theme_helpers.py
Files skipped - 0
Tools
- MyPy (Static Code Analysis) - ✔︎ Successful
- Astral Ruff (Static Code Analysis) - ✔︎ Successful
- 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

codeant-ai-for-open-source · 2026-08-03T08:50:30Z

+  const algorithms = getThemeAlgorithms(jsonData);
+  if (!algorithms.length) return false;
+
+  return algorithms.includes(ThemeAlgorithm.DARK) !== isDarkSlot;


Suggestion: The conflict check treats every algorithm list that does not contain ThemeAlgorithm.DARK as a light algorithm. A theme declaring only a modifier such as compact is compatible with either slot, and the backend preserves that modifier while adding the slot algorithm. This condition therefore displays a misleading warning for valid modifier-only themes; check for an explicit opposing algorithm instead of using absence of dark as evidence of default. [incorrect condition logic]

Severity Level: Minor 🧹

- ⚠️ System-dark confirmation warns for compact-only themes. - ⚠️ Admins may incorrectly believe compact themes are incompatible.

(Use Cmd/Ctrl + Click for best experience)

Prompt for AI Agent 🤖

This is a comment left during a code review. **Path:** superset-frontend/src/features/themes/utils.ts **Line:** 47:47 **Comment:** *Incorrect Condition Logic: The conflict check treats every algorithm list that does not contain `ThemeAlgorithm.DARK` as a light algorithm. A theme declaring only a modifier such as `compact` is compatible with either slot, and the backend preserves that modifier while adding the slot algorithm. This condition therefore displays a misleading warning for valid modifier-only themes; check for an explicit opposing algorithm instead of using absence of `dark` as evidence of `default`. Validate the correctness of the flagged issue. If correct, How can I resolve this? If you propose a fix, implement it and please make it concise. Once fix is implemented, also check other comments on the same PR, and ask user if the user wants to fix the rest of the comments as well. if said yes, then fetch all the comments validate the correctness and implement a minimal fix

👍 | 👎

codeant-ai-for-open-source · 2026-08-03T08:50:30Z

+              'Are you sure you want to set "%s" as the system default theme? This will apply to all users who haven\'t set a personal preference.',
+              theme.theme_name,
+            )}
+            {hasConflictingAlgorithm(theme.json_data, false) && (


Suggestion: The warning is calculated from the raw theme.json_data, but the backend applies the configured base theme before enforcing the slot algorithm. Consequently, a partial theme with no algorithm field can inherit an explicit opposing algorithm from the configured theme and still be assigned without any warning. Resolve the effective merged algorithm, or use the same fallback configuration as the backend, before calling hasConflictingAlgorithm. [api mismatch]

Severity Level: Minor 🧹

- ⚠️ Theme assignment warning omits inherited algorithm conflicts. - ⚠️ Admins may miss that configured colors are remapped.

(Use Cmd/Ctrl + Click for best experience)

Prompt for AI Agent 🤖

This is a comment left during a code review. **Path:** superset-frontend/src/pages/ThemeList/index.tsx **Line:** 283:283 **Comment:** *Api Mismatch: The warning is calculated from the raw `theme.json_data`, but the backend applies the configured base theme before enforcing the slot algorithm. Consequently, a partial theme with no `algorithm` field can inherit an explicit opposing algorithm from the configured theme and still be assigned without any warning. Resolve the effective merged algorithm, or use the same fallback configuration as the backend, before calling `hasConflictingAlgorithm`. Validate the correctness of the flagged issue. If correct, How can I resolve this? If you propose a fix, implement it and please make it concise. Once fix is implemented, also check other comments on the same PR, and ask user if the user wants to fix the rest of the comments as well. if said yes, then fetch all the comments validate the correctness and implement a minimal fix

👍 | 👎

codecov · 2026-08-03T08:59:39Z

Codecov Report

❌ Patch coverage is 72.50000% with 11 lines in your changes missing coverage. Please review.
✅ Project coverage is 65.42%. Comparing base (22c305f) to head (68b04fc).
⚠️ Report is 21 commits behind head on master.

Files with missing lines	Patch %	Lines
superset/themes/utils.py	55.00%	6 Missing and 3 partials ⚠️
superset-frontend/src/pages/ThemeList/index.tsx	50.00%	2 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##           master   #42700      +/-   ##
==========================================
- Coverage   65.43%   65.42%   -0.02%     
==========================================
  Files        2810     2811       +1     
  Lines      159460   159554      +94     
  Branches    36396    36418      +22     
==========================================
+ Hits       104350   104389      +39     
- Misses      53068    53116      +48     
- Partials     2042     2049       +7

Flag	Coverage Δ
hive	`38.06% <59.09%> (-0.01%)`	⬇️
javascript	`71.55% <88.88%> (+<0.01%)`	⬆️
mysql	`57.77% <59.09%> (-0.03%)`	⬇️
postgres	`57.82% <59.09%> (-0.03%)`	⬇️
presto	`39.96% <59.09%> (-0.01%)`	⬇️
python	`59.20% <59.09%> (-0.03%)`	⬇️
sqlite	`57.44% <59.09%> (-0.03%)`	⬇️
unit	`100.00% <ø> (ø)`

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.

alexandrusoare

Thank you for your work @msyavuz, a clean fix and solid test coverage!

I have only one question, have you considered just hiding the "Set as dark theme" action for light-algorithm themes (and vice versa) to prevent the mismatch entirely, rather than warning and correcting it downstream?

msyavuz · 2026-08-07T11:29:39Z

I have only one question, have you considered just hiding the "Set as dark theme" action for light-algorithm themes (and vice versa) to prevent the mismatch entirely, rather than warning and correcting it downstream?

Yes, i wanted to cover non-UI paths as well. Headles, embedded etc.

pull-request-size Bot added the size/L label Aug 3, 2026

dosubot Bot added change:frontend Requires changing the frontend global:theming Related to theming Superset labels Aug 3, 2026

github-actions Bot added the preset-io label Aug 3, 2026

codeant-ai-for-open-source Bot reviewed Aug 3, 2026

View reviewed changes

alexandrusoare approved these changes Aug 7, 2026

View reviewed changes

msyavuz merged commit 14583b6 into master Aug 7, 2026
90 of 91 checks passed

msyavuz deleted the msyavuz/fix/system-dark-theme-algorithm branch August 7, 2026 11:29

Navigation Menu

Uh oh!

fix(themes): serve system themes with the algorithm of the slot they fill - #42700

fix(themes): serve system themes with the algorithm of the slot they fill#42700
msyavuz merged 1 commit into
masterfrom
msyavuz/fix/system-dark-theme-algorithm

msyavuz commented Aug 3, 2026

Uh oh!

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

edited

Loading

Code Review Agent Run #c6de6f

Uh oh!

codeant-ai-for-open-source Bot Aug 3, 2026

Uh oh!

codeant-ai-for-open-source Bot Aug 3, 2026

Uh oh!

codecov Bot commented Aug 3, 2026 •

edited

Loading

Uh oh!

alexandrusoare left a comment

Uh oh!

msyavuz commented Aug 7, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Uh oh!

Conversation

msyavuz commented Aug 3, 2026

SUMMARY

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

TESTING INSTRUCTIONS

ADDITIONAL INFORMATION

Uh oh!

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

Uh oh!

Code Review Agent Run #c6de6f

Uh oh!

codeant-ai-for-open-source Bot Aug 3, 2026

Choose a reason for hiding this comment

Uh oh!

codeant-ai-for-open-source Bot Aug 3, 2026

Choose a reason for hiding this comment

Uh oh!

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

Uh oh!

Codecov Report

Uh oh!

alexandrusoare left a comment

Choose a reason for hiding this comment

Uh oh!

msyavuz commented Aug 7, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

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

edited

Loading

codecov Bot commented Aug 3, 2026 •

edited

Loading