|
| 1 | +// Patch for the startup theme. Customizes the `ThemeService.get().defaultTheme();` to dispatch the default IDE2 theme based on the OS' theme. |
| 2 | +// For all subsequent starts of the IDE the theme applied will be the last one set by the user. |
| 3 | + |
| 4 | +// With the current version of Theia adopted (1.25) it is not possible to extend the `ThemeService`, it will be possible starting from Theia 1.27. |
| 5 | +// Once the version of Theia is updated, this patch will be removed and this functionality will be implemented via dependency injection. |
| 6 | +// Ideally, we should open a PR in Theia and add support for `light` and `dark` default themes in the app config. |
| 7 | + |
| 8 | +const { |
| 9 | + ThemeService, |
| 10 | + ThemeServiceSymbol, |
| 11 | + BuiltinThemeProvider, |
| 12 | +} = require('@theia/core/lib/browser/theming'); |
| 13 | +const { |
| 14 | + ApplicationProps, |
| 15 | +} = require('@theia/application-package/lib/application-props'); |
| 16 | +const { |
| 17 | + FrontendApplicationConfigProvider, |
| 18 | +} = require('@theia/core/lib/browser/frontend-application-config-provider'); |
| 19 | + |
| 20 | +// It is a mighty hack to support theme updates in the bundled IDE2. |
| 21 | +// If the custom theme registration happens before the restoration of the existing monaco themes, then any custom theme changes will be ignored. |
| 22 | +// This patch introduces a static deferred promise in the monaco-theming service that will be resolved when the restoration is ready. |
| 23 | +// IDE2 cannot require the monaco theme service on the outer module level, as it requires the application config provider to be initialized, |
| 24 | +// but the initialization happens only in the generated `index.js`. |
| 25 | +// This patch customizes the monaco theme service behavior before loading the DI containers via the preload. |
| 26 | +// The preload is called only once before the app loads. The Theia extensions are not loaded at that point, but the app config provider is ready. |
| 27 | +const preloader = require('@theia/core/lib/browser/preloader'); |
| 28 | +const originalPreload = preloader.preload; |
| 29 | +preloader.preload = async function () { |
| 30 | + const { MonacoThemingService } = require('@theia/monaco/lib/browser/monaco-theming-service'); |
| 31 | + const { MonacoThemeServiceIsReady } = require('arduino-ide-extension/lib/browser/utils/window'); |
| 32 | + const { Deferred } = require('@theia/core/lib/common/promise-util'); |
| 33 | + const ready = new Deferred(); |
| 34 | + if (!window[MonacoThemeServiceIsReady]) { |
| 35 | + window[MonacoThemeServiceIsReady] = ready; |
| 36 | + console.log('Registered a custom monaco-theme service initialization signal on the window object.'); |
| 37 | + } |
| 38 | + // Here, it is safe to patch the theme service, app config provider is ready. |
| 39 | + MonacoThemingService.init = async function () { |
| 40 | + this.updateBodyUiTheme(); |
| 41 | + ThemeService.get().onDidColorThemeChange(() => this.updateBodyUiTheme()); |
| 42 | + await this.restore(); |
| 43 | + ready.resolve(); |
| 44 | + }.bind(MonacoThemingService); |
| 45 | + return originalPreload(); |
| 46 | +}.bind(preloader); |
| 47 | + |
| 48 | +const lightTheme = 'arduino-theme'; |
| 49 | +const darkTheme = 'arduino-theme-dark'; |
| 50 | +const defaultTheme = |
| 51 | + window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches |
| 52 | + ? darkTheme |
| 53 | + : lightTheme; |
| 54 | + |
| 55 | +const originalGet = FrontendApplicationConfigProvider.get; |
| 56 | +FrontendApplicationConfigProvider.get = function () { |
| 57 | + const originalProps = originalGet.bind(FrontendApplicationConfigProvider)(); |
| 58 | + return { ...originalProps, defaultTheme }; |
| 59 | +}.bind(FrontendApplicationConfigProvider); |
| 60 | + |
| 61 | +const arduinoDarkTheme = { |
| 62 | + id: 'arduino-theme-dark', |
| 63 | + type: 'dark', |
| 64 | + label: 'Dark (Arduino)', |
| 65 | + editorTheme: 'arduino-theme-dark', |
| 66 | + activate() {}, |
| 67 | + deactivate() {}, |
| 68 | +}; |
| 69 | + |
| 70 | +const arduinoLightTheme = { |
| 71 | + id: 'arduino-theme', |
| 72 | + type: 'light', |
| 73 | + label: 'Light (Arduino)', |
| 74 | + editorTheme: 'arduino-theme', |
| 75 | + activate() {}, |
| 76 | + deactivate() {}, |
| 77 | +}; |
| 78 | + |
| 79 | +if (!window[ThemeServiceSymbol]) { |
| 80 | + const themeService = new ThemeService(); |
| 81 | + Object.defineProperty(themeService, 'defaultTheme', { |
| 82 | + get: function () { |
| 83 | + return ( |
| 84 | + this.themes[defaultTheme] || |
| 85 | + this.themes[ApplicationProps.DEFAULT.frontend.config.defaultTheme] |
| 86 | + ); |
| 87 | + }, |
| 88 | + }); |
| 89 | + themeService.register( |
| 90 | + ...BuiltinThemeProvider.themes, |
| 91 | + arduinoDarkTheme, |
| 92 | + arduinoLightTheme |
| 93 | + ); |
| 94 | + themeService.startupTheme(); |
| 95 | + themeService.setCurrentTheme(defaultTheme); |
| 96 | + window[ThemeServiceSymbol] = themeService; |
| 97 | +} |
| 98 | + |
| 99 | +// Require the original, generated `index.js` for `webpack` as the next entry for the `bundle.js`. |
| 100 | +require('../../src-gen/frontend/index'); |
0 commit comments