feat: package for electron-builder (resolves #16)

package.json

@@ -16,6 +16,9 @@
       "renderer/out"
     ]
   },
+  "workspaces": [
+    "packages/bruno-electron"
+  ],
   "dependencies": {
     "@fortawesome/fontawesome-svg-core": "^1.2.36",
     "@fortawesome/free-solid-svg-icons": "^5.15.4",

packages/bruno-electron/package.json

@@ -0,0 +1,31 @@
+{
+  "name": "@usebruno/bruno-electron",
+  "private": true,
+  "main": "src/index.js",
+  "scripts": {
+    "clean": "rimraf dist",
+    "start": "electron .",
+    "build": "next build renderer && next export renderer",
+    "pack-app": "npm run build && electron-builder --dir",
+    "dist": "npm run build && electron-builder"
+  },
+  "build": {
+    "asar": true,
+    "files": [
+      "main",
+      "renderer/out"
+    ]
+  },
+  "dependencies": {
+    "axios": "^0.26.0",
+    "electron-is-dev": "^2.0.0",
+    "electron-next": "^3.1.5",
+    "electron-util": "^0.17.2",
+    "form-data": "^4.0.0",
+    "lodash": "^4.17.21"
+  },
+  "devDependencies": {
+    "electron": "^17.1.0",
+    "electron-builder": "^22.14.13"
+  }
+}

packages/bruno-electron/readme.md

@@ -0,0 +1,6 @@
+# bruno-electron
+
+```bash
+# electron dev
+npm start
+```

packages/bruno-electron/src/index.js

@@ -0,0 +1,54 @@
+const path = require('path');
+const isDev = require('electron-is-dev');
+const prepareNext = require('electron-next');
+const { format } = require('url');
+const { BrowserWindow, app, Menu } = require('electron');
+const { setContentSecurityPolicy } = require('electron-util');
+
+const menuTemplate = require('./menu-template');
+const registerIpc = require('./ipc');
+
+setContentSecurityPolicy(`
+	default-src * 'unsafe-inline' 'unsafe-eval';
+	script-src * 'unsafe-inline' 'unsafe-eval';
+	connect-src * 'unsafe-inline';
+	base-uri 'none';
+	form-action 'none';
+	frame-ancestors 'none';
+`);
+
+const menu = Menu.buildFromTemplate(menuTemplate);
+Menu.setApplicationMenu(menu);
+
+let mainWindow;
+
+// Prepare the renderer once the app is ready
+app.on('ready', async () => {
+  await prepareNext('../../renderer');
+
+  mainWindow = new BrowserWindow({
+    width: 1280,
+    height: 768,
+    webPreferences: {
+      nodeIntegration: true,
+      contextIsolation: true,
+      preload: path.join(__dirname, "preload.js")
+    },
+  });
+
+  const url = isDev
+    ? 'http://localhost:8000'
+    : format({
+        pathname: path.join(__dirname, '../renderer/out/index.html'),
+        protocol: 'file:',
+        slashes: true
+      });
+
+  mainWindow.loadURL(url);
+
+  // register all ipc handlers
+  registerIpc(mainWindow);
+});
+
+// Quit the app once all windows are closed
+app.on('window-all-closed', app.quit);

packages/bruno-electron/src/ipc.js

@@ -0,0 +1,47 @@
+const axios = require('axios');
+const FormData = require('form-data');
+const { ipcMain } = require('electron');
+const { forOwn, extend } = require('lodash');
+
+
+const registerIpc = () => {
+  // handler for sending http request
+  ipcMain.handle('send-http-request', async (event, request) => {
+    try {
+      // make axios work in node using form data
+      // reference: https://github.com/axios/axios/issues/1006#issuecomment-320165427
+      if(request.headers && request.headers['content-type'] === 'multipart/form-data') {
+        const form = new FormData();
+        forOwn(request.data, (value, key) => {
+          form.append(key, value);
+        });
+        extend(request.headers, form.getHeaders());
+        request.data = form;
+      }
+
+      const result = await axios(request);
+
+      return {
+        status: result.status,
+        headers: result.headers,
+        data: result.data
+      };
+    } catch (error) {
+      if(error.response) {
+        return {
+          status: error.response.status,
+          headers: error.response.headers,
+          data: error.response.data
+        };
+      }
+
+      return {
+        status: -1,
+        headers: [],
+        data: null
+      };
+    }
+  });
+};
+
+module.exports = registerIpc;

packages/bruno-electron/src/menu-template.js

@@ -0,0 +1,55 @@
+const { ipcMain } = require('electron');
+
+const template = [
+  {
+    label: 'Collection',
+    submenu: [
+      {
+        label: 'Open Collection',
+        click () {
+          ipcMain.emit('main:open-collection');
+        }
+      },
+      { role: 'quit' }
+    ]
+  },
+  {
+     label: 'Edit',
+     submenu: [
+      { role: 'undo'},
+      { role: 'redo'},
+      { role: 'separator'},
+      { role: 'cut'},
+      { role: 'copy'},
+      { role: 'paste'}
+    ]
+  },
+  {
+     label: 'View',
+     submenu: [
+      { role: 'reload'},
+      { role: 'toggledevtools'},
+      { role: 'separator'},
+      { role: 'resetzoom'},
+      { role: 'zoomin'},
+      { role: 'zoomout'},
+      { role: 'separator'},
+      { role: 'togglefullscreen'}
+    ]
+  },
+  {
+     role: 'window',
+     submenu: [
+      { role: 'minimize'},
+      { role: 'close'}
+    ]
+  },
+  {
+    role: 'help',
+    submenu: [
+      { label: 'Learn More'}
+    ]
+  }
+];
+
+module.exports = template;

packages/bruno-electron/src/preload.js

@@ -0,0 +1,14 @@
+const { ipcRenderer, contextBridge } = require('electron');
+
+contextBridge.exposeInMainWorld('ipcRenderer', {
+  invoke: (channel, ...args) => ipcRenderer.invoke(channel, ...args),
+  on: (channel, handler) => {
+    // Deliberately strip event as it includes `sender` 
+    const subscription = (event, ...args) => handler(...args);
+    ipcRenderer.on(channel, subscription);
+
+    return () => {
+      ipcRenderer.removeListener(channel, subscription);
+    };
+  }
+});