Merge pull request #334 from complexdatacollective/feature/npm7

npm7 upgrade

.eslintrc.json

@@ -6,7 +6,7 @@
         "es6": true,
         "node": true
     },
-    "parser": "babel-eslint",
+    "parser": "@babel/eslint-parser",
     "parserOptions": {
         "ecmaVersion": 7,
         "ecmaFeatures": {
@@ -23,6 +23,7 @@
       "react/forbid-prop-types": "off",
       "react/no-array-index-key": "off",
       "import/no-extraneous-dependencies": ["error", { "devDependencies": true }],
+      "jsx-a11y/click-events-have-key-events": "off",
       "no-mixed-operators": [1, {"allowSamePrecedence": true}]
     }
 }

README.md

@@ -50,7 +50,7 @@ Run `npm run` for a list of all available commands.
 
 ### Node.js/NPM Versions
 
-This project currently requires Node.js `12.14.1` to match the version used by Electron, and version `6.13.4` of npm.
+This project currently requires Node.js `12.14.1` to match the version used by Electron, and version `7.6.3` of npm.
 
 ### [MDNS](https://www.npmjs.com/package/mdns)
 

config/webpackDevServer.config.js

@@ -69,7 +69,7 @@ module.exports = function(proxy, allowedHost) {
     },
     // Enable HTTPS if the HTTPS environment variable is set to 'true'
     https: protocol === 'https',
-    host: host,
+    host,
     overlay: false,
     historyApiFallback: {
       // Paths with dots should still use the history fallback.
@@ -86,7 +86,13 @@ module.exports = function(proxy, allowedHost) {
       // We do this in development to avoid hitting the production cache if
       // it used the same host and port.
       // https://github.com/facebookincubator/create-react-app/issues/2272#issuecomment-302832432
-      app.use(noopServiceWorkerMiddleware());
+      app.use(noopServiceWorkerMiddleware('/'));
     },
+    // Use 'ws' instead of 'sockjs-node' on server since we're using native
+    // websockets in `webpackHotDevClient`.
+    transportMode: 'ws',
+    // Prevent a WS client from getting injected as we're already including
+    // `webpackHotDevClient`.
+    injectClient: false,
   };
 };

package.json

