fix: use resolvedTheme instead of theme for dark mode detection

When theme is set to 'auto', checking theme === 'dark' returns false even
when the system preference is dark mode. This caused charts and custom
styles to use light mode colors in a dark UI.

Fixed by using resolvedTheme which correctly resolves to 'light' or 'dark'
based on system preference when in auto mode.

Fixes the issue reported in PR #29 review.
This commit is contained in:
XYenon
2025-12-26 00:19:04 +08:00
parent 961cc802b2
commit c9fc22bae5
3 changed files with 8 additions and 7 deletions

View File

@@ -16,7 +16,7 @@ export function ConfigPage() {
const { t } = useTranslation();
const { showNotification } = useNotificationStore();
const connectionStatus = useAuthStore((state) => state.connectionStatus);
const theme = useThemeStore((state) => state.theme);
const resolvedTheme = useThemeStore((state) => state.resolvedTheme);
const [content, setContent] = useState('');
const [loading, setLoading] = useState(true);
@@ -289,7 +289,7 @@ export function ConfigPage() {
value={content}
onChange={handleChange}
extensions={extensions}
theme={theme === 'dark' ? 'dark' : 'light'}
theme={resolvedTheme}
editable={!disableControls && !loading}
placeholder={t('config_management.editor_placeholder')}
height="100%"