WIP [Chore] Update dependencies

.husky/pre-commit

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname $0)/_/husky.sh"
+
+yarn lint-staged

__mocks__/my-components.js

@@ -1,9 +1,9 @@
-jest.mock('components/Arrow', () => 'Arrow');
-jest.mock('components/SvgText', () => 'SvgText');
-jest.mock('components/NodeDivider', () => 'NodeDivider');
-jest.mock('components/NodeConnections', () => 'NodeConnections');
-jest.mock('components/NodeConnection', () => 'NodeConnection');
-jest.mock('components/GenericNode', () => 'GenericNode');
-jest.mock('components/NodeState', () => 'NodeState');
-jest.mock('components/NodeStates', () => 'NodeStates');
-jest.mock('components/NodeStateBar', () => 'NodeStateBar');
+jest.mock('@components/Arrow', () => 'Arrow');
+jest.mock('@components/SvgText', () => 'SvgText');
+jest.mock('@components/NodeDivider', () => 'NodeDivider');
+jest.mock('@components/NodeConnections', () => 'NodeConnections');
+jest.mock('@components/NodeConnection', () => 'NodeConnection');
+jest.mock('@components/GenericNode', () => 'GenericNode');
+jest.mock('@components/NodeState', () => 'NodeState');
+jest.mock('@components/NodeStates', () => 'NodeStates');
+jest.mock('@components/NodeStateBar', () => 'NodeStateBar');

cypress/integration/bayesin-network/network.spec.js