@@ -1,13 +1,13 @@
 {
     "name": "network-canvas-server-6",
-    "version": "6.0.1",
+    "version": "6.1.0",
     "productName": "Network Canvas Server",
     "description": "A tool for storing, analyzing, and exporting Network Canvas interview data.",
     "private": true,
     "author": "Complex Data Collective",
     "engines": {
         "node": "12.14.1",
-        "npm": "6.13.4"
+        "npm": "7.6.3"
     },
     "scripts": {
         "start": "cross-env PORT=4000 BUILD_TARGET=web node scripts/start.js",
@@ -40,6 +40,7 @@
     },
     "devDependencies": {
         "@babel/core": "^7.13.8",
+        "@babel/eslint-parser": "^7.13.10",
         "@babel/plugin-proposal-class-properties": "^7.10.4",
         "@babel/plugin-proposal-json-strings": "^7.10.4",
         "@babel/plugin-syntax-import-meta": "^7.10.4",
@@ -49,7 +50,6 @@
         "@babel/preset-env": "^7.13.8",
         "@babel/preset-react": "^7.12.3",
         "autoprefixer": "^9.8.6",
-        "babel-eslint": "^9.0.0",
         "babel-jest": "^25.5.1",
         "babel-loader": "^8.1.0",
         "case-sensitive-paths-webpack-plugin": "^2.1.2",
@@ -58,30 +58,31 @@
         "css-loader": "^1.0.0",
         "dotenv": "^6.0.0",
         "electron": "9.4.4",
-        "electron-builder": "^22.8.0",
+        "electron-builder": "^22.10.5",
         "electron-devtools-installer": "^2.2.4",
         "electron-log": "^4.2.4",
         "electron-notarize": "^1.0.0",
+        "enzyme": "^3.11.0",
         "enzyme-adapter-react-16": "^1.15.3",
         "enzyme-to-json": "^3.5.0",
-        "enzyme": "^3.11.0",
-        "eslint-config-airbnb": "^15.0.1",
-        "eslint-config-react-app": "^2.1.0",
-        "eslint-loader": "^2.2.1",
-        "eslint-plugin-import": "^2.22.0",
-        "eslint-plugin-jsx-a11y": "5.1.1",
+        "eslint": "^7.22.0",
+        "eslint-config-airbnb": "^18.2.1",
+        "eslint-config-react-app": "^6.0.0",
+        "eslint-loader": "^4.0.2",
+        "eslint-plugin-flowtype": "^5.2.0",
+        "eslint-plugin-import": "2.22.1",
+        "eslint-plugin-jsx-a11y": "6.4.1",
         "eslint-plugin-react": "^7.20.6",
-        "eslint": "^4.1.1",
         "eventemitter3": "^4.0.7",
         "faker": "^4.1.0",
         "file-loader": "^1.1.11",
         "framer-motion": "^2.9.1",
         "fs-extra": "^6.0.1",
         "html-webpack-plugin": "^4.3.0",
-        "icon-gen": "^1.2.1",
+        "icon-gen": "~2.1.0",
         "istanbul-lib-coverage": "^1.2.0",
-        "jest-fetch-mock": "^1.6.5",
         "jest": "^25.5.4",
+        "jest-fetch-mock": "^1.6.5",
         "jsdoc": "^3.6.5",
         "json-loader": "^0.5.7",
         "jssha": "^3.1.0",
@@ -94,7 +95,7 @@
         "react-dropzone": "^11.2.0",
         "react-markdown": "^3.6.0",
         "react-redux": "^7.2.1",
-        "react-virtualized": "^9.22.2",
+        "react-virtualized": "^9.22.3",
         "redux-logger": "^3.0.6",
         "redux-persist": "^6.0.0",
         "regenerator-runtime": "^0.13.7",
@@ -107,14 +108,14 @@
         "supertest": "^5.0.0",
         "swagger-jsdoc": "^3.7.0",
         "url-loader": "^1.0.1",
+        "webpack": "^4.44.1",
         "webpack-dev-server": "^3.11.0",
         "webpack-manifest-plugin": "^2.0.4",
-        "webpack": "^4.44.1",
         "whatwg-fetch": "2.0.2"
     },
     "dependencies": {
         "@babel/runtime": "^7.11.2",
-        "@codaco/ui": "^4.0.1",
+        "@codaco/ui": "^5.0.0",
         "animejs": "^2.2.0",
         "archiver": "^4.0.1",
         "async": "^3.2.0",
@@ -126,23 +127,23 @@
         "jszip": "^3.4.0",
         "libsodium-wrappers": "^0.7.8",
         "lodash": "^4.17.20",
-        "mdns": "^2.5.1",
+        "mdns": "^2.7.2",
         "mississippi": "^4.0.0",
         "nedb": "^1.8.0",
         "object-hash": "^1.3.0",
         "prop-types": "^15.6.2",
         "react": "^16.13.1",
         "react-dom": "^16.13.1",
         "react-error-overlay": "^5.0.0-next.3e165448",
-        "react-identicons": "^1.2.4",
+        "react-identicons": "1.2.4",
         "react-router-dom": "^4.3.1",
         "react-sortable-hoc": "^0.6.8",
         "react-test-renderer": "^16.13.1",
         "react-tooltip": "^4.2.10",
         "react-transition-group": "^2.5.0",
         "recharts": "^1.0.1",
-        "recompose": "^0.26.0",
-        "redux": "^3.6.0",
+        "recompose": "^0.30.0",
+        "redux": "^4.0.5",
         "redux-actions": "~2.6.5",
         "redux-thunk": "^2.3.0",
         "reselect": "^3.0.0",
@@ -152,7 +153,7 @@
         "split": "^1.0.1",
         "thread-loader": "^1.1.5",
         "uuid": "^3.3.2",
-        "xmldom": "^0.5.0"
+        "xmldom": "0.5.0"
     },
     "browserslist": [
         "Electron 9.4.4"

scripts/start.js

@@ -7,7 +7,7 @@ process.env.NODE_ENV = 'development';
 // Makes the script crash on unhandled rejections instead of silently
 // ignoring them. In the future, promise rejections that are not handled will
 // terminate the Node.js process with a non-zero exit code.
-process.on('unhandledRejection', err => {
+process.on('unhandledRejection', (err) => {
   throw err;
 });
 
@@ -46,27 +46,35 @@ const HOST = process.env.HOST || '0.0.0.0';
 // We attempt to use the default port but if it is busy, we offer the user to
 // run on a different port. `detect()` Promise resolves to the next free port.
 choosePort(HOST, DEFAULT_PORT)
-  .then(port => {
+  .then((port) => {
     if (port == null) {
       // We have not found a port.
       return;
     }
     const protocol = process.env.HTTPS === 'true' ? 'https' : 'http';
+    // eslint-disable-next-line global-require,import/no-dynamic-require
     const appName = require(paths.appPackageJson).name;
     const urls = prepareUrls(protocol, HOST, port);
     // Create a webpack compiler that is configured with custom messages.
-    const compiler = createCompiler(webpack, config, appName, urls, useYarn);
+    const compiler = createCompiler({
+      webpack,
+      config,
+      appName,
+      urls,
+      useYarn,
+    });
     // Load proxy config
+    // eslint-disable-next-line global-require,import/no-dynamic-require
     const proxySetting = require(paths.appPackageJson).proxy;
     const proxyConfig = prepareProxy(proxySetting, paths.appPublic);
     // Serve webpack assets generated by the compiler over a web sever.
     const serverConfig = createDevServerConfig(
       proxyConfig,
-      urls.lanUrlForConfig
+      urls.lanUrlForConfig,
     );
     const devServer = new WebpackDevServer(compiler, serverConfig);
     // Launch WebpackDevServer.
-    devServer.listen(port, HOST, err => {
+    devServer.listen(port, HOST, (err) => {
       if (err) {
         return console.log(err);
       }
@@ -79,14 +87,14 @@ choosePort(HOST, DEFAULT_PORT)
       }
     });
 
-    ['SIGINT', 'SIGTERM'].forEach(function(sig) {
-      process.on(sig, function() {
+    ['SIGINT', 'SIGTERM'].forEach((sig) => {
+      process.on(sig, () => {
         devServer.close();
         process.exit();
       });
     });
   })
-  .catch(err => {
+  .catch((err) => {
     if (err && err.message) {
       console.log(err.message);
     }

src/__factories__/edge.js

@@ -2,7 +2,7 @@ const { Factory } = require('rosie');
 const { times } = require('lodash');
 
 const edge = new Factory()
-  .option('range', times(100, n => n))
+  .option('range', times(100, (n) => n))
   .option('nodes', null)
   .attr('from', ['nodes', 'range'], (nodes, range) => {
     const ids = nodes ? nodes.map(({ _uid }) => _uid) : range;

src/__factories__/network.js

@@ -9,8 +9,8 @@ const network = new Factory()
     caseId: faker.random.uuid(),
   }))
   .attr('ego', () => node.build())
-  .attr('nodes', ['size'], size => node.buildList(size))
-  .attr('edges', ['nodes'], nodes => edge.buildList(Math.ceil(nodes.length / 3), null, { nodes }));
+  .attr('nodes', ['size'], (size) => node.buildList(size))
+  .attr('edges', ['nodes'], (nodes) => edge.buildList(Math.ceil(nodes.length / 3), null, { nodes }));
 
 module.exports = {
   default: network,

src/__factories__/resolution.js

@@ -8,7 +8,7 @@ const resolution = new Factory()
   .option('transformCount', null)
   .option('attributes', {})
   .attr('id', () => uuid())
-  .sequence('date', i => DateTime.local().minus({ days: i }).toJSDate())
+  .sequence('date', (i) => DateTime.local().minus({ days: i }).toJSDate())
   .attr(
     'transforms',
     ['transformCount', 'network', 'attributes'],

src/__factories__/session.js

@@ -3,7 +3,7 @@ const { DateTime } = require('luxon');
 const { network } = require('./network');
 
 const session = new Factory().extend(network)
-  .sequence('date', i => DateTime.local().minus({ days: i }).toJSDate());
+  .sequence('date', (i) => DateTime.local().minus({ days: i }).toJSDate());
 
 module.exports = {
   default: session,

src/main/MainApp.js

@@ -58,18 +58,17 @@ const createApp = () => {
     });
   };
 
-  const showImportProtocolDialog = () =>
-    protocolManager.presentImportProtocolDialog(mainWindow.window)
-      .then(() => mainWindow.send(FileImportUpdated))
-      .catch((err) => {
-        dialog.showErrorBox('Protocol Import Error', err && err.message);
-      });
-
-  const showImportSessionDialog = () =>
-    protocolManager.presentImportSessionDialog(mainWindow.window)
-      .catch((err) => {
-        dialog.showErrorBox('Session Import Error', err && err.message);
-      });
+  const showImportProtocolDialog = () => protocolManager.presentImportProtocolDialog(
+    mainWindow.window,
+  ).then(() => mainWindow.send(FileImportUpdated)).catch((err) => {
+    dialog.showErrorBox('Protocol Import Error', err && err.message);
+  });
+
+  const showImportSessionDialog = () => protocolManager.presentImportSessionDialog(
+    mainWindow.window,
+  ).catch((err) => {
+    dialog.showErrorBox('Session Import Error', err && err.message);
+  });
 
   const generateTestSessions = (number) => {
     protocolManager.allProtocols().then((allProtocols) => {

src/main/components/__tests__/tray-test.js

@@ -40,4 +40,3 @@ describe('tray', () => {
     });
   });
 });
-

src/main/components/loadDevToolsExtensions.js

@@ -6,7 +6,7 @@ const loadDevToolsExtensions = () => {
     return;
   }
   try {
-    extensions.split(';').forEach(filepath => BrowserWindow.addDevToolsExtension(filepath));
+    extensions.split(';').forEach((filepath) => BrowserWindow.addDevToolsExtension(filepath));
   } catch (err) {
     /* eslint-disable no-console, global-require */
     const chalk = require('chalk');

src/main/data-managers/DeviceDB.js

@@ -6,7 +6,7 @@ const { resolveOrReject } = require('../utils/db');
 
 const missingRequiredIdMessage = 'Cannot delete device without an id';
 
-const withDefaultName = dbDevice => ({
+const withDefaultName = (dbDevice) => ({
   name: `Device ${dbDevice._id.substr(0, 6)}`,
   ...dbDevice,
 });
@@ -24,7 +24,7 @@ class DeviceDB extends DatabaseAdapter {
   }
 
   all() {
-    return super.all().then(docs => docs.map(withDefaultName));
+    return super.all().then((docs) => docs.map(withDefaultName));
   }
 
   destroyAll() {

src/main/data-managers/ExportManager.js

@@ -41,7 +41,7 @@ class ExportManager {
 
     // Get all sessions associated with this protocol
     const sessions = await this.sessionDB.findAll(protocol._id, null, null)
-      .then(s => s.map(session => ({ ...session.data })));
+      .then((s) => s.map((session) => ({ ...session.data })));
 
     return [sessions, formatProtocol(protocol, sessions)];
   }
@@ -79,8 +79,7 @@ class ExportManager {
       .then(([sessions, protocols]) => {
         const fileExportManager = new FileExportManager(options);
 
-        const exportSessions = () =>
-          fileExportManager.exportSessions(sessions, protocols);
+        const exportSessions = () => fileExportManager.exportSessions(sessions, protocols);
 
         return { exportSessions, fileExportManager };
       });