Merge branch 'add-actions-to-linux-context-menu' into master

4 files changed, 63 insertions, 5 deletions

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 24b8cc0712..aaf0d94bd7 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -27,6 +27,10 @@ Line wrap the file at 100 chars.                                              Th
 ### Added
 #### Linux
 - Add support for WireGuard's kernel module if it's loaded.
+- Add tray context menu with actions.
+
+### Changed
+- Open and focus app when opened from context menu instead of toggling the window.
 
 ### Fixed
 - Stop resetting the firewall after an upgrade to not leak after an upgrade.
diff --git a/gui/src/main/index.ts b/gui/src/main/index.ts
index 4cab78b524..8d9bfb6e77 100644
--- a/gui/src/main/index.ts
+++ b/gui/src/main/index.ts
@@ -4,6 +4,7 @@ import log from 'electron-log';
 import mkdirp from 'mkdirp';
 import moment from 'moment';
 import * as path from 'path';
+import { sprintf } from 'sprintf-js';
 import * as uuid from 'uuid';
 import { hasExpired } from '../shared/account-expiry';
 import BridgeSettingsBuilder from '../shared/bridge-settings-builder';
@@ -88,6 +89,7 @@ class ApplicationMain {
     areSystemNotificationsEnabled: () => this.guiSettings.enableSystemNotifications,
   });
   private windowController?: WindowController;
+  private tray?: Tray;
   private trayIconController?: TrayIconController;
 
   private daemonRpc = new DaemonRpc(DAEMON_RPC_PATH);
@@ -358,6 +360,7 @@ class ApplicationMain {
     this.addContextMenu(window);
 
     this.windowController = windowController;
+    this.tray = tray;
 
     this.guiSettings.onChange = (newState, oldState) => {
       if (oldState.monochromaticIcon !== newState.monochromaticIcon) {
@@ -389,7 +392,7 @@ class ApplicationMain {
         this.setMacOsAppMenu();
         break;
       case 'linux':
-        this.installGenericMenubarAppWindowHandlers(tray, windowController);
+        this.setLinuxTrayContextMenu();
         this.installLinuxWindowCloseHandler(windowController);
         this.setLinuxAppMenu();
         window.setMenuBarVisibility(false);
@@ -619,6 +622,10 @@ class ApplicationMain {
     this.updateTrayIcon(newState, this.settings.blockWhenDisconnected);
     consumePromise(this.updateLocation());
 
+    if (process.platform === 'linux') {
+      this.setLinuxTrayContextMenu();
+    }
+
     this.notificationController.notifyTunnelState(
       newState,
       this.settings.blockWhenDisconnected,
@@ -1412,6 +1419,52 @@ class ApplicationMain {
     Menu.setApplicationMenu(Menu.buildFromTemplate(template));
   }
 
+  private setLinuxTrayContextMenu() {
+    const template: Electron.MenuItemConstructorOptions[] = [
+      {
+        label: sprintf(messages.pgettext('tray-icon-context-menu', 'Open %(mullvadVpn)s'), {
+          mullvadVpn: messages.pgettext('generic', 'Mullvad VPN'),
+        }),
+        click: () => this.windowController?.show(),
+      },
+      { type: 'separator' },
+      {
+        label: this.getLinuxContextMenuActionButtonLabel(),
+        click: () => {
+          if (this.tunnelState.state === 'disconnected') {
+            consumePromise(this.daemonRpc.connectTunnel());
+          } else {
+            consumePromise(this.daemonRpc.disconnectTunnel());
+          }
+        },
+      },
+      {
+        label: messages.gettext('Reconnect'),
+        enabled: this.tunnelState.state === 'connected' || this.tunnelState.state === 'connecting',
+        click: () => consumePromise(this.daemonRpc.reconnectTunnel()),
+      },
+    ];
+
+    this.tray?.setContextMenu(Menu.buildFromTemplate(template));
+  }
+
+  private getLinuxContextMenuActionButtonLabel() {
+    switch (this.tunnelState.state) {
+      case 'disconnected':
+        return messages.gettext('Connect');
+      case 'connecting':
+        return messages.gettext('Cancel');
+      case 'connected':
+        return messages.gettext('Disconnect');
+      case 'disconnecting':
+        return '';
+      case 'error':
+        return this.tunnelState.details.blockFailure
+          ? messages.gettext('Dismiss')
+          : messages.gettext('Cancel');
+    }
+  }
+
   private addContextMenu(window: BrowserWindow) {
     const menuTemplate: Electron.MenuItemConstructorOptions[] = [
       { role: 'cut' },
diff --git a/gui/src/renderer/components/TunnelControl.tsx b/gui/src/renderer/components/TunnelControl.tsx
index 611c24d78e..a36e5b9486 100644
--- a/gui/src/renderer/components/TunnelControl.tsx
+++ b/gui/src/renderer/components/TunnelControl.tsx
@@ -97,19 +97,19 @@ export default class TunnelControl extends React.Component<ITunnelControlProps>
 
     const Disconnect = (props: React.ComponentProps<typeof AppButton.RedTransparentButton>) => (
       <AppButton.RedTransparentButton onClick={this.props.onDisconnect} {...props}>
-        {messages.pgettext('tunnel-control', 'Disconnect')}
+        {messages.gettext('Disconnect')}
       </AppButton.RedTransparentButton>
     );
 
     const Cancel = (props: React.ComponentProps<typeof AppButton.RedTransparentButton>) => (
       <AppButton.RedTransparentButton onClick={this.props.onDisconnect} {...props}>
-        {messages.pgettext('tunnel-control', 'Cancel')}
+        {messages.gettext('Cancel')}
       </AppButton.RedTransparentButton>
     );
 
     const Dismiss = (props: React.ComponentProps<typeof AppButton.RedTransparentButton>) => (
       <AppButton.RedTransparentButton onClick={this.props.onDisconnect} {...props}>
-        {messages.pgettext('tunnel-control', 'Dismiss')}
+        {messages.gettext('Dismiss')}
       </AppButton.RedTransparentButton>
     );
 
diff --git a/gui/src/shared/localization-contexts.ts b/gui/src/shared/localization-contexts.ts
index 73cdfed11b..32d591b7a4 100644
--- a/gui/src/shared/localization-contexts.ts
+++ b/gui/src/shared/localization-contexts.ts
@@ -28,4 +28,5 @@ export type LocalizationContexts =
   | 'split-tunneling-view'
   | 'split-tunneling-nav'
   | 'support-view'
-  | 'select-language-nav';
+  | 'select-language-nav'
+  | 'tray-icon-context-menu';