refactor: Move platform-specific logic for shortcut keys into common location.

4 files changed, 23 insertions, 17 deletions

diff --git a/src/components/layout/Sidebar.js b/src/components/layout/Sidebar.js
index a6f5adce8..a3dbc3539 100644
--- a/src/components/layout/Sidebar.js
+++ b/src/components/layout/Sidebar.js
@@ -6,7 +6,7 @@ import { inject, observer } from 'mobx-react';
 import { Link } from 'react-router';
 
 import Tabbar from '../services/tabs/Tabbar';
-import { ctrlKey, shiftKey, settingsShortcutKey } from '../../environment';
+import { settingsShortcutKey, lockFerdiShortcutKey, todosToggleShortcutKey, workspaceToggleShortcutKey, addNewServiceShortcutKey, muteFerdiShortcutKey } from '../../environment';
 import { workspaceStore } from '../../features/workspaces';
 import { todosStore } from '../../features/todos';
 import { todoActions } from '../../features/todos/actions';
@@ -148,7 +148,7 @@ export default @inject('stores', 'actions') @observer class Sidebar extends Comp
                     },
                   });
                 }}
-                data-tip={`${intl.formatMessage(messages.lockFerdi)} (${ctrlKey}+${shiftKey}+L)`}
+                data-tip={`${intl.formatMessage(messages.lockFerdi)} (${lockFerdiShortcutKey(false)})`}
               >
                 <i className="mdi mdi-lock" />
               </button>
@@ -162,7 +162,7 @@ export default @inject('stores', 'actions') @observer class Sidebar extends Comp
                 }}
                 disabled={isTodosServiceActive}
                 className={`sidebar__button sidebar__button--todos ${todosStore.isTodosPanelVisible ? 'is-active' : ''}`}
-                data-tip={`${intl.formatMessage(todosToggleMessage)} (${ctrlKey}+T)`}
+                data-tip={`${intl.formatMessage(todosToggleMessage)} (${todosToggleShortcutKey(false)})`}
               >
                 <i className="mdi mdi-check-all" />
               </button>
@@ -175,7 +175,7 @@ export default @inject('stores', 'actions') @observer class Sidebar extends Comp
                   this.updateToolTip();
                 }}
                 className={`sidebar__button sidebar__button--workspaces ${isWorkspaceDrawerOpen ? 'is-active' : ''}`}
-                data-tip={`${intl.formatMessage(workspaceToggleMessage)} (${ctrlKey}+D)`}
+                data-tip={`${intl.formatMessage(workspaceToggleMessage)} (${workspaceToggleShortcutKey(false)})`}
               >
                 <i className="mdi mdi-view-grid" />
               </button>
@@ -187,7 +187,7 @@ export default @inject('stores', 'actions') @observer class Sidebar extends Comp
                 this.updateToolTip();
               }}
               className={`sidebar__button sidebar__button--audio ${isAppMuted ? 'is-muted' : ''}`}
-              data-tip={`${intl.formatMessage(isAppMuted ? messages.unmute : messages.mute)} (${ctrlKey}+${shiftKey}+M)`}
+              data-tip={`${intl.formatMessage(isAppMuted ? messages.unmute : messages.mute)} (${muteFerdiShortcutKey(false)})`}
             >
               <i className={`mdi mdi-bell${isAppMuted ? '-off' : ''}`} />
             </button>
@@ -195,7 +195,7 @@ export default @inject('stores', 'actions') @observer class Sidebar extends Comp
               type="button"
               onClick={() => openSettings({ path: 'recipes' })}
               className="sidebar__button sidebar__button--new-service"
-              data-tip={`${intl.formatMessage(messages.addNewService)} (${ctrlKey}+N)`}
+              data-tip={`${intl.formatMessage(messages.addNewService)} (${addNewServiceShortcutKey(false)})`}
             >
               <i className="mdi mdi-plus-box" />
             </button>
diff --git a/src/components/settings/settings/EditSettingsForm.js b/src/components/settings/settings/EditSettingsForm.js
index a4381e37d..87a4ada27 100644
--- a/src/components/settings/settings/EditSettingsForm.js
+++ b/src/components/settings/settings/EditSettingsForm.js
@@ -1,5 +1,5 @@
 import { app, systemPreferences } from '@electron/remote';
-import React, { Component, Fragment } from 'react';
+import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import { observer } from 'mobx-react';
 import prettyBytes from 'pretty-bytes';
@@ -16,7 +16,7 @@ import {
   FRANZ_TRANSLATION,
   GITHUB_FRANZ_URL,
 } from '../../../config';
