Merge branches 'develop' and 't3chguy/nvl/fix_sso_flash' of https://github.com/matrix-org/matrix-react-sdk into t3chguy/nvl/fix_sso_flash

src/components/structures/RoomDirectory.js

@@ -1,6 +1,7 @@
 /*
 Copyright 2015, 2016 OpenMarket Ltd
 Copyright 2019 Michael Telatynski <7t3chguy@gmail.com>
+Copyright 2019 The Matrix.org Foundation C.I.C.
 
 Licensed under the Apache License, Version 2.0 (the "License");
 you may not use this file except in compliance with the License.
@@ -140,6 +141,10 @@ module.exports = createReactClass({
     getMoreRooms: function() {
         if (!MatrixClientPeg.get()) return Promise.resolve();
 
+        this.setState({
+            loading: true,
+        });
+
         const my_filter_string = this.state.filterString;
         const my_server = this.state.roomServer;
         // remember the next batch token when we sent the request
@@ -554,15 +559,21 @@ module.exports = createReactClass({
         let content;
         if (this.state.error) {
             content = this.state.error;
-        } else if (this.state.protocolsLoading || this.state.loading) {
+        } else if (this.state.protocolsLoading) {
             content = <Loader />;
         } else {
             const rows = (this.state.publicRooms || []).map(room => this.getRow(room));
             // we still show the scrollpanel, at least for now, because
             // otherwise we don't fetch more because we don't get a fill
             // request from the scrollpanel because there isn't one
+
+            let spinner;
+            if (this.state.loading) {
+                spinner = <Loader />;
+            }
+
             let scrollpanel_content;
-            if (rows.length == 0) {
+            if (rows.length === 0 && !this.state.loading) {
                 scrollpanel_content = <i>{ _t('No rooms to show') }</i>;
             } else {
                 scrollpanel_content = <table ref="directory_table" className="mx_RoomDirectory_table">
@@ -579,6 +590,7 @@ module.exports = createReactClass({
                 startAtBottom={false}
             >
                 { scrollpanel_content }
+                { spinner }
             </ScrollPanel>;
         }
 

src/components/views/rooms/EditMessageComposer.js

@@ -112,6 +112,10 @@ export default class EditMessageComposer extends React.Component {
         super(props, context);
         this.model = null;
         this._editorRef = null;
+
+        this.state = {
+            saveDisabled: true,
+        };
     }
 
     _setEditorRef = ref => {
@@ -160,7 +164,7 @@ export default class EditMessageComposer extends React.Component {
         dis.dispatch({action: 'focus_composer'});
     }
 
-    _isModifiedOrSameAsOld(newContent) {
+    _isContentModified(newContent) {
         // if nothing has changed then bail
         const oldContent = this.props.editState.getEvent().getContent();
         if (!this._editorRef.isModified() ||
@@ -176,16 +180,18 @@ export default class EditMessageComposer extends React.Component {
         const editedEvent = this.props.editState.getEvent();
         const editContent = createEditContent(this.model, editedEvent);
         const newContent = editContent["m.new_content"];
-        if (!this._isModifiedOrSameAsOld(newContent)) {
-            return;
-        }
-        const roomId = editedEvent.getRoomId();
-        this._cancelPreviousPendingEdit();
-        this.context.matrixClient.sendMessage(roomId, editContent);
 
+        // If content is modified then send an updated event into the room
+        if (this._isContentModified(newContent)) {
+            const roomId = editedEvent.getRoomId();
+            this._cancelPreviousPendingEdit();
+            this.context.matrixClient.sendMessage(roomId, editContent);
+        }
+
+        // close the event editing and focus composer
         dis.dispatch({action: "edit_event", event: null});
         dis.dispatch({action: 'focus_composer'});
-    }
+    };
 
     _cancelPreviousPendingEdit() {
         const originalEvent = this.props.editState.getEvent();
@@ -240,6 +246,16 @@ export default class EditMessageComposer extends React.Component {
         return caretPosition;
     }
 
+    _onChange = () => {
+        if (!this.state.saveDisabled || !this._editorRef || !this._editorRef.isModified()) {
+            return;
+        }
+
+        this.setState({
+            saveDisabled: false,
+        });
+    };
+
     render() {
         const AccessibleButton = sdk.getComponent('elements.AccessibleButton');
         return (<div className={classNames("mx_EditMessageComposer", this.props.className)} onKeyDown={this._onKeyDown}>
@@ -249,10 +265,13 @@ export default class EditMessageComposer extends React.Component {
                 room={this._getRoom()}
                 initialCaret={this.props.editState.getCaret()}
                 label={_t("Edit message")}
+                onChange={this._onChange}
             />
             <div className="mx_EditMessageComposer_buttons">
                 <AccessibleButton kind="secondary" onClick={this._cancelEdit}>{_t("Cancel")}</AccessibleButton>
-                <AccessibleButton kind="primary" onClick={this._sendEdit}>{_t("Save")}</AccessibleButton>
+                <AccessibleButton kind="primary" onClick={this._sendEdit} disabled={this.state.saveDisabled}>
+                    {_t("Save")}
+                </AccessibleButton>
             </div>
         </div>);
     }