Skip to content

Commit 74594b0

Browse files
Marc-Andre-RivetMarc-Andre-Rivet
authored
React 16.13 (#1145)
1 parent 38994eb commit 74594b0

19 files changed

+6603
-2943
lines changed

‎CHANGELOG.md

+4
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,10 @@
22
All notable changes to `dash` will be documented in this file.
33
This project adheres to [Semantic Versioning](http://semver.org/).
44

5+
## [Unreleased]
6+
### Changed
7+
- [#1145](https://github.com/plotly/dash/pull/1145) Update from React 16.8.6 to 16.13.0
8+
59
## [1.9.1] - 2020-02-27
610
### Added
711
- [#1133](github.com/plotly/dash/pull/1133) Allow the `compress` config variable to be set with an environment variable with DASH_COMPRESS=FALSE

‎dash-renderer/.eslintrc.json

+2-1
Original file line numberDiff line numberDiff line change
@@ -102,6 +102,7 @@
102102
"no-new-wrappers": ["error"],
103103
"no-param-reassign": ["error"],
104104
"no-process-env": ["warn"],
105+
"no-prototype-builtins": ["off"],
105106
"no-proto": ["error"],
106107
"no-redeclare": ["error"],
107108
"no-return-assign": ["error"],
@@ -141,7 +142,7 @@
141142
}],
142143
"no-magic-numbers": ["error", {
143144
"ignoreArrayIndexes": true,
144-
"ignore": [-1, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 100, 10, 16, 0.5, 25]
145+
"ignore": [-1, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 100, 10, 16, 0.5, 25, 200, 500]
145146
}],
146147
"no-underscore-dangle": ["off"],
147148
"no-useless-escape": ["off"]

‎dash-renderer/package-lock.json

+6,497-2,794
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dash-renderer/package.json

+38-38
Original file line numberDiff line numberDiff line change
@@ -20,48 +20,48 @@
2020
"author": "chriddyp",
2121
"license": "MIT",
2222
"dependencies": {
23-
"react": "16.8.6",
24-
"react-dom": "16.8.6",
23+
"@babel/polyfill": "7.8.7",
24+
"cookie": "^0.4.0",
25+
"dependency-graph": "^0.9.0",
2526
"prop-types": "15.7.2",
26-
"cookie": "^0.3.1",
27-
"dependency-graph": "^0.5.0",
28-
"radium": "^0.22.1",
29-
"ramda": "^0.26.1",
30-
"react-redux": "^4.4.5",
31-
"redux": "^3.4.0",
32-
"redux-actions": "^0.9.1",
33-
"redux-thunk": "^2.0.1",
34-
"viz.js": "1.8.0"
27+
"radium": "^0.26.0",
28+
"ramda": "^0.27.0",
29+
"react": "16.13.0",
30+
"react-dom": "16.13.0",
31+
"react-redux": "^7.2.0",
32+
"redux": "^4.0.5",
33+
"redux-actions": "^2.6.5",
34+
"redux-thunk": "^2.3.0",
35+
"viz.js": "2.1.2"
3536
},
3637
"devDependencies": {
37-
"@babel/core": "^7.6.0",
38-
"@babel/plugin-transform-modules-commonjs": "^7.6.0",
39-
"@babel/polyfill": "7.7.0",
40-
"@babel/preset-env": "^7.6.0",
41-
"@babel/preset-react": "^7.0.0",
42-
"@plotly/dash-component-plugins": "^1.0.2",
43-
"@svgr/webpack": "^4.1.0",
44-
"babel-eslint": "^10.0.3",
38+
"@babel/core": "^7.8.7",
39+
"@babel/plugin-transform-modules-commonjs": "^7.8.3",
40+
"@babel/preset-env": "^7.8.7",
41+
"@babel/preset-react": "^7.8.3",
42+
"@plotly/dash-component-plugins": "^1.2.0",
43+
"@svgr/webpack": "^5.2.0",
44+
"babel-eslint": "^10.1.0",
4545
"babel-loader": "^8.0.6",
46-
"css-loader": "^3.2.0",
47-
"es-check": "^5.0.0",
48-
"eslint": "^5.15.3",
49-
"eslint-config-airbnb": "^17.1.0",
50-
"eslint-config-prettier": "^3.6.0",
51-
"eslint-plugin-import": "^2.16.0",
52-
"eslint-plugin-jsx-a11y": "^6.2.1",
53-
"eslint-plugin-prettier": "^3.0.1",
54-
"eslint-plugin-react": "^7.12.4",
55-
"jest": "^24.9.0",
56-
"prettier": "^1.16.4",
57-
"prettier-eslint": "^8.8.2",
58-
"prettier-eslint-cli": "^4.7.1",
46+
"css-loader": "^3.4.2",
47+
"es-check": "^5.1.0",
48+
"eslint": "^6.8.0",
49+
"eslint-config-airbnb": "^18.0.1",
50+
"eslint-config-prettier": "^6.10.0",
51+
"eslint-plugin-import": "^2.20.1",
52+
"eslint-plugin-jsx-a11y": "^6.2.3",
53+
"eslint-plugin-prettier": "^3.1.2",
54+
"eslint-plugin-react": "^7.18.3",
55+
"jest": "^25.1.0",
56+
"prettier": "^1.19.1",
57+
"prettier-eslint": "^9.0.1",
58+
"prettier-eslint-cli": "^5.0.0",
5959
"prettier-stylelint": "^0.4.2",
60-
"style-loader": "^1.0.0",
61-
"webpack": "^4.39.3",
62-
"webpack-cli": "^3.3.8",
63-
"webpack-dev-server": "^3.1.11",
64-
"webpack-serve": "^3.1.1",
65-
"whatwg-fetch": "^2.0.2"
60+
"style-loader": "^1.1.3",
61+
"webpack": "^4.42.0",
62+
"webpack-cli": "^3.3.11",
63+
"webpack-dev-server": "^3.10.3",
64+
"webpack-serve": "^3.2.0",
65+
"whatwg-fetch": "^3.0.0"
6666
}
6767
}

‎dash-renderer/src/APIController.react.js

+45-65
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import {connect} from 'react-redux';
22
import {includes, isEmpty, isNil} from 'ramda';
3-
import React, {Component} from 'react';
3+
import React, {useEffect, useState} from 'react';
44
import PropTypes from 'prop-types';
55
import TreeContainer from './TreeContainer';
66
import GlobalErrorContainer from './components/error/GlobalErrorContainer.react';
@@ -17,24 +17,13 @@ import {STATUS} from './constants/constants';
1717

1818
/**
1919
* Fire off API calls for initialization
20+
* @param {*} props props
21+
* @returns {*} component
2022
*/
21-
class UnconnectedContainer extends Component {
22-
constructor(props) {
23-
super(props);
24-
this.initialization = this.initialization.bind(this);
25-
this.state = {
26-
errorLoading: false,
27-
};
28-
}
29-
componentDidMount() {
30-
this.initialization(this.props);
31-
}
32-
33-
componentWillReceiveProps(props) {
34-
this.initialization(props);
35-
}
23+
const UnconnectedContainer = props => {
24+
const [errorLoading, setErrorLoading] = useState(false);
3625

37-
initialization(props) {
26+
useEffect(() => {
3827
const {
3928
appLifecycle,
4029
dependenciesRequest,
@@ -81,74 +70,65 @@ class UnconnectedContainer extends Component {
8170
// Hasn't already hydrated
8271
appLifecycle === getAppState('STARTED')
8372
) {
84-
let errorLoading = false;
73+
let error = false;
8574
try {
8675
dispatch(hydrateInitialOutputs());
8776
} catch (err) {
88-
errorLoading = true;
77+
error = true;
8978
} finally {
90-
this.setState(state =>
91-
state.errorLoading !== errorLoading ? {errorLoading} : null
92-
);
79+
setErrorLoading(error);
9380
}
9481
}
95-
}
82+
});
9683

97-
render() {
98-
const {
99-
appLifecycle,
100-
dependenciesRequest,
101-
layoutRequest,
102-
layout,
103-
config,
104-
} = this.props;
105-
106-
const {errorLoading} = this.state;
84+
const {
85+
appLifecycle,
86+
dependenciesRequest,
87+
layoutRequest,
88+
layout,
89+
config,
90+
} = props;
10791

108-
if (
109-
layoutRequest.status &&
110-
!includes(layoutRequest.status, [STATUS.OK, 'loading'])
111-
) {
112-
return <div className="_dash-error">Error loading layout</div>;
113-
} else if (
114-
errorLoading ||
115-
(dependenciesRequest.status &&
116-
!includes(dependenciesRequest.status, [STATUS.OK, 'loading']))
117-
) {
118-
return (
119-
<div className="_dash-error">Error loading dependencies</div>
120-
);
121-
} else if (
122-
appLifecycle === getAppState('HYDRATED') &&
123-
config.ui === true
124-
) {
125-
return (
126-
<GlobalErrorContainer>
127-
<TreeContainer
128-
_dashprivate_layout={layout}
129-
_dashprivate_path={[]}
130-
/>
131-
</GlobalErrorContainer>
132-
);
133-
} else if (appLifecycle === getAppState('HYDRATED')) {
134-
return (
92+
if (
93+
layoutRequest.status &&
94+
!includes(layoutRequest.status, [STATUS.OK, 'loading'])
95+
) {
96+
return <div className="_dash-error">Error loading layout</div>;
97+
} else if (
98+
errorLoading ||
99+
(dependenciesRequest.status &&
100+
!includes(dependenciesRequest.status, [STATUS.OK, 'loading']))
101+
) {
102+
return <div className="_dash-error">Error loading dependencies</div>;
103+
} else if (appLifecycle === getAppState('HYDRATED') && config.ui === true) {
104+
return (
105+
<GlobalErrorContainer>
135106
<TreeContainer
136107
_dashprivate_layout={layout}
137108
_dashprivate_path={[]}
138109
/>
139-
);
140-
}
141-
142-
return <div className="_dash-loading">Loading...</div>;
110+
</GlobalErrorContainer>
111+
);
112+
} else if (appLifecycle === getAppState('HYDRATED')) {
113+
return (
114+
<TreeContainer
115+
_dashprivate_layout={layout}
116+
_dashprivate_path={[]}
117+
/>
118+
);
143119
}
144-
}
120+
121+
return <div className="_dash-loading">Loading...</div>;
122+
};
123+
145124
UnconnectedContainer.propTypes = {
146125
appLifecycle: PropTypes.oneOf([
147126
getAppState('STARTED'),
148127
getAppState('HYDRATED'),
149128
]),
150129
dispatch: PropTypes.func,
151130
dependenciesRequest: PropTypes.object,
131+
graphs: PropTypes.object,
152132
layoutRequest: PropTypes.object,
153133
layout: PropTypes.object,
154134
paths: PropTypes.object,

‎dash-renderer/src/AccessDenied.react.js

-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
/* global window:true, document:true */
21
import React from 'react';
32
import {mergeRight, once} from 'ramda';
43
import PropTypes from 'prop-types';
@@ -31,7 +30,6 @@ function AccessDenied(props) {
3130
<a
3231
style={styles.base.a}
3332
onClick={() => {
34-
/* eslint no-empty: ["error", { "allowEmptyCatch": true }] */
3533
try {
3634
document.cookie =
3735
`${constants.OAUTH_COOKIE_NAME}=; ` +

‎dash-renderer/src/AppContainer.react.js

+1-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
/* global document:true */
21
import {connect} from 'react-redux';
32
import React from 'react';
43
import PropTypes from 'prop-types';
@@ -21,7 +20,7 @@ class UnconnectedAppContainer extends React.Component {
2120
}
2221
}
2322

24-
componentWillMount() {
23+
UNSAFE_componentWillMount() {
2524
const {dispatch} = this.props;
2625
const config = JSON.parse(
2726
document.getElementById('_dash-config').textContent

‎dash-renderer/src/DashRenderer.js

-4
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,3 @@
1-
/* eslint-env browser */
2-
3-
'use strict';
4-
51
import React from 'react';
62
import ReactDOM from 'react-dom';
73
import AppProvider from './AppProvider.react';

‎dash-renderer/src/actions/api.js

-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
/* global fetch: true */
21
import {mergeDeepRight} from 'ramda';
32
import {handleAsyncError, getCSRFHeader} from '../actions';
43
import {urlBase} from '../utils';

‎dash-renderer/src/actions/index.js

+5-10
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
/* global fetch:true, Promise:true, document:true */
21
import {
32
adjust,
43
any,
@@ -429,9 +428,8 @@ export function notifyObservers(payload) {
429428
);
430429
}
431430

432-
/* eslint-disable consistent-return */
431+
/* eslint-disable-next-line consistent-return */
433432
return Promise.all(promises);
434-
/* eslint-enable consistent-return */
435433
};
436434
}
437435

@@ -645,13 +643,13 @@ function updateOutput(
645643
return;
646644
}
647645

648-
/* eslint-disable no-console */
646+
/* eslint-disable-next-line no-console */
649647
console.error(
650648
`The following error occurred while executing ${clientside_function.namespace}.${clientside_function.function_name} ` +
651649
`in order to update component "${payload.output}" ⋁⋁⋁`
652650
);
651+
/* eslint-disable-next-line no-console */
653652
console.error(e);
654-
/* eslint-enable no-console */
655653

656654
/*
657655
* Update the request queue by treating an unsuccessful clientside
@@ -665,15 +663,14 @@ function updateOutput(
665663

666664
// Returning promises isn't support atm
667665
if (type(returnValue) === 'Promise') {
668-
/* eslint-disable no-console */
666+
/* eslint-disable-next-line no-console */
669667
console.error(
670668
'The clientside function ' +
671669
`${clientside_function.namespace}.${clientside_function.function_name} ` +
672670
'returned a Promise instead of a value. Promises are not ' +
673671
'supported in Dash clientside right now, but may be in the ' +
674672
'future.'
675673
);
676-
/* eslint-enable no-console */
677674
updateRequestQueue(true, STATUS.CLIENTSIDE_ERROR);
678675
return;
679676
}
@@ -736,12 +733,10 @@ function updateOutput(
736733
hooks.request_pre(payload);
737734
}
738735

739-
/* eslint-disable consistent-return */
736+
/* eslint-disable-next-line consistent-return */
740737
return fetch(
741738
`${urlBase(config)}_dash-update-component`,
742739
mergeDeepRight(config.fetch, {
743-
/* eslint-enable consistent-return */
744-
745740
method: 'POST',
746741
headers: getCSRFHeader(),
747742
body: JSON.stringify(payload),

‎dash-renderer/src/components/core/DocumentTitle.react.js

+1-3
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,3 @@
1-
/* global document:true */
2-
31
import {connect} from 'react-redux';
42
import {any} from 'ramda';
53
import {Component} from 'react';
@@ -13,7 +11,7 @@ class DocumentTitle extends Component {
1311
};
1412
}
1513

16-
componentWillReceiveProps(props) {
14+
UNSAFE_componentWillReceiveProps(props) {
1715
if (any(r => r.status === 'loading', props.requestQueue)) {
1816
document.title = 'Updating...';
1917
} else {

‎dash-renderer/src/components/core/Reloader.react.js

-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
/* eslint-disable no-undef,react/no-did-update-set-state,no-magic-numbers */
21
import {
32
comparator,
43
equals,

0 commit comments

Comments
 (0)