Merge pull request #2148 from matrix-org/dbkr/dont_say_email_optional_if_it_isnt

Correctly mark email as optional

src/components/structures/login/Registration.js

@@ -93,6 +93,7 @@ module.exports = React.createClass({
             doingUIAuth: Boolean(this.props.sessionId),
             hsUrl: this.props.customHsUrl,
             isUrl: this.props.customIsUrl,
+            flows: null,
         };
     },
 
@@ -145,11 +146,27 @@ module.exports = React.createClass({
         });
     },
 
-    _replaceClient: function() {
+    _replaceClient: async function() {
         this._matrixClient = Matrix.createClient({
             baseUrl: this.state.hsUrl,
             idBaseUrl: this.state.isUrl,
         });
+        try {
+            await this._makeRegisterRequest({});
+            // This should never succeed since we specified an empty
+            // auth object.
+            console.log("Expecting 401 from register request but got success!");
+        } catch (e) {
+            if (e.httpStatus === 401) {
+                this.setState({
+                    flows: e.data.flows,
+                });
+            } else {
+                this.setState({
+                    errorText: _t("Unable to query for supported registration methods"),
+                });
+            }
+        }
     },
 
     onFormSubmit: function(formVals) {
@@ -378,7 +395,7 @@ module.exports = React.createClass({
                     poll={true}
                 />
             );
-        } else if (this.state.busy || this.state.teamServerBusy) {
+        } else if (this.state.busy || this.state.teamServerBusy || !this.state.flows) {
             registerBody = <Spinner />;
         } else {
             let serverConfigSection;
@@ -408,6 +425,7 @@ module.exports = React.createClass({
                         onError={this.onFormValidationFailed}
                         onRegisterClick={this.onFormSubmit}
                         onTeamSelected={this.onTeamSelected}
+                        flows={this.state.flows}
                     />
                     { serverConfigSection }
                 </div>

src/components/views/login/RegistrationForm.js

@@ -1,6 +1,7 @@
 /*
 Copyright 2015, 2016 OpenMarket Ltd
 Copyright 2017 Vector Creations Ltd
+Copyright 2018 New Vector Ltd
 
 Licensed under the Apache License, Version 2.0 (the "License");
 you may not use this file except in compliance with the License.
@@ -49,7 +50,7 @@ module.exports = React.createClass({
         teamsConfig: PropTypes.shape({
             // Email address to request new teams
             supportEmail: PropTypes.string,
-            teams: PropTypes.arrayOf(React.PropTypes.shape({
+            teams: PropTypes.arrayOf(PropTypes.shape({
                 // The displayed name of the team
                 "name": PropTypes.string,
                 // The domain of team email addresses
@@ -60,6 +61,7 @@ module.exports = React.createClass({
         minPasswordLength: PropTypes.number,
         onError: PropTypes.func,
         onRegisterClick: PropTypes.func.isRequired, // onRegisterClick(Object) => ?Promise
+        flows: PropTypes.arrayOf(PropTypes.object).isRequired,
     },
 
     getDefaultProps: function() {
@@ -273,12 +275,18 @@ module.exports = React.createClass({
         });
     },
 
+    _authStepIsRequired(step) {
+        // A step is required if no flow exists which does not include that step
+        // (Notwithstanding setups like either email or msisdn being required)
+        return !this.props.flows.some((flow) => {
+            return !flow.stages.includes(step);
+        });
+    },
+
     render: function() {
         const self = this;
 
-        const theme = SettingsStore.getValue("theme");
-        // FIXME: remove hardcoded Status team tweaks at some point
-        const emailPlaceholder = theme === 'status' ? _t("Email address") : _t("Email address (optional)");
+        const emailPlaceholder = this._authStepIsRequired('m.login.email.identity') ? _t("Email address") : _t("Email address (optional)");
 
         const emailSection = (
             <div>
@@ -315,6 +323,7 @@ module.exports = React.createClass({
         const CountryDropdown = sdk.getComponent('views.login.CountryDropdown');
         let phoneSection;
         if (!SdkConfig.get().disable_3pid_login) {
+            const phonePlaceholder = this._authStepIsRequired('m.login.msisdn') ? _t("Mobile phone number") : _t("Mobile phone number (optional)");
             phoneSection = (
                 <div className="mx_Login_phoneSection">
                     <CountryDropdown ref="phone_country" onOptionChange={this._onPhoneCountryChange}
@@ -324,7 +333,7 @@ module.exports = React.createClass({
                         showPrefix={true}
                     />
                     <input type="text" ref="phoneNumber"
-                        placeholder={_t("Mobile phone number (optional)")}
+                        placeholder={phonePlaceholder}
                         defaultValue={this.props.defaultPhoneNumber}
                         className={this._classForField(
                             FIELD_PHONE_NUMBER,

test/components/views/login/RegistrationForm-test.js

@@ -37,6 +37,11 @@ function doInputEmail(inputEmail, onTeamSelected) {
         <RegistrationForm
             teamsConfig={TEAM_CONFIG}
             onTeamSelected={onTeamSelected}
+            flows={[
+                {
+                    stages: ['m.login.dummy'],
+                },
+            ]}
         />,
     );