now configuring our own window!

app/electron/main.js

@@ -3,6 +3,7 @@ const {
   BrowserWindow,
   session
 } = require("electron");
+const MenuBuilder = require("./menu");
 const path = require("path");
 const isDev = process.env.NODE_ENV === "development";
 const port = 40992; // Hardcoded; needs to match webpack.development.js and package.json
@@ -24,6 +25,8 @@ const installExtensions = async () => {
 // Keep a global reference of the window object, if you don"t, the window will
 // be closed automatically when the JavaScript object is garbage collected.
 let win;
+let menuBuilder;
+
 
 async function createWindow() {
   if (isDev){
@@ -80,6 +83,9 @@ async function createWindow() {
       callback(false); // Deny
     }
   });
+
+  menuBuilder = MenuBuilder(win);
+  menuBuilder.buildMenu();
 }
 
 // This method will be called when Electron has finished

app/electron/menu.js

@@ -0,0 +1,213 @@
+const electron = require("electron");
+const Menu = electron.Menu;
+const MenuItem = electron.MenuItem;
+const BrowserWindow = electron.BrowserWindow;
+const isMac = process.platform === "darwin";
+
+var MenuBuilder = function (mainWindow) {
+
+  let setupDevelopmentEnvironment = function () {
+    mainWindow.webContents.on("context-menu", (e, props) => {
+      const {
+        x,
+        y
+      } = props;
+
+      Menu.buildFromTemplate([{
+        label: "Inspect element",
+        click: () => {
+          mainWindow.inspectElement(x, y);
+        }
+      }]).popup(mainWindow);
+    });
+  }
+
+  // https://electronjs.org/docs/api/menu#main-process
+  let defaultTemplate = function() {
+    return [
+      // { role: "appMenu" }
+      ...(isMac ? [{
+        label: app.name,
+        submenu: [{
+            role: "about"
+          },
+          {
+            type: "separator"
+          },
+          {
+            role: "services"
+          },
+          {
+            type: "separator"
+          },
+          {
+            role: "hide"
+          },
+          {
+            role: "hideothers"
+          },
+          {
+            role: "unhide"
+          },
+          {
+            type: "separator"
+          },
+          {
+            role: "quit"
+          }
+        ]
+      }] : []),
+      // { role: "fileMenu" }
+      {
+        label: "File",
+        submenu: [
+          isMac ? {
+            role: "close"
+          } : {
+            role: "quit"
+          }
+        ]
+      },
+      // { role: "editMenu" }
+      {
+        label: "Edit",
+        submenu: [{
+            role: "undo"
+          },
+          {
+            role: "redo"
+          },
+          {
+            type: "separator"
+          },
+          {
+            role: "cut"
+          },
+          {
+            role: "copy"
+          },
+          {
+            role: "paste"
+          },
+          ...(isMac ? [{
+              role: "pasteAndMatchStyle"
+            },
+            {
+              role: "delete"
+            },
+            {
+              role: "selectAll"
+            },
+            {
+              type: "separator"
+            },
+            {
+              label: "Speech",
+              submenu: [{
+                  role: "startspeaking"
+                },
+                {
+                  role: "stopspeaking"
+                }
+              ]
+            }
+          ] : [{
+              role: "delete"
+            },
+            {
+              type: "separator"
+            },
+            {
+              role: "selectAll"
+            }
+          ])
+        ]
+      },
+      // { role: "viewMenu" }
+      {
+        label: "View",
+        submenu: [{
+            role: "reload"
+          },
+          {
+            role: "forcereload"
+          },
+          {
+            role: "toggledevtools"
+          },
+          {
+            type: "separator"
+          },
+          {
+            role: "resetzoom"
+          },
+          {
+            role: "zoomin"
+          },
+          {
+            role: "zoomout"
+          },
+          {
+            type: "separator"
+          },
+          {
+            role: "togglefullscreen"
+          }
+        ]
+      },
+      // { role: "windowMenu" }
+      {
+        label: "Window",
+        submenu: [{
+            role: "minimize"
+          },
+          {
+            role: "zoom"
+          },
+          ...(isMac ? [{
+              type: "separator"
+            },
+            {
+              role: "front"
+            },
+            {
+              type: "separator"
+            },
+            {
+              role: "window"
+            }
+          ] : [{
+            role: "close"
+          }])
+        ]
+      },
+      {
+        role: "help",
+        submenu: [{
+          label: "Learn More",
+          click: async () => {
+            const {
+              shell
+            } = require("electron")
+            await shell.openExternal("https://electronjs.org")
+          }
+        }]
+      }
+    ]
+  }
+
+  return {
+    buildMenu: function () {
+      if (process.env.NODE_ENV === "development") {
+        setupDevelopmentEnvironment();
+      }
+
+      const menu = Menu.buildFromTemplate(defaultTemplate());
+      Menu.setApplicationMenu(menu);
+
+      return menu;
+    }
+  }
+}
+
+module.exports = MenuBuilder;