eschutho opened a new pull request, #35198:
URL: https://github.com/apache/superset/pull/35198
## Summary
- Fixes confirmation dialogs (like "Set System Default Theme") appearing
with white backgrounds in dark mode
- Restores App component wrapper in SupersetThemeProvider to provide theme
context
- Modal.confirm dialogs now properly inherit dark mode theming
## Problem
Confirmation modals created with `Modal.confirm` were not respecting the
current theme:
- ❌ White backgrounds in dark mode (as shown in screenshot)
- ❌ Confirmation dialogs rendered outside theme context
- ❌ App component wrapper was missing from theme provider
- ❌ Poor user experience with jarring white flashes
## Solution
**1. Restored App component wrapper:**
- Re-added `App` import from 'antd' in Theme.tsx
- Wrapped children with `<App>{children}</App>` in SupersetThemeProvider
- Provides theme context for imperatively created modals
**2. Enhanced themedConfirm function:**
- Maintained themedConfirm wrapper for Modal.confirm
- Added documentation explaining App wrapper dependency
- Ensures all Modal.confirm calls inherit current theme
**3. Theme inheritance:**
- Modal.confirm now automatically respects light/dark mode
- Consistent theming across all modal types
- No code changes needed for existing Modal.confirm usage
## Visual Impact
- ✅ Confirmation dialogs now use proper dark backgrounds in dark mode
- ✅ Consistent theming across all modal interactions
- ✅ No more white flashes when confirming actions
- ✅ Better visual consistency with app theme
## Technical Details
- Uses Ant Design's App component to provide theme context to portaled
elements
- App component automatically injects theme for Modal.confirm, message,
notification APIs
- Maintains backwards compatibility with existing modal usage
- Follows Ant Design v5 theming best practices
## Files Changed
- `superset-frontend/packages/superset-ui-core/src/theme/Theme.tsx`
-
`superset-frontend/packages/superset-ui-core/src/components/Modal/Modal.tsx`
## Testing
- ✅ Test Modal.confirm in both light and dark themes
- ✅ Verify confirmation dialogs use proper theme colors
- ✅ Check system theme change dialogs (main use case)
- ✅ Ensure no visual regressions with regular modals
🤖 Generated with [Claude Code](https://claude.ai/code)
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
