Replace 'remote' with 'electron/remote' (#1448)

* Locked new version of 'recipes' submodule with corresponding changes.

43 files changed, 376 insertions, 422 deletions

diff --git a/package-lock.json b/package-lock.json
index e209f62a4..11256f0ed 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3730,6 +3730,11 @@
         }
       }
     },
+    "@electron/remote": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@electron/remote/-/remote-1.1.0.tgz",
+      "integrity": "sha512-yr8gZTkIgJYKbFqExI4QZqMSjn1kL/us9Dl46+TH1EZdhgRtsJ6HDfdsIxu0QEc6Hv+DMAXs69rgquH+8FDk4w=="
+    },
     "@electron/universal": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/@electron/universal/-/universal-1.0.5.tgz",
@@ -15259,11 +15264,6 @@
         "hunspell-asm": "^4.0.2"
       }
     },
-    "electron-is-dev": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/electron-is-dev/-/electron-is-dev-1.1.0.tgz",
-      "integrity": "sha512-Z1qA/1oHNowGtSBIcWk0pcLEqYT/j+13xUw/MYOrBUOL4X7VN0i0KCTf5SqyvMPmW5pSPKbo28wkxMxzZ20YnQ=="
-    },
     "electron-notarize": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/electron-notarize/-/electron-notarize-1.0.0.tgz",
