Merge remote-tracking branch 'origin/develop' into dbkr/register_ui_auth

(This ended up mostly being merged by hand as git made a complete
mess of the merge)

src/Lifecycle.js

@@ -277,6 +277,9 @@ export function setLoggedIn(credentials) {
                 credentials.userId, credentials.guest,
                 credentials.homeserverUrl);
 
+    // Resolves by default
+    let teamPromise = Promise.resolve(null);
+
     // persist the session
     if (localStorage) {
         try {
@@ -300,16 +303,12 @@ export function setLoggedIn(credentials) {
             console.warn("Error using local storage: can't persist session!", e);
         }
 
-        if (rtsClient) {
-            rtsClient.login(credentials.userId).then((body) => {
+        if (rtsClient && !credentials.guest) {
+            teamPromise = rtsClient.login(credentials.userId).then((body) => {
                 if (body.team_token) {
                     localStorage.setItem("mx_team_token", body.team_token);
                 }
-            }, (err) =>{
-                console.error(
-                    "Failed to get team token on login, not persisting to localStorage",
-                    err
-                );
+                return body.team_token;
             });
         }
     } else {
@@ -321,7 +320,12 @@ export function setLoggedIn(credentials) {
 
     MatrixClientPeg.replaceUsingCreds(credentials);
 
-    dis.dispatch({action: 'on_logged_in'});
+    teamPromise.then((teamToken) => {
+        dis.dispatch({action: 'on_logged_in', teamToken: teamToken});
+    }, (err) => {
+        console.warn("Failed to get team token on login", err);
+        dis.dispatch({action: 'on_logged_in', teamToken: null});
+    });
 
     startMatrixClient();
 }

src/components/structures/MatrixChat.js

@@ -524,7 +524,7 @@ module.exports = React.createClass({
                 this._onSetTheme(payload.value);
                 break;
             case 'on_logged_in':
-                this._onLoggedIn();
+                this._onLoggedIn(payload.teamToken);
                 break;
             case 'on_logged_out':
                 this._onLoggedOut();
@@ -700,13 +700,20 @@ module.exports = React.createClass({
     /**
      * Called when a new logged in session has started
      */
-    _onLoggedIn: function(credentials) {
+    _onLoggedIn: function(teamToken) {
         this.guestCreds = null;
         this.notifyNewScreen('');
         this.setState({
             screen: undefined,
             logged_in: true,
         });
+
+        if (teamToken) {
+            this._teamToken = teamToken;
+            this._setPage(PageTypes.HomePage);
+        } else if (this._is_registered) {
+            this._setPage(PageTypes.UserSettings);
+        }
     },
 
     /**
@@ -723,6 +730,7 @@ module.exports = React.createClass({
             currentRoomId: null,
             page_type: PageTypes.RoomDirectory,
         });
+        this._teamToken = null;
     },
 
     /**
@@ -993,23 +1001,11 @@ module.exports = React.createClass({
         }
     },
 
-    onRegistered: function(credentials) {
-        Lifecycle.setLoggedIn(credentials);
-        // do post-registration stuff
-        // This now goes straight to user settings
-        // We use _setPage since if we wait for
-        // showScreen to do the dispatch loop,
-        // the showScreen dispatch will race with the
-        // sdk sync finishing and we'll probably see
-        // the page type still unset when the MatrixClient
-        // is started and show the Room Directory instead.
-        //this.showScreen("view_user_settings");
-        this._setPage(PageTypes.UserSettings);
-    },
-
-    onTeamMemberRegistered: function(teamToken) {
+    onRegistered: function(credentials, teamToken) {
+        // teamToken may not be truthy
         this._teamToken = teamToken;
-        this._setPage(PageTypes.HomePage);
+        this._is_registered = true;
+        Lifecycle.setLoggedIn(credentials);
     },
 
     onFinishPostRegistration: function() {
@@ -1146,7 +1142,6 @@ module.exports = React.createClass({
                     customIsUrl={this.getCurrentIsUrl()}
                     makeRegistrationUrl={this.props.makeRegistrationUrl}
                     defaultDeviceDisplayName={this.props.defaultDeviceDisplayName}
-                    onTeamMemberRegistered={this.onTeamMemberRegistered}
                     onLoggedIn={this.onRegistered}
                     onLoginClick={this.onLoginClick}
                     onRegisterClick={this.onRegisterClick}

src/components/structures/login/Registration.js

@@ -17,15 +17,19 @@ limitations under the License.
 
 import Matrix from 'matrix-js-sdk';
 
-var React = require('react');
+import q from 'q';
+import React from 'react';
 
-var sdk = require('../../../index');
-var MatrixClientPeg = require("../../../MatrixClientPeg");
-var RegistrationForm = require("../../views/login/RegistrationForm");
-var CaptchaForm = require("../../views/login/CaptchaForm");
-var RtsClient = require("../../../RtsClient");
+import sdk from '../../../index';
+import dis from '../../../dispatcher';
+import Signup from '../../../Signup';
+import ServerConfig from '../../views/login/ServerConfig';
+import MatrixClientPeg from '../../../MatrixClientPeg';
+import RegistrationForm from '../../views/login/RegistrationForm';
+import CaptchaForm from '../../views/login/CaptchaForm';
+import RtsClient from '../../../RtsClient';
 
-var MIN_PASSWORD_LENGTH = 6;
+const MIN_PASSWORD_LENGTH = 6;
 
 /**
  * TODO: It would be nice to make use of the InteractiveAuthEntryComponents
@@ -56,7 +60,6 @@ module.exports = React.createClass({
             teamServerURL: React.PropTypes.string.isRequired,
         }),
         teamSelected: React.PropTypes.object,
-        onTeamMemberRegistered: React.PropTypes.func.isRequired,
 
         defaultDeviceDisplayName: React.PropTypes.string,
 
@@ -182,20 +185,20 @@ module.exports = React.createClass({
         // will just nop. The point of this being we might not have the email address
         // that the user registered with at this stage (depending on whether this
         // is the client they initiated registration).
-        if (self._rtsClient) {
-            // Track referral if self.props.referrer set, get team_token in order to
+        if (this._rtsClient) {
+            // Track referral if this.props.referrer set, get team_token in order to
             // retrieve team config and see welcome page etc.
-            self._rtsClient.trackReferral(
-                self.props.referrer || '', // Default to empty string = not referred
-                self.registerLogic.params.idSid,
-                self.registerLogic.params.clientSecret
+            this._rtsClient.trackReferral(
+                this.props.referrer || '', // Default to empty string = not referred
+                this.registerLogic.params.idSid,
+                this.registerLogic.params.clientSecret
             ).then((data) => {
                 const teamToken = data.team_token;
                 // Store for use /w welcome pages
                 window.localStorage.setItem('mx_team_token', teamToken);
-                self.props.onTeamMemberRegistered(teamToken);
+                this.props.onTeamMemberRegistered(teamToken);
 
-                self._rtsClient.getTeam(teamToken).then((team) => {
+                this._rtsClient.getTeam(teamToken).then((team) => {
                     console.log(
                         `User successfully registered with team ${team.name}`
                     );
@@ -209,6 +212,8 @@ module.exports = React.createClass({
                             MatrixClientPeg.get().joinRoom(room.room_id);
                         }
                     });
+
+                    return teamToken;
                 }, (err) => {
                     console.error('Error getting team config', err);
                 });
@@ -217,25 +222,40 @@ module.exports = React.createClass({
             });
         }
 
-        // Set approipriate branding on the email pusher
-        if (self.props.brand) {
-            MatrixClientPeg.get().getPushers().done((resp)=>{
-                var pushers = resp.pushers;
-                for (var i = 0; i < pushers.length; ++i) {
-                    if (pushers[i].kind == 'email') {
-                        var emailPusher = pushers[i];
-                        emailPusher.data = { brand: self.props.brand };
-                        MatrixClientPeg.get().setPusher(emailPusher).done(() => {
-                            console.log("Set email branding to " + self.props.brand);
-                        }, (error) => {
-                            console.error("Couldn't set email branding: " + error);
-                        });
-                    }
-                }
-            }, (error) => {
-                console.error("Couldn't get pushers: " + error);
-            });
+        trackPromise.then((teamToken) => {
+            console.info('Team token promise',teamToken);
+            this.props.onLoggedIn({
+                userId: response.user_id,
+                deviceId: response.device_id,
+                homeserverUrl: this.registerLogic.getHomeserverUrl(),
+                identityServerUrl: this.registerLogic.getIdentityServerUrl(),
+                accessToken: response.access_token
+            }, teamToken);
+        }).then(() => {
+            return this._setupPushers();
+        }.done());
+    },
+
+    _setupPushers: function() {
+        if (!this.props.brand) {
+            return q();
         }
+        return MatrixClientPeg.get().getPushers().then((resp)=>{
+            const pushers = resp.pushers;
+            for (let i = 0; i < pushers.length; ++i) {
+                if (pushers[i].kind == 'email') {
+                    const emailPusher = pushers[i];
+                    emailPusher.data = { brand: this.props.brand };
+                    MatrixClientPeg.get().setPusher(emailPusher).done(() => {
+                        console.log("Set email branding to " + this.props.brand);
+                    }, (error) => {
+                        console.error("Couldn't set email branding: " + error);
+                    });
+                }
+            }
+        }, (error) => {
+            console.error("Couldn't get pushers: " + error);
+        });
     },
 
     onFormValidationFailed: function(errCode) {

src/components/views/rooms/EventTile.js

@@ -318,8 +318,12 @@ module.exports = WithMatrixClient(React.createClass({
                     this.props.readReceiptMap[userId] = readReceiptInfo;
                 }
             }
+            // TODO: we keep the extra read avatars in the dom to make animation simpler
+            // we could optimise this to reduce the dom size.
+            if (!hidden) {
+                left -= 15;
+            }
 
-            //console.log("i = " + i + ", MAX_READ_AVATARS = " + MAX_READ_AVATARS + ", allReadAvatars = " + this.state.allReadAvatars + " visibility = " + style.visibility);
             // add to the start so the most recent is on the end (ie. ends up rightmost)
             avatars.unshift(
                 <ReadReceiptMarker key={userId} member={receipt.roomMember}
@@ -332,12 +336,6 @@ module.exports = WithMatrixClient(React.createClass({
                     showFullTimestamp={receipt.ts >= dayAfterEventTime}
                 />
             );
-
-            // TODO: we keep the extra read avatars in the dom to make animation simpler
-            // we could optimise this to reduce the dom size.
-            if (!hidden) {
-                left -= 15;
-            }
         }
         var remText;
         if (!this.state.allReadAvatars) {
@@ -345,9 +343,8 @@ module.exports = WithMatrixClient(React.createClass({
             if (remainder > 0) {
                 remText = <span className="mx_EventTile_readAvatarRemainder"
                     onClick={this.toggleAllReadAvatars}
-                    style={{ left: left }}>{ remainder }+
+                    style={{ right: -(left - 15) }}>{ remainder }+
                 </span>;
-                left -= 15;
             }
         }