fix(desktop): ensure Monaco editor loads syntax highlighting reliably
Merged
KI
10mo ago+55+55+01234567890123456789-6-6-0123456789
Summary
- Fix race condition where Monaco editor would render before theme was registered
- Add
useMonacoReadyhook to allow components to wait for Monaco initialization - DiffViewer now properly waits for Monaco to be ready before rendering
Problem
When opening files in the diff viewer, syntax highlighting would sometimes not load immediately. This was caused by:
MonacoProviderrendering children immediately without waiting for Monaco initialization- Theme definition happening asynchronously via
monacoPromise.then(), butDiffEditoralready trying to useSUPERSET_THEMEbefore it was registered - Theme store starting with
monacoTheme: nulluntil hydration, causing the first render to skip theme registration
Solution
- Added
MonacoContextwithisReadystate to track full initialization - Provider now waits for both Monaco initialization AND theme availability before setting
isReady: true - Exposed
useMonacoReady()hook for consumers to check readiness DiffVieweruses the hook to show loading state until Monaco is fully ready
Test plan
- Open a file in the diff viewer
- Verify syntax highlighting loads immediately (no delay/flicker)
- Switch between files and verify highlighting persists
- Change theme and verify editor updates correctly
🤖 Generated with Claude Code
Summary by CodeRabbit
- Bug Fixes
- Improved Monaco editor initialization handling by adding a readiness check before rendering the diff viewer. Users will now see a loading state while the editor initializes, preventing potential rendering issues during startup.
✏️ Tip: You can customize this high-level summary in your review settings.