Use componentDidMount in place of componentWillMount where possible

This fixes a common React warning we see. Most of these components should be using constructors instead, however componentDidMount is just as good (and doesn't require converting most of these).

Conversion to classes will be done in a later stage of React warning fixes.

For https://github.com/vector-im/riot-web/issues/12877

src/components/structures/CustomRoomTagPanel.js

@@ -30,7 +30,7 @@ class CustomRoomTagPanel extends React.Component {
         };
     }
 
-    componentWillMount() {
+    componentDidMount() {
         this._tagStoreToken = CustomRoomTagStore.addListener(() => {
             this.setState({tags: CustomRoomTagStore.getSortedTags()});
         });

src/components/structures/EmbeddedPage.js

@@ -58,7 +58,7 @@ export default class EmbeddedPage extends React.PureComponent {
         return sanitizeHtml(_t(s));
     }
 
-    componentWillMount() {
+    componentDidMount() {
         this._unmounted = false;
 
         if (!this.props.url) {

src/components/structures/GroupView.js

@@ -428,7 +428,7 @@ export default createReactClass({
         };
     },
 
-    componentWillMount: function() {
+    componentDidMount: function() {
         this._unmounted = false;
         this._matrixClient = MatrixClientPeg.get();
         this._matrixClient.on("Group.myMembership", this._onGroupMyMembership);

src/components/structures/LeftPanel.js

@@ -44,7 +44,7 @@ const LeftPanel = createReactClass({
         };
     },
 
-    componentWillMount: function() {
+    componentDidMount: function() {
         this.focusedElement = null;
 
         this._breadcrumbsWatcherRef = SettingsStore.watchSetting(

src/components/structures/MatrixChat.js

@@ -221,7 +221,7 @@ export default createReactClass({
         return {serverConfig: props};
     },
 
-    componentWillMount: function() {
+    componentDidMount: function() {
         SdkConfig.put(this.props.config);
 
         // Used by _viewRoom before getting state from sync
@@ -261,9 +261,7 @@ export default createReactClass({
 
         this._accountPassword = null;
         this._accountPasswordTimer = null;
-    },
 
-    componentDidMount: function() {
         this.dispatcherRef = dis.register(this.onAction);
         this._themeWatcher = new ThemeWatcher();
         this._themeWatcher.start();

src/components/structures/MyGroups.js

@@ -38,7 +38,7 @@ export default createReactClass({
         contextType: MatrixClientContext,
     },
 
-    componentWillMount: function() {
+    componentDidMount: function() {
         this._fetch();
     },
 

src/components/structures/RightPanel.js

@@ -108,7 +108,7 @@ export default class RightPanel extends React.Component {
         }
     }
 
-    componentWillMount() {
+    componentDidMount() {
         this.dispatcherRef = dis.register(this.onAction);
         const cli = this.context;
         cli.on("RoomState.members", this.onRoomStateMember);

src/components/structures/RoomDirectory.js

@@ -56,7 +56,7 @@ export default createReactClass({
         };
     },
 
-    componentWillMount: function() {
+    componentDidMount: function() {
         this._unmounted = false;
         this.nextBatch = null;
         this.filterTimeout = null;
@@ -89,9 +89,7 @@ export default createReactClass({
                 ),
             });
         });
-    },
 
-    componentDidMount: function() {
         this.refreshRoomList();
     },
 

src/components/structures/RoomStatusBar.js

@@ -96,7 +96,7 @@ export default createReactClass({
         };
     },
 
-    componentWillMount: function() {
+    componentDidMount: function() {
         MatrixClientPeg.get().on("sync", this.onSyncStateChange);
         MatrixClientPeg.get().on("Room.localEchoUpdated", this._onRoomLocalEchoUpdated);
 

src/components/structures/TagPanel.js

@@ -44,7 +44,7 @@ const TagPanel = createReactClass({
         };
     },
 
-    componentWillMount: function() {
+    componentDidMount: function() {
         this.unmounted = false;
         this.context.on("Group.myMembership", this._onGroupMyMembership);
         this.context.on("sync", this._onClientSync);

src/components/structures/UserView.js

@@ -35,7 +35,7 @@ export default class UserView extends React.Component {
         this.state = {};
     }
 
-    componentWillMount() {
+    componentDidMount() {
         if (this.props.userId) {
             this._loadProfileInfo();
         }

src/components/structures/auth/ForgotPassword.js

@@ -69,7 +69,7 @@ export default createReactClass({
         };
     },
 
-    componentWillMount: function() {
+    componentDidMount: function() {
         this.reset = null;
         this._checkServerLiveliness(this.props.serverConfig);
     },

src/components/structures/auth/Login.js

@@ -113,7 +113,7 @@ export default createReactClass({
         };
     },
 
-    componentWillMount: function() {
+    componentDidMount: function() {
         this._unmounted = false;
 
         // map from login step type to a function which will render a control

src/components/structures/auth/PostRegistration.js

@@ -37,7 +37,7 @@ export default createReactClass({
         };
     },
 
-    componentWillMount: function() {
+    componentDidMount: function() {
         // There is some assymetry between ChangeDisplayName and ChangeAvatar,
         // as ChangeDisplayName will auto-get the name but ChangeAvatar expects
         // the URL to be passed to you (because it's also used for room avatars).

src/components/structures/auth/Registration.js

@@ -120,7 +120,7 @@ export default createReactClass({
         };
     },
 
-    componentWillMount: function() {
+    componentDidMount: function() {
         this._unmounted = false;
         this._replaceClient();
     },