@allow-large-files [flipper][deps] Upgrade Electron (#636)

Summary:
allow-large-files

Pull Request resolved: https://github.com/facebook/flipper/pull/636

per title

Reviewed By: jknoxville

Differential Revision: D18374332

fbshipit-source-id: f7300f527b65b65caebac51c5bcf8f019dc34228

package.json

@@ -41,7 +41,7 @@
     ]
   },
   "resolutions": {
-    "@jest-runner/electron/electron": "5.0.11",
+    "@jest-runner/electron/electron": "7.1.1",
     "adbkit/adbkit-logcat": "2",
     "@types/react": "16.9.11",
     "@types/react-dom": "16.9.2"
@@ -60,7 +60,7 @@
     "clearMocks": true
   },
   "devDependencies": {
-    "@jest-runner/electron": "^2.0.1",
+    "@jest-runner/electron": "^2.0.2",
     "@testing-library/react": "^9.3.0",
     "@types/algoliasearch": "^3.30.19",
     "@types/deep-equal": "^1.0.1",
@@ -84,8 +84,8 @@
     "@typescript-eslint/parser": "^2.1.1-alpha.4",
     "babel-code-frame": "^6.26.0",
     "babel-eslint": "^10.0.1",
-    "electron": "^5.0.11",
+    "electron": "7.1.1",
-    "electron-builder": "^20.38.5",
+    "electron-builder": "22.1.0",
     "eslint": "^6.5.1",
     "eslint-config-fbjs": "^3.1.1",
     "eslint-plugin-babel": "^5.3.0",
@@ -180,8 +180,6 @@
   },
   "greenkeeper": {
     "ignore": [
-      "electron",
-      "electron-builder",
       "emotion",
       "react-emotion",
       "tmp"

src/MenuBar.tsx

@@ -107,7 +107,7 @@ export function setupMenuBar(
       const menu = applicationMenu.items.find(
         menuItem => menuItem.label === topLevelMenu,
       );
-      if (menu) {
+      if (menu && menu.submenu) {
         const menuItem = menu.submenu.items.find(
           menuItem => menuItem.label === label,
         );
@@ -187,14 +187,17 @@ function getTemplate(
       label: 'File...',
       accelerator: 'CommandOrControl+E',
       click: function() {
-        electron.remote.dialog.showSaveDialog(
+        electron.remote.dialog
-          // @ts-ignore This appears to work but isn't allowed by the types
+          .showSaveDialog(
-          null,
+            // @ts-ignore This appears to work but isn't allowed by the types
-          {
+            null,
-            title: 'FlipperExport',
+            {
-            defaultPath: path.join(os.homedir(), 'FlipperExport.flipper'),
+              title: 'FlipperExport',
-          },
+              defaultPath: path.join(os.homedir(), 'FlipperExport.flipper'),
-          async (file: string) => {
+            },
+          )
+          .then(async (result: electron.SaveDialogReturnValue) => {
+            const file = result.filePath;
             if (!file) {
               return;
             }
@@ -205,8 +208,7 @@ function getTemplate(
                 closeOnFinish: false,
               }),
             );
-          },
+          });
-        );
       },
     },
   ];
@@ -297,7 +299,7 @@ function getTemplate(
         {
           label: 'Select All',
           accelerator: 'CmdOrCtrl+A',
-          role: 'selectall',
+          role: 'selectAll',
         },
       ],
     },
@@ -411,7 +413,7 @@ function getTemplate(
   ];
 
   if (process.platform === 'darwin') {
-    const name = app.getName();
+    const name = app.name;
     template.unshift({
       label: name,
       submenu: [
@@ -438,7 +440,7 @@ function getTemplate(
         {
           label: 'Hide Others',
           accelerator: 'Command+Shift+H',
-          role: 'hideothers',
+          role: 'hideOthers',
         },
         {
           label: 'Show All',

src/chrome/settings/configFields.tsx

@@ -7,6 +7,7 @@
  * @format
  */
 
+import electron from 'electron';
 import {FlexColumn, styled, Text, FlexRow, Input, colors, Glyph} from 'flipper';
 import React, {useState} from 'react';
 import {promises as fs} from 'fs';
@@ -87,16 +88,18 @@ export function FilePathConfigField(props: {
       />
       <FlexColumn
         onClick={() =>
-          remote.dialog.showOpenDialog(
+          remote.dialog
-            {
+            .showOpenDialog({
               properties: ['openDirectory', 'showHiddenFiles'],
               defaultPath: path.resolve('/'),
-            },
+            })
-            (paths: Array<string> | undefined) => {
+            .then((result: electron.SaveDialogReturnValue) => {
-              paths && setValue(paths[0]);
+              if (result.filePath) {
-              paths && props.onChange(paths[0]);
+                const path: string = result.filePath.toString();
-            },
+                setValue(path);
-          )
+                props.onChange(path);
+              }
+            })
         }>
         <CenteredGlyph name="dots-3-circle" variant="outline" />
       </FlexColumn>

src/dispatcher/application.tsx

@@ -7,7 +7,7 @@
  * @format
  */
 
-import {remote, ipcRenderer} from 'electron';
+import {remote, ipcRenderer, IpcRendererEvent} from 'electron';
 import {toggleAction} from '../reducers/application';
 import {setStaticView} from '../reducers/connections';
 import {Store} from '../reducers/index.js';
@@ -57,7 +57,7 @@ export default (store: Store, logger: Logger) => {
 
   ipcRenderer.on(
     'flipper-protocol-handler',
-    (_event: string, query: string) => {
+    (_event: IpcRendererEvent, query: string) => {
       const uri = new URL(query);
       if (query.startsWith('flipper://import')) {
         const {search} = new URL(query);
@@ -102,11 +102,14 @@ export default (store: Store, logger: Logger) => {
     },
   );
 
-  ipcRenderer.on('open-flipper-file', (_event: string, url: string) => {
+  ipcRenderer.on(
-    tryCatchReportPlatformFailures(() => {
+    'open-flipper-file',
-      return importFileToStore(url, store);
+    (_event: IpcRendererEvent, url: string) => {
-    }, `${IMPORT_FLIPPER_TRACE_EVENT}:Deeplink`);
+      tryCatchReportPlatformFailures(() => {
-  });
+        return importFileToStore(url, store);
+      }, `${IMPORT_FLIPPER_TRACE_EVENT}:Deeplink`);
+    },
+  );
 
   if (process.env.FLIPPER_PORTS) {
     const portOverrides = parseFlipperPorts(process.env.FLIPPER_PORTS);

src/dispatcher/notifications.tsx

@@ -12,7 +12,7 @@ import {Logger} from '../fb-interfaces/Logger';
 import {PluginNotification} from '../reducers/notifications';
 import {FlipperPlugin, FlipperDevicePlugin} from '../plugin';
 import isHeadless from '../utils/isHeadless';
-import {ipcRenderer} from 'electron';
+import {ipcRenderer, IpcRendererEvent} from 'electron';
 import {selectPlugin} from '../reducers/connections';
 import {
   setActiveNotifications,
@@ -37,6 +37,7 @@ export default (store: Store, logger: Logger) => {
   ipcRenderer.on(
     'notificationEvent',
     (
+      _event: IpcRendererEvent,
       _e: Error,
       eventName: NotificationEvents,
       pluginNotification: PluginNotification,

src/utils/exportData.tsx

@@ -669,8 +669,9 @@ export function showOpenDialog(store: Store) {
     properties: ['openFile'],
     filters: [{extensions: ['flipper', 'json', 'txt'], name: 'Flipper files'}],
   };
-  remote.dialog.showOpenDialog(options, (filePaths?: Array<string>) => {
+  remote.dialog.showOpenDialog(options).then(result => {
-    if (filePaths !== undefined && filePaths.length > 0) {
+    const filePaths = result.filePaths;
+    if (filePaths.length > 0) {
       tryCatchReportPlatformFailures(() => {
         importFileToStore(filePaths[0], store);
       }, `${IMPORT_FLIPPER_TRACE_EVENT}:UI`);