chore: improve logging when installing dev extensions (#2649)

* chore: improve logging when installing dev extensions

* prevent error if no extensions are installed (not actually possible)

* use node:path to get extensions directory

* log message in case of error

Author: eglitise

app/electron/main/debug.js

@@ -1,12 +1,46 @@
-import {installExtension, REACT_DEVELOPER_TOOLS, REDUX_DEVTOOLS} from 'electron-devtools-installer';
+import {join} from 'node:path';
+
+import {
+  installExtension,
+  REACT_DEVELOPER_TOOLS,
+  REDUX_DEVTOOLS,
+} from '@tomjs/electron-devtools-installer';
+
+const EXTENSIONS_TO_INSTALL = [REACT_DEVELOPER_TOOLS, REDUX_DEVTOOLS];
+
+// These console.log wrappers are used for better visual separation from other logs
+
+function logEmptyLine() {
+  console.log(''); // eslint-disable-line no-console
+}
+
+function logWithExtPrefix(textString) {
+  console.log(`[🧩 Extensions 🧩] ${textString}`); // eslint-disable-line no-console
+}
 
 export async function installExtensions() {
   const opts = {
     forceDownload: !!process.env.UPGRADE_EXTENSIONS,
   };
+  logEmptyLine();
+  logWithExtPrefix('Installing development extensions...');
+  logWithExtPrefix(
+    opts.forceDownload
+      ? 'Explicitly re-downloading all extensions'
+      : 'Set UPGRADE_EXTENSIONS=1 to force re-download',
+  );
   try {
-    await installExtension([REACT_DEVELOPER_TOOLS, REDUX_DEVTOOLS], opts);
+    const installedExts = await installExtension(EXTENSIONS_TO_INSTALL, opts);
+    if (installedExts.length === 0) {
+      logWithExtPrefix('No extensions were installed');
+    } else {
+      logWithExtPrefix(`Installed extensions at ${join(installedExts[0].path, '..')}:`);
+      for (const ext of installedExts) {
+        logWithExtPrefix(`* ${ext.name} v${ext.version} (ID: ${ext.id})`);
+      }
+    }
   } catch (e) {
-    console.warn(`Error installing extension: ${e}`); // eslint-disable-line no-console
+    logWithExtPrefix(`Error installing extensions: ${e.message}`);
   }
+  logEmptyLine();
 }

package-lock.json

@@ -99,6 +99,7 @@
     "@appium/fake-driver": "6.0.2",
     "@appium/support": "7.0.5",
     "@eslint-react/eslint-plugin": "2.12.4",
+    "@tomjs/electron-devtools-installer": "4.0.1",
     "@types/lodash": "4.17.23",
     "@types/react": "19.2.13",
     "@types/react-dom": "19.2.3",
@@ -107,7 +108,6 @@
     "babel-plugin-react-compiler": "1.0.0",
     "electron": "40.2.1",
     "electron-builder": "26.7.0",
-    "electron-devtools-installer": "4.0.0",
     "electron-vite": "5.0.0",
     "eslint": "9.39.2",
     "eslint-plugin-react-hooks": "7.0.1",