@@ -31451,9 +31451,9 @@
       }
     },
     "react": {
-      "version": "16.12.0",
-      "resolved": "https://registry.npmjs.org/react/-/react-16.12.0.tgz",
-      "integrity": "sha512-fglqy3k5E+81pA8s+7K0/T3DBCF0ZDOher1elBFzF7O6arXJgzyu/FW+COxFvAWXJoJN9KIZbT2LXlukwphYTA==",
+      "version": "16.14.0",
+      "resolved": "https://registry.npmjs.org/react/-/react-16.14.0.tgz",
+      "integrity": "sha512-0X2CImDkJGApiAlcf0ODKIneSwBPhqJawOa5wCtKbu7ZECrmS26NvtSILynQ66cgkT/RJ4LidJOc3bUESwmU8g==",
       "requires": {
         "loose-envify": "^1.1.0",
         "object-assign": "^4.1.1",
diff --git a/package.json b/package.json
index 3bfbf1125..12739eedf 100644
--- a/package.json
+++ b/package.json
@@ -61,6 +61,7 @@
     "@adonisjs/validator": "5.0.6",
     "@babel/polyfill": "7.7.0",
     "@babel/runtime": "7.7.4",
+    "@electron/remote": "1.1.0",
     "@mdi/js": "4.6.95",
     "@meetfranz/electron-notification-state": "1.0.0",
     "@meetfranz/forms": "file:packages/forms",
@@ -81,7 +82,6 @@
     "electron-fetch": "1.7.3",
     "electron-find": "1.0.6",
     "electron-hunspell": "1.1.2",
-    "electron-is-dev": "1.1.0",
     "electron-react-titlebar": "0.8.2",
     "electron-updater": "4.3.9",
     "electron-util": "0.16.0",
@@ -111,7 +111,7 @@
     "os-name": "4.0.0",
     "pretty-bytes": "^5.6.0",
     "prop-types": "^15.5.10",
-    "react": "16.12.0",
+    "react": "16.14.0",
     "react-addons-css-transition-group": "15.6.2",
     "react-confetti": "3.1.0",
     "react-dom": "^16.14.0",
diff --git a/recipes b/recipes
-Subproject fb98432857928b7c26a196fc2b9020c3a90531d
+Subproject e05d27ea49929e763906e6c430ec79c1a093dde
diff --git a/src/api/server/LocalApi.js b/src/api/server/LocalApi.js
index cc8035523..4b1f03f22 100644
--- a/src/api/server/LocalApi.js
+++ b/src/api/server/LocalApi.js
@@ -1,12 +1,11 @@
-import { ipcRenderer, remote } from 'electron';
+import { ipcRenderer } from 'electron';
+import { session } from '@electron/remote';
 import du from 'du';
 
 import { getServicePartitionsDirectory } from '../../helpers/service-helpers.js';
 
 const debug = require('debug')('Ferdi:LocalApi');
 
-const { session } = remote;
-
 export default class LocalApi {
   // Settings
   getAppSettings(type) {
diff --git a/src/api/server/ServerApi.js b/src/api/server/ServerApi.js
index 627425948..5fd5268ce 100644
--- a/src/api/server/ServerApi.js
+++ b/src/api/server/ServerApi.js
@@ -2,7 +2,7 @@ import os from 'os';
 import path from 'path';
 import tar from 'tar';
 import fs from 'fs-extra';
-import { remote } from 'electron';
+import { app, require as remoteRequire } from '@electron/remote';
 
 import ServiceModel from '../../models/Service';
 import RecipePreviewModel from '../../models/RecipePreview';
@@ -35,8 +35,7 @@ module.paths.unshift(
   getRecipeDirectory(),
 );
 
-const { app } = remote;
-const { default: fetch } = remote.require('electron-fetch');
+const { default: fetch } = remoteRequire('electron-fetch');
 
 export default class ServerApi {
   recipePreviews = [];
diff --git a/src/api/utils/auth.js b/src/api/utils/auth.js
index 6dbdeaa7f..5952cfe11 100644
--- a/src/api/utils/auth.js
+++ b/src/api/utils/auth.js
@@ -1,8 +1,6 @@
-import { remote } from 'electron';
+import { app } from '@electron/remote';
 import localStorage from 'mobx-localstorage';
 
-const { app } = remote;
-
 export const prepareAuthRequest = (options = { method: 'GET' }, auth = true) => {
   const request = Object.assign(options, {
     mode: 'cors',
diff --git a/src/components/auth/Locked.js b/src/components/auth/Locked.js
index c5e8a5aad..1fdbea595 100644
--- a/src/components/auth/Locked.js
+++ b/src/components/auth/Locked.js
@@ -1,4 +1,4 @@
-import { remote } from 'electron';
+import { systemPreferences } from '@electron/remote';
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import { observer } from 'mobx-react';
@@ -12,10 +12,6 @@ import { isMac } from '../../environment';
 
 import { globalError as globalErrorPropType } from '../../prop-types';
 
-const {
-  systemPreferences,
-} = remote;
-
 const messages = defineMessages({
   headline: {
     id: 'locked.headline',
diff --git a/src/components/services/tabs/TabItem.js b/src/components/services/tabs/TabItem.js
index 24bbe7939..d4714a809 100644
--- a/src/components/services/tabs/TabItem.js
+++ b/src/components/services/tabs/TabItem.js
@@ -1,4 +1,6 @@
-import { remote } from 'electron';
+import {
+  Menu, dialog, app, getCurrentWindow,
+} from '@electron/remote';
 import React, { Component } from 'react';
 import { defineMessages, intlShape } from 'react-intl';
 import PropTypes from 'prop-types';
@@ -14,8 +16,6 @@ import { ctrlKey, cmdKey } from '../../../environment';
 
 const IS_SERVICE_DEBUGGING_ENABLED = (localStorage.getItem('debug') || '').includes('Ferdi:Service');
 
-const { Menu, dialog, app } = remote;
-
 const messages = defineMessages({
   reload: {
     id: 'tabs.item.reload',
@@ -236,7 +236,7 @@ const styles = {
           'is-disabled': !service.isEnabled,
         })}
         onClick={clickHandler}
-        onContextMenu={() => menu.popup(remote.getCurrentWindow())}
+        onContextMenu={() => menu.popup(getCurrentWindow())}
         data-tip={`${service.name} ${shortcutIndex <= 9 ? `(${ctrlKey}+${shortcutIndex})` : ''}`}
       >
         <img
diff --git a/src/components/settings/settings/EditSettingsForm.js b/src/components/settings/settings/EditSettingsForm.js
index eef529730..28f456608 100644
--- a/src/components/settings/settings/EditSettingsForm.js
+++ b/src/components/settings/settings/EditSettingsForm.js
@@ -1,4 +1,4 @@
-import { remote } from 'electron';
+import { app, systemPreferences } from '@electron/remote';
 import React, { Component, Fragment } from 'react';
 import PropTypes from 'prop-types';
 import { observer } from 'mobx-react';
@@ -19,10 +19,6 @@ import {
 } from '../../../config';
 import { isMac, isWindows } from '../../../environment';
 
-const {
-  systemPreferences,
-} = remote;
-
 const messages = defineMessages({
   headline: {
     id: 'settings.app.headline',
@@ -665,7 +661,7 @@ export default @observer class EditSettingsForm extends Component {
               )}
               {intl.formatMessage(messages.currentVersion)}
               {' '}
-              {remote.app.getVersion()}
+              {app.getVersion()}
               {noUpdateAvailable && (
               <>
                 <br />
diff --git a/src/components/settings/supportFerdi/SupportFerdiDashboard.js b/src/components/settings/supportFerdi/SupportFerdiDashboard.js
index f6fc7c171..36c126565 100644
--- a/src/components/settings/supportFerdi/SupportFerdiDashboard.js
+++ b/src/components/settings/supportFerdi/SupportFerdiDashboard.js
@@ -1,10 +1,8 @@
 import React, { Component } from 'react';
 import { defineMessages, FormattedHTMLMessage, intlShape } from 'react-intl';
-import { remote } from 'electron';
+import { BrowserWindow } from '@electron/remote';
 import InfoBar from '../../ui/InfoBar';
 
-const { BrowserWindow } = remote;
-
 const messages = defineMessages({
   headline: {
     id: 'settings.supportFerdi.headline',
diff --git a/src/config.js b/src/config.js
index ecd1aa316..127dcd2dc 100644
--- a/src/config.js
+++ b/src/config.js
@@ -1,12 +1,9 @@
-import electron from 'electron';
-import isDevMode from 'electron-is-dev';
 import ms from 'ms';
 import path from 'path';
 import { DEFAULT_ACCENT_COLOR } from '@meetfranz/theme';
 import { asarPath } from './helpers/asar-helpers';
 
-const app = process.type === 'renderer' ? electron.remote.app : electron.app;
-const nativeTheme = process.type === 'renderer' ? electron.remote.nativeTheme : electron.nativeTheme;
+const { app, nativeTheme } = process.type === 'renderer' ? require('@electron/remote') : require('electron');
 
 export const CHECK_INTERVAL = ms('1h'); // How often should we perform checks
 
@@ -199,6 +196,7 @@ if (process.env.FERDI_APPDATA_DIR != null) {
   app.setPath('userData', path.join(app.getPath('appData'), app.name));
 }
 
+export const isDevMode = !app.isPackaged;
 if (isDevMode) {
   app.setPath('userData', path.join(app.getPath('appData'), `${app.name}Dev`));
 }
diff --git a/src/containers/settings/RecipesScreen.js b/src/containers/settings/RecipesScreen.js
index 40e32ff37..74abcacee 100644
--- a/src/containers/settings/RecipesScreen.js
+++ b/src/containers/settings/RecipesScreen.js
@@ -1,4 +1,5 @@
-import { remote, shell } from 'electron';
+import { shell } from 'electron';
+import { app } from '@electron/remote';
 import fs from 'fs-extra';
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
@@ -17,8 +18,6 @@ import { FRANZ_DEV_DOCS, RECIPES_PATH } from '../../config';
 import { communityRecipesStore } from '../../features/communityRecipes';
 import RecipePreview from '../../models/RecipePreview';
 
-const { app } = remote;
-
 export default @inject('stores', 'actions') @observer class RecipesScreen extends Component {
   static propTypes = {
     params: PropTypes.shape({
diff --git a/src/containers/subscription/SubscriptionFormScreen.js b/src/containers/subscription/SubscriptionFormScreen.js
index 38e46a7ba..2d1f3d0eb 100644
--- a/src/containers/subscription/SubscriptionFormScreen.js
+++ b/src/containers/subscription/SubscriptionFormScreen.js
@@ -1,5 +1,5 @@
 import React, { Component } from 'react';
-import { remote } from 'electron';
+import { BrowserWindow, getCurrentWindow } from '@electron/remote';
 import PropTypes from 'prop-types';
 import { inject, observer } from 'mobx-react';
 
@@ -8,8 +8,6 @@ import PaymentStore from '../../stores/PaymentStore';
 import SubscriptionForm from '../../components/subscription/SubscriptionForm';
 import TrialForm from '../../components/subscription/TrialForm';
 
-const { BrowserWindow } = remote;
-
 export default @inject('stores', 'actions') @observer class SubscriptionFormScreen extends Component {
   static propTypes = {
     onCloseWindow: PropTypes.func,
@@ -34,7 +32,7 @@ export default @inject('stores', 'actions') @observer class SubscriptionFormScre
     hostedPageURL = user.getAuthURL(hostedPageURL);
 
     const paymentWindow = new BrowserWindow({
-      parent: remote.getCurrentWindow(),
+      parent: getCurrentWindow(),
       modal: true,
       title: '🔒 Franz Supporter License',
       width: 800,
@@ -44,6 +42,8 @@ export default @inject('stores', 'actions') @observer class SubscriptionFormScre
       webPreferences: {
         nodeIntegration: true,
         webviewTag: true,
+        enableRemoteModule: true,
+        contextIsolation: false,
       },
     });
     paymentWindow.loadURL(`file://${__dirname}/../../index.html#/payment/${encodeURIComponent(hostedPageURL)}`);
diff --git a/src/electron/webview-ime-focus.js b/src/electron/webview-ime-focus.js
index b41232b63..b9421eb06 100644
--- a/src/electron/webview-ime-focus.js
+++ b/src/electron/webview-ime-focus.js
@@ -1,4 +1,4 @@
-const { remote } = require('electron');
+const { webContents } = require('@electron/remote');
 const { releaseDocumentFocus } = require('./webview-ime-focus-helpers');
 
 function giveWebviewDocumentFocus(element) {
@@ -10,7 +10,7 @@ function giveWebviewDocumentFocus(element) {
 }
 
 function elementIsUnfocusedWebview(element) {
-  return element.tagName === 'WEBVIEW' && !remote.webContents.fromId(element.getWebContentsId()).isFocused();
+  return element.tagName === 'WEBVIEW' && !webContents.fromId(element.getWebContentsId()).isFocused();
 }
 
 function webviewDidAutofocus(element) {
diff --git a/src/environment.js b/src/environment.js
index 6c889f7d8..1aa0def04 100644
--- a/src/environment.js
+++ b/src/environment.js
@@ -1,5 +1,3 @@
-import isDev from 'electron-is-dev';
-
 import {
   LIVE_API,
   DEV_API,
@@ -14,7 +12,10 @@ import {
   PRODUCTION_TODOS_FRONTEND_URL,
 } from './config';
 
-export const isDevMode = isDev;
+// eslint-disable-next-line global-require
+export const { app } = process.type === 'renderer' ? require('@electron/remote') : require('electron');
+
+export const isDevMode = !app.isPackaged;
 export const useLiveAPI = process.env.LIVE_API;
 export const useLocalAPI = process.env.LOCAL_API;
 
diff --git a/src/features/announcements/api.js b/src/features/announcements/api.js
index e5c5a7d6f..2ab5a15b2 100644
--- a/src/features/announcements/api.js
+++ b/src/features/announcements/api.js
@@ -1,4 +1,4 @@
-import { remote } from 'electron';
+import { app } from '@electron/remote';
 import Request from '../../stores/lib/Request';
 
 const debug = require('debug')('Ferdi:feature:announcements:api');
@@ -6,7 +6,7 @@ const debug = require('debug')('Ferdi:feature:announcements:api');
 export const announcementsApi = {
   async getCurrentVersion() {
     debug('getting current version of electron app');
-    return Promise.resolve(remote.app.getVersion());
+    return Promise.resolve(app.getVersion());
   },
 
   async getChangelog(version) {
diff --git a/src/features/planSelection/containers/PlanSelectionScreen.js b/src/features/planSelection/containers/PlanSelectionScreen.js
index e4d85cda5..fba65506e 100644
--- a/src/features/planSelection/containers/PlanSelectionScreen.js
+++ b/src/features/planSelection/containers/PlanSelectionScreen.js
@@ -1,7 +1,7 @@
 import React, { Component } from 'react';
 import { observer, inject } from 'mobx-react';
 import PropTypes from 'prop-types';
-import { remote } from 'electron';
+import { dialog, app } from '@electron/remote';
 import { defineMessages, intlShape } from 'react-intl';
 
 import FeaturesStore from '../../../stores/FeaturesStore';
@@ -10,8 +10,6 @@ import PlanSelection from '../components/PlanSelection';
 import ErrorBoundary from '../../../components/util/ErrorBoundary';
 import { planSelectionStore } from '..';
 
-const { dialog, app } = remote;
-
 const messages = defineMessages({
   dialogTitle: {
     id: 'feature.planSelection.fullscreen.dialog.title',
diff --git a/src/features/quickSwitch/Component.js b/src/features/quickSwitch/Component.js
index 58479e7ef..c5c320f52 100644
--- a/src/features/quickSwitch/Component.js
+++ b/src/features/quickSwitch/Component.js
@@ -1,5 +1,5 @@
 import React, { Component, createRef } from 'react';
-import { remote } from 'electron';
+import { getCurrentWindow } from '@electron/remote';
 import PropTypes from 'prop-types';
 import { observer, inject } from 'mobx-react';
 import { reaction } from 'mobx';
@@ -244,8 +244,8 @@ export default @injectSheet(styles) @inject('stores', 'actions') @observer class
     if (isModalVisible && !this.state.wasPrevVisible) {
       // Set focus back on current window if its in a service
       // TODO: Find a way to gain back focus
-      remote.getCurrentWindow().blurWebView();
-      remote.getCurrentWindow().webContents.focus();
+      getCurrentWindow().blurWebView();
+      getCurrentWindow().webContents.focus();
 
       // The input "focus" attribute will only work on first modal open
       // Manually add focus to the input element
diff --git a/src/features/serviceProxy/index.js b/src/features/serviceProxy/index.js
index e78607667..f74f5f0b2 100644
--- a/src/features/serviceProxy/index.js
+++ b/src/features/serviceProxy/index.js
@@ -1,9 +1,5 @@
 import { autorun, observable } from 'mobx';
-import { remote } from 'electron';
-
-// import { DEFAULT_FEATURES_CONFIG } from '../../config';
-
-const { session } = remote;
+import { session } from '@electron/remote';
 
 const debug = require('debug')('Ferdi:feature:serviceProxy');
 
@@ -16,8 +12,6 @@ export default function init(stores) {
   debug('Initializing `serviceProxy` feature');
 
   autorun(() => {
-    // const { isServiceProxyEnabled, isServiceProxyIncludedInCurrentPlan } = stores.features.features;
-
     config.isEnabled = true;
     config.isIncludedInCurrentPlan = true;
 
diff --git a/src/features/workspaces/components/WorkspaceDrawerItem.js b/src/features/workspaces/components/WorkspaceDrawerItem.js
index 18f424d8a..2e58b70d6 100644
--- a/src/features/workspaces/components/WorkspaceDrawerItem.js
+++ b/src/features/workspaces/components/WorkspaceDrawerItem.js
@@ -1,4 +1,4 @@
-import { remote } from 'electron';
+import { Menu, getCurrentWindow } from '@electron/remote';
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import { observer } from 'mobx-react';
@@ -7,8 +7,6 @@ import classnames from 'classnames';
 import { defineMessages, intlShape } from 'react-intl';
 import { ctrlKey } from '../../../environment';
 
-const { Menu } = remote;
-
 const messages = defineMessages({
   noServicesAddedYet: {
     id: 'workspaceDrawer.item.noServicesAddedYet',
@@ -113,7 +111,7 @@ class WorkspaceDrawerItem extends Component {
         ])}
         onClick={onClick}
         onContextMenu={() => (
-          onContextMenuEditClick && contextMenu.popup(remote.getCurrentWindow())
+          onContextMenuEditClick && contextMenu.popup(getCurrentWindow())
         )}
         data-tip={`${shortcutIndex <= 9 ? `(${ctrlKey}+Alt+${shortcutIndex})` : ''}`}
       >
diff --git a/src/helpers/recipe-helpers.js b/src/helpers/recipe-helpers.js
index a31c29e72..7daa0aaab 100644
--- a/src/helpers/recipe-helpers.js
+++ b/src/helpers/recipe-helpers.js
@@ -1,9 +1,5 @@
 import path from 'path';
-import { remote } from 'electron';
-
-// import ServiceModel from '../models/Service';
-
-const { app } = remote;
+import { app } from '@electron/remote';
 
 export function getRecipeDirectory(id = '') {
   return path.join(app.getPath('userData'), 'recipes', id);
diff --git a/src/helpers/service-helpers.js b/src/helpers/service-helpers.js
index 83f89f108..f6363aca8 100644
--- a/src/helpers/service-helpers.js
+++ b/src/helpers/service-helpers.js
@@ -1,9 +1,7 @@
 import path from 'path';
-import { remote } from 'electron';
+import { app } from '@electron/remote';
 import fs from 'fs-extra';
 
-const { app } = remote;
-
 export function getServicePartitionsDirectory() {
   return path.join(app.getPath('userData'), 'Partitions');
 }
diff --git a/src/helpers/userAgent-helpers.js b/src/helpers/userAgent-helpers.js
index fd0d16e2d..c5eee0082 100644
--- a/src/helpers/userAgent-helpers.js
+++ b/src/helpers/userAgent-helpers.js
@@ -1,11 +1,8 @@
-import { remote, app } from 'electron';
 import os from 'os';
 import macosVersion from 'macos-version';
-import { isMac, isWindows } from '../environment';
+import { app, isMac, isWindows } from '../environment';
 
-// This helper gets included from the backend and frontend but we only need to use "remote"
-// if we are in the frontend
-export const ferdiVersion = remote && remote.app ? remote.app.getVersion() : app.getVersion();
+export const ferdiVersion = app.getVersion();
 
 function macOS() {
   const version = macosVersion();
diff --git a/src/i18n/messages/src/components/auth/Locked.json b/src/i18n/messages/src/components/auth/Locked.json
index ed3999114..a871d6fc8 100644
--- a/src/i18n/messages/src/components/auth/Locked.json
+++ b/src/i18n/messages/src/components/auth/Locked.json
@@ -4,11 +4,11 @@
     "defaultMessage": "!!!Locked",
     "file": "src/components/auth/Locked.js",
     "start": {
-      "line": 20,
+      "line": 16,
       "column": 12
     },
     "end": {
-      "line": 23,
+      "line": 19,
       "column": 3
     }
   },
@@ -17,11 +17,11 @@
     "defaultMessage": "!!!Ferdi is currently locked. Please unlock Ferdi with your password to see your messages.",
     "file": "src/components/auth/Locked.js",
     "start": {
-      "line": 24,
+      "line": 20,
       "column": 8
     },
     "end": {
-      "line": 27,
+      "line": 23,
       "column": 3
     }
   },
@@ -30,11 +30,11 @@
     "defaultMessage": "!!!Unlock with Touch ID",
     "file": "src/components/auth/Locked.js",
     "start": {
-      "line": 28,
+      "line": 24,
       "column": 11
     },
     "end": {
-      "line": 31,
+      "line": 27,
       "column": 3
     }
   },
@@ -43,11 +43,11 @@
     "defaultMessage": "!!!unlock via Touch ID",
     "file": "src/components/auth/Locked.js",
     "start": {
-      "line": 32,
+      "line": 28,
       "column": 17
     },
     "end": {
-      "line": 35,
+      "line": 31,
       "column": 3
     }
   },
@@ -56,11 +56,11 @@
     "defaultMessage": "!!!Password",
     "file": "src/components/auth/Locked.js",
     "start": {
-      "line": 36,
+      "line": 32,
       "column": 17
     },
     "end": {
-      "line": 39,
+      "line": 35,
       "column": 3
     }
   },
@@ -69,11 +69,11 @@
     "defaultMessage": "!!!Unlock",
     "file": "src/components/auth/Locked.js",
     "start": {
-      "line": 40,
+      "line": 36,
       "column": 21
     },
     "end": {
-      "line": 43,
+      "line": 39,
       "column": 3
     }
   },
@@ -82,11 +82,11 @@
     "defaultMessage": "!!!Unlock with Password",
     "file": "src/components/auth/Locked.js",
     "start": {
-      "line": 44,
+      "line": 40,
       "column": 22
     },
     "end": {
-      "line": 47,
+      "line": 43,
       "column": 3
     }
   },
@@ -95,11 +95,11 @@
     "defaultMessage": "!!!Password invalid",
     "file": "src/components/auth/Locked.js",
     "start": {
-      "line": 48,
+      "line": 44,
       "column": 22
     },
     "end": {
-      "line": 51,
+      "line": 47,
       "column": 3
     }
   }
diff --git a/src/i18n/messages/src/components/settings/settings/EditSettingsForm.json b/src/i18n/messages/src/components/settings/settings/EditSettingsForm.json
index ecac749db..68c04e434 100644
--- a/src/i18n/messages/src/components/settings/settings/EditSettingsForm.json
+++ b/src/i18n/messages/src/components/settings/settings/EditSettingsForm.json
@@ -4,11 +4,11 @@
     "defaultMessage": "!!!Settings",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 27,
+      "line": 23,
       "column": 12
     },
     "end": {
-      "line": 30,
+      "line": 26,
       "column": 3
     }
   },
@@ -17,11 +17,11 @@
     "defaultMessage": "!!!General",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 31,
+      "line": 27,
       "column": 19
     },
     "end": {
-      "line": 34,
+      "line": 30,
       "column": 3
     }
   },
@@ -30,11 +30,11 @@
     "defaultMessage": "!!!Sending telemetry data allows us to find errors in Ferdi - we will not send any personal information like your message data! Changing this option requires you to restart Ferdi.",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 35,
+      "line": 31,
       "column": 14
     },
     "end": {
-      "line": 38,
+      "line": 34,
       "column": 3
     }
   },
@@ -43,11 +43,11 @@
     "defaultMessage": "!!!By default, Ferdi will keep all your services open and loaded in the background so they are ready when you want to use them. Service Hibernation will unload your services after a specified amount. This is useful to save RAM or keeping services from slowing down your computer.",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 39,
+      "line": 35,
       "column": 17
     },
     "end": {
-      "line": 42,
+      "line": 38,
       "column": 3
     }
   },
@@ -56,11 +56,11 @@
     "defaultMessage": "!!!Minutes of inactivity, after which Ferdi should automatically lock. Use 0 to disable",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 43,
+      "line": 39,
       "column": 22
     },
     "end": {
-      "line": 46,
+      "line": 42,
       "column": 3
     }
   },
@@ -69,11 +69,11 @@
     "defaultMessage": "!!!This server will be used for the \"Franz Todo\" feature. (default: https://app.franztodos.com)",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 47,
+      "line": 43,
       "column": 18
     },
     "end": {
-      "line": 50,
+      "line": 46,
       "column": 3
     }
   },
@@ -82,11 +82,11 @@
     "defaultMessage": "!!!Password",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 51,
+      "line": 47,
       "column": 18
     },
     "end": {
-      "line": 54,
+      "line": 50,
       "column": 3
     }
   },
@@ -95,11 +95,11 @@
     "defaultMessage": "!!!Please make sure to set a password you'll remember.\nIf you loose this password, you will have to reinstall Ferdi.",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 55,
+      "line": 51,
       "column": 22
     },
     "end": {
-      "line": 58,
+      "line": 54,
       "column": 3
     }
   },
@@ -108,11 +108,11 @@
     "defaultMessage": "!!!Password Lock allows you to keep your messages protected.\nUsing Password Lock, you will be prompted to enter your password everytime you start Ferdi or lock Ferdi yourself using the lock symbol in the bottom left corner or the shortcut CMD/CTRL+Shift+L.",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 59,
+      "line": 55,
       "column": 12
     },
     "end": {
-      "line": 62,
+      "line": 58,
       "column": 3
     }
   },
@@ -121,11 +121,11 @@
     "defaultMessage": "!!!Times in 24-Hour-Format. End time can be before start time (e.g. start 17:00, end 09:00) to enable Do-not-Disturb overnight.",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 63,
+      "line": 59,
       "column": 24
     },
     "end": {
-      "line": 66,
+      "line": 62,
       "column": 3
     }
   },
@@ -134,11 +134,11 @@
     "defaultMessage": "!!!Scheduled Do-not-Disturb allows you to define a period of time in which you do not want to get Notifications from Ferdi.",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 67,
+      "line": 63,
       "column": 20
     },
     "end": {
-      "line": 70,
+      "line": 66,
       "column": 3
     }
   },
@@ -147,11 +147,11 @@
     "defaultMessage": "!!!Language",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 71,
+      "line": 67,
       "column": 20
     },
     "end": {
-      "line": 74,
+      "line": 70,
       "column": 3
     }
   },
@@ -160,11 +160,11 @@
     "defaultMessage": "!!!Updates",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 75,
+      "line": 71,
       "column": 19
     },
     "end": {
-      "line": 78,
+      "line": 74,
       "column": 3
     }
   },
@@ -173,11 +173,11 @@
     "defaultMessage": "!!!Appearance",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 79,
+      "line": 75,
       "column": 22
     },
     "end": {
-      "line": 82,
+      "line": 78,
       "column": 3
     }
   },
@@ -186,11 +186,11 @@
     "defaultMessage": "!!!Universal Dark Mode tries to dynamically generate dark mode styles for services that are otherwise not currently supported.",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 83,
+      "line": 79,
       "column": 25
     },
     "end": {
-      "line": 86,
+      "line": 82,
       "column": 3
     }
   },
@@ -199,11 +199,11 @@
     "defaultMessage": "!!!Write your accent color in a CSS-compatible format. (Default: {defaultAccentColor})",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 87,
+      "line": 83,
       "column": 19
     },
     "end": {
-      "line": 90,
+      "line": 86,
       "column": 3
     }
   },
