From 386f47aa789ac74efe5770a35b8983e8323e2aad Mon Sep 17 00:00:00 2001
From: Tim Klever <Tim.V.Klever@aexp.com>
Date: Thu, 6 Aug 2020 20:16:40 -0700
Subject: [PATCH] Remove UNSAFE_componentWillMount lifecycle methods
Refactor components to no longer use UNSAFE_componentWillMount methods adhering to current React best practices.
Signed-off-by: Tim Klever <Tim.V.Klever@aexp.com>
---
.../DependencyGraph/DependencyForceGraph.js | 3 +--
.../jaeger-ui/src/components/DependencyGraph/index.js | 3 +--
.../TracePage/TraceStatistics/DetailTableData.tsx | 11 +++--------
.../TracePage/TraceStatistics/MainTableData.tsx | 11 +++--------
4 files changed, 8 insertions(+), 20 deletions(-)
diff --git a/packages/jaeger-ui/src/components/DependencyGraph/DependencyForceGraph.js b/packages/jaeger-ui/src/components/DependencyGraph/DependencyForceGraph.js
index 461573c578..05141100e1 100644
--- a/packages/jaeger-ui/src/components/DependencyGraph/DependencyForceGraph.js
+++ b/packages/jaeger-ui/src/components/DependencyGraph/DependencyForceGraph.js
@@ -37,8 +37,7 @@ export default class DependencyForceGraph extends Component {
};
}
- // eslint-disable-next-line camelcase
- UNSAFE_componentWillMount() {
+ componentDidMount() {
this.onResize();
this.debouncedResize = debounce((...args) => this.onResize(...args), 50);
window.addEventListener('resize', this.debouncedResize);
diff --git a/packages/jaeger-ui/src/components/DependencyGraph/index.js b/packages/jaeger-ui/src/components/DependencyGraph/index.js
index 00cdee3856..fe11e638f9 100644
--- a/packages/jaeger-ui/src/components/DependencyGraph/index.js
+++ b/packages/jaeger-ui/src/components/DependencyGraph/index.js
@@ -66,8 +66,7 @@ export class DependencyGraphPageImpl extends Component {
};
}
- // eslint-disable-next-line camelcase
- UNSAFE_componentWillMount() {
+ componentDidMount() {
this.props.fetchDependencies();
}
diff --git a/packages/jaeger-ui/src/components/TracePage/TraceStatistics/DetailTableData.tsx b/packages/jaeger-ui/src/components/TracePage/TraceStatistics/DetailTableData.tsx
index 8cf4661621..8b4096dd03 100644
--- a/packages/jaeger-ui/src/components/TracePage/TraceStatistics/DetailTableData.tsx
+++ b/packages/jaeger-ui/src/components/TracePage/TraceStatistics/DetailTableData.tsx
@@ -37,17 +37,12 @@ type State = {
* Used to render the detail column.
*/
export default class DetailTableData extends Component<Props, State> {
- // eslint-disable-next-line camelcase
- UNSAFE_componentWillMount() {
+ constructor(props: Readonly<Props>) {
+ super(props);
const element = this.props.values.map(item => {
return { uid: _.uniqueId('id'), value: item };
});
- this.setState(prevState => {
- return {
- ...prevState,
- element,
- };
- });
+ this.state = { element };
}
render() {
diff --git a/packages/jaeger-ui/src/components/TracePage/TraceStatistics/MainTableData.tsx b/packages/jaeger-ui/src/components/TracePage/TraceStatistics/MainTableData.tsx
index fe5b8c27f0..460377e67d 100644
--- a/packages/jaeger-ui/src/components/TracePage/TraceStatistics/MainTableData.tsx
+++ b/packages/jaeger-ui/src/components/TracePage/TraceStatistics/MainTableData.tsx
@@ -39,18 +39,13 @@ type State = {
* Used to render the main column.
*/
export default class MainTableData extends Component<Props, State> {
- // eslint-disable-next-line camelcase
- UNSAFE_componentWillMount() {
+ constructor(props: Readonly<Props>) {
+ super(props);
const element = this.props.values.map(item => {
return { uid: _.uniqueId('id'), value: item };
});
- this.setState(prevState => {
- return {
- ...prevState,
- element,
- };
- });
+ this.state = { element };
}
render() {