6 files changed, 19 insertions, 29 deletions

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