@@ -212,11 +212,11 @@
     "defaultMessage": "!!!Privacy",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 91,
+      "line": 87,
       "column": 19
     },
     "end": {
-      "line": 94,
+      "line": 90,
       "column": 3
     }
   },
@@ -225,11 +225,11 @@
     "defaultMessage": "!!!Advanced",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 95,
+      "line": 91,
       "column": 20
     },
     "end": {
-      "line": 98,
+      "line": 94,
       "column": 3
     }
   },
@@ -238,11 +238,11 @@
     "defaultMessage": "!!!Help us to translate Ferdi into your language.",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 99,
+      "line": 95,
       "column": 19
     },
     "end": {
-      "line": 102,
+      "line": 98,
       "column": 3
     }
   },
@@ -251,11 +251,11 @@
     "defaultMessage": "!!!Ferdi uses your Mac's build-in spellchecker to check for typos. If you want to change the languages the spellchecker checks for, you can do so in your Mac's System Preferences.",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 103,
+      "line": 99,
       "column": 28
     },
     "end": {
-      "line": 106,
+      "line": 102,
       "column": 3
     }
   },
@@ -264,11 +264,11 @@
     "defaultMessage": "!!!Cache",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 107,
+      "line": 103,
       "column": 20
     },
     "end": {
-      "line": 110,
+      "line": 106,
       "column": 3
     }
   },
@@ -277,11 +277,11 @@
     "defaultMessage": "!!!Ferdi cache is currently using {size} of disk space.",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 111,
+      "line": 107,
       "column": 13
     },
     "end": {
-      "line": 114,
+      "line": 110,
       "column": 3
     }
   },
@@ -290,11 +290,11 @@
     "defaultMessage": "!!!Couldn't clear all cache",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 115,
+      "line": 111,
       "column": 19
     },
     "end": {
-      "line": 118,
+      "line": 114,
       "column": 3
     }
   },
@@ -303,11 +303,11 @@
     "defaultMessage": "!!!Clear cache",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 119,
+      "line": 115,
       "column": 23
     },
     "end": {
-      "line": 122,
+      "line": 118,
       "column": 3
     }
   },
@@ -316,11 +316,11 @@
     "defaultMessage": "!!!Check for updates",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 123,
+      "line": 119,
       "column": 25
     },
     "end": {
-      "line": 126,
+      "line": 122,
       "column": 3
     }
   },
