fix: apply theme on init

src/renderer/theme.store.ts

@@ -141,7 +141,9 @@ export class ThemeStore {
     });
 
     // auto-apply colors to dom from active theme
-    reaction(() => this.activeTheme, this.onChange);
+    reaction(() => this.activeTheme, this.onChange, {
+      fireImmediately: true,
+    });
 
     // apply theme from configuration
     import("./config.store").then(({ configStore }) => {
@@ -184,6 +186,7 @@ export class ThemeStore {
     try {
       await this.load(themeId);
       this.activeThemeId = themeId;
+      console.log('THEME', themeId, this.themes.get(themeId))
     } catch (err) {
       if (themeId !== this.defaultTheme.name) {
         this.setTheme(); // fallback to default theme

webpack.renderer.ts

@@ -26,6 +26,7 @@ export function webpackConfigReact(): webpack.Configuration {
     },
     output: {
       path: outDir,
+      publicPath: "/",
       filename: '[name].js',
       chunkFilename: 'chunks/[name].js',
     },
@@ -100,7 +101,14 @@ export function webpackConfigReact(): webpack.Configuration {
         {
           test: /\.s?css$/,
           use: [
-            isDevelopment ? "style-loader" : MiniCssExtractPlugin.loader,
+            {
+              // https://webpack.js.org/plugins/mini-css-extract-plugin/
+              loader: MiniCssExtractPlugin.loader,
+              options: {
+                hmr: isDevelopment, // fixme: doesn't work
+                reloadAll: true,
+              }
+            },
             {
               loader: "css-loader",
               options: {
@@ -127,13 +135,13 @@ export function webpackConfigReact(): webpack.Configuration {
     plugins: [
       new ForkTsCheckerPlugin(),
 
-      // detect circular dependencies
-      new CircularDependencyPlugin({
-        cwd: __dirname,
-        exclude: /node_modules/,
-        allowAsyncCycles: true,
-        failOnError: false,
-      }),
+      // todo: fix remain warnings about circular dependencies
+      // new CircularDependencyPlugin({
+      //   cwd: __dirname,
+      //   exclude: /node_modules/,
+      //   allowAsyncCycles: true,
+      //   failOnError: false,
+      // }),
 
       // todo: check if this actually works in mode=production files
       // new webpack.DllReferencePlugin({

yarn.lock

@@ -3535,7 +3535,7 @@ chokidar@^2.1.8:
   optionalDependencies:
     fsevents "^1.2.7"
 
-chokidar@^3.4.0:
+chokidar@^3.0.2, chokidar@^3.4.0:
   version "3.4.0"
   resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.4.0.tgz#b30611423ce376357c765b9b8f904b9fba3c0be8"
   integrity sha512-aXAaho2VJtisB/1fg1+3nlLJqGOuewTzQpd/Tz0yTg2R0e4IGtshYvtjowyEumcBv2z+y4+kc75Mz7j5xJskcQ==
@@ -4672,10 +4672,12 @@ electron-publish@22.7.0:
     lazy-val "^1.0.4"
     mime "^2.4.5"
 
-electron-serve@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/electron-serve/-/electron-serve-1.0.0.tgz#babf2f5022102fa300a841d91e4c2e7048ac4b1f"
-  integrity sha512-Rsm4tjj1eK7NUWKgGw6NjHkjfB+bIXZh0ztybUYzqmwCm1wzb7zv95LERbwricDZfCsKHB0V57NgVvHdi2OOAQ==
+electron-reload@^1.5.0:
+  version "1.5.0"
+  resolved "https://registry.yarnpkg.com/electron-reload/-/electron-reload-1.5.0.tgz#179ab1f6941fcf0ed261c37b16dc465e201348f5"
+  integrity sha512-L9X6LzsL3Bt2j0eJ4/MBrI9Vt902KvVUtBB7J4qrL1A9sXqC2fE0lpvUAlOThpJYh6zWO1l86U/YiEN9bDURHw==
+  dependencies:
+    chokidar "^3.0.2"
 
 electron-store@^5.2.0:
   version "5.2.0"