-import { cmdKey, shiftKey, DEFAULT_APP_SETTINGS, isMac, isWindows } from '../../../environment';
+import { DEFAULT_APP_SETTINGS, isMac, isWindows, lockFerdiShortcutKey } from '../../../environment';
 import globalMessages from '../../../i18n/globalMessages';
 
 const messages = defineMessages({
@@ -548,7 +548,7 @@ export default @observer class EditSettingsForm extends Component {
                   }}
                 >
                   <span>
-                    { intl.formatMessage(messages.lockInfo, { lockShortcut: `${cmdKey}+${shiftKey}+L` }) }
+                    { intl.formatMessage(messages.lockInfo, { lockShortcut: `${lockFerdiShortcutKey(false)}` }) }
                   </span>
                 </p>
               </div>
diff --git a/src/environment.js b/src/environment.js
index 923754048..39b854db4 100644
--- a/src/environment.js
+++ b/src/environment.js
@@ -82,7 +82,13 @@ export const altKey = isMac ? '⌥' : 'Alt';
 export const shiftKey = isMac ? '⇧' : 'Shift';
 
 // Platform specific shortcut keys
-export const settingsShortcutKey = (isAccelerator = true) => `${isAccelerator ? cmdKey : ctrlKey}+${isMac ? ',' : 'P'}`;
+const shortcutKey = (isAccelerator) => `${isAccelerator ? cmdKey : ctrlKey}`;
+export const lockFerdiShortcutKey = (isAccelerator = true) => `${shortcutKey(isAccelerator)}+${shiftKey}+L`;
+export const todosToggleShortcutKey = (isAccelerator = true) => `${shortcutKey(isAccelerator)}+T`;
+export const workspaceToggleShortcutKey = (isAccelerator = true) => `${shortcutKey(isAccelerator)}+D`;
+export const muteFerdiShortcutKey = (isAccelerator = true) => `${shortcutKey(isAccelerator)}+${shiftKey}+M`;
+export const addNewServiceShortcutKey = (isAccelerator = true) => `${shortcutKey(isAccelerator)}+N`;
+export const settingsShortcutKey = (isAccelerator = true) => `${shortcutKey(isAccelerator)}+${isMac ? ',' : 'P'}`;
 
 let api;
 let wsApi;
diff --git a/src/lib/Menu.js b/src/lib/Menu.js
index e8d3e79b4..21133bfde 100644
--- a/src/lib/Menu.js
+++ b/src/lib/Menu.js
@@ -6,7 +6,7 @@ import { autorun, observable } from 'mobx';
 import { defineMessages } from 'react-intl';
 import { CUSTOM_WEBSITE_RECIPE_ID, GITHUB_FERDI_URL, LIVE_API_FERDI_WEBSITE } from '../config';
 import {
-  cmdKey, altKey, shiftKey, settingsShortcutKey, isLinux, isMac, aboutAppDetails,
+  cmdKey, altKey, shiftKey, settingsShortcutKey, isLinux, isMac, aboutAppDetails, lockFerdiShortcutKey, todosToggleShortcutKey, workspaceToggleShortcutKey, addNewServiceShortcutKey, muteFerdiShortcutKey,
 } from '../environment';
 import { announcementsStore } from '../features/announcements';
 import { announcementActions } from '../features/announcements/actions';
@@ -668,7 +668,7 @@ export default class FranzMenu {
         type: 'separator',
       }, {
         label: intl.formatMessage(menuItems.lockFerdi),
-        accelerator: `${cmdKey}+${shiftKey}+L`,
+        accelerator: `${lockFerdiShortcutKey()}`,
         enabled: this.stores.user.isLoggedIn && this.stores.settings.app.lockingFeatureEnabled,
         click() {
           actions.settings.update({
@@ -696,7 +696,7 @@ export default class FranzMenu {
 
       tpl[0].submenu.unshift({
         label: intl.formatMessage(menuItems.touchId),
-        accelerator: `${cmdKey}+${shiftKey}+L`,
+        accelerator: `${lockFerdiShortcutKey()}`,
         visible: touchIdEnabled,
         click() {
           systemPreferences.promptTouchID(intl.formatMessage(menuItems.touchIdPrompt)).then(() => {
@@ -875,7 +875,7 @@ export default class FranzMenu {
 
     menu.push({
       label: intl.formatMessage(menuItems.addNewService),
-      accelerator: `${cmdKey}+N`,
+      accelerator: `${addNewServiceShortcutKey()}`,
       click: () => {
         this.actions.ui.openSettings({ path: 'recipes' });
       },
@@ -905,7 +905,7 @@ export default class FranzMenu {
       label: intl.formatMessage(
         settings.all.app.isAppMuted ? menuItems.unmuteApp : menuItems.muteApp,
       ).replace('&', '&&'),
-      accelerator: `${cmdKey}+${shiftKey}+m`,
+      accelerator: `${muteFerdiShortcutKey()}`,
       click: () => this.actions.app.toggleMuteApp(),
     }, {
       type: 'separator',
@@ -960,7 +960,7 @@ export default class FranzMenu {
       );
       menu.push({
         label: intl.formatMessage(drawerLabel),
-        accelerator: `${cmdKey}+D`,
+        accelerator: `${workspaceToggleShortcutKey()}`,
         click: () => {
           workspaceActions.toggleWorkspaceDrawer();
         },
@@ -1006,7 +1006,7 @@ export default class FranzMenu {
 
     menu.push({
       label: intl.formatMessage(drawerLabel),
-      accelerator: `${cmdKey}+T`,
+      accelerator: `${todosToggleShortcutKey()}`,
       click: () => {
         todoActions.toggleTodosPanel();
       },