@@ -329,11 +329,11 @@
     "defaultMessage": "!!!Restart & install update",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 127,
+      "line": 123,
       "column": 23
     },
     "end": {
-      "line": 130,
+      "line": 126,
       "column": 3
     }
   },
@@ -342,11 +342,11 @@
     "defaultMessage": "!!!Is searching for update",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 131,
+      "line": 127,
       "column": 25
     },
     "end": {
-      "line": 134,
+      "line": 130,
       "column": 3
     }
   },
@@ -355,11 +355,11 @@
     "defaultMessage": "!!!Update available, downloading...",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 135,
+      "line": 131,
       "column": 25
     },
     "end": {
-      "line": 138,
+      "line": 134,
       "column": 3
     }
   },
@@ -368,11 +368,11 @@
     "defaultMessage": "!!!You are using the latest version of Ferdi",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 139,
+      "line": 135,
       "column": 24
     },
     "end": {
-      "line": 142,
+      "line": 138,
       "column": 3
     }
   },
@@ -381,11 +381,11 @@
     "defaultMessage": "!!!Current version:",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 143,
+      "line": 139,
       "column": 18
     },
     "end": {
-      "line": 146,
+      "line": 142,
       "column": 3
     }
   },
@@ -394,11 +394,11 @@
     "defaultMessage": "!!!Changes require restart",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 147,
+      "line": 143,
       "column": 29
     },
     "end": {
-      "line": 150,
+      "line": 146,
       "column": 3
     }
   },
@@ -407,11 +407,11 @@
     "defaultMessage": "!!!Official translations are English & German. All other languages are community based translations.",
     "file": "src/components/settings/settings/EditSettingsForm.js",
     "start": {
-      "line": 151,
+      "line": 147,
       "column": 22
     },
     "end": {
-      "line": 154,
+      "line": 150,
       "column": 3
     }
   }
diff --git a/src/i18n/messages/src/components/settings/supportFerdi/SupportFerdiDashboard.json b/src/i18n/messages/src/components/settings/supportFerdi/SupportFerdiDashboard.json
index d8ec01f17..e63c2801f 100644
--- a/src/i18n/messages/src/components/settings/supportFerdi/SupportFerdiDashboard.json
+++ b/src/i18n/messages/src/components/settings/supportFerdi/SupportFerdiDashboard.json
@@ -4,11 +4,11 @@
     "defaultMessage": "!!!About Ferdi",
     "file": "src/components/settings/supportFerdi/SupportFerdiDashboard.js",
     "start": {
-      "line": 9,
+      "line": 7,
       "column": 12
     },
     "end": {
-      "line": 12,
+      "line": 10,
       "column": 3
     }
   },
@@ -17,11 +17,11 @@
     "defaultMessage": "!!!Do you like Ferdi?",
     "file": "src/components/settings/supportFerdi/SupportFerdiDashboard.js",
     "start": {
-      "line": 13,
+      "line": 11,
       "column": 9
     },
     "end": {
-      "line": 16,
+      "line": 14,
       "column": 3
     }
   },
@@ -30,11 +30,11 @@
     "defaultMessage": "!!!<p>Ferdi is an open-source and a community-lead application.</p><p>Thanks to the people who make this possbile:</p>",
     "file": "src/components/settings/supportFerdi/SupportFerdiDashboard.js",
     "start": {
-      "line": 17,
+      "line": 15,
       "column": 14
     },
     "end": {
-      "line": 20,
+      "line": 18,
       "column": 3
     }
   },
@@ -43,11 +43,11 @@
     "defaultMessage": "!!!Full list of contributor",
     "file": "src/components/settings/supportFerdi/SupportFerdiDashboard.js",
     "start": {
-      "line": 21,
+      "line": 19,
       "column": 24
     },
     "end": {
-      "line": 24,
+      "line": 22,
       "column": 3
     }
   },
@@ -56,11 +56,11 @@
     "defaultMessage": "!!!here",
     "file": "src/components/settings/supportFerdi/SupportFerdiDashboard.js",
     "start": {
-      "line": 25,
+      "line": 23,
       "column": 28
     },
     "end": {
-      "line": 28,
+      "line": 26,
       "column": 3
     }
   },
@@ -69,11 +69,11 @@
     "defaultMessage": "!!!The development of Ferdi is done by volunteers. People who use Ferdi like you. They maintain, fix, and improve Ferdi in their spare time.",
     "file": "src/components/settings/supportFerdi/SupportFerdiDashboard.js",
     "start": {
-      "line": 29,
+      "line": 27,
       "column": 18
     },
     "end": {
-      "line": 32,
+      "line": 30,
       "column": 3
     }
   },
@@ -82,11 +82,11 @@
     "defaultMessage": "!!!Support is always welcome. You can find a list of the help we need",
     "file": "src/components/settings/supportFerdi/SupportFerdiDashboard.js",
     "start": {
-      "line": 33,
+      "line": 31,
       "column": 22
     },
     "end": {
-      "line": 36,
+      "line": 34,
       "column": 3
     }
   },
@@ -95,11 +95,11 @@
     "defaultMessage": "!!!here",
     "file": "src/components/settings/supportFerdi/SupportFerdiDashboard.js",
     "start": {
-      "line": 37,
+      "line": 35,
       "column": 26
     },
     "end": {
-      "line": 40,
+      "line": 38,
       "column": 3
     }
   },
@@ -108,11 +108,11 @@
     "defaultMessage": "!!!While volunteers do most of the work, we still need to pay for servers and certificates. As a community, we are fully transparent on funds we collect and spend - see our",
     "file": "src/components/settings/supportFerdi/SupportFerdiDashboard.js",
     "start": {
-      "line": 41,
+      "line": 39,
       "column": 16
     },
     "end": {
-      "line": 44,
+      "line": 42,
       "column": 3
     }
   },
@@ -121,11 +121,11 @@
     "defaultMessage": "!!!Open Collective",
     "file": "src/components/settings/supportFerdi/SupportFerdiDashboard.js",
     "start": {
-      "line": 45,
+      "line": 43,
       "column": 22
     },
     "end": {
-      "line": 48,
+      "line": 46,
       "column": 3
     }
   },
@@ -134,11 +134,11 @@
     "defaultMessage": "!!!If you feel like supporting Ferdi development with a donation, you can do so on both,",
     "file": "src/components/settings/supportFerdi/SupportFerdiDashboard.js",
     "start": {
-      "line": 49,
+      "line": 47,
       "column": 16
     },
     "end": {
-      "line": 52,
+      "line": 50,
       "column": 3
     }
   },
@@ -147,11 +147,11 @@
     "defaultMessage": "!!!and",
     "file": "src/components/settings/supportFerdi/SupportFerdiDashboard.js",
     "start": {
-      "line": 53,
+      "line": 51,
       "column": 19
     },
     "end": {
-      "line": 56,
+      "line": 54,
       "column": 3
     }
   },
@@ -160,11 +160,11 @@
     "defaultMessage": "!!!GitHub Sponsors",
     "file": "src/components/settings/supportFerdi/SupportFerdiDashboard.js",
     "start": {
-      "line": 57,
+      "line": 55,
       "column": 22
     },
     "end": {
-      "line": 60,
+      "line": 58,
       "column": 3
     }
   },
@@ -173,11 +173,11 @@
     "defaultMessage": "!!!Open Survey",
     "file": "src/components/settings/supportFerdi/SupportFerdiDashboard.js",
     "start": {
-      "line": 61,
+      "line": 59,
       "column": 14
     },
     "end": {
-      "line": 64,
+      "line": 62,
       "column": 3
     }
   },
@@ -186,11 +186,11 @@
     "defaultMessage": "!!!Do you want to help us improve Ferdi?",
     "file": "src/components/settings/supportFerdi/SupportFerdiDashboard.js",
     "start": {
-      "line": 65,
+      "line": 63,
       "column": 14
     },
     "end": {
-      "line": 68,
+      "line": 66,
       "column": 3
     }
   }
diff --git a/src/i18n/messages/src/features/planSelection/containers/PlanSelectionScreen.json b/src/i18n/messages/src/features/planSelection/containers/PlanSelectionScreen.json
index 04b2144b4..290d1547d 100644
--- a/src/i18n/messages/src/features/planSelection/containers/PlanSelectionScreen.json
+++ b/src/i18n/messages/src/features/planSelection/containers/PlanSelectionScreen.json
@@ -4,11 +4,11 @@
     "defaultMessage": "!!!Downgrade your Franz Plan",
     "file": "src/features/planSelection/containers/PlanSelectionScreen.js",
     "start": {
-      "line": 16,
+      "line": 14,
       "column": 15
     },
     "end": {
-      "line": 19,
+      "line": 17,
       "column": 3
     }
   },
@@ -17,11 +17,11 @@
     "defaultMessage": "!!!You're about to downgrade to our Free account. Are you sure? Click here instead to get more services and functionality for just {currency}{price} a month.",
     "file": "src/features/planSelection/containers/PlanSelectionScreen.js",
     "start": {
-      "line": 20,
+      "line": 18,
       "column": 17
     },
     "end": {
-      "line": 23,
+      "line": 21,
       "column": 3
     }
   },
@@ -30,11 +30,11 @@
     "defaultMessage": "!!!Downgrade to Free",
     "file": "src/features/planSelection/containers/PlanSelectionScreen.js",
     "start": {
-      "line": 24,
+      "line": 22,
       "column": 22
     },
     "end": {
-      "line": 27,
+      "line": 25,
       "column": 3
     }
   },
@@ -43,11 +43,11 @@
     "defaultMessage": "!!!Choose Personal",
     "file": "src/features/planSelection/containers/PlanSelectionScreen.js",
     "start": {
-      "line": 28,
+      "line": 26,
       "column": 20
     },
     "end": {
-      "line": 31,
+      "line": 29,
       "column": 3
     }
   }
diff --git a/src/i18n/messages/src/features/workspaces/components/WorkspaceDrawerItem.json b/src/i18n/messages/src/features/workspaces/components/WorkspaceDrawerItem.json
index 1b6664787..737dee59b 100644
--- a/src/i18n/messages/src/features/workspaces/components/WorkspaceDrawerItem.json
+++ b/src/i18n/messages/src/features/workspaces/components/WorkspaceDrawerItem.json
@@ -4,11 +4,11 @@
     "defaultMessage": "!!!No services added yet",
     "file": "src/features/workspaces/components/WorkspaceDrawerItem.js",
     "start": {
-      "line": 13,
+      "line": 11,
       "column": 22
     },
     "end": {
-      "line": 16,
+      "line": 14,
       "column": 3
     }
   },
@@ -17,11 +17,11 @@
     "defaultMessage": "!!!edit",
     "file": "src/features/workspaces/components/WorkspaceDrawerItem.js",
     "start": {
-      "line": 17,
+      "line": 15,
       "column": 19
     },
     "end": {
-      "line": 20,
+      "line": 18,
       "column": 3
     }
   }