@@ -1,4 +1,4 @@
-import { getComponentTestId } from 'utils/test-utils';
+import { getComponentTestId } from '@utils/test-utils';
 
 describe('Network', () => {
   it('creates a new one', () => {

cypress/integration/bayesin-network/node-connection.spec.js

@@ -1,4 +1,4 @@
-import { getComponentTestId } from 'utils/test-utils';
+import { getComponentTestId } from '@utils/test-utils';
 
 describe('Node Connection', () => {
   it('connect two nodes and then disconnect', () => {

cypress/integration/bayesin-network/node-probabilities.spec.js

@@ -1,4 +1,4 @@
-import { getComponentTestId } from 'utils/test-utils';
+import { getComponentTestId } from '@utils/test-utils';
 
 describe('Node Probabilities', () => {
   const nodeName = 'Node 1';

cypress/integration/bayesin-network/node-states.spec.js

@@ -1,4 +1,4 @@
-import { getComponentTestId } from 'utils/test-utils';
+import { getComponentTestId } from '@utils/test-utils';
 
 describe('Node States', () => {
   const nodeName = 'Node 1';

cypress/integration/bayesin-network/node.spec.js

@@ -1,4 +1,4 @@
-import { getComponentTestId } from 'utils/test-utils';
+import { getComponentTestId } from '@utils/test-utils';
 
 describe('Node', () => {
   const nodeName = 'Node 1';

jest.config.js

@@ -4,16 +4,16 @@ module.exports = {
   snapshotSerializers: ['enzyme-to-json/serializer'],
   moduleNameMapper: {
     '\\.(css|less|scss|sss|styl)$': '<rootDir>/node_modules/jest-css-modules',
-    '^json-templates(.*)$': '<rootDir>/__fixtures__$1',
-    '^components(.*)$': '<rootDir>/src/components$1',
-    '^utils(.*)$': '<rootDir>/src/utils$1',
-    '^models(.*)$': '<rootDir>/src/models$1',
-    '^reducers(.*)$': '<rootDir>/src/reducers$1',
-    '^selectors(.*)$': '<rootDir>/src/selectors$1',
-    '^actions(.*)$': '<rootDir>/src/actions$1',
-    '^decorators(.*)$': '<rootDir>/src/decorators$1',
-    '^constants(.*)$': '<rootDir>/src/constants$1',
-    '^validations(.*)$': '<rootDir>/src/validations$1',
-    '^portals(.*)$': '<rootDir>/src/portals$1',
+    '^@json-templates(.*)$': '<rootDir>/__fixtures__$1',
+    '^@components(.*)$': '<rootDir>/src/components$1',
+    '^@utils(.*)$': '<rootDir>/src/utils$1',
+    '^@models(.*)$': '<rootDir>/src/models$1',
+    '^@reducers(.*)$': '<rootDir>/src/reducers$1',
+    '^@selectors(.*)$': '<rootDir>/src/selectors$1',
+    '^@actions(.*)$': '<rootDir>/src/actions$1',
+    '^@decorators(.*)$': '<rootDir>/src/decorators$1',
+    '^@constants(.*)$': '<rootDir>/src/constants$1',
+    '^@validations(.*)$': '<rootDir>/src/validations$1',
+    '^@portals(.*)$': '<rootDir>/src/portals$1',
   },
 };

jest.setup.js

@@ -1,6 +1,6 @@
 import './__mocks__/my-components';
 
-import Adapter from 'enzyme-adapter-react-16';
+import Adapter from '@wojtekmaj/enzyme-adapter-react-17';
 import Enzyme from 'enzyme';
 
 Enzyme.configure({ adapter: new Adapter() });

jsconfig.json

@@ -5,17 +5,17 @@
     "target": "es2016",
     "jsx": "preserve",
     "paths": {
-      "json-templates/*": ["./__fixtures__/*"],
-      "components/*": ["./src/components/*"],
-      "utils/*": ["./src/utils/*"],
-      "models/*": ["./src/models/*"],
-      "reducers/*": ["./src/reducers/*"],
-      "selectors/*": ["./src/selectors/*"],
-      "actions/*": ["./src/actions/*"],
-      "decorators/*": ["./src/decorators/*"],
-      "constants/*": ["./src/constants/*"],
-      "validations/*": ["./src/validations/*"],
-      "portals/*": ["./src/portals/*"],
+      "@json-templates/*": ["./__fixtures__/*"],
+      "@components/*": ["./src/components/*"],
+      "@utils/*": ["./src/utils/*"],
+      "@models/*": ["./src/models/*"],
+      "@reducers/*": ["./src/reducers/*"],
+      "@selectors/*": ["./src/selectors/*"],
+      "@actions/*": ["./src/actions/*"],
+      "@decorators/*": ["./src/decorators/*"],
+      "@constants/*": ["./src/constants/*"],
+      "@validations/*": ["./src/validations/*"],
+      "@portals/*": ["./src/portals/*"],
     }
   },
   "exclude": [

package.json

@@ -37,7 +37,7 @@
   },
   "dependencies": {
     "@cypress/webpack-preprocessor": "^4.0.3",
-    "babel-jest": "^24.8.0",
+    "babel-jest": "^26.6.3",
     "bayesjs": "0.4.3",
     "change-case": "^3.1.0",
     "classnames": "^2.2.5",
@@ -52,9 +52,9 @@
     "postcss-preset-env": "^6.6.0",
     "prop-types": "^15.7.2",
     "ramda": "^0.26.1",
-    "react": "^16.8.6",
+    "react": "17.0.1",
     "react-contextmenu": "^2.11.0",
-    "react-dom": "^16.8.6",
+    "react-dom": "17.0.1",
     "react-file-download": "^0.3.5",
     "react-modal": "^3.1.7",
     "react-redux": "^7.0.3",
@@ -78,6 +78,7 @@
     "@commitlint/cli": "^11.0.0",
     "@commitlint/config-conventional": "^11.0.0",
     "@testing-library/react": "^9.1.4",
+    "@wojtekmaj/enzyme-adapter-react-17": "^0.4.1",
     "babel-eslint": "^10.0.1",
     "babel-loader": "^8.0.6",
     "babel-plugin-syntax-trailing-function-commas": "^6.22.0",
@@ -87,7 +88,6 @@
     "cypress": "^3.2.0",
     "cz-conventional-changelog": "3.3.0",
     "enzyme": "^3.9.0",
-    "enzyme-adapter-react-16": "^1.12.1",
     "enzyme-to-json": "^3.3.5",
     "eslint": "^5.15.2",
     "eslint-config-airbnb": "^17.1.0",
@@ -99,9 +99,10 @@
     "gh-pages": "^2.0.1",
     "husky": "^5.0.6",
     "is-ci": "^2.0.0",
-    "jest": "^24.8.0",
-    "jest-css-modules": "^2.0.0",
+    "jest": "^26.6.3",
+    "jest-css-modules": "^2.1.0",
     "json-loader": "^0.5.7",
+    "lint-staged": ">=10",
     "node-sass": "^4.12.0",
     "postcss": "^7.0.16",
     "postcss-loader": "^3.0.0",
@@ -117,5 +118,8 @@
     "commitizen": {
       "path": "./node_modules/cz-conventional-changelog"
     }
+  },
+  "lint-staged": {
+    "*.js": "lint"
   }
 }

src/actions/editing-node-cpt.js

@@ -1,8 +1,8 @@
 import {
-  EDITING_NODE_CPT,
   CANCEL_EDITING_NODE_CPT,
+  EDITING_NODE_CPT,
   SAVE_EDITING_NODE_CPT,
-} from 'constants/editing-node-cpt';
+} from '@constants/editing-node-cpt';
 
 export const onEditingNodeCpt = node => ({
   type: EDITING_NODE_CPT,

src/actions/editing-node-cpt.test.js

@@ -1,8 +1,8 @@
 import {
-  EDITING_NODE_CPT,
   CANCEL_EDITING_NODE_CPT,
+  EDITING_NODE_CPT,
   SAVE_EDITING_NODE_CPT,
-} from 'constants/editing-node-cpt';
+} from '@constants/editing-node-cpt';
 import {
   onCancelEditingNodeCpt,
   onEditingNodeCpt,

src/actions/editing-node-states.js

@@ -1,8 +1,8 @@
 import {
-  EDITING_NODE_STATES,
   CANCEL_EDITING_NODE_STATES,
+  EDITING_NODE_STATES,
   SAVE_EDITING_NODE_STATES,
-} from 'constants/editing-node-states';
+} from '@constants/editing-node-states';
 
 export const onEditingNodeStates = node => ({
   type: EDITING_NODE_STATES,

src/actions/editing-node-states.test.js

@@ -1,8 +1,8 @@
 import {
-  EDITING_NODE_STATES,
   CANCEL_EDITING_NODE_STATES,
+  EDITING_NODE_STATES,
   SAVE_EDITING_NODE_STATES,
-} from 'constants/editing-node-states';
+} from '@constants/editing-node-states';
 import {
   onCancelEditingNodeStates,
   onEditingNodeStates,

src/actions/index.js

@@ -1,4 +1,4 @@
-import { NETWORK_KINDS } from 'constants/network';
+import { NETWORK_KINDS } from '@constants/network';
 
 export const PERSIST_STATE = 'PERSIST_STATE';
 export const NEW_NETWORK = 'NEW_NETWORK';

src/actions/index.test.js

@@ -1,37 +1,38 @@
-import { NETWORK_KINDS } from 'constants/network';
+import { NETWORK_KINDS } from '@constants/network';
 import {
-  persistState,
-  newNetwork,
-  loadNetwork,
-  setBelief,
-  changeNodeId,
-  changeNodePosition,
-  changeNodeDescription,
-  addNode,
-  addLinkage,
-  addSuperNode,
-  removeSuperNode,
-  removeLinkage,
-  PERSIST_STATE,
-  NEW_NETWORK,
-  LOAD_NETWORK,
-  SET_BELIEF,
-  CHANGE_NODE_ID,
-  CHANGE_NODE_POSITION,
-  CHANGE_NODE_DESCRIPTION,
-  ADD_NODE,
   ADD_LINKAGE,
+  ADD_NODE,
+  ADD_PARENT,
   ADD_SUPER_NODE,
-  REMOVE_SUPER_NODE,
+  CHANGE_NODE_DESCRIPTION,
+  CHANGE_NODE_ID,
+  CHANGE_NODE_POSITION,
+  LOAD_NETWORK,
+  NEW_NETWORK,
+  PERSIST_STATE,
   REMOVE_LINKAGE,
-  removeNode,
   REMOVE_NODE,
+  REMOVE_PARENT,
+  REMOVE_SUPER_NODE,
+  SET_BELIEF,
+  addLinkage,
+  addNode,
   addParent,
-  ADD_PARENT,
+  addSuperNode,
+  changeNodeDescription,
+  changeNodeId,
+  changeNodePosition,
+  loadNetwork,
+  newNetwork,
+  persistState,
+  removeLinkage,
+  removeNode,
   removeParent,
-  REMOVE_PARENT,
+  removeSuperNode,
+  setBelief,
 } from './index';
 
+
 const persistStateAction = {
   type: PERSIST_STATE,
 };

src/actions/network.js

@@ -1,14 +1,13 @@
 import {
-  persistState,
-  UPDATE_NETWORK_NAME,
   UPDATE_NETWORK_DESCRIPTION,
-  UPDATE_NETWORK_WIDTH,
   UPDATE_NETWORK_HEIGHT,
   UPDATE_NETWORK_INFERENCE_ENABLED,
+  UPDATE_NETWORK_NAME,
   UPDATE_NETWORK_PROPERTIES_PANEL_VISIBLE,
   UPDATE_NETWORK_SELECTED_NODES,
-} from 'actions';
-
+  UPDATE_NETWORK_WIDTH,
+  persistState,
+} from '@actions';
 
 export const onUpdateNetworkName = name => (dispatch) => {
   dispatch({

src/actions/network.test.js

@@ -1,25 +1,23 @@
 import {
   PERSIST_STATE,
-  UPDATE_NETWORK_NAME,
   UPDATE_NETWORK_DESCRIPTION,
-  UPDATE_NETWORK_WIDTH,
   UPDATE_NETWORK_HEIGHT,
   UPDATE_NETWORK_INFERENCE_ENABLED,
+  UPDATE_NETWORK_NAME,
   UPDATE_NETWORK_PROPERTIES_PANEL_VISIBLE,
   UPDATE_NETWORK_SELECTED_NODES,
-} from 'actions';
-
+  UPDATE_NETWORK_WIDTH,
+} from '@actions';
 import {
-  onUpdateNetworkName,
   onUpdateNetworkDescription,
-  onUpdateNetworkWidth,
   onUpdateNetworkHeight,
   onUpdateNetworkInferenceEnabled,
+  onUpdateNetworkName,
   onUpdateNetworkPropertiesPanelVisible,
   onUpdateNetworkSelectedNodes,
+  onUpdateNetworkWidth,
 } from './network';
 
-
 const persistStateAction = {
   type: PERSIST_STATE,
 };

src/components/AddNodeModal/index.js

@@ -1,14 +1,14 @@
 import React, { Component } from 'react';
-import { nodePropTypes, positionPropTypes } from 'models';
+import { nodePropTypes, positionPropTypes } from '@models';
 
-import Button from 'components/Button';
-import Modal from 'components/Modal';
+import Button from '@components/Button';
+import Modal from '@components/Modal';
+import NodeAddState from '@components/NodeAddState';
+import NodeStatesEditList from '@components/NodeStatesEditList';
 import PropTypes from 'prop-types';
-import { addNode } from 'actions';
+import { addNode } from '@actions';
 import { connect } from 'react-redux';
-import { getNodes } from 'selectors';
-import NodeStatesEditList from 'components/NodeStatesEditList';
-import NodeAddState from 'components/NodeAddState';
+import { getNodes } from '@selectors';
 import styles from './styles.css';
 
 const initialState = {

src/components/App/index.js

@@ -1,12 +1,12 @@
 import React, { Component } from 'react';
 
 import { connect } from 'react-redux';
-import {
-  getNetworkKind,
-} from 'selectors';
 import Canvas from '../Canvas';
 import Header from '../Header';
 import PropertiesPanel from '../PropertiesPanel';
+import {
+  getNetworkKind,
+} from '@selectors';
 import styles from './styles.css';
 
 class App extends Component {

src/components/Arrow/component.js

@@ -1,11 +1,12 @@
+import { contextMenuItemPropTypes, positionPropTypes } from '@models/';
+
+import { CONTEXTMENU_TYPES } from '@constants/contextmenu';
+import ContextMenu from '@components/ContextMenu';
 import PropTypes from 'prop-types';
 import React from 'react';
-import { getComponentTestId } from 'utils/test-utils';
+import { getComponentTestId } from '@utils/test-utils';
 import { noop } from 'lodash';
 import { pick } from 'ramda';
-import { positionPropTypes, contextMenuItemPropTypes } from 'models';
-import { CONTEXTMENU_TYPES } from 'constants/contextmenu';
-import ContextMenu from 'components/ContextMenu';
 
 const style = {
   transition: 'stroke-opacity 0.2s',