From 2160440ff14c957e87a7dcfdebe35368699a24fd Mon Sep 17 00:00:00 2001
From: Kegan Dougal <kegan@matrix.org>
Date: Tue, 21 Jul 2015 18:05:22 +0100
Subject: [PATCH] Add and impl resend button. Update UI when failing to send
messages.
---
skins/base/css/molecules/MessageTile.css | 4 ++++
skins/base/views/molecules/MessageTile.js | 9 ++++++--
src/controllers/molecules/MessageComposer.js | 4 ++++
src/controllers/molecules/MessageTile.js | 22 ++++++++++++++++++++
src/controllers/organisms/RoomView.js | 2 ++
5 files changed, 39 insertions(+), 2 deletions(-)
diff --git a/skins/base/css/molecules/MessageTile.css b/skins/base/css/molecules/MessageTile.css
index 9b548c5e..45882de6 100644
--- a/skins/base/css/molecules/MessageTile.css
+++ b/skins/base/css/molecules/MessageTile.css
@@ -74,3 +74,7 @@ limitations under the License.
.mx_MessageTile_highlight {
color: #00f;
}
+
+.mx_MessageTile_msgOption {
+ float: right;
+}
diff --git a/skins/base/views/molecules/MessageTile.js b/skins/base/views/molecules/MessageTile.js
index 7eca2030..572ee0d5 100644
--- a/skins/base/views/molecules/MessageTile.js
+++ b/skins/base/views/molecules/MessageTile.js
@@ -57,8 +57,7 @@ module.exports = React.createClass({
mx_MessageTile_continuation: this.props.continuation,
});
var timestamp = this.props.last ? <MessageTimestamp ts={this.props.mxEvent.getTs()} /> : null;
- var avatar;
- var sender;
+ var avatar, sender, resend;
if (!this.props.continuation) {
avatar = (
<div className="mx_MessageTile_avatar">
@@ -67,10 +66,16 @@ module.exports = React.createClass({
);
sender = <SenderProfile mxEvent={this.props.mxEvent} />;
}
+ if (this.props.mxEvent.status === "not_sent" && !this.state.resending) {
+ resend = <button className="mx_MessageTile_msgOption" onClick={this.onResend}>
+ Resend
+ </button>;
+ }
return (
<div className={classes}>
{ avatar }
{ timestamp }
+ { resend }
{ sender }
<TileType mxEvent={this.props.mxEvent} />
</div>
diff --git a/src/controllers/molecules/MessageComposer.js b/src/controllers/molecules/MessageComposer.js
index 2ece5636..c73e9f25 100644
--- a/src/controllers/molecules/MessageComposer.js
+++ b/src/controllers/molecules/MessageComposer.js
@@ -232,6 +232,10 @@ module.exports = {
dis.dispatch({
action: 'message_sent'
});
+ }, function() {
+ dis.dispatch({
+ action: 'message_send_failed'
+ });
});
this.refs.textarea.getDOMNode().value = '';
ev.preventDefault();
diff --git a/src/controllers/molecules/MessageTile.js b/src/controllers/molecules/MessageTile.js
index 953e33b5..47b616e7 100644
--- a/src/controllers/molecules/MessageTile.js
+++ b/src/controllers/molecules/MessageTile.js
@@ -23,6 +23,28 @@ module.exports = {
var actions = MatrixClientPeg.get().getPushActionsForEvent(this.props.mxEvent);
if (!actions || !actions.tweaks) { return false; }
return actions.tweaks.highlight;
+ },
+
+ getInitialState: function() {
+ return {
+ resending: false
+ };
+ },
+
+ onResend: function() {
+ var self = this;
+ self.setState({
+ resending: true
+ });
+ MatrixClientPeg.get().resendEvent(
+ this.props.mxEvent, MatrixClientPeg.get().getRoom(
+ this.props.mxEvent.getRoomId()
+ )
+ ).finally(function() {
+ self.setState({
+ resending: false
+ });
+ })
}
};
diff --git a/src/controllers/organisms/RoomView.js b/src/controllers/organisms/RoomView.js
index 8465b2ce..332572a5 100644
--- a/src/controllers/organisms/RoomView.js
+++ b/src/controllers/organisms/RoomView.js
@@ -79,10 +79,12 @@ module.exports = {
onAction: function(payload) {
switch (payload.action) {
+ case 'message_send_failed':
case 'message_sent':
this.setState({
room: MatrixClientPeg.get().getRoom(this.props.roomId)
});
+ this.forceUpdate();
break;
case'notifier_enabled':
this.forceUpdate();