diff --git a/src/i18n/messages/src/lib/Menu.json b/src/i18n/messages/src/lib/Menu.json
index d5a8d5923..6bb50c012 100644
--- a/src/i18n/messages/src/lib/Menu.json
+++ b/src/i18n/messages/src/lib/Menu.json
@@ -4,11 +4,11 @@
     "defaultMessage": "!!!Edit",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 24,
+      "line": 21,
       "column": 8
     },
     "end": {
-      "line": 27,
+      "line": 24,
       "column": 3
     }
   },
@@ -17,11 +17,11 @@
     "defaultMessage": "!!!Undo",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 28,
+      "line": 25,
       "column": 8
     },
     "end": {
-      "line": 31,
+      "line": 28,
       "column": 3
     }
   },
@@ -30,11 +30,11 @@
     "defaultMessage": "!!!Redo",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 32,
+      "line": 29,
       "column": 8
     },
     "end": {
-      "line": 35,
+      "line": 32,
       "column": 3
     }
   },
@@ -43,11 +43,11 @@
     "defaultMessage": "!!!Cut",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 36,
+      "line": 33,
       "column": 7
     },
     "end": {
-      "line": 39,
+      "line": 36,
       "column": 3
     }
   },
@@ -56,11 +56,11 @@
     "defaultMessage": "!!!Copy",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 40,
+      "line": 37,
       "column": 8
     },
     "end": {
-      "line": 43,
+      "line": 40,
       "column": 3
     }
   },
@@ -69,11 +69,11 @@
     "defaultMessage": "!!!Paste",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 44,
+      "line": 41,
       "column": 9
     },
     "end": {
-      "line": 47,
+      "line": 44,
       "column": 3
     }
   },
@@ -82,11 +82,11 @@
     "defaultMessage": "!!!Paste And Match Style",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 48,
+      "line": 45,
       "column": 22
     },
     "end": {
-      "line": 51,
+      "line": 48,
       "column": 3
     }
   },
@@ -95,11 +95,11 @@
     "defaultMessage": "!!!Delete",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 52,
+      "line": 49,
       "column": 10
     },
     "end": {
-      "line": 55,
+      "line": 52,
       "column": 3
     }
   },
@@ -108,11 +108,11 @@
     "defaultMessage": "!!!Select All",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 56,
+      "line": 53,
       "column": 13
     },
     "end": {
-      "line": 59,
+      "line": 56,
       "column": 3
     }
   },
@@ -121,11 +121,11 @@
     "defaultMessage": "!!!Find in Page",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 60,
+      "line": 57,
       "column": 14
     },
     "end": {
-      "line": 63,
+      "line": 60,
       "column": 3
     }
   },
@@ -134,11 +134,11 @@
     "defaultMessage": "!!!Speech",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 64,
+      "line": 61,
       "column": 10
     },
     "end": {
-      "line": 67,
+      "line": 64,
       "column": 3
     }
   },
@@ -147,11 +147,11 @@
     "defaultMessage": "!!!Start Speaking",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 68,
+      "line": 65,
       "column": 17
     },
     "end": {
-      "line": 71,
+      "line": 68,
       "column": 3
     }
   },
@@ -160,11 +160,11 @@
     "defaultMessage": "!!!Stop Speaking",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 72,
+      "line": 69,
       "column": 16
     },
     "end": {
-      "line": 75,
+      "line": 72,
       "column": 3
     }
   },
@@ -173,11 +173,11 @@
     "defaultMessage": "!!!Start Dictation",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 76,
+      "line": 73,
       "column": 18
     },
     "end": {
-      "line": 79,
+      "line": 76,
       "column": 3
     }
   },
@@ -186,11 +186,11 @@
     "defaultMessage": "!!!Emoji & Symbols",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 80,
+      "line": 77,
       "column": 16
     },
     "end": {
-      "line": 83,
+      "line": 80,
       "column": 3
     }
   },
@@ -199,11 +199,11 @@
     "defaultMessage": "!!!Open Quick Switch",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 84,
+      "line": 81,
       "column": 19
     },
     "end": {
-      "line": 87,
+      "line": 84,
       "column": 3
     }
   },
@@ -212,11 +212,11 @@
     "defaultMessage": "!!!Back",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 88,
+      "line": 85,
       "column": 8
     },
     "end": {
-      "line": 91,
+      "line": 88,
       "column": 3
     }
   },
@@ -225,11 +225,11 @@
     "defaultMessage": "!!!Forward",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 92,
+      "line": 89,
       "column": 11
     },
     "end": {
-      "line": 95,
+      "line": 92,
       "column": 3
     }
   },
@@ -238,11 +238,11 @@
     "defaultMessage": "!!!Actual Size",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 96,
+      "line": 93,
       "column": 13
     },
     "end": {
-      "line": 99,
+      "line": 96,
       "column": 3
     }
   },
@@ -251,11 +251,11 @@
     "defaultMessage": "!!!Zoom In",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 100,
+      "line": 97,
       "column": 10
     },
     "end": {
-      "line": 103,
+      "line": 100,
       "column": 3
     }
   },
@@ -264,11 +264,11 @@
     "defaultMessage": "!!!Zoom Out",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 104,
+      "line": 101,
       "column": 11
     },
     "end": {
-      "line": 107,
+      "line": 104,
       "column": 3
     }
   },
@@ -277,11 +277,11 @@
     "defaultMessage": "!!!Enter Full Screen",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 108,
+      "line": 105,
       "column": 19
     },
     "end": {
-      "line": 111,
+      "line": 108,
       "column": 3
     }
   },
@@ -290,11 +290,11 @@
     "defaultMessage": "!!!Exit Full Screen",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 112,
+      "line": 109,
       "column": 18
     },
     "end": {
-      "line": 115,
+      "line": 112,
       "column": 3
     }
   },
@@ -303,11 +303,11 @@
     "defaultMessage": "!!!Toggle Full Screen",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 116,
+      "line": 113,
       "column": 20
     },
     "end": {
-      "line": 119,
+      "line": 116,
       "column": 3
     }
   },
@@ -316,11 +316,11 @@
     "defaultMessage": "!!!Toggle Dark Mode",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 120,
+      "line": 117,
       "column": 18
     },
     "end": {
-      "line": 123,
+      "line": 120,
       "column": 3
     }
   },
@@ -329,11 +329,11 @@
     "defaultMessage": "!!!Toggle Developer Tools",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 124,
+      "line": 121,
       "column": 18
     },
     "end": {
-      "line": 127,
+      "line": 124,
       "column": 3
     }
   },
@@ -342,11 +342,11 @@
     "defaultMessage": "!!!Toggle Todos Developer Tools",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 128,
+      "line": 125,
       "column": 23
     },
     "end": {
-      "line": 131,
+      "line": 128,
       "column": 3
     }
   },
@@ -355,11 +355,11 @@
     "defaultMessage": "!!!Toggle Service Developer Tools",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 132,
+      "line": 129,
       "column": 25
     },
     "end": {
-      "line": 135,
+      "line": 132,
       "column": 3
     }
   },
@@ -368,11 +368,11 @@
     "defaultMessage": "!!!Reload Service",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 136,
+      "line": 133,
       "column": 17
     },
     "end": {
-      "line": 139,
+      "line": 136,
       "column": 3
     }
   },
@@ -381,11 +381,11 @@
     "defaultMessage": "!!!Reload Ferdi",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 140,
+      "line": 137,
       "column": 15
     },
     "end": {
-      "line": 143,
+      "line": 140,
       "column": 3
     }
   },
@@ -394,11 +394,11 @@
     "defaultMessage": "!!!Lock Ferdi",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 144,
+      "line": 141,
       "column": 13
     },
     "end": {
-      "line": 147,
+      "line": 144,
       "column": 3
     }
   },
@@ -407,11 +407,11 @@
     "defaultMessage": "!!!Reload ToDos",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 148,
+      "line": 145,
       "column": 15
     },
     "end": {
-      "line": 151,
+      "line": 148,
       "column": 3
     }
   },
@@ -420,11 +420,11 @@
     "defaultMessage": "!!!Minimize",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 152,
+      "line": 149,
       "column": 12
     },
     "end": {
-      "line": 155,
+      "line": 152,
       "column": 3
     }
   },
@@ -433,11 +433,11 @@
     "defaultMessage": "!!!Close",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 156,
+      "line": 153,
       "column": 9
     },
     "end": {
-      "line": 159,
+      "line": 156,
       "column": 3
     }
   },
@@ -446,11 +446,11 @@
     "defaultMessage": "!!!Learn More",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 160,
+      "line": 157,
       "column": 13
     },
     "end": {
-      "line": 163,
+      "line": 160,
       "column": 3
     }
   },
@@ -459,11 +459,11 @@
     "defaultMessage": "!!!Changelog",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 164,
+      "line": 161,
       "column": 13
     },
     "end": {
-      "line": 167,
+      "line": 164,
       "column": 3
     }
   },
@@ -472,11 +472,11 @@
     "defaultMessage": "!!!Support",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 168,
+      "line": 165,
       "column": 11
     },
     "end": {
-      "line": 171,
+      "line": 168,
       "column": 3
     }
   },
@@ -485,11 +485,11 @@
     "defaultMessage": "!!!Copy Debug Information",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 172,
+      "line": 169,
       "column": 13
     },
     "end": {
-      "line": 175,
+      "line": 172,
       "column": 3
     }
   },
@@ -498,11 +498,11 @@
     "defaultMessage": "!!!Publish Debug Information",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 176,
+      "line": 173,
       "column": 20
     },
     "end": {
-      "line": 179,
+      "line": 176,
       "column": 3
     }
   },
@@ -511,11 +511,11 @@
     "defaultMessage": "!!!Ferdi Debug Information",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 180,
+      "line": 177,
       "column": 27
     },
     "end": {
-      "line": 183,
+      "line": 180,
       "column": 3
     }
   },
@@ -524,11 +524,11 @@
     "defaultMessage": "!!!Your Debug Information has been copied to your clipboard.",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 184,
+      "line": 181,
       "column": 23
     },
     "end": {
-      "line": 187,
+      "line": 184,
       "column": 3
     }
   },
@@ -537,11 +537,11 @@
     "defaultMessage": "!!!Unlock with Touch ID",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 188,
+      "line": 185,
       "column": 11
     },
     "end": {
-      "line": 191,
+      "line": 188,
       "column": 3
     }
   },
@@ -550,11 +550,11 @@
     "defaultMessage": "!!!unlock via Touch ID",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 192,
+      "line": 189,
       "column": 17
     },
     "end": {
-      "line": 195,
+      "line": 192,
       "column": 3
     }
   },
@@ -563,11 +563,11 @@
     "defaultMessage": "!!!Terms of Service",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 196,
