Skip to content

Fix Monaco theme handling for DiffTab consistency#136

Merged
Stasshe merged 3 commits intomainfrom
copilot/fix-diff-theme-reset-issue
Dec 3, 2025
Merged

Fix Monaco theme handling for DiffTab consistency#136
Stasshe merged 3 commits intomainfrom
copilot/fix-diff-theme-reset-issue

Conversation

Copy link
Contributor

Copilot AI commented Dec 3, 2025

DiffTab wasn't applying themes correctly when switching tabs, while CodeEditor worked fine. Root cause: theme names mismatched - components used theme="pyxis-custom" but monaco-themes.ts defined pyxis-dark/pyxis-light.

Changes

  • Unified theme name: Define single pyxis-custom theme matching component props
  • Simplified light/dark detection: Use LIGHT_THEMES list with themeName instead of computing from colors
  • Cache by themeName: Only re-define theme when themeName changes
// Before: color-based detection with separate theme names
const useLight = isHexLight(bg) || /white|fff/i.test(background);
const targetTheme = useLight ? 'pyxis-light' : 'pyxis-dark';

// After: simple themeName check
const LIGHT_THEMES = ['light', 'solarizedLight', 'pastelSoft'];
const useLight = LIGHT_THEMES.includes(themeName);
mon.editor.defineTheme('pyxis-custom', { base: useLight ? 'vs' : 'vs-dark', ... });

Updated callers (MonacoEditor, DiffTab, AIReviewTab) to pass themeName from useTheme().

Original prompt

diffタブで、確かにテーマ再設定毎回するようにするとちゃんとテーマ再設定される。しかし、テーマをキャッシュしておくようにすると、うまくいかんかった。なぜ、codeeditor同士のタブ切り替えではthemeがちゃんとグローバルで、再設定しなくてよくて、diffだと今の実装にならんとバグる?慎重に調査して、修正して、毎回テーマ設定は知って重くならないようにしたい。


💬 We'd love your input! Share your thoughts on Copilot coding agent in our 2 minute survey.

- Changed from defining separate pyxis-dark/pyxis-light themes to a single pyxis-custom theme
- pyxis-custom theme now dynamically adapts based on colors (light/dark detection)
- Added cache key based on editor-related color properties to avoid unnecessary re-definitions
- Theme is only re-defined when relevant color properties change
- setTheme('pyxis-custom') is called on every mount to ensure consistency

Co-authored-by: Stasshe <133995608+Stasshe@users.noreply.github.com>
- Use LIGHT_THEMES list to determine light/dark theme
- Accept themeName parameter instead of computing from colors
- Remove getColorsCacheKey function and use themeName for caching
- Update all callers to pass themeName from useTheme()

Co-authored-by: Stasshe <133995608+Stasshe@users.noreply.github.com>
@Stasshe Stasshe temporarily deployed to copilot/fix-diff-theme-reset-issue - pyxis-code PR #136 December 3, 2025 10:34 — with Render Destroyed
@Stasshe Stasshe marked this pull request as ready for review December 3, 2025 10:41
Copilot AI changed the title [WIP] Fix theme reset issue in diff tab Fix Monaco theme handling for DiffTab consistency Dec 3, 2025
Copilot AI requested a review from Stasshe December 3, 2025 10:41
@Stasshe Stasshe merged commit 6878859 into main Dec 3, 2025
@Stasshe Stasshe deleted the copilot/fix-diff-theme-reset-issue branch December 3, 2025 10:42
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants