Add ApplicationMenu

package.json

@@ -1,12 +1,27 @@
 {
   "name": "thedesk-vue",
+  "productName": "TheDesk Vue",
   "version": "0.1.0",
   "description": "TheDesk is a Mastodon client for PC.",
   "private": true,
   "license": "GPL-3.0",
-  "repository": {
+  "repository": "github:kPherox/TheDesk-Vue",
-    "url": "https://github.com/kPherox/TheDesk-Vue"
+  "bugs": {
+    "url": "https://github.com/kPherox/TheDesk-Vue/issues"
   },
+  "homepage": "https://github.com/kPherox/TheDesk-Vue",
+  "author": {
+    "name": "Cutls",
+    "url": "https://kirishima.clooud/@Cutls",
+    "email": "web-pro@cutls.com"
+  },
+  "contributors": [
+    {
+      "name": "kPherox",
+      "url": "https://www.kr-kp.com/",
+      "email": "admin@mail.kr-kp.com"
+    }
+  ],
   "scripts": {
     "serve": "vue-cli-service serve",
     "build": "vue-cli-service build",
@@ -35,6 +50,9 @@
     "vue-cli-plugin-electron-builder": "^1.2.0",
     "vue-template-compiler": "^2.5.21"
   },
+  "dev_kpherox": {
+    "document": "https://github.com/kPherox/TheDesk-Vue#readme"
+  },
   "eslintConfig": {
     "root": true,
     "env": {

src/background.js

@@ -1,12 +1,19 @@
 'use strict'
 
-import { app, protocol, BrowserWindow } from 'electron'
-import contextMenu from 'electron-context-menu'
 import path from 'path'
+import {
+  app,
+  protocol,
+  shell,
+  BrowserWindow,
+  Menu
+} from 'electron'
+import ContextMenu from 'electron-context-menu'
 import {
   createProtocol,
   installVueDevtools
 } from 'vue-cli-plugin-electron-builder/lib'
+import PackageJson from "../package.json"
 
 const isDevelopment = process.env.NODE_ENV !== 'production'
 
@@ -14,10 +21,11 @@ const isDevelopment = process.env.NODE_ENV !== 'production'
 // be closed automatically when the JavaScript object is garbage collected.
 let win
 
-contextMenu()
+ContextMenu()
 
 // Standard scheme must be registered before the app is ready
 protocol.registerStandardSchemes(['app'], { secure: true })
+
 function createWindow () {
   // Create the browser window.
   win = new BrowserWindow({
@@ -26,6 +34,8 @@ function createWindow () {
       icon: path.join(__static, 'icon.png')
     })
 
+  win.setMenuBarVisibility(true)
+
   if (process.env.WEBPACK_DEV_SERVER_URL) {
     // Load the url of the dev server if in development mode
     win.loadURL(process.env.WEBPACK_DEV_SERVER_URL)
@@ -87,3 +97,91 @@ if (isDevelopment) {
     })
   }
 }
+
+const template = [
+  {
+    label: app.getName(),
+    submenu: [
+      { role: 'about' },
+    ]
+  },
+  {
+    label: 'Edit',
+    submenu: [
+      { role: 'undo' },
+      { role: 'redo' },
+      { type: 'separator' },
+      { role: 'cut' },
+      { role: 'copy' },
+      { role: 'paste' },
+      { role: 'pasteandmatchstyle' },
+      { role: 'delete' },
+      { role: 'selectall' }
+    ]
+  },
+  {
+    label: 'View',
+    submenu: [
+      { role: 'reload' },
+      { role: 'forcereload' },
+      { role: 'toggledevtools' },
+      { type: 'separator' },
+      { role: 'togglefullscreen' }
+    ]
+  },
+  {
+    role: 'Window',
+    submenu: [
+      { role: 'minimize' },
+      { role: 'close' }
+    ]
+  },
+  {
+    role: 'help',
+    submenu: [
+      {
+        label: 'Report an issue',
+        click () { shell.openExternal(`${PackageJson.bugs.url}/new`) }
+      },
+      {
+        label: 'Learn More',
+        click () { shell.openExternal(PackageJson.dev_kpherox.document) }
+      }
+    ]
+  }
+]
+
+if (process.platform === 'darwin') {
+  template[0].submenu.push(
+    { type: 'separator' },
+    { role: 'services' },
+    { type: 'separator' },
+    { role: 'hide' },
+    { role: 'hideothers' },
+    { role: 'unhide' },
+    { type: 'separator' },
+    { role: 'quit' }
+  )
+
+  template[1].submenu.push(
+    { type: 'separator' },
+    {
+      label: 'Speech',
+      submenu: [
+        { role: 'startspeaking' },
+        { role: 'stopspeaking' }
+      ]
+    }
+  )
+
+  template[3].submenu = [
+    { role: 'close' },
+    { role: 'minimize' },
+    { role: 'zoom' },
+    { type: 'separator' },
+    { role: 'front' }
+  ]
+}
+
+const menu = Menu.buildFromTemplate(template)
+Menu.setApplicationMenu(menu)

vue.config.js

@@ -12,7 +12,6 @@ module.exports = {
   pluginOptions: {
     electronBuilder: {
       builderOptions: {
-        productName: "TheDesk Vue",
         appId: "dev.kpherox.thedesk-vue",
         win: {
           "target": [