+      "line": 193,
       "column": 7
     },
     "end": {
-      "line": 199,
+      "line": 196,
       "column": 3
     }
   },
@@ -576,11 +576,11 @@
     "defaultMessage": "!!!Privacy Statement",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 200,
+      "line": 197,
       "column": 11
     },
     "end": {
-      "line": 203,
+      "line": 200,
       "column": 3
     }
   },
@@ -589,11 +589,11 @@
     "defaultMessage": "!!!File",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 204,
+      "line": 201,
       "column": 8
     },
     "end": {
-      "line": 207,
+      "line": 204,
       "column": 3
     }
   },
@@ -602,11 +602,11 @@
     "defaultMessage": "!!!View",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 208,
+      "line": 205,
       "column": 8
     },
     "end": {
-      "line": 211,
+      "line": 208,
       "column": 3
     }
   },
@@ -615,11 +615,11 @@
     "defaultMessage": "!!!Services",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 212,
+      "line": 209,
       "column": 12
     },
     "end": {
-      "line": 215,
+      "line": 212,
       "column": 3
     }
   },
@@ -628,11 +628,11 @@
     "defaultMessage": "!!!Window",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 216,
+      "line": 213,
       "column": 10
     },
     "end": {
-      "line": 219,
+      "line": 216,
       "column": 3
     }
   },
@@ -641,11 +641,11 @@
     "defaultMessage": "!!!Help",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 220,
+      "line": 217,
       "column": 8
     },
     "end": {
-      "line": 223,
+      "line": 220,
       "column": 3
     }
   },
@@ -654,11 +654,11 @@
     "defaultMessage": "!!!About Ferdi",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 224,
+      "line": 221,
       "column": 9
     },
     "end": {
-      "line": 227,
+      "line": 224,
       "column": 3
     }
   },
@@ -667,11 +667,11 @@
     "defaultMessage": "!!!What's new?",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 228,
+      "line": 225,
       "column": 16
     },
     "end": {
-      "line": 231,
+      "line": 228,
       "column": 3
     }
   },
@@ -680,11 +680,11 @@
     "defaultMessage": "!!!Settings",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 232,
+      "line": 229,
       "column": 12
     },
     "end": {
-      "line": 235,
+      "line": 232,
       "column": 3
     }
   },
@@ -693,11 +693,11 @@
     "defaultMessage": "!!!Check for updates",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 236,
+      "line": 233,
       "column": 19
     },
     "end": {
-      "line": 239,
+      "line": 236,
       "column": 3
     }
   },
@@ -706,11 +706,11 @@
     "defaultMessage": "!!!Hide",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 240,
+      "line": 237,
       "column": 8
     },
     "end": {
-      "line": 243,
+      "line": 240,
       "column": 3
     }
   },
@@ -719,11 +719,11 @@
     "defaultMessage": "!!!Hide Others",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 244,
+      "line": 241,
       "column": 14
     },
     "end": {
-      "line": 247,
+      "line": 244,
       "column": 3
     }
   },
@@ -732,11 +732,11 @@
     "defaultMessage": "!!!Unhide",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 248,
+      "line": 245,
       "column": 10
     },
     "end": {
-      "line": 251,
+      "line": 248,
       "column": 3
     }
   },
@@ -745,11 +745,11 @@
     "defaultMessage": "!!!Auto-hide menu bar",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 252,
+      "line": 249,
       "column": 19
     },
     "end": {
-      "line": 255,
+      "line": 252,
       "column": 3
     }
   },
@@ -758,11 +758,11 @@
     "defaultMessage": "!!!Quit",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 256,
+      "line": 253,
       "column": 8
     },
     "end": {
-      "line": 259,
+      "line": 256,
       "column": 3
     }
   },
@@ -771,11 +771,11 @@
     "defaultMessage": "!!!Add New Service...",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 260,
+      "line": 257,
       "column": 17
     },
     "end": {
-      "line": 263,
+      "line": 260,
       "column": 3
     }
   },
@@ -784,11 +784,11 @@
     "defaultMessage": "!!!Add New Workspace...",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 264,
+      "line": 261,
       "column": 19
     },
     "end": {
-      "line": 267,
+      "line": 264,
       "column": 3
     }
   },
@@ -797,11 +797,11 @@
     "defaultMessage": "!!!Open workspace drawer",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 268,
+      "line": 265,
       "column": 23
     },
     "end": {
-      "line": 271,
+      "line": 268,
       "column": 3
     }
   },
@@ -810,11 +810,11 @@
     "defaultMessage": "!!!Close workspace drawer",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 272,
+      "line": 269,
       "column": 24
     },
     "end": {
-      "line": 275,
+      "line": 272,
       "column": 3
     }
   },
@@ -823,11 +823,11 @@
     "defaultMessage": "!!!Activate next service...",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 276,
+      "line": 273,
       "column": 23
     },
     "end": {
-      "line": 279,
+      "line": 276,
       "column": 3
     }
   },
@@ -836,11 +836,11 @@
     "defaultMessage": "!!!Activate previous service...",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 280,
+      "line": 277,
       "column": 27
     },
     "end": {
-      "line": 283,
+      "line": 280,
       "column": 3
     }
   },
@@ -849,11 +849,11 @@
     "defaultMessage": "!!!Disable notifications & audio",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 284,
+      "line": 281,
       "column": 11
     },
     "end": {
-      "line": 287,
+      "line": 284,
       "column": 3
     }
   },
@@ -862,11 +862,11 @@
     "defaultMessage": "!!!Enable notifications & audio",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 288,
+      "line": 285,
       "column": 13
     },
     "end": {
-      "line": 291,
+      "line": 288,
       "column": 3
     }
   },
@@ -875,11 +875,11 @@
     "defaultMessage": "!!!Workspaces",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 292,
+      "line": 289,
       "column": 14
     },
     "end": {
-      "line": 295,
+      "line": 292,
       "column": 3
     }
   },
@@ -888,11 +888,11 @@
     "defaultMessage": "!!!Default",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 296,
+      "line": 293,
       "column": 20
     },
     "end": {
-      "line": 299,
+      "line": 296,
       "column": 3
     }
   },
@@ -901,11 +901,11 @@
     "defaultMessage": "!!!Todos",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 300,
+      "line": 297,
       "column": 9
     },
     "end": {
-      "line": 303,
+      "line": 300,
       "column": 3
     }
   },
@@ -914,11 +914,11 @@
     "defaultMessage": "!!!Open Todos drawer",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 304,
+      "line": 301,
       "column": 19
     },
     "end": {
-      "line": 307,
+      "line": 304,
       "column": 3
     }
   },
@@ -927,11 +927,11 @@
     "defaultMessage": "!!!Close Todos drawer",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 308,
+      "line": 305,
       "column": 20
     },
     "end": {
-      "line": 311,
+      "line": 308,
       "column": 3
     }
   },
@@ -940,11 +940,11 @@
     "defaultMessage": "!!!Enable Todos",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 312,
+      "line": 309,
       "column": 15
     },
     "end": {
-      "line": 315,
+      "line": 312,
       "column": 3
     }
   },
@@ -953,11 +953,11 @@
     "defaultMessage": "!!!Home",
     "file": "src/lib/Menu.js",
     "start": {
-      "line": 316,
+      "line": 313,
       "column": 17
     },
     "end": {
-      "line": 319,
+      "line": 316,
       "column": 3
     }
   }
