improve error messages, etc

src/components/views/rooms/RoomPreviewBar.js

@@ -77,7 +77,6 @@ module.exports = React.createClass({
     getDefaultProps: function() {
         return {
             onJoinClick: function() {},
-            canPreview: true,
         };
     },
 
@@ -222,19 +221,18 @@ module.exports = React.createClass({
             case MessageCase.OtherThreePIDError: {
                 title = _t("Something went wrong with your invite to this room");
                 const joinRule = this._joinRule();
-                const errCodeMessage = _t("<code>%(errcode)s</code> was returned while trying to valide your invite. You could try to pass this information on to a room admin.",
+                const errCodeMessage = _t("%(errcode)s was returned while trying to valide your invite. You could try to pass this information on to a room admin.",
                     {errcode: this.state.threePidFetchError.errcode},
-                    {code: label => <code>{label}</code>}
                 );
                 switch (joinRule) {
                     case "invite":
                         subTitle = [
-                            _t("Sadly, you can only join it with a working invite."),
+                            _t("You can only join it with a working invite."),
                             errCodeMessage,
                         ];
                         break;
                     case "public":
-                        subTitle = _t("Luckily, you can still join it because this is a public room.");
+                        subTitle = _t("You can still join it because this is a public room.");
                         primaryActionLabel = _t("Join the discussion");
                         primaryActionHandler = this.props.onJoinClick;
                         break;
@@ -250,7 +248,7 @@ module.exports = React.createClass({
                 title = _t("The room invite wasn't sent to your account");
                 const joinRule = this._joinRule();
                 if (joinRule === "public") {
-                    subTitle = _t("Luckily, you can still join it because this is a public room.");
+                    subTitle = _t("You can still join it because this is a public room.");
                     primaryActionLabel = _t("Join the discussion");
                     primaryActionHandler = this.props.onJoinClick;
                 } else {
@@ -292,20 +290,20 @@ module.exports = React.createClass({
             }
             case MessageCase.OtherError: {
                 title = _t("%(roomName)s is not accessible at this time.", {roomName: this._roomName()});
-                subTitle = ([
+                subTitle = [
                     _t("Try again later, or ask a room admin to check if you have access."),
-                    _t("<code>%(errcode)s</code> was returned while trying to access the room.", {errcode: this.props.error.errcode}),
+                    _t("%(errcode)s was returned while trying to access the room. If you think you're seeing this message in error, please <issueLink>submit a bug report</issueLink>.",
-                    _t("If you think you're seeing this message in error, please <issueLink>submit a bug report</issueLink>.", {}, {
+                        { errcode: this.props.error.errcode },
-                        issueLink: label => <a href="https://github.com/vector-im/riot-web/issues/new/choose"
+                        { issueLink: label => <a href="https://github.com/vector-im/riot-web/issues/new/choose"
-                                                  target="_blank" rel="noopener">{ label }</a>,
+                            target="_blank" rel="noopener">{ label }</a> }
-                        code: label => <code>{label}</code>,
+                    ),
-                    }),
+                ];
-                ]);
                 break;
             }
         }
 
         const AccessibleButton = sdk.getComponent('elements.AccessibleButton');
+        const Spinner = sdk.getComponent('elements.Spinner');
 
         let subTitleElements;
         if (subTitle) {
@@ -318,12 +316,20 @@ module.exports = React.createClass({
         const classes = classNames("mx_RoomPreviewBar", "dark-panel", {
             "mx_RoomPreviewBar_panel": this.props.canPreview,
             "mx_RoomPreviewBar_dialog": !this.props.canPreview,
+            "mx_RoomPreviewBar_dark": darkStyle,
         });
 
+        let titleElement;
+        if (showSpinner) {
+            titleElement = <h3 className="mx_RoomPreviewBar_spinnerTitle"><Spinner />{ title }</h3>;
+        } else {
+            titleElement = <h3>{ title }</h3>;
+        }
+
         return (
             <div className={classes}>
                 <div className="mx_RoomPreviewBar_message">
-                    <h3>{ title }</h3>
+                    { titleElement }
                     { subTitleElements }
                 </div>
                 <div className="mx_RoomPreviewBar_actions">

src/i18n/strings/en_EN.json

@@ -800,6 +800,12 @@
     "Re-join": "Re-join",
     "Forget this room": "Forget this room",
     "You were banned from this room by %(memberName)s": "You were banned from this room by %(memberName)s",
+    "Something went wrong with your invite to this room": "Something went wrong with your invite to this room",
+    "%(errcode)s was returned while trying to valide your invite. You could try to pass this information on to a room admin.": "%(errcode)s was returned while trying to valide your invite. You could try to pass this information on to a room admin.",
+    "You can only join it with a working invite.": "You can only join it with a working invite.",
+    "You can still join it because this is a public room.": "You can still join it because this is a public room.",
+    "Join the discussion": "Join the discussion",
+    "Try to join anyway": "Try to join anyway",
     "The room invite wasn't sent to your account": "The room invite wasn't sent to your account",
     "Sign in with a different account, ask for another invite, or add the e-mail address %(email)s to this account.": "Sign in with a different account, ask for another invite, or add the e-mail address %(email)s to this account.",
     "%(memberName)s invited you to this room": "%(memberName)s invited you to this room",
@@ -808,12 +814,11 @@
     "Reject": "Reject",
     "You're previewing this room. Want to join it?": "You're previewing this room. Want to join it?",
     "This room can't be previewed. Do you want to join it?": "This room can't be previewed. Do you want to join it?",
-    "Join the discussion": "Join the discussion",
     "%(roomName)s does not exist.": "%(roomName)s does not exist.",
     "This room doesn't exist. Are you sure you're at the right place?": "This room doesn't exist. Are you sure you're at the right place?",
     "%(roomName)s is not accessible at this time.": "%(roomName)s is not accessible at this time.",
     "Try again later, or ask a room admin to check if you have access.": "Try again later, or ask a room admin to check if you have access.",
-    "If you think you're seeing this message in error, please <issueLink>submit a bug report</issueLink>.": "If you think you're seeing this message in error, please <issueLink>submit a bug report</issueLink>.",
+    "%(errcode)s was returned while trying to access the room. If you think you're seeing this message in error, please <issueLink>submit a bug report</issueLink>.": "%(errcode)s was returned while trying to access the room. If you think you're seeing this message in error, please <issueLink>submit a bug report</issueLink>.",
     "Use Key Backup": "Use Key Backup",
     "Never lose encrypted messages": "Never lose encrypted messages",
     "Messages in this room are secured with end-to-end encryption. Only you and the recipient(s) have the keys to read these messages.": "Messages in this room are secured with end-to-end encryption. Only you and the recipient(s) have the keys to read these messages.",