refactor: replace deprecated componentWillMount

src/components/ChromeDropdown/ChromeDropdown.react.js

@@ -34,10 +34,6 @@ export default class ChromeDropdown extends React.Component {
     }
   }
 
-  componentWillMount() {
-    this.styles = this.props.styles || styles;
-  }
-
   componentDidMount() {
     this.node = ReactDOM.findDOMNode(this);
   }
@@ -54,7 +50,6 @@ export default class ChromeDropdown extends React.Component {
 
   render() {
     let widthStyle = { width: parseFloat(this.props.width || 140) };
-    let styles = this.styles;
     let color = this.props.color || 'purple';
 
     let label = this.props.value;
@@ -119,7 +114,4 @@ ChromeDropdown.propTypes = {
   placeholder: PropTypes.string.describe(
     'Placeholder text used in place of default selection.'
   ),
-  styles: PropTypes.object.describe(
-    'Styles override used to provide dropdown with differnt skin.'
-  ),
 };

src/components/FourOhFour/FourOhFour.react.js

@@ -22,7 +22,7 @@ export default class FourOhFour extends React.Component {
     this.updateEmoji = this.updateEmoji.bind(this);
   }
 
-  componentWillMount() {
+  componentDidMount() {
     this.timeout = setTimeout(this.updateEmoji, 3000);
   }
 

src/components/LiveReload/LiveReload.react.js

@@ -53,7 +53,7 @@ export default class LiveReload extends React.Component {
 		return promise;
 	}
 
-  componentWillMount() {
+  componentDidMount() {
 		this.shouldContinueReloading = true;
 		if (!this.state.currentData) {
 			this.fetchNewData();

src/components/PushAudienceDialog/PushAudienceDialog.react.js

@@ -59,7 +59,7 @@ export default class PushAudienceDialog extends React.Component {
     };
   }
 
-  componentWillMount() {
+  componentDidMount() {
     let stateSettings = {};
     let audienceInfo = this.props.audienceInfo;
     //this case is only for 'New Segment' to prepopulate existing audience

src/components/PushAudiencesSelector/PushAudiencesBaseRow.react.js

@@ -43,7 +43,7 @@ export default class PushAudiencesBaseRow extends React.Component {
     }, () => {});
   }
 
-  componentWillMount() {
+  componentDidMount() {
     this.fetchPushSubscriberCount.call(this,this.context);
     if (this.props.id == NEW_SEGMENT_ID) {
       this.setState({ isNewSegment: true });

src/components/PushExperimentDropdown/PushExperimentDropdown.react.js

@@ -22,10 +22,6 @@ export default class PushExperimentDropdown extends React.Component {
     };
   }
 
-  componentWillMount() {
-    this.styles = this.props.styles || styles;
-  }
-
   componentDidMount() {
     this.node = ReactDOM.findDOMNode(this);
   }
@@ -42,7 +38,6 @@ export default class PushExperimentDropdown extends React.Component {
 
   render() {
     let widthStyle = { width: this.props.width || 140 };
-    let styles = this.styles;
     let color = this.props.color;
     let content = (
       <div className={[styles.current, styles[color]].join(' ')} onClick={() => this.setState({ open: true })}>
@@ -86,7 +81,4 @@ PushExperimentDropdown.propTypes = {
   placeHolder: PropTypes.string.describe(
     'Placeholder text used in place of default selection.'
   ),
-  styles: PropTypes.object.describe(
-    'Styles override used to provide dropdown with differnt skin.'
-  ),
 };

src/components/Sidebar/SidebarHeader.react.js

@@ -17,7 +17,7 @@ export default class SidebarHeader extends React.Component {
     super();
     this.state = { };
   }
-  componentWillMount() {
+  componentDidMount() {
     let mountPath = window.PARSE_DASHBOARD_PATH;
     fetch(mountPath).then(response => {
       this.setState({ dashboardUser: response.headers.get('username') });

src/dashboard/Analytics/Explorer/Explorer.react.js

@@ -74,9 +74,7 @@ class Explorer extends DashboardView {
       width: display.offsetWidth,
       height: display.offsetHeight
     };
-  }
 
-  componentWillMount() {
     this.props.customQueries.dispatch(ActionTypes.LIST);
     this.props.customQueries.dispatch(ActionTypes.LIST_RECENT);
   }

src/dashboard/Analytics/Overview/Overview.react.js

@@ -99,7 +99,7 @@ export default class Overview extends DashboardView {
     }
   }
 
-  componentWillMount() {
+  componentDidMount() {
     this.fetchOverview(this.context.currentApp);
   }
 

src/dashboard/Analytics/Performance/Performance.react.js

@@ -99,9 +99,7 @@ export default class Performance extends DashboardView {
       width: display.offsetWidth,
       height: display.offsetHeight
     };
-  }
 
-  componentWillMount() {
     this.handleRunQuery(this.context.currentApp);
   }
 

src/dashboard/Analytics/Retention/Retention.react.js

@@ -52,7 +52,7 @@ export default class Retention extends DashboardView {
     };
   }
 
-  componentWillMount() {
+  componentDidMount() {
     this.fetchRetention(this.context.currentApp);
   }
 

src/dashboard/Analytics/SlowQueries/SlowQueries.react.js

@@ -65,7 +65,7 @@ class SlowQueries extends TableView {
     this.xhrHandles = [];
   }
 
-  componentWillMount() {
+  componentDidMount() {
     this.fetchDropdownData(this.props);
     this.fetchSlowQueries(this.context.currentApp);
   }

src/dashboard/Apps/AppsIndex.react.js

@@ -96,16 +96,16 @@ export default class AppsIndex extends React.Component {
     this.searchRef = React.createRef();
   }
 
-  componentWillMount() {
+  componentDidMount() {
     if (AppsManager.apps().length === 1) {
       const [app] = AppsManager.apps();
       history.push(`/apps/${app.slug}/browser`);
-      return;
+    } else {
+      document.body.addEventListener('keydown', this.focusField);
+      AppsManager.getAllAppsIndexStats().then(() => {
+        this.forceUpdate();
+      });
     }
-    document.body.addEventListener('keydown', this.focusField);
-    AppsManager.getAllAppsIndexStats().then(() => {
-      this.forceUpdate();
-    });
   }
 
   componentWillUnmount() {

src/dashboard/Data/Browser/AttachSelectedRowsDialog.react.js

@@ -24,7 +24,7 @@ export default class AttachSelectedRowsDialog extends React.Component {
     this.handleTargetObjectIdChange = this.handleTargetObjectIdChange.bind(this);
   }
 
-  componentWillMount() {
+  componentDidMount() {
     const { selection, classes, onSelectClass } = this.props;
     if (selection) {
       const currentClass = classes[0];

src/dashboard/Data/Browser/Browser.react.js

@@ -152,7 +152,7 @@ class Browser extends DashboardView {
     this.dataBrowserRef = React.createRef();
   }
 
-  componentWillMount() {
+  componentDidMount() {
     const { currentApp } = this.context;
     if (!currentApp.preventSchemaEdits) {
       this.action = new SidebarAction('Create a class', this.showCreateClass.bind(this));

src/dashboard/Data/Browser/ExportDialog.react.js

@@ -18,7 +18,7 @@ export default class ExportDialog extends React.Component {
     };
   }
 
-  componentWillMount() {
+  componentDidMount() {
     this.context.currentApp.getExportProgress().then((progress) => {
       this.setState({ progress });
     });

src/dashboard/Data/Browser/ObjectPickerDialog.react.js

@@ -50,19 +50,20 @@ export default class ObjectPickerDialog extends React.Component {
     this.onConfirm = this.onConfirm.bind(this);
   }
 
-  async componentWillMount() {
+  componentDidMount() {
     const { filters } = this.state;
     const { className, pointerId, relation } = this.props;
-    await this.fetchData(className, filters);
-    if (pointerId) {
-      this.selectRow(pointerId, true);
-    }
-    if (relation) {
-      this.selectRelationRows(relation, filters);
-    }
-    document
-      .getElementById(SELECTION_INPUT_ID)
-      .addEventListener('focus', this.disableDataBrowserKeyControls);
+    this.fetchData(className, filters).then(() => {
+      if (pointerId) {
+        this.selectRow(pointerId, true);
+      }
+      if (relation) {
+        this.selectRelationRows(relation, filters);
+      }
+      document
+        .getElementById(SELECTION_INPUT_ID)
+        .addEventListener('focus', this.disableDataBrowserKeyControls);
+    })
   }
 
   componentWillUnmount() {

src/dashboard/Data/Browser/SchemaOverview.react.js

@@ -30,7 +30,7 @@ class Browser extends DashboardView {
     };
   }
 
-  componentWillMount() {
+  componentDidMount() {
     this.props.schema.dispatch(ActionTypes.FETCH);
   }
 

src/dashboard/Data/CloudCode/CloudCode.react.js

@@ -30,7 +30,7 @@ export default class CloudCode extends DashboardView {
     };
   }
 
-  componentWillMount() {
+  componentDidMount() {
     this.fetchSource(this.context.currentApp, getPath(this.props.params));
   }
 

src/dashboard/Data/Config/Config.react.js

@@ -37,7 +37,7 @@ class Config extends TableView {
     };
   }
 
-  componentWillMount() {
+  componentDidMount() {
     this.props.config.dispatch(ActionTypes.FETCH);
   }
 

src/dashboard/Data/Jobs/JobEdit.react.js

@@ -57,7 +57,7 @@ class JobEdit extends React.Component {
     return promise;
   }
 
-  componentWillMount() {
+  componentDidMount() {
     this.props.jobs.dispatch(ActionTypes.FETCH);
   }
 

src/dashboard/Data/Jobs/Jobs.react.js

@@ -75,7 +75,7 @@ class Jobs extends TableView {
     };
   }
 
-  componentWillMount() {
+  componentDidMount() {
     this.loadData();
   }
 

src/dashboard/Data/Webhooks/Webhooks.react.js

@@ -50,7 +50,7 @@ class Webhooks extends TableView {
     };
   }
 
-  componentWillMount() {
+  componentDidMount() {
     this.props.webhooks.dispatch(WebhookActionTypes.FETCH);
     this.props.schema.dispatch(SchemaActionTypes.FETCH);
   }

src/dashboard/Push/PushAudiencesData.react.js

@@ -39,7 +39,7 @@ export default class PushAudiencesData extends React.Component {
     };
   }
 
-  componentWillMount(){
+  componentDidMount(){
     if (this.props.loaded){ //case when data already fetched
       this.setState({ loading: false});
     }

src/dashboard/Push/PushAudiencesIndex.react.js

@@ -49,7 +49,7 @@ class PushAudiencesIndex extends DashboardView {
     }
   }
 
-  componentWillMount() {
+  componentDidMount() {
     this.props.schema.dispatch(SchemaStore.ActionTypes.FETCH);
     this.props.pushaudiences.dispatch(PushAudiencesStore.ActionTypes.FETCH,
       {

src/dashboard/Push/PushDetails.react.js

@@ -222,7 +222,7 @@ class PushDetails extends DashboardView {
     this.xhrHandles = [];
   }
 
-  componentWillMount() {
+  componentDidMount() {
     this.props.schema.dispatch(SchemaStore.ActionTypes.FETCH);
     let promise = this.context.currentApp.fetchPushDetails(this.props.params.pushId);
     promise.then((pushDetails) => {

src/dashboard/Push/PushIndex.react.js

@@ -262,7 +262,7 @@ export default class PushIndex extends DashboardView {
     });
   }
 
-  componentWillMount() {
+  componentDidMount() {
     this.handleFetch(this.props.params.category);
     //TODO: make xhr map and generic abort for existing xhrs.
     this.context.currentApp.fetchAvailableDevices().then(({ available_devices }) => {

src/dashboard/Push/PushNew.react.js

@@ -144,7 +144,7 @@ class PushNew extends DashboardView {
     }
   }
 
-  componentWillMount() {
+  componentDidMount() {
     this.props.schema.dispatch(SchemaStore.ActionTypes.FETCH);
     let options = { xhrKey: XHR_KEY };
     const query = new URLSearchParams(this.props.location.search);