Remove UNSAFE_componentWillMount lifecycle methods (jaegertracing#611)

Refactor components to no longer use UNSAFE_componentWillMount methods adhering to current React best practices. Signed-off-by: Tim Klever <[email protected]> Signed-off-by: vvvprabhakar <[email protected]>
vvvprabhakar · Jul 4, 2021 · 33c75bd · 33c75bd
1 parent 78bec82
commit 33c75bd
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 20 deletions.
diff --git 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
@@ -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
@@ -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
@@ -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() {