Replace componentWillMount with componentDidMount and as required, construct(). Fixes #179

app/soapbox/features/about/index.js

@@ -20,7 +20,7 @@ class AboutPage extends ImmutablePureComponent {
     });
   }
 
-  componentWillMount() {
+  componentDidMount() {
     this.loadPageHtml();
   }
 

app/soapbox/features/account/components/header.js

@@ -91,7 +91,7 @@ class Header extends ImmutablePureComponent {
     return !location.pathname.match(/\/(followers|following|favorites|pins)\/?$/);
   }
 
-  componentWillMount() {
+  componentDidMount() {
     window.addEventListener('resize', this.handleResize, { passive: true });
   }
 

app/soapbox/features/account_timeline/index.js

@@ -64,7 +64,7 @@ class AccountTimeline extends ImmutablePureComponent {
     unavailable: PropTypes.bool,
   };
 
-  componentWillMount() {
+  componentDidMount() {
     const { params: { username }, accountId, withReplies, me } = this.props;
 
     if (accountId && accountId !== -1) {

app/soapbox/features/auth_login/components/captcha.js

@@ -61,7 +61,7 @@ class CaptchaField extends React.Component {
     });
   }
 
-  componentWillMount() {
+  componentDidMount() {
     this.fetchCaptcha();
     this.startRefresh(); // Refresh periodically
   }

app/soapbox/features/blocks/index.js

@@ -32,7 +32,7 @@ class Blocks extends ImmutablePureComponent {
     intl: PropTypes.object.isRequired,
   };
 
-  componentWillMount() {
+  componentDidMount() {
     this.props.dispatch(fetchBlocks());
   }
 

app/soapbox/features/compose/components/privacy_dropdown.js

@@ -168,6 +168,18 @@ class PrivacyDropdown extends React.PureComponent {
     placement: 'bottom',
   };
 
+  constructor(props) {
+    super(props);
+    const { intl: { formatMessage } } = this.props;
+
+    this.options = [
+      { icon: 'globe', value: 'public', text: formatMessage(messages.public_short), meta: formatMessage(messages.public_long) },
+      { icon: 'unlock', value: 'unlisted', text: formatMessage(messages.unlisted_short), meta: formatMessage(messages.unlisted_long) },
+      { icon: 'lock', value: 'private', text: formatMessage(messages.private_short), meta: formatMessage(messages.private_long) },
+      { icon: 'envelope', value: 'direct', text: formatMessage(messages.direct_short), meta: formatMessage(messages.direct_long) },
+    ];
+  }
+
   handleToggle = ({ target }) => {
     if (this.props.isUserTouching()) {
       if (this.state.open) {
@@ -210,17 +222,6 @@ class PrivacyDropdown extends React.PureComponent {
     this.props.onChange(value);
   }
 
-  componentWillMount() {
-    const { intl: { formatMessage } } = this.props;
-
-    this.options = [
-      { icon: 'globe', value: 'public', text: formatMessage(messages.public_short), meta: formatMessage(messages.public_long) },
-      { icon: 'unlock', value: 'unlisted', text: formatMessage(messages.unlisted_short), meta: formatMessage(messages.unlisted_long) },
-      { icon: 'lock', value: 'private', text: formatMessage(messages.private_short), meta: formatMessage(messages.private_long) },
-      { icon: 'envelope', value: 'direct', text: formatMessage(messages.direct_short), meta: formatMessage(messages.direct_long) },
-    ];
-  }
-
   render() {
     const { value, intl } = this.props;
     const { open, placement } = this.state;

app/soapbox/features/domain_blocks/index.js

@@ -33,7 +33,7 @@ class Blocks extends ImmutablePureComponent {
     intl: PropTypes.object.isRequired,
   };
 
-  componentWillMount() {
+  componentDidMount() {
     this.props.dispatch(fetchDomainBlocks());
   }
 

app/soapbox/features/edit_profile/index.js

@@ -117,18 +117,15 @@ class EditProfile extends ImmutablePureComponent {
     event.preventDefault();
   }
 
-  setInitialState = () => {
+  constructor(props) {
+    super(props);
     const initialState = this.props.account.withMutations(map => {
       map.merge(map.get('source'));
       map.delete('source');
       map.set('fields', normalizeFields(map.get('fields')));
       unescapeParams(map, ['display_name', 'note']);
     });
-    this.setState(initialState.toObject());
+    this.state = initialState.toObject();
-  }
-
-  componentWillMount() {
-    this.setInitialState();
   }
 
   handleCheckboxChange = e => {

app/soapbox/features/favourited_statuses/index.js

@@ -34,7 +34,7 @@ class Favourites extends ImmutablePureComponent {
     isMyAccount: PropTypes.bool.isRequired,
   };
 
-  componentWillMount() {
+  componentDidMount() {
     this.props.dispatch(fetchFavouritedStatuses());
   }
 

app/soapbox/features/favourites/index.js

@@ -23,7 +23,7 @@ class Favourites extends ImmutablePureComponent {
     accountIds: ImmutablePropTypes.list,
   };
 
-  componentWillMount() {
+  componentDidMount() {
     this.props.dispatch(fetchFavourites(this.props.params.statusId));
   }
 

app/soapbox/features/filters/index.js

@@ -24,7 +24,7 @@ class Filters extends ImmutablePureComponent {
     intl: PropTypes.object.isRequired,
   };
 
-  componentWillMount() {
+  componentDidMount() {
     this.props.dispatch(fetchFilters());
   }
 

app/soapbox/features/follow_requests/index.js

@@ -32,7 +32,7 @@ class FollowRequests extends ImmutablePureComponent {
     intl: PropTypes.object.isRequired,
   };
 
-  componentWillMount() {
+  componentDidMount() {
     this.props.dispatch(fetchFollowRequests());
   }
 

app/soapbox/features/followers/index.js

@@ -58,7 +58,7 @@ class Followers extends ImmutablePureComponent {
     unavailable: PropTypes.bool,
   };
 
-  componentWillMount() {
+  componentDidMount() {
     const { params: { username }, accountId } = this.props;
 
     if (accountId && accountId !== -1) {

app/soapbox/features/following/index.js

@@ -58,7 +58,7 @@ class Following extends ImmutablePureComponent {
     diffCount: PropTypes.number,
   };
 
-  componentWillMount() {
+  componentDidMount() {
     const { params: { username }, accountId } = this.props;
 
     if (accountId && accountId !== -1) {

app/soapbox/features/groups/create/index.js

@@ -49,7 +49,8 @@ class Create extends React.PureComponent {
     onCoverImageChange: PropTypes.func.isRequired,
   };
 
-  componentWillMount() {
+  constructor(props) {
+    super(props);
     this.props.reset();
   }
 

app/soapbox/features/groups/edit/index.js

@@ -55,7 +55,8 @@ class Edit extends React.PureComponent {
     setUp: PropTypes.func.isRequired,
   };
 
-  componentWillMount(nextProps) {
+  constructor(nextProps) {
+    super(nextProps);
     if (this.props.group) {
       this.props.setUp(this.props.group);
     }

app/soapbox/features/groups/index/index.js

@@ -36,7 +36,7 @@ class Groups extends ImmutablePureComponent {
     intl: PropTypes.object.isRequired,
   };
 
-  componentWillMount() {
+  componentDidMount() {
     this.props.dispatch(fetchGroups(this.props.activeTab));
   }
 

app/soapbox/features/groups/members/index.js

@@ -30,7 +30,7 @@ class GroupMembers extends ImmutablePureComponent {
     hasMore: PropTypes.bool,
   };
 
-  componentWillMount() {
+  componentDidMount() {
     const { params: { id } } = this.props;
 
     this.props.dispatch(fetchMembers(id));

app/soapbox/features/groups/removed_accounts/index.js

@@ -37,7 +37,7 @@ class GroupRemovedAccounts extends ImmutablePureComponent {
     hasMore: PropTypes.bool,
   };
 
-  componentWillMount() {
+  componentDidMount() {
     const { params: { id } } = this.props;
 
     this.props.dispatch(fetchRemovedAccounts(id));

app/soapbox/features/introduction/index.js

@@ -84,7 +84,8 @@ class Introduction extends React.PureComponent {
     currentIndex: 0,
   };
 
-  componentWillMount() {
+  constructor(props) {
+    super(props);
     this.pages = [
       <FrameWelcome domain={this.props.domain} onNext={this.handleNext} />,
       <FrameFederation onNext={this.handleNext} />,

app/soapbox/features/lists/index.js

@@ -42,7 +42,7 @@ class Lists extends ImmutablePureComponent {
     intl: PropTypes.object.isRequired,
   };
 
-  componentWillMount() {
+  componentDidMount() {
     this.props.dispatch(fetchLists());
   }
 

app/soapbox/features/mutes/index.js

@@ -32,7 +32,7 @@ class Mutes extends ImmutablePureComponent {
     intl: PropTypes.object.isRequired,
   };
 
-  componentWillMount() {
+  componentDidMount() {
     this.props.dispatch(fetchMutes());
   }
 

app/soapbox/features/pinned_statuses/index.js

@@ -31,7 +31,7 @@ class PinnedStatuses extends ImmutablePureComponent {
     isMyAccount: PropTypes.bool.isRequired,
   };
 
-  componentWillMount() {
+  componentDidMount() {
     this.props.dispatch(fetchPinnedStatuses());
   }
 

app/soapbox/features/reblogs/index.js

@@ -36,7 +36,7 @@ class Reblogs extends ImmutablePureComponent {
     status: ImmutablePropTypes.map,
   };
 
-  componentWillMount() {
+  componentDidMount() {
     this.props.dispatch(fetchReblogs(this.props.params.statusId));
     this.props.dispatch(fetchStatus(this.props.params.statusId));
   }

app/soapbox/features/status/index.js

@@ -139,11 +139,8 @@ class Status extends ImmutablePureComponent {
     loadedStatusId: undefined,
   };
 
-  componentWillMount() {
-    this.props.dispatch(fetchStatus(this.props.params.statusId));
-  }
-
   componentDidMount() {
+    this.props.dispatch(fetchStatus(this.props.params.statusId));
     attachFullscreenListener(this.onFullScreenChange);
   }
 

app/soapbox/features/ui/components/bundle.js

@@ -33,7 +33,7 @@ class Bundle extends React.PureComponent {
     forceRender: false,
   }
 
-  componentWillMount() {
+  componentDidMount() {
     this.load(this.props);
   }
 

app/soapbox/features/ui/components/focal_point_modal.js

@@ -34,7 +34,7 @@ class FocalPointModal extends ImmutablePureComponent {
     dragging: false,
   };
 
-  componentWillMount() {
+  componentDidMount() {
     this.updatePositionFromMedia(this.props.media);
   }
 

app/soapbox/features/ui/index.js

@@ -167,7 +167,7 @@ class SwitchingColumnsArea extends React.PureComponent {
     mobile: isMobile(window.innerWidth),
   };
 
-  componentWillMount() {
+  componentDidMount() {
     window.addEventListener('resize', this.handleResize, { passive: true });
   }
 
@@ -394,9 +394,9 @@ class UI extends React.PureComponent {
     }
   }
 
-
+  componentDidMount() {
-  componentWillMount() {
     const { me } = this.props;
+    if (!me) return;
     window.addEventListener('beforeunload', this.handleBeforeUnload, false);
 
     document.addEventListener('dragenter', this.handleDragEnter, false);
@@ -420,11 +420,6 @@ class UI extends React.PureComponent {
 
       setTimeout(() => this.props.dispatch(fetchFilters()), 500);
     }
-  }
-
-  componentDidMount() {
-    const { me } = this.props;
-    if (!me) return;
     this.connectStreaming();
   }
 

app/soapbox/pages/group_page.js

@@ -25,7 +25,7 @@ class GroupPage extends ImmutablePureComponent {
       dispatch: PropTypes.func.isRequired,
     };
 
-    componentWillMount() {
+    componentDidMount() {
       const { params: { id }, dispatch } = this.props;
 
       dispatch(fetchGroup(id));