diff --git a/src/index.js b/src/index.js
index 396d2e649..ab4187e68 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,3 +1,5 @@
+/* eslint-disable import/first */
+
 import {
   app,
   BrowserWindow,
@@ -5,13 +7,26 @@ import {
   ipcMain,
   session,
 } from 'electron';
-import isDevMode from 'electron-is-dev';
+
 import fs from 'fs-extra';
 import path from 'path';
 import windowStateKeeper from 'electron-window-state';
 import { enforceMacOSAppLocation } from 'electron-util';
 import ms from 'ms';
 
+require('@electron/remote/main').initialize();
+
+import {
+  DEFAULT_APP_SETTINGS,
+  DEFAULT_WINDOW_OPTIONS,
+} from './config';
+
+import {
+  isMac,
+  isWindows,
+  isLinux,
+} from './environment';
+
 // TODO: This seems to be duplicated between here and 'config.js'
 // Set app directory before loading user modules
 if (process.env.FERDI_APPDATA_DIR != null) {
@@ -25,16 +40,11 @@ if (process.env.FERDI_APPDATA_DIR != null) {
   app.setPath('userData', path.join(app.getPath('appData'), app.name));
 }
 
+const isDevMode = !app.isPackaged;
 if (isDevMode) {
   app.setPath('userData', path.join(app.getPath('appData'), `${app.name}Dev`));
 }
 
-/* eslint-disable import/first */
-import {
-  isMac,
-  isWindows,
-  isLinux,
-} from './environment';
 import { mainIpcHandler as basicAuthHandler } from './features/basicAuth';
 import ipcApi from './electron/ipc-api';
 import Tray from './lib/Tray';
@@ -42,15 +52,10 @@ import DBus from './lib/DBus';
 import Settings from './electron/Settings';
 import handleDeepLink from './electron/deepLinking';
 import { isPositionValid } from './electron/windowUtils';
-import askFormacOSPermissions from './electron/macOSPermissions';
 import { appId } from './package.json'; // eslint-disable-line import/no-unresolved
 import * as buildInfo from './buildInfo.json'; // eslint-disable-line import/no-unresolved
 import './electron/exception';
 
-import {
-  DEFAULT_APP_SETTINGS,
-  DEFAULT_WINDOW_OPTIONS,
-} from './config';
 import { asarPath } from './helpers/asar-helpers';
 import { isValidExternalURL } from './helpers/url-helpers';
 import userAgent, { ferdiVersion } from './helpers/userAgent-helpers';
@@ -329,6 +334,8 @@ const createWindow = () => {
   });
 
   if (isMac) {
+    // eslint-disable-next-line global-require
+    const askFormacOSPermissions = require('./electron/macOSPermissions');
     setTimeout(() => askFormacOSPermissions(mainWindow), ms('30s'));
   }
 
diff --git a/src/lib/Menu.js b/src/lib/Menu.js
index 2131a97be..621be9a12 100644
--- a/src/lib/Menu.js
+++ b/src/lib/Menu.js
@@ -1,4 +1,5 @@
-import { clipboard, remote, shell } from 'electron';
+import { clipboard, shell } from 'electron';
+import { app, Menu, dialog, systemPreferences } from '@electron/remote';
 import { autorun, observable } from 'mobx';
 import { defineMessages } from 'react-intl';
 import {
@@ -16,10 +17,6 @@ import { ferdiVersion } from '../helpers/userAgent-helpers';
 
 const osName = require('os-name');
 
-const {
-  app, Menu, dialog, systemPreferences,
-} = remote;
-
 const menuItems = defineMessages({
   edit: {
     id: 'menu.edit',
diff --git a/src/lib/TouchBar.js b/src/lib/TouchBar.js
index 32f546644..11eaec306 100644
--- a/src/lib/TouchBar.js
+++ b/src/lib/TouchBar.js
@@ -1,6 +1,6 @@
 import os from 'os';
 import semver from 'semver';
-import { remote } from 'electron';
+import { TouchBar, getCurrentWindow } from '@electron/remote';
 import { autorun } from 'mobx';
 
 import { isMac } from '../environment';
@@ -22,14 +22,13 @@ export default class FranzTouchBar {
   }
 
   _build() {
-    const currentWindow = remote.getCurrentWindow();
+    const currentWindow = getCurrentWindow();
 
     if (this.stores.router.location.pathname.startsWith('/payment/')) {
       return;
     }
 
     if (this.stores.user.isLoggedIn) {
-      const { TouchBar } = remote;
       const { TouchBarButton, TouchBarSpacer } = TouchBar;
 
       const buttons = [];
diff --git a/src/models/Service.js b/src/models/Service.js
index a980ca4a3..b76e92a53 100644
--- a/src/models/Service.js
+++ b/src/models/Service.js
@@ -1,5 +1,6 @@
 import { autorun, computed, observable } from 'mobx';
-import { ipcRenderer, remote } from 'electron';
+import { ipcRenderer } from 'electron';
+import { webContents } from '@electron/remote';
 import normalizeUrl from 'normalize-url';
 import path from 'path';
 
@@ -246,7 +247,7 @@ export default class Service {
 
 
   initializeWebViewEvents({ handleIPCMessage, openWindow, stores }) {
-    const webContents = remote.webContents.fromId(this.webview.getWebContentsId());
+    const webviewWebContents = webContents.fromId(this.webview.getWebContentsId());
 
     // If the recipe has implemented modifyRequestHeaders,
     // Send those headers to ipcMain so that it can be set in session
@@ -337,14 +338,14 @@ export default class Service {
       this.hasCrashed = true;
     });
 
-    webContents.on('login', (event, request, authInfo, callback) => {
+    webviewWebContents.on('login', (event, request, authInfo, callback) => {
       // const authCallback = callback;
       debug('browser login event', authInfo);
       event.preventDefault();
 
       if (authInfo.isProxy && authInfo.scheme === 'basic') {
         debug('Sending service echo ping');
-        webContents.send('get-service-id');
+        webviewWebContents.send('get-service-id');
 
         debug('Received service id', this.id);
 
diff --git a/src/stores/AppStore.js b/src/stores/AppStore.js
index c409b6ac7..4af802460 100644
--- a/src/stores/AppStore.js
+++ b/src/stores/AppStore.js
@@ -1,7 +1,8 @@
-import { remote, ipcRenderer, shell } from 'electron';
+import { ipcRenderer, shell } from 'electron';
 import {
-  action, computed, observable,
-} from 'mobx';
+  app, screen, powerMonitor, nativeTheme, getCurrentWindow, process as remoteProcess,
+} from '@electron/remote';
+import { action, computed, observable } from 'mobx';
 import moment from 'moment';
 import AutoLaunch from 'auto-launch';
 import ms from 'ms';
@@ -24,18 +25,11 @@ import { sleep } from '../helpers/async-helpers';
 
 const debug = require('debug')('Ferdi:AppStore');
 
-const {
-  app,
-  screen,
-  powerMonitor,
-  nativeTheme,
-} = remote;
-
-const mainWindow = remote.getCurrentWindow();
+const mainWindow = getCurrentWindow();
 
 const defaultLocale = DEFAULT_APP_SETTINGS.locale;
 
-const executablePath = isMac ? remote.process.execPath : process.execPath;
+const executablePath = isMac ? remoteProcess.execPath : process.execPath;
 const autoLauncher = new AutoLaunch({
   name: 'Ferdi',
   path: executablePath,
diff --git a/src/stores/PaymentStore.js b/src/stores/PaymentStore.js
index 69e6eb9c3..05bb5b3d0 100644
--- a/src/stores/PaymentStore.js
+++ b/src/stores/PaymentStore.js
@@ -1,12 +1,10 @@
 import { action, observable, computed } from 'mobx';
-import { remote } from 'electron';
+import { BrowserWindow, getCurrentWindow } from '@electron/remote';
 
 import Store from './lib/Store';
 import CachedRequest from './lib/CachedRequest';
 import Request from './lib/Request';
 
-const { BrowserWindow } = remote;
-
 export default class PaymentStore extends Store {
   @observable plansRequest = new CachedRequest(this.api.payment, 'plans');
 
@@ -43,7 +41,7 @@ export default class PaymentStore extends Store {
     hostedPageURL = this.stores.user.getAuthURL(`${parsedUrl.origin}${parsedUrl.pathname}?${params.toString()}`);
 
     const win = new BrowserWindow({
-      parent: remote.getCurrentWindow(),
+      parent: getCurrentWindow(),
       modal: true,
       title: '🔒 Upgrade Your Franz Account',
       width: 800,
@@ -54,6 +52,8 @@ export default class PaymentStore extends Store {
       webPreferences: {
         nodeIntegration: true,
         webviewTag: true,
+        enableRemoteModule: true,
+        contextIsolation: false,
       },
     });
     win.loadURL(`file://${__dirname}/../index.html#/payment/${encodeURIComponent(hostedPageURL)}`);
diff --git a/src/stores/ServicesStore.js b/src/stores/ServicesStore.js
index afb370341..dc2cb0dbd 100644
--- a/src/stores/ServicesStore.js
+++ b/src/stores/ServicesStore.js
@@ -1,4 +1,4 @@
-import { shell, remote } from 'electron';
+import { shell } from 'electron';
 import {
   action,
   reaction,
@@ -7,6 +7,7 @@ import {
 } from 'mobx';
 import { debounce, remove } from 'lodash';
 import ms from 'ms';
+import { app } from '@electron/remote';
 import fs from 'fs-extra';
 import path from 'path';
 
@@ -25,8 +26,6 @@ import { SPELLCHECKER_LOCALES } from '../i18n/languages';
 
 const debug = require('debug')('Ferdi:ServiceStore');
 
-const { app } = remote;
-
 export default class ServicesStore extends Store {
   @observable allServicesRequest = new CachedRequest(this.api.services, 'all');
 
diff --git a/src/stores/SettingsStore.js b/src/stores/SettingsStore.js
index ced286052..15b0db120 100644
--- a/src/stores/SettingsStore.js
+++ b/src/stores/SettingsStore.js
@@ -1,4 +1,5 @@
-import { ipcRenderer, remote } from 'electron';
+import { ipcRenderer } from 'electron';
+import { getCurrentWindow } from '@electron/remote';
 import {
   action, computed, observable, reaction,
 } from 'mobx';
@@ -41,7 +42,7 @@ export default class SettingsStore extends Store {
     reaction(
       () => this.all.app.autohideMenuBar,
       () => {
-        const currentWindow = remote.getCurrentWindow();
+        const currentWindow = getCurrentWindow();
         currentWindow.setMenuBarVisibility(!this.all.app.autohideMenuBar);
         currentWindow.autoHideMenuBar = this.all.app.autohideMenuBar;
       },
@@ -61,7 +62,7 @@ export default class SettingsStore extends Store {
 
     // Inactivity lock timer
     let inactivityTimer;
-    remote.getCurrentWindow().on('blur', () => {
+    getCurrentWindow().on('blur', () => {
       if (this.all.app.inactivityLock !== 0) {
         inactivityTimer = setTimeout(() => {
           this.actions.settings.update({
@@ -73,7 +74,7 @@ export default class SettingsStore extends Store {
         }, this.all.app.inactivityLock * 1000 * 60);
       }
     });
-    remote.getCurrentWindow().on('focus', () => {
+    getCurrentWindow().on('focus', () => {
       if (inactivityTimer) {
         clearTimeout(inactivityTimer);
       }
diff --git a/src/stores/UIStore.js b/src/stores/UIStore.js
index 05e3f71fe..0ca61046a 100644
--- a/src/stores/UIStore.js
+++ b/src/stores/UIStore.js
@@ -2,13 +2,11 @@ import {
   action, observable, computed, reaction,
 } from 'mobx';
 import { theme } from '@meetfranz/theme';
-import { remote } from 'electron';
+import { nativeTheme, systemPreferences } from '@electron/remote';
 
 import Store from './lib/Store';
 import { isMac, isWindows } from '../environment';
 
-const { nativeTheme, systemPreferences } = remote;
-
 export default class UIStore extends Store {
   @observable showServicesUpdatedInfoBar = false;
 
diff --git a/src/stores/UserStore.js b/src/stores/UserStore.js
index 7b4d39524..2cb6affa8 100644
--- a/src/stores/UserStore.js
+++ b/src/stores/UserStore.js
@@ -3,7 +3,7 @@ import moment from 'moment';
 import jwt from 'jsonwebtoken';
 import localStorage from 'mobx-localstorage';
 import ms from 'ms';
-import { remote } from 'electron';
+import { session } from '@electron/remote';
 
 import { isDevMode } from '../environment';
 import Store from './lib/Store';
@@ -14,8 +14,6 @@ import { getPlan } from '../helpers/plan-helpers';
 import { PLANS } from '../config';
 import { TODOS_PARTITION_ID } from '../features/todos';
 
-const { session } = remote;
-
 const debug = require('debug')('Ferdi:UserStore');
 
 // TODO: split stores into UserStore and AuthStore
diff --git a/src/webview/contextMenu.js b/src/webview/contextMenu.js
index 5858e89ef..f19d863ee 100644
--- a/src/webview/contextMenu.js
+++ b/src/webview/contextMenu.js
@@ -1,7 +1,7 @@
-import { remote } from 'electron';
+import { getCurrentWebContents } from '@electron/remote';
 import ContextMenuBuilder from './contextMenuBuilder';
 
-const webContents = remote.getCurrentWebContents();
+const webContents = getCurrentWebContents();
 
 export default async function setupContextMenu(isSpellcheckEnabled, getDefaultSpellcheckerLanguage, getSpellcheckerLanguage, getSearchEngine) {
   const contextMenuBuilder = new ContextMenuBuilder(
diff --git a/src/webview/contextMenuBuilder.js b/src/webview/contextMenuBuilder.js
index eac383fbd..5d6df8068 100644
--- a/src/webview/contextMenuBuilder.js
+++ b/src/webview/contextMenuBuilder.js
@@ -6,18 +6,14 @@
  *
  * Source: https://github.com/electron-userland/electron-spellchecker/blob/master/src/context-menu-builder.js
  */
+import { clipboard, ipcRenderer, nativeImage, shell } from 'electron';
+import { Menu, MenuItem } from '@electron/remote';
 import { isMac } from '../environment';
 
 import { SEARCH_ENGINE_NAMES, SEARCH_ENGINE_URLS } from '../config';
 
-const {
-  clipboard, ipcRenderer, nativeImage, remote, shell,
-} = require('electron');
-
 const { URL } = require('url');
 
-const { Menu, MenuItem } = remote;
-
 function matchesWord(string) {
   const regex = /[\u0041-\u005A\u0061-\u007A\u00AA\u00B5\u00BA\u00C0-\u00D6\u00D8-\u00F6\u00F8-\u02C1\u02C6-\u02D1\u02E0-\u02E4\u02EC\u02EE\u0370-\u0374\u0376\u0377\u037A-\u037D\u0386\u0388-\u038A\u038C\u038E-\u03A1\u03A3-\u03F5\u03F7-\u0481\u048A-\u0527\u0531-\u0556\u0559\u0561-\u0587\u05D0-\u05EA\u05F0-\u05F2\u0620-\u064A\u066E\u066F\u0671-\u06D3\u06D5\u06E5\u06E6\u06EE\u06EF\u06FA-\u06FC\u06FF\u0710\u0712-\u072F\u074D-\u07A5\u07B1\u07CA-\u07EA\u07F4\u07F5\u07FA\u0800-\u0815\u081A\u0824\u0828\u0840-\u0858\u08A0\u08A2-\u08AC\u0904-\u0939\u093D\u0950\u0958-\u0961\u0971-\u0977\u0979-\u097F\u0985-\u098C\u098F\u0990\u0993-\u09A8\u09AA-\u09B0\u09B2\u09B6-\u09B9\u09BD\u09CE\u09DC\u09DD\u09DF-\u09E1\u09F0\u09F1\u0A05-\u0A0A\u0A0F\u0A10\u0A13-\u0A28\u0A2A-\u0A30\u0A32\u0A33\u0A35\u0A36\u0A38\u0A39\u0A59-\u0A5C\u0A5E\u0A72-\u0A74\u0A85-\u0A8D\u0A8F-\u0A91\u0A93-\u0AA8\u0AAA-\u0AB0\u0AB2\u0AB3\u0AB5-\u0AB9\u0ABD\u0AD0\u0AE0\u0AE1\u0B05-\u0B0C\u0B0F\u0B10\u0B13-\u0B28\u0B2A-\u0B30\u0B32\u0B33\u0B35-\u0B39\u0B3D\u0B5C\u0B5D\u0B5F-\u0B61\u0B71\u0B83\u0B85-\u0B8A\u0B8E-\u0B90\u0B92-\u0B95\u0B99\u0B9A\u0B9C\u0B9E\u0B9F\u0BA3\u0BA4\u0BA8-\u0BAA\u0BAE-\u0BB9\u0BD0\u0C05-\u0C0C\u0C0E-\u0C10\u0C12-\u0C28\u0C2A-\u0C33\u0C35-\u0C39\u0C3D\u0C58\u0C59\u0C60\u0C61\u0C85-\u0C8C\u0C8E-\u0C90\u0C92-\u0CA8\u0CAA-\u0CB3\u0CB5-\u0CB9\u0CBD\u0CDE\u0CE0\u0CE1\u0CF1\u0CF2\u0D05-\u0D0C\u0D0E-\u0D10\u0D12-\u0D3A\u0D3D\u0D4E\u0D60\u0D61\u0D7A-\u0D7F\u0D85-\u0D96\u0D9A-\u0DB1\u0DB3-\u0DBB\u0DBD\u0DC0-\u0DC6\u0E01-\u0E30\u0E32\u0E33\u0E40-\u0E46\u0E81\u0E82\u0E84\u0E87\u0E88\u0E8A\u0E8D\u0E94-\u0E97\u0E99-\u0E9F\u0EA1-\u0EA3\u0EA5\u0EA7\u0EAA\u0EAB\u0EAD-\u0EB0\u0EB2\u0EB3\u0EBD\u0EC0-\u0EC4\u0EC6\u0EDC-\u0EDF\u0F00\u0F40-\u0F47\u0F49-\u0F6C\u0F88-\u0F8C\u1000-\u102A\u103F\u1050-\u1055\u105A-\u105D\u1061\u1065\u1066\u106E-\u1070\u1075-\u1081\u108E\u10A0-\u10C5\u10C7\u10CD\u10D0-\u10FA\u10FC-\u1248\u124A-\u124D\u1250-\u1256\u1258\u125A-\u125D\u1260-\u1288\u128A-\u128D\u1290-\u12B0\u12B2-\u12B5\u12B8-\u12BE\u12C0\u12C2-\u12C5\u12C8-\u12D6\u12D8-\u1310\u1312-\u1315\u1318-\u135A\u1380-\u138F\u13A0-\u13F4\u1401-\u166C\u166F-\u167F\u1681-\u169A\u16A0-\u16EA\u1700-\u170C\u170E-\u1711\u1720-\u1731\u1740-\u1751\u1760-\u176C\u176E-\u1770\u1780-\u17B3\u17D7\u17DC\u1820-\u1877\u1880-\u18A8\u18AA\u18B0-\u18F5\u1900-\u191C\u1950-\u196D\u1970-\u1974\u1980-\u19AB\u19C1-\u19C7\u1A00-\u1A16\u1A20-\u1A54\u1AA7\u1B05-\u1B33\u1B45-\u1B4B\u1B83-\u1BA0\u1BAE\u1BAF\u1BBA-\u1BE5\u1C00-\u1C23\u1C4D-\u1C4F\u1C5A-\u1C7D\u1CE9-\u1CEC\u1CEE-\u1CF1\u1CF5\u1CF6\u1D00-\u1DBF\u1E00-\u1F15\u1F18-\u1F1D\u1F20-\u1F45\u1F48-\u1F4D\u1F50-\u1F57\u1F59\u1F5B\u1F5D\u1F5F-\u1F7D\u1F80-\u1FB4\u1FB6-\u1FBC\u1FBE\u1FC2-\u1FC4\u1FC6-\u1FCC\u1FD0-\u1FD3\u1FD6-\u1FDB\u1FE0-\u1FEC\u1FF2-\u1FF4\u1FF6-\u1FFC\u2071\u207F\u2090-\u209C\u2102\u2107\u210A-\u2113\u2115\u2119-\u211D\u2124\u2126\u2128\u212A-\u212D\u212F-\u2139\u213C-\u213F\u2145-\u2149\u214E\u2183\u2184\u2C00-\u2C2E\u2C30-\u2C5E\u2C60-\u2CE4\u2CEB-\u2CEE\u2CF2\u2CF3\u2D00-\u2D25\u2D27\u2D2D\u2D30-\u2D67\u2D6F\u2D80-\u2D96\u2DA0-\u2DA6\u2DA8-\u2DAE\u2DB0-\u2DB6\u2DB8-\u2DBE\u2DC0-\u2DC6\u2DC8-\u2DCE\u2DD0-\u2DD6\u2DD8-\u2DDE\u2E2F\u3005\u3006\u3031-\u3035\u303B\u303C\u3041-\u3096\u309D-\u309F\u30A1-\u30FA\u30FC-\u30FF\u3105-\u312D\u3131-\u318E\u31A0-\u31BA\u31F0-\u31FF\u3400-\u4DB5\u4E00-\u9FCC\uA000-\uA48C\uA4D0-\uA4FD\uA500-\uA60C\uA610-\uA61F\uA62A\uA62B\uA640-\uA66E\uA67F-\uA697\uA6A0-\uA6E5\uA717-\uA71F\uA722-\uA788\uA78B-\uA78E\uA790-\uA793\uA7A0-\uA7AA\uA7F8-\uA801\uA803-\uA805\uA807-\uA80A\uA80C-\uA822\uA840-\uA873\uA882-\uA8B3\uA8F2-\uA8F7\uA8FB\uA90A-\uA925\uA930-\uA946\uA960-\uA97C\uA984-\uA9B2\uA9CF\uAA00-\uAA28\uAA40-\uAA42\uAA44-\uAA4B\uAA60-\uAA76\uAA7A\uAA80-\uAAAF\uAAB1\uAAB5\uAAB6\uAAB9-\uAABD\uAAC0\uAAC2\uAADB-\uAADD\uAAE0-\uAAEA\uAAF2-\uAAF4\uAB01-\uAB06\uAB09-\uAB0E\uAB11-\uAB16\uAB20-\uAB26\uAB28-\uAB2E\uABC0-\uABE2\uAC00-\uD7A3\uD7B0-\uD7C6\uD7CB-\uD7FB\uF900-\uFA6D\uFA70-\uFAD9\uFB00-\uFB06\uFB13-\uFB17\uFB1D\uFB1F-\uFB28\uFB2A-\uFB36\uFB38-\uFB3C\uFB3E\uFB40\uFB41\uFB43\uFB44\uFB46-\uFBB1\uFBD3-\uFD3D\uFD50-\uFD8F\uFD92-\uFDC7\uFDF0-\uFDFB\uFE70-\uFE74\uFE76-\uFEFC\uFF21-\uFF3A\uFF41-\uFF5A\uFF66-\uFFBE\uFFC2-\uFFC7\uFFCA-\uFFCF\uFFD2-\uFFD7\uFFDA-\uFFDC]+/g;
 
diff --git a/src/webview/recipe.js b/src/webview/recipe.js
index 2701603cb..6180270b2 100644
--- a/src/webview/recipe.js
+++ b/src/webview/recipe.js
@@ -1,5 +1,6 @@
 /* eslint-disable import/first */
-import { ipcRenderer, remote, desktopCapturer } from 'electron';
+import { ipcRenderer, desktopCapturer } from 'electron';
+import { getCurrentWebContents } from '@electron/remote';
 import path from 'path';
 import { autorun, computed, observable } from 'mobx';
 import fs from 'fs-extra';
@@ -158,7 +159,7 @@ class RecipeController {
     autorun(() => this.update());
 
     document.addEventListener('DOMContentLoaded', () => {
-      this.findInPage = new FindInPage(remote.getCurrentWebContents(), {
+      this.findInPage = new FindInPage(getCurrentWebContents(), {
         inputFocusColor: '#CE9FFC',
         textColor: '#212121',
       });
diff --git a/src/webview/spellchecker.js b/src/webview/spellchecker.js
index d7c917326..58a04b728 100644
--- a/src/webview/spellchecker.js
+++ b/src/webview/spellchecker.js
@@ -1,12 +1,10 @@
-import {
-  remote,
-} from 'electron';
+import { getCurrentWebContents } from '@electron/remote';
 import { SPELLCHECKER_LOCALES } from '../i18n/languages';
 import { isMac } from '../environment';
 
 const debug = require('debug')('Ferdi:spellchecker');
 
-const webContents = remote.getCurrentWebContents();
+const webContents = getCurrentWebContents();
 const [defaultLocale] = webContents.session.getSpellCheckerLanguages();
 debug('Spellchecker default locale is', defaultLocale);