From 93a3c896a4ebdeeeeb2bf72cfef71ee54fb7f3c9 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Thu, 27 Jul 2017 17:45:02 +0100 Subject: [PATCH 01/11] un-i18n Modal Analytics Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/components/structures/RoomDirectory.js | 14 +++++++------- src/components/structures/RoomSubList.js | 2 +- .../views/context_menus/MessageContextMenu.js | 8 ++++---- .../views/context_menus/RoomTileContextMenu.js | 8 ++++---- src/components/views/elements/ImageView.js | 4 ++-- src/components/views/globals/NewVersionBar.js | 4 ++-- src/components/views/globals/PasswordNagBar.js | 2 +- src/components/views/rooms/DNDRoomTile.js | 6 +++--- src/components/views/settings/Notifications.js | 10 +++++----- 9 files changed, 29 insertions(+), 29 deletions(-) diff --git a/src/components/structures/RoomDirectory.js b/src/components/structures/RoomDirectory.js index ea3aa5a2..fd870a97 100644 --- a/src/components/structures/RoomDirectory.js +++ b/src/components/structures/RoomDirectory.js @@ -82,7 +82,7 @@ module.exports = React.createClass({ return; } const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); - Modal.createDialog(ErrorDialog, { + Modal.createTrackedDialog('Failed to get protocol list from Home Server', err.toString(), ErrorDialog, { title: _t('Failed to get protocol list from Home Server'), description: _t('The Home Server may be too old to support third party networks'), }); @@ -178,7 +178,7 @@ module.exports = React.createClass({ this.setState({ loading: false }); console.error("Failed to get publicRooms: %s", JSON.stringify(err)); var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); - Modal.createDialog(ErrorDialog, { + Modal.createTrackedDialog('Failed to get public room list', err.toString(), ErrorDialog, { title: _t('Failed to get public room list'), description: ((err && err.message) ? err.message : _t('The server may be unavailable or overloaded')) }); @@ -206,7 +206,7 @@ module.exports = React.createClass({ desc = _t('Remove %(name)s from the directory?', {name: name}); } - Modal.createDialog(QuestionDialog, { + Modal.createTrackedDialog('Remove from Directory', '', QuestionDialog, { title: _t('Remove from Directory'), description: desc, onFinished: (should_delete) => { @@ -227,7 +227,7 @@ module.exports = React.createClass({ modal.close(); this.refreshRoomList(); console.error("Failed to " + step + ": " + err); - Modal.createDialog(ErrorDialog, { + Modal.createTrackedDialog('Remove from Directory Error', err.toString(), ErrorDialog, { title: _t('Error'), description: ((err && err.message) ? err.message : _t('The server may be unavailable or overloaded')) }); @@ -316,7 +316,7 @@ module.exports = React.createClass({ const fields = protocolName ? this._getFieldsForThirdPartyLocation(alias, this.protocols[protocolName], instance) : null; if (!fields) { const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); - Modal.createDialog(ErrorDialog, { + Modal.createTrackedDialog('Unable to join network', '', ErrorDialog, { title: _t('Unable to join network'), description: _t('Riot does not know how to join a room on this network'), }); @@ -327,14 +327,14 @@ module.exports = React.createClass({ this.showRoomAlias(resp[0].alias); } else { const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); - Modal.createDialog(ErrorDialog, { + Modal.createTrackedDialog('Room not found', '', ErrorDialog, { title: _t('Room not found'), description: _t('Couldn\'t find a matching Matrix room'), }); } }, (e) => { const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); - Modal.createDialog(ErrorDialog, { + Modal.createTrackedDialog('Fetching third party location failed', e.toString(), ErrorDialog, { title: _t('Fetching third party location failed'), description: _t('Unable to look up room ID from server'), }); diff --git a/src/components/structures/RoomSubList.js b/src/components/structures/RoomSubList.js index 17febe02..faf2499e 100644 --- a/src/components/structures/RoomSubList.js +++ b/src/components/structures/RoomSubList.js @@ -514,7 +514,7 @@ var RoomSubList = React.createClass({ }).fail(function(err) { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); console.error("Failed to add tag " + self.props.tagName + " to room" + err); - Modal.createDialog(ErrorDialog, { + Modal.createTrackedDialog('Failed to add tag to room', err.toString(), ErrorDialog, { title: _t('Failed to add tag %(tagName)s to room', {tagName: self.props.tagName}), description: ((err && err.message) ? err.message : _t('Operation failed')), }); diff --git a/src/components/views/context_menus/MessageContextMenu.js b/src/components/views/context_menus/MessageContextMenu.js index 2064cede..ef87dcb9 100644 --- a/src/components/views/context_menus/MessageContextMenu.js +++ b/src/components/views/context_menus/MessageContextMenu.js @@ -72,7 +72,7 @@ module.exports = React.createClass({ onViewSourceClick: function() { const ViewSource = sdk.getComponent('structures.ViewSource'); - Modal.createDialog(ViewSource, { + Modal.createTrackedDialog('View Event Source', '', ViewSource, { content: this.props.mxEvent.event, }, 'mx_Dialog_viewsource'); this.closeMenu(); @@ -80,7 +80,7 @@ module.exports = React.createClass({ onViewClearSourceClick: function() { const ViewSource = sdk.getComponent('structures.ViewSource'); - Modal.createDialog(ViewSource, { + Modal.createTrackedDialog('View Clear Event Source', '', ViewSource, { // FIXME: _clearEvent is private content: this.props.mxEvent._clearEvent, }, 'mx_Dialog_viewsource'); @@ -89,7 +89,7 @@ module.exports = React.createClass({ onRedactClick: function() { const ConfirmRedactDialog = sdk.getComponent("dialogs.ConfirmRedactDialog"); - Modal.createDialog(ConfirmRedactDialog, { + Modal.createTrackedDialog('Confirm Redact Dialog', '', ConfirmRedactDialog, { onFinished: (proceed) => { if (!proceed) return; @@ -99,7 +99,7 @@ module.exports = React.createClass({ const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); // display error message stating you couldn't delete this. const code = e.errcode || e.statusCode; - Modal.createDialog(ErrorDialog, { + Modal.createTrackedDialog('You cannot delete this message', e.toString(), ErrorDialog, { title: _t('Error'), description: _t('You cannot delete this message. (%(code)s)', {code: code}) }); diff --git a/src/components/views/context_menus/RoomTileContextMenu.js b/src/components/views/context_menus/RoomTileContextMenu.js index 4d08e833..3f3154c1 100644 --- a/src/components/views/context_menus/RoomTileContextMenu.js +++ b/src/components/views/context_menus/RoomTileContextMenu.js @@ -70,7 +70,7 @@ module.exports = React.createClass({ }; }).fail(function(err) { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); - Modal.createDialog(ErrorDialog, { + Modal.createTrackedDialog('Failed to remove tag from room 1', err.toString(), ErrorDialog, { title: _t('Failed to remove tag %(tagName)s from room', {tagName: tagNameOff}), description: ((err && err.message) ? err.message : _t('Operation failed')), }); @@ -87,7 +87,7 @@ module.exports = React.createClass({ }; }).fail(function(err) { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); - Modal.createDialog(ErrorDialog, { + Modal.createTrackedDialog('Failed to remove tag from room 2', err.toString(), ErrorDialog, { title: _t('Failed to remove tag %(tagName)s from room', {tagName: tagNameOn}), description: ((err && err.message) ? err.message : _t('Operation failed')), }); @@ -148,7 +148,7 @@ module.exports = React.createClass({ }; }, (err) => { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); - Modal.createDialog(ErrorDialog, { + Modal.createTrackedDialog('Failed to set Direct Message status of room', err.toString(), ErrorDialog, { title: _t('Failed to set Direct Message status of room'), description: ((err && err.message) ? err.message : _t('Operation failed')), }); @@ -187,7 +187,7 @@ module.exports = React.createClass({ }, function(err) { var errCode = err.errcode || "unknown error code"; var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); - Modal.createDialog(ErrorDialog, { + Modal.createTrackedDialog('Failed to forget room', err.toString(), ErrorDialog, { title: _t('Failed to forget room %(errCode)s', {errCode: errCode}), description: ((err && err.message) ? err.message : _t('Operation failed')), }); diff --git a/src/components/views/elements/ImageView.js b/src/components/views/elements/ImageView.js index f9404eac..96803774 100644 --- a/src/components/views/elements/ImageView.js +++ b/src/components/views/elements/ImageView.js @@ -66,7 +66,7 @@ module.exports = React.createClass({ onRedactClick: function() { const ConfirmRedactDialog = sdk.getComponent("dialogs.ConfirmRedactDialog"); - Modal.createDialog(ConfirmRedactDialog, { + Modal.createTrackedDialog('Confirm Redact Dialog', 'Image View', ConfirmRedactDialog, { onFinished: (proceed) => { if (!proceed) return; var self = this; @@ -76,7 +76,7 @@ module.exports = React.createClass({ var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); // display error message stating you couldn't delete this. var code = e.errcode || e.statusCode; - Modal.createDialog(ErrorDialog, { + Modal.createTrackedDialog('You cannot delete this image.', e.toString(), ErrorDialog, { title: _t('Error'), description: _t('You cannot delete this image. (%(code)s)', {code: code}) }); diff --git a/src/components/views/globals/NewVersionBar.js b/src/components/views/globals/NewVersionBar.js index d25fa3a6..f56d1a51 100644 --- a/src/components/views/globals/NewVersionBar.js +++ b/src/components/views/globals/NewVersionBar.js @@ -40,7 +40,7 @@ export default React.createClass({ displayReleaseNotes: function(releaseNotes) { const QuestionDialog = sdk.getComponent('dialogs.QuestionDialog'); - Modal.createDialog(QuestionDialog, { + Modal.createTrackedDialog('Display release notes', '', QuestionDialog, { title: _t("What's New"), description: 
{releaseNotes}
, button: _t("Update"), @@ -54,7 +54,7 @@ export default React.createClass({ displayChangelog: function() { const ChangelogDialog = sdk.getComponent('dialogs.ChangelogDialog'); - Modal.createDialog(ChangelogDialog, { + Modal.createTrackedDialog('Display Changelog', '', ChangelogDialog, { version: this.props.version, newVersion: this.props.newVersion, onFinished: (update) => { diff --git a/src/components/views/globals/PasswordNagBar.js b/src/components/views/globals/PasswordNagBar.js index 873cefe1..bf71fa2c 100644 --- a/src/components/views/globals/PasswordNagBar.js +++ b/src/components/views/globals/PasswordNagBar.js @@ -25,7 +25,7 @@ import { _t, _tJsx } from 'matrix-react-sdk/lib/languageHandler'; export default React.createClass({ onUpdateClicked: function() { const SetPasswordDialog = sdk.getComponent('dialogs.SetPasswordDialog'); - Modal.createDialog(SetPasswordDialog, { + Modal.createTrackedDialog('Set Password Dialog', 'Password Nag Bar', SetPasswordDialog, { onFinished: (passwordChanged) => { if (!passwordChanged) { return; diff --git a/src/components/views/rooms/DNDRoomTile.js b/src/components/views/rooms/DNDRoomTile.js index 2f521028..ee4f7036 100644 --- a/src/components/views/rooms/DNDRoomTile.js +++ b/src/components/views/rooms/DNDRoomTile.js @@ -89,7 +89,7 @@ var roomTileSource = { }, (err) => { const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); console.error("Failed to set direct chat tag " + err); - Modal.createDialog(ErrorDialog, { + Modal.createTrackedDialog('Failed to set direct chat tag', err.toString(), ErrorDialog, { title: _t('Failed to set direct chat tag'), description: ((err && err.message) ? err.message : _t('Operation failed')), }); @@ -114,7 +114,7 @@ var roomTileSource = { }).fail(function(err) { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); console.error("Failed to remove tag " + prevTag + " from room: " + err); - Modal.createDialog(ErrorDialog, { + Modal.createTrackedDialog('Failed to remove tag from room', err.toString(), ErrorDialog, { title: _t('Failed to remove tag %(tagName)s from room', {tagName: prevTag}), description: ((err && err.message) ? err.message : _t('Operation failed')), }); @@ -133,7 +133,7 @@ var roomTileSource = { MatrixClientPeg.get().setRoomTag(item.room.roomId, newTag, newOrder).catch(function(err) { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); console.error("Failed to add tag " + newTag + " to room: " + err); - Modal.createDialog(ErrorDialog, { + Modal.createTrackedDialog('Failed to add tag to room', err.toString(), ErrorDialog, { title: _t('Failed to add tag %(tagName)s to room', {tagName: newTag}), description: ((err && err.message) ? err.message : _t('Operation failed')), }); diff --git a/src/components/views/settings/Notifications.js b/src/components/views/settings/Notifications.js index 451a28b8..1ca63e1e 100644 --- a/src/components/views/settings/Notifications.js +++ b/src/components/views/settings/Notifications.js @@ -131,7 +131,7 @@ module.exports = React.createClass({ this._refreshFromServer(); }, (error) => { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); - Modal.createDialog(ErrorDialog, { + Modal.createTrackedDialog('Error saving email notification preferences', error.toString(), ErrorDialog, { title: _t('Error saving email notification preferences'), description: _t('An error occurred whilst saving your email notification preferences.'), }); @@ -175,7 +175,7 @@ module.exports = React.createClass({ } var TextInputDialog = sdk.getComponent("dialogs.TextInputDialog"); - Modal.createDialog(TextInputDialog, { + Modal.createTrackedDialog('Keywords Dialog', '', TextInputDialog, { title: _t('Keywords'), description: _t('Enter keywords separated by a comma:'), button: _t('OK'), @@ -241,7 +241,7 @@ module.exports = React.createClass({ }, function(error) { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); console.error("Failed to change settings: " + error); - Modal.createDialog(ErrorDialog, { + Modal.createTrackedDialog('Failed to change settings', error.toString(), ErrorDialog, { title: _t('Failed to change settings'), description: ((error && error.message) ? error.message : _t('Operation failed')), onFinished: self._refreshFromServer @@ -311,7 +311,7 @@ module.exports = React.createClass({ }, function(error) { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); console.error("Can't update user notification settings: " + error); - Modal.createDialog(ErrorDialog, { + Modal.createTrackedDialog('Can\'t update user notifcation settings', error.toString(), ErrorDialog, { title: _t('Can\'t update user notification settings'), description: ((error && error.message) ? error.message : _t('Operation failed')), onFinished: self._refreshFromServer @@ -353,7 +353,7 @@ module.exports = React.createClass({ var onError = function(error) { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); console.error("Failed to update keywords: " + error); - Modal.createDialog(ErrorDialog, { + Modal.createTrackedDialog('Failed to update keywords', error.toString(), ErrorDialog, { title: _t('Failed to update keywords'), description: ((error && error.message) ? error.message : _t('Operation failed')), onFinished: self._refreshFromServer From 57f82c3c9e855e6ae3a293fa24ee83145e9e958b Mon Sep 17 00:00:00 2001 From: Luke Barnard Date: Thu, 10 Aug 2017 10:18:37 +0100 Subject: [PATCH 02/11] Quote using innerText codep matrix-org/matrix-react-sdk#1289 --- .../views/context_menus/MessageContextMenu.js | 16 +++++++++------- 1 file changed, 9 insertions(+), 7 deletions(-) diff --git a/src/components/views/context_menus/MessageContextMenu.js b/src/components/views/context_menus/MessageContextMenu.js index 2064cede..5646be49 100644 --- a/src/components/views/context_menus/MessageContextMenu.js +++ b/src/components/views/context_menus/MessageContextMenu.js @@ -134,10 +134,9 @@ module.exports = React.createClass({ }, onQuoteClick: function() { - console.log(this.props.mxEvent); dis.dispatch({ action: 'quote', - event: this.props.mxEvent, + text: this.props.eventTileOps.getInnerText(), }); this.closeMenu(); }, @@ -153,6 +152,7 @@ module.exports = React.createClass({ let unhidePreviewButton; let permalinkButton; let externalURLButton; + let quoteButton; if (eventStatus === 'not_sent') { resendButton = ( @@ -221,11 +221,13 @@ module.exports = React.createClass({ ); - const quoteButton = ( -
- { _t('Quote') } -
- ); + if (this.props.eventTileOps && this.props.eventTileOps.getInnerText) { + quoteButton = ( +
+ { _t('Quote') } +
+ ); + } // Bridges can provide a 'external_url' to link back to the source. if( typeof(this.props.mxEvent.event.content.external_url) === "string") { From 7269e7b84a7902f850c6e91fc55336d844d44772 Mon Sep 17 00:00:00 2001 From: Luke Barnard Date: Thu, 10 Aug 2017 13:16:31 +0100 Subject: [PATCH 03/11] Remove userId property on RightPanel because we shouldn't have a dispatch AND have a property that do vaguely similar things. Ideally, the dispatch would send a userId and RP would do async work to get the member/avatar/displayname. --- src/components/structures/RightPanel.js | 17 ++++------------- 1 file changed, 4 insertions(+), 13 deletions(-) diff --git a/src/components/structures/RightPanel.js b/src/components/structures/RightPanel.js index 6c5c1fe1..0fae1bc0 100644 --- a/src/components/structures/RightPanel.js +++ b/src/components/structures/RightPanel.js @@ -31,7 +31,6 @@ module.exports = React.createClass({ displayName: 'RightPanel', propTypes: { - userId: React.PropTypes.string, // if showing an orphaned MemberInfo page, this is set roomId: React.PropTypes.string, // if showing panels for a given room, this is set collapsed: React.PropTypes.bool, // currently unused property to request for a minimized view of the panel }, @@ -57,17 +56,9 @@ module.exports = React.createClass({ }, getInitialState: function() { - if (this.props.userId) { - var member = new Matrix.RoomMember(null, this.props.userId); - return { - phase: this.Phase.MemberInfo, - member: member, - }; - } else { - return { - phase: this.Phase.MemberList - }; - } + return { + phase: this.Phase.MemberList + }; }, onMemberListButtonClick: function() { @@ -229,7 +220,7 @@ module.exports = React.createClass({ } else if(this.state.phase == this.Phase.MemberInfo) { var MemberInfo = sdk.getComponent('rooms.MemberInfo'); - panel = + panel = } else if (this.state.phase == this.Phase.NotificationPanel) { panel = From aae751533969352acaa736c771416d7a86201554 Mon Sep 17 00:00:00 2001 From: Marcel Date: Thu, 10 Aug 2017 14:29:41 +0200 Subject: [PATCH 04/11] Add Login Page LanguageDropdown CSS (#4767) --- .../matrix-react-sdk/structures/login/_Login.scss | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/src/skins/vector/css/matrix-react-sdk/structures/login/_Login.scss b/src/skins/vector/css/matrix-react-sdk/structures/login/_Login.scss index 805c817a..7faab6e7 100644 --- a/src/skins/vector/css/matrix-react-sdk/structures/login/_Login.scss +++ b/src/skins/vector/css/matrix-react-sdk/structures/login/_Login.scss @@ -265,3 +265,16 @@ limitations under the License. margin: 3px; vertical-align: top; } + +.mx_Login_language { + margin-left: auto; + margin-right: auto; + min-width: 60%; +} + +.mx_Login_language_div { + display: flex; + margin-top: 12px; + margin-bottom: 12px; +} + From 9c5ceb677592a28cf69dc6f1156ff35b88b20eb8 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Thu, 10 Aug 2017 13:56:01 +0100 Subject: [PATCH 05/11] don't track error messages Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/components/structures/RoomDirectory.js | 6 +++--- src/components/structures/RoomSubList.js | 2 +- src/components/views/context_menus/RoomTileContextMenu.js | 8 ++++---- src/components/views/rooms/DNDRoomTile.js | 6 +++--- 4 files changed, 11 insertions(+), 11 deletions(-) diff --git a/src/components/structures/RoomDirectory.js b/src/components/structures/RoomDirectory.js index fd870a97..e160b780 100644 --- a/src/components/structures/RoomDirectory.js +++ b/src/components/structures/RoomDirectory.js @@ -82,7 +82,7 @@ module.exports = React.createClass({ return; } const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); - Modal.createTrackedDialog('Failed to get protocol list from Home Server', err.toString(), ErrorDialog, { + Modal.createTrackedDialog('Failed to get protocol list from Home Server', '', ErrorDialog, { title: _t('Failed to get protocol list from Home Server'), description: _t('The Home Server may be too old to support third party networks'), }); @@ -178,7 +178,7 @@ module.exports = React.createClass({ this.setState({ loading: false }); console.error("Failed to get publicRooms: %s", JSON.stringify(err)); var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); - Modal.createTrackedDialog('Failed to get public room list', err.toString(), ErrorDialog, { + Modal.createTrackedDialog('Failed to get public room list', '', ErrorDialog, { title: _t('Failed to get public room list'), description: ((err && err.message) ? err.message : _t('The server may be unavailable or overloaded')) }); @@ -227,7 +227,7 @@ module.exports = React.createClass({ modal.close(); this.refreshRoomList(); console.error("Failed to " + step + ": " + err); - Modal.createTrackedDialog('Remove from Directory Error', err.toString(), ErrorDialog, { + Modal.createTrackedDialog('Remove from Directory Error', '', ErrorDialog, { title: _t('Error'), description: ((err && err.message) ? err.message : _t('The server may be unavailable or overloaded')) }); diff --git a/src/components/structures/RoomSubList.js b/src/components/structures/RoomSubList.js index afbde398..7c6b1622 100644 --- a/src/components/structures/RoomSubList.js +++ b/src/components/structures/RoomSubList.js @@ -514,7 +514,7 @@ var RoomSubList = React.createClass({ }).catch(function(err) { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); console.error("Failed to add tag " + self.props.tagName + " to room" + err); - Modal.createTrackedDialog('Failed to add tag to room', err.toString(), ErrorDialog, { + Modal.createTrackedDialog('Failed to add tag to room', '', ErrorDialog, { title: _t('Failed to add tag %(tagName)s to room', {tagName: self.props.tagName}), description: ((err && err.message) ? err.message : _t('Operation failed')), }); diff --git a/src/components/views/context_menus/RoomTileContextMenu.js b/src/components/views/context_menus/RoomTileContextMenu.js index e6bccb0a..c9ded5f4 100644 --- a/src/components/views/context_menus/RoomTileContextMenu.js +++ b/src/components/views/context_menus/RoomTileContextMenu.js @@ -70,7 +70,7 @@ module.exports = React.createClass({ }; }).catch(function(err) { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); - Modal.createTrackedDialog('Failed to remove tag from room 1', err.toString(), ErrorDialog, { + Modal.createTrackedDialog('Failed to remove tag from room 1', '', ErrorDialog, { title: _t('Failed to remove tag %(tagName)s from room', {tagName: tagNameOff}), description: ((err && err.message) ? err.message : _t('Operation failed')), }); @@ -87,7 +87,7 @@ module.exports = React.createClass({ }; }).catch(function(err) { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); - Modal.createTrackedDialog('Failed to remove tag from room 2', err.toString(), ErrorDialog, { + Modal.createTrackedDialog('Failed to remove tag from room 2', '', ErrorDialog, { title: _t('Failed to remove tag %(tagName)s from room', {tagName: tagNameOn}), description: ((err && err.message) ? err.message : _t('Operation failed')), }); @@ -148,7 +148,7 @@ module.exports = React.createClass({ }; }, (err) => { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); - Modal.createTrackedDialog('Failed to set Direct Message status of room', err.toString(), ErrorDialog, { + Modal.createTrackedDialog('Failed to set Direct Message status of room', '', ErrorDialog, { title: _t('Failed to set Direct Message status of room'), description: ((err && err.message) ? err.message : _t('Operation failed')), }); @@ -187,7 +187,7 @@ module.exports = React.createClass({ }, function(err) { var errCode = err.errcode || "unknown error code"; var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); - Modal.createTrackedDialog('Failed to forget room', err.toString(), ErrorDialog, { + Modal.createTrackedDialog('Failed to forget room', '', ErrorDialog, { title: _t('Failed to forget room %(errCode)s', {errCode: errCode}), description: ((err && err.message) ? err.message : _t('Operation failed')), }); diff --git a/src/components/views/rooms/DNDRoomTile.js b/src/components/views/rooms/DNDRoomTile.js index 9ef934f8..430906d2 100644 --- a/src/components/views/rooms/DNDRoomTile.js +++ b/src/components/views/rooms/DNDRoomTile.js @@ -89,7 +89,7 @@ var roomTileSource = { }, (err) => { const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); console.error("Failed to set direct chat tag " + err); - Modal.createTrackedDialog('Failed to set direct chat tag', err.toString(), ErrorDialog, { + Modal.createTrackedDialog('Failed to set direct chat tag', '', ErrorDialog, { title: _t('Failed to set direct chat tag'), description: ((err && err.message) ? err.message : _t('Operation failed')), }); @@ -114,7 +114,7 @@ var roomTileSource = { }).catch(function(err) { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); console.error("Failed to remove tag " + prevTag + " from room: " + err); - Modal.createTrackedDialog('Failed to remove tag from room', err.toString(), ErrorDialog, { + Modal.createTrackedDialog('Failed to remove tag from room', '', ErrorDialog, { title: _t('Failed to remove tag %(tagName)s from room', {tagName: prevTag}), description: ((err && err.message) ? err.message : _t('Operation failed')), }); @@ -133,7 +133,7 @@ var roomTileSource = { MatrixClientPeg.get().setRoomTag(item.room.roomId, newTag, newOrder).catch(function(err) { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); console.error("Failed to add tag " + newTag + " to room: " + err); - Modal.createTrackedDialog('Failed to add tag to room', err.toString(), ErrorDialog, { + Modal.createTrackedDialog('Failed to add tag to room', '', ErrorDialog, { title: _t('Failed to add tag %(tagName)s to room', {tagName: newTag}), description: ((err && err.message) ? err.message : _t('Operation failed')), }); From 4c6836bc3f67addd6b6668203ba115505f8ab64e Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Thu, 10 Aug 2017 15:13:30 +0100 Subject: [PATCH 06/11] don't track error messages .2 Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/components/structures/RoomDirectory.js | 2 +- src/components/views/context_menus/MessageContextMenu.js | 2 +- src/components/views/elements/ImageView.js | 2 +- src/components/views/settings/Notifications.js | 8 ++++---- 4 files changed, 7 insertions(+), 7 deletions(-) diff --git a/src/components/structures/RoomDirectory.js b/src/components/structures/RoomDirectory.js index e160b780..cd9ac565 100644 --- a/src/components/structures/RoomDirectory.js +++ b/src/components/structures/RoomDirectory.js @@ -334,7 +334,7 @@ module.exports = React.createClass({ } }, (e) => { const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); - Modal.createTrackedDialog('Fetching third party location failed', e.toString(), ErrorDialog, { + Modal.createTrackedDialog('Fetching third party location failed', '', ErrorDialog, { title: _t('Fetching third party location failed'), description: _t('Unable to look up room ID from server'), }); diff --git a/src/components/views/context_menus/MessageContextMenu.js b/src/components/views/context_menus/MessageContextMenu.js index ef87dcb9..a0381245 100644 --- a/src/components/views/context_menus/MessageContextMenu.js +++ b/src/components/views/context_menus/MessageContextMenu.js @@ -99,7 +99,7 @@ module.exports = React.createClass({ const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); // display error message stating you couldn't delete this. const code = e.errcode || e.statusCode; - Modal.createTrackedDialog('You cannot delete this message', e.toString(), ErrorDialog, { + Modal.createTrackedDialog('You cannot delete this message', '', ErrorDialog, { title: _t('Error'), description: _t('You cannot delete this message. (%(code)s)', {code: code}) }); diff --git a/src/components/views/elements/ImageView.js b/src/components/views/elements/ImageView.js index 96803774..e70a5d3b 100644 --- a/src/components/views/elements/ImageView.js +++ b/src/components/views/elements/ImageView.js @@ -76,7 +76,7 @@ module.exports = React.createClass({ var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); // display error message stating you couldn't delete this. var code = e.errcode || e.statusCode; - Modal.createTrackedDialog('You cannot delete this image.', e.toString(), ErrorDialog, { + Modal.createTrackedDialog('You cannot delete this image.', '', ErrorDialog, { title: _t('Error'), description: _t('You cannot delete this image. (%(code)s)', {code: code}) }); diff --git a/src/components/views/settings/Notifications.js b/src/components/views/settings/Notifications.js index 1ca63e1e..a58b5d58 100644 --- a/src/components/views/settings/Notifications.js +++ b/src/components/views/settings/Notifications.js @@ -131,7 +131,7 @@ module.exports = React.createClass({ this._refreshFromServer(); }, (error) => { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); - Modal.createTrackedDialog('Error saving email notification preferences', error.toString(), ErrorDialog, { + Modal.createTrackedDialog('Error saving email notification preferences', '', ErrorDialog, { title: _t('Error saving email notification preferences'), description: _t('An error occurred whilst saving your email notification preferences.'), }); @@ -241,7 +241,7 @@ module.exports = React.createClass({ }, function(error) { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); console.error("Failed to change settings: " + error); - Modal.createTrackedDialog('Failed to change settings', error.toString(), ErrorDialog, { + Modal.createTrackedDialog('Failed to change settings', '', ErrorDialog, { title: _t('Failed to change settings'), description: ((error && error.message) ? error.message : _t('Operation failed')), onFinished: self._refreshFromServer @@ -311,7 +311,7 @@ module.exports = React.createClass({ }, function(error) { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); console.error("Can't update user notification settings: " + error); - Modal.createTrackedDialog('Can\'t update user notifcation settings', error.toString(), ErrorDialog, { + Modal.createTrackedDialog('Can\'t update user notifcation settings', '', ErrorDialog, { title: _t('Can\'t update user notification settings'), description: ((error && error.message) ? error.message : _t('Operation failed')), onFinished: self._refreshFromServer @@ -353,7 +353,7 @@ module.exports = React.createClass({ var onError = function(error) { var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); console.error("Failed to update keywords: " + error); - Modal.createTrackedDialog('Failed to update keywords', error.toString(), ErrorDialog, { + Modal.createTrackedDialog('Failed to update keywords', '', ErrorDialog, { title: _t('Failed to update keywords'), description: ((error && error.message) ? error.message : _t('Operation failed')), onFinished: self._refreshFromServer From 68dd47aa7bdc4a9262fc0996be9bf7731bd60bf9 Mon Sep 17 00:00:00 2001 From: Andrei Shevchuk Date: Thu, 10 Aug 2017 17:50:09 +0300 Subject: [PATCH 07/11] Make member device info buttons fluid and stackable with flexbox Buttons with short text stay as they are, buttons with long text don't get overflowed, but just grow and wrap on a new line if needed, still remaining aligned with others (see screenshot in PR comments) Signed-off-by: Andrei Shevchuk --- .../views/rooms/_MemberDeviceInfo.scss | 17 +++++++++-------- 1 file changed, 9 insertions(+), 8 deletions(-) diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/_MemberDeviceInfo.scss b/src/skins/vector/css/matrix-react-sdk/views/rooms/_MemberDeviceInfo.scss index f1584d4e..4d0db6c1 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/rooms/_MemberDeviceInfo.scss +++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/_MemberDeviceInfo.scss @@ -18,6 +18,13 @@ limitations under the License. padding: 10px 0px; } +.mx_MemberDeviceInfo.mx_DeviceVerifyButtons { + width: 100%; + padding: 6px 0; + display: flex; + flex-wrap: wrap; + justify-content: space-between; +} .mx_MemberDeviceInfo_textButton { color: $accent-fg-color; @@ -26,12 +33,11 @@ limitations under the License. text-align: center; padding-left: 1em; padding-right: 1em; - width: 95px; border: 0px; font-size: 14px; - cursor: pointer; - display: inline; + margin: 2px; + flex: 1; } .mx_MemberDeviceInfo_deviceId { @@ -44,11 +50,6 @@ limitations under the License. border-bottom: 1px solid rgba(0,0,0,0.1); } -.mx_MemberDeviceInfo_blacklist, -.mx_MemberDeviceInfo_unblacklist { - float: right; -} - /* "Unblacklist" is too long for a regular button: make it wider and reduce the padding. */ .mx_EncryptedEventDialog .mx_MemberDeviceInfo_blacklist, From 44c6f3fafc0c2ec2efafd5379f4161a4c752cd11 Mon Sep 17 00:00:00 2001 From: Luke Barnard Date: Thu, 10 Aug 2017 16:59:12 +0100 Subject: [PATCH 08/11] Add todo to make RP listen to RVS --- src/components/structures/RightPanel.js | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/structures/RightPanel.js b/src/components/structures/RightPanel.js index 0fae1bc0..9120de8c 100644 --- a/src/components/structures/RightPanel.js +++ b/src/components/structures/RightPanel.js @@ -31,6 +31,7 @@ module.exports = React.createClass({ displayName: 'RightPanel', propTypes: { + // TODO: This should not be a prop, it should be received from the RoomViewStore roomId: React.PropTypes.string, // if showing panels for a given room, this is set collapsed: React.PropTypes.bool, // currently unused property to request for a minimized view of the panel }, From a72fc80ef6ad65a0b4d74c8d7901da897aed16aa Mon Sep 17 00:00:00 2001 From: Andrei Shevchuk Date: Thu, 10 Aug 2017 20:08:46 +0300 Subject: [PATCH 09/11] Remove width 100% from device info buttons wrapper --- .../css/matrix-react-sdk/views/rooms/_MemberDeviceInfo.scss | 1 - 1 file changed, 1 deletion(-) diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/_MemberDeviceInfo.scss b/src/skins/vector/css/matrix-react-sdk/views/rooms/_MemberDeviceInfo.scss index 4d0db6c1..2a5be325 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/rooms/_MemberDeviceInfo.scss +++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/_MemberDeviceInfo.scss @@ -19,7 +19,6 @@ limitations under the License. } .mx_MemberDeviceInfo.mx_DeviceVerifyButtons { - width: 100%; padding: 6px 0; display: flex; flex-wrap: wrap; From 5bfb5d4c3ccdde039d3a2794231ea62af996be3f Mon Sep 17 00:00:00 2001 From: Matthew Hodgson Date: Tue, 18 Apr 2017 17:36:23 +0100 Subject: [PATCH 10/11] move focus-via-up/down cursors to LeftPanel Conflicts: src/components/structures/LeftPanel.js --- src/components/structures/LeftPanel.js | 109 ++++++++++++++++++++++--- 1 file changed, 99 insertions(+), 10 deletions(-) diff --git a/src/components/structures/LeftPanel.js b/src/components/structures/LeftPanel.js index 77338404..4539df1f 100644 --- a/src/components/structures/LeftPanel.js +++ b/src/components/structures/LeftPanel.js @@ -16,17 +16,16 @@ limitations under the License. 'use strict'; -var React = require('react'); -var DragDropContext = require('react-dnd').DragDropContext; -var HTML5Backend = require('react-dnd-html5-backend'); -var sdk = require('matrix-react-sdk') -var dis = require('matrix-react-sdk/lib/dispatcher'); +import React from 'react'; +import { DragDropContext } from 'react-dnd'; +import HTML5Backend from 'react-dnd-html5-backend'; +import KeyCode from 'matrix-react-sdk/lib/KeyCode'; +import sdk from 'matrix-react-sdk'; +import dis from 'matrix-react-sdk/lib/dispatcher'; import MatrixClientPeg from 'matrix-react-sdk/lib/MatrixClientPeg'; - -var VectorConferenceHandler = require('../../VectorConferenceHandler'); -var CallHandler = require("matrix-react-sdk/lib/CallHandler"); - +import CallHandler from 'matrix-react-sdk/lib/CallHandler'; import AccessibleButton from 'matrix-react-sdk/lib/components/views/elements/AccessibleButton'; +import VectorConferenceHandler from '../../VectorConferenceHandler'; var LeftPanel = React.createClass({ displayName: 'LeftPanel', @@ -42,6 +41,10 @@ var LeftPanel = React.createClass({ }; }, + componentWillMount: function() { + this.focusedElement = null; + }, + componentDidMount: function() { this.dispatcherRef = dis.register(this.onAction); }, @@ -64,6 +67,91 @@ var LeftPanel = React.createClass({ } }, + _onFocus: function(ev) { + this.focusedElement = ev.target; + }, + + _onBlur: function(ev) { + this.focusedElement = null; + }, + + _onKeyDown: function(ev) { + if (!this.focusedElement) return; + let handled = false; + + switch (ev.keyCode) { + case KeyCode.UP: + this._onMoveFocus(true); + handled = true; + break; + case KeyCode.DOWN: + this._onMoveFocus(false); + handled = true; + break; + } + + if (handled) { + ev.stopPropagation(); + ev.preventDefault(); + } + }, + + _onMoveFocus: function(up) { + var element = this.focusedElement; + + // unclear why this isn't needed + // var descending = (up == this.focusDirection) ? this.focusDescending : !this.focusDescending; + // this.focusDirection = up; + + var descending = false; // are we currently descending or ascending through the DOM tree? + var classes; + + do { + var child = up ? element.lastElementChild : element.firstElementChild; + var sibling = up ? element.previousElementSibling : element.nextElementSibling; + + if (descending) { + if (child) { + element = child; + } + else if (sibling) { + element = sibling; + } + else { + descending = false; + element = element.parentElement; + } + } + else { + if (sibling) { + element = sibling; + descending = true; + } + else { + element = element.parentElement; + } + } + + if (element) { + classes = element.classList; + if (classes.contains("mx_LeftPanel")) { // we hit the top + element = up ? element.lastElementChild : element.firstElementChild; + descending = true; + } + } + + } while(element && !( + classes.contains("mx_RoomTile") || + classes.contains("mx_SearchBox_search") || + classes.contains("mx_RoomSubList_ellipsis"))); + + if (element) { + element.focus(); + this.focusedElement = element; + this.focusedDescending = descending; + } + }, + _recheckCallElement: function(selectedRoomId) { // if we aren't viewing a room with an ongoing call, but there is an // active call, show the call element - we need to do this to make @@ -126,7 +214,8 @@ var LeftPanel = React.createClass({ } return ( -