diff --git a/src/HtmlUtils.js b/src/HtmlUtils.js index f1420d0a22..c500076783 100644 --- a/src/HtmlUtils.js +++ b/src/HtmlUtils.js @@ -58,22 +58,6 @@ export function unicodeToImage(str) { return str; } -/** - * Given one or more unicode characters (represented by unicode - * character number), return an image node with the corresponding - * emoji. - * - * @param alt {string} String to use for the image alt text - * @param unicode {integer} One or more integers representing unicode characters - * @returns A img node with the corresponding emoji - */ -export function charactersToImageNode(alt, ...unicode) { - const fileName = unicode.map((u) => { - return u.toString(16); - }).join('-'); - return {alt}; -} - export function stripParagraphs(html: string): string { const contentDiv = document.createElement('div'); contentDiv.innerHTML = html; diff --git a/src/Login.js b/src/Login.js index 053f88ce93..96f953c130 100644 --- a/src/Login.js +++ b/src/Login.js @@ -105,38 +105,21 @@ export default class Login { }); } - loginViaPassword(username, phoneCountry, phoneNumber, pass) { - const self = this; - - const isEmail = username.indexOf("@") > 0; - - let identifier; - if (phoneCountry && phoneNumber) { - identifier = { - type: 'm.id.phone', - country: phoneCountry, - number: phoneNumber, - }; - } else if (isEmail) { - identifier = { - type: 'm.id.thirdparty', - medium: 'email', - address: username, - }; - } else { - identifier = { - type: 'm.id.user', - user: username, - }; - } - - const loginParams = { + loginViaPassword(username, pass) { + var self = this; + var isEmail = username.indexOf("@") > 0; + var loginParams = { password: pass, - identifier: identifier, initial_device_display_name: this._defaultDeviceDisplayName, }; + if (isEmail) { + loginParams.medium = 'email'; + loginParams.address = username; + } else { + loginParams.user = username; + } - const client = this._createTemporaryClient(); + var client = this._createTemporaryClient(); return client.login('m.login.password', loginParams).then(function(data) { return q({ homeserverUrl: self._hsUrl, diff --git a/src/component-index.js b/src/component-index.js index 59d3ad53e4..2644f1a379 100644 --- a/src/component-index.js +++ b/src/component-index.js @@ -109,8 +109,6 @@ import views$elements$DeviceVerifyButtons from './components/views/elements/Devi views$elements$DeviceVerifyButtons && (module.exports.components['views.elements.DeviceVerifyButtons'] = views$elements$DeviceVerifyButtons); import views$elements$DirectorySearchBox from './components/views/elements/DirectorySearchBox'; views$elements$DirectorySearchBox && (module.exports.components['views.elements.DirectorySearchBox'] = views$elements$DirectorySearchBox); -import views$elements$Dropdown from './components/views/elements/Dropdown'; -views$elements$Dropdown && (module.exports.components['views.elements.Dropdown'] = views$elements$Dropdown); import views$elements$EditableText from './components/views/elements/EditableText'; views$elements$EditableText && (module.exports.components['views.elements.EditableText'] = views$elements$EditableText); import views$elements$EditableTextContainer from './components/views/elements/EditableTextContainer'; @@ -133,8 +131,6 @@ import views$login$CaptchaForm from './components/views/login/CaptchaForm'; views$login$CaptchaForm && (module.exports.components['views.login.CaptchaForm'] = views$login$CaptchaForm); import views$login$CasLogin from './components/views/login/CasLogin'; views$login$CasLogin && (module.exports.components['views.login.CasLogin'] = views$login$CasLogin); -import views$login$CountryDropdown from './components/views/login/CountryDropdown'; -views$login$CountryDropdown && (module.exports.components['views.login.CountryDropdown'] = views$login$CountryDropdown); import views$login$CustomServerDialog from './components/views/login/CustomServerDialog'; views$login$CustomServerDialog && (module.exports.components['views.login.CustomServerDialog'] = views$login$CustomServerDialog); import views$login$InteractiveAuthEntryComponents from './components/views/login/InteractiveAuthEntryComponents'; diff --git a/src/components/structures/login/Login.js b/src/components/structures/login/Login.js index 0a1549f75b..69195fc715 100644 --- a/src/components/structures/login/Login.js +++ b/src/components/structures/login/Login.js @@ -1,6 +1,5 @@ /* Copyright 2015, 2016 OpenMarket Ltd -Copyright 2017 Vector Creations Ltd Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. @@ -65,10 +64,8 @@ module.exports = React.createClass({ enteredHomeserverUrl: this.props.customHsUrl || this.props.defaultHsUrl, enteredIdentityServerUrl: this.props.customIsUrl || this.props.defaultIsUrl, - // used for preserving form values when changing homeserver + // used for preserving username when changing homeserver username: "", - phoneCountry: null, - phoneNumber: "", }; }, @@ -76,21 +73,20 @@ module.exports = React.createClass({ this._initLoginLogic(); }, - onPasswordLogin: function(username, phoneCountry, phoneNumber, password) { - this.setState({ + onPasswordLogin: function(username, password) { + var self = this; + self.setState({ busy: true, errorText: null, loginIncorrect: false, }); - this._loginLogic.loginViaPassword( - username, phoneCountry, phoneNumber, password, - ).then((data) => { - this.props.onLoggedIn(data); - }, (error) => { - this._setStateFromError(error, true); - }).finally(() => { - this.setState({ + this._loginLogic.loginViaPassword(username, password).then(function(data) { + self.props.onLoggedIn(data); + }, function(error) { + self._setStateFromError(error, true); + }).finally(function() { + self.setState({ busy: false }); }).done(); @@ -123,14 +119,6 @@ module.exports = React.createClass({ this.setState({ username: username }); }, - onPhoneCountryChanged: function(phoneCountry) { - this.setState({ phoneCountry: phoneCountry }); - }, - - onPhoneNumberChanged: function(phoneNumber) { - this.setState({ phoneNumber: phoneNumber }); - }, - onHsUrlChanged: function(newHsUrl) { var self = this; this.setState({ @@ -237,11 +225,7 @@ module.exports = React.createClass({ diff --git a/src/components/structures/login/Registration.js b/src/components/structures/login/Registration.js index f4805ef044..cbc8929158 100644 --- a/src/components/structures/login/Registration.js +++ b/src/components/structures/login/Registration.js @@ -262,9 +262,6 @@ module.exports = React.createClass({ case "RegistrationForm.ERR_EMAIL_INVALID": errMsg = "This doesn't look like a valid email address"; break; - case "RegistrationForm.ERR_PHONE_NUMBER_INVALID": - errMsg = "This doesn't look like a valid phone number"; - break; case "RegistrationForm.ERR_USERNAME_INVALID": errMsg = "User names may only contain letters, numbers, dots, hyphens and underscores."; break; @@ -299,20 +296,15 @@ module.exports = React.createClass({ guestAccessToken = null; } - // Only send the bind params if we're sending username / pw params - // (Since we need to send no params at all to use the ones saved in the - // session). - const bindThreepids = this.state.formVals.password ? { - email: true, - msisdn: true, - } : {}; - return this._matrixClient.register( this.state.formVals.username, this.state.formVals.password, undefined, // session id: included in the auth dict already auth, - bindThreepids, + // Only send the bind_email param if we're sending username / pw params + // (Since we need to send no params at all to use the ones saved in the + // session). + Boolean(this.state.formVals.username) || undefined, guestAccessToken, ); }, @@ -363,8 +355,6 @@ module.exports = React.createClass({ - {this.props.children} - - } -}; - -MenuOption.propTypes = { - children: React.PropTypes.oneOfType([ - React.PropTypes.arrayOf(React.PropTypes.node), - React.PropTypes.node - ]), - highlighted: React.PropTypes.bool, - dropdownKey: React.PropTypes.string, - onClick: React.PropTypes.func.isRequired, - onMouseEnter: React.PropTypes.func.isRequired, -}; - -/* - * Reusable dropdown select control, akin to react-select, - * but somewhat simpler as react-select is 79KB of minified - * javascript. - * - * TODO: Port NetworkDropdown to use this. - */ -export default class Dropdown extends React.Component { - constructor(props) { - super(props); - - this.dropdownRootElement = null; - this.ignoreEvent = null; - - this._onInputClick = this._onInputClick.bind(this); - this._onRootClick = this._onRootClick.bind(this); - this._onDocumentClick = this._onDocumentClick.bind(this); - this._onMenuOptionClick = this._onMenuOptionClick.bind(this); - this._onInputKeyPress = this._onInputKeyPress.bind(this); - this._onInputKeyUp = this._onInputKeyUp.bind(this); - this._onInputChange = this._onInputChange.bind(this); - this._collectRoot = this._collectRoot.bind(this); - this._collectInputTextBox = this._collectInputTextBox.bind(this); - this._setHighlightedOption = this._setHighlightedOption.bind(this); - - this.inputTextBox = null; - - this._reindexChildren(this.props.children); - - const firstChild = React.Children.toArray(props.children)[0]; - - this.state = { - // True if the menu is dropped-down - expanded: false, - // The key of the highlighted option - // (the option that would become selected if you pressed enter) - highlightedOption: firstChild ? firstChild.key : null, - // the current search query - searchQuery: '', - }; - } - - componentWillMount() { - // Listen for all clicks on the document so we can close the - // menu when the user clicks somewhere else - document.addEventListener('click', this._onDocumentClick, false); - } - - componentWillUnmount() { - document.removeEventListener('click', this._onDocumentClick, false); - } - - componentWillReceiveProps(nextProps) { - this._reindexChildren(nextProps.children); - const firstChild = React.Children.toArray(nextProps.children)[0]; - this.setState({ - highlightedOption: firstChild ? firstChild.key : null, - }); - } - - _reindexChildren(children) { - this.childrenByKey = {}; - React.Children.forEach(children, (child) => { - this.childrenByKey[child.key] = child; - }); - } - - _onDocumentClick(ev) { - // Close the dropdown if the user clicks anywhere that isn't - // within our root element - if (ev !== this.ignoreEvent) { - this.setState({ - expanded: false, - }); - } - } - - _onRootClick(ev) { - // This captures any clicks that happen within our elements, - // such that we can then ignore them when they're seen by the - // click listener on the document handler, ie. not close the - // dropdown immediately after opening it. - // NB. We can't just stopPropagation() because then the event - // doesn't reach the React onClick(). - this.ignoreEvent = ev; - } - - _onInputClick(ev) { - this.setState({ - expanded: !this.state.expanded, - }); - ev.preventDefault(); - } - - _onMenuOptionClick(dropdownKey) { - this.setState({ - expanded: false, - }); - this.props.onOptionChange(dropdownKey); - } - - _onInputKeyPress(e) { - // This needs to be on the keypress event because otherwise - // it can't cancel the form submission - if (e.key == 'Enter') { - this.setState({ - expanded: false, - }); - this.props.onOptionChange(this.state.highlightedOption); - e.preventDefault(); - } - } - - _onInputKeyUp(e) { - // These keys don't generate keypress events and so needs to - // be on keyup - if (e.key == 'Escape') { - this.setState({ - expanded: false, - }); - } else if (e.key == 'ArrowDown') { - this.setState({ - highlightedOption: this._nextOption(this.state.highlightedOption), - }); - } else if (e.key == 'ArrowUp') { - this.setState({ - highlightedOption: this._prevOption(this.state.highlightedOption), - }); - } - } - - _onInputChange(e) { - this.setState({ - searchQuery: e.target.value, - }); - if (this.props.onSearchChange) { - this.props.onSearchChange(e.target.value); - } - } - - _collectRoot(e) { - if (this.dropdownRootElement) { - this.dropdownRootElement.removeEventListener( - 'click', this._onRootClick, false, - ); - } - if (e) { - e.addEventListener('click', this._onRootClick, false); - } - this.dropdownRootElement = e; - } - - _collectInputTextBox(e) { - this.inputTextBox = e; - if (e) e.focus(); - } - - _setHighlightedOption(optionKey) { - this.setState({ - highlightedOption: optionKey, - }); - } - - _nextOption(optionKey) { - const keys = Object.keys(this.childrenByKey); - const index = keys.indexOf(optionKey); - return keys[(index + 1) % keys.length]; - } - - _prevOption(optionKey) { - const keys = Object.keys(this.childrenByKey); - const index = keys.indexOf(optionKey); - return keys[(index - 1) % keys.length]; - } - - _getMenuOptions() { - const options = React.Children.map(this.props.children, (child) => { - return ( - - {child} - - ); - }); - - if (!this.state.searchQuery) { - options.push( -
- Type to search... -
- ); - } - return options; - } - - render() { - let currentValue; - - const menuStyle = {}; - if (this.props.menuWidth) menuStyle.width = this.props.menuWidth; - - let menu; - if (this.state.expanded) { - currentValue = ; - menu =
- {this._getMenuOptions()} -
; - } else { - const selectedChild = this.props.getShortOption ? - this.props.getShortOption(this.props.value) : - this.childrenByKey[this.props.value]; - currentValue =
- {selectedChild} -
- } - - const dropdownClasses = { - mx_Dropdown: true, - }; - if (this.props.className) { - dropdownClasses[this.props.className] = true; - } - - // Note the menu sits inside the AccessibleButton div so it's anchored - // to the input, but overflows below it. The root contains both. - return
- - {currentValue} - - {menu} - -
; - } -} - -Dropdown.propTypes = { - // The width that the dropdown should be. If specified, - // the dropped-down part of the menu will be set to this - // width. - menuWidth: React.PropTypes.number, - // Called when the selected option changes - onOptionChange: React.PropTypes.func.isRequired, - // Called when the value of the search field changes - onSearchChange: React.PropTypes.func, - // Function that, given the key of an option, returns - // a node representing that option to be displayed in the - // box itself as the currently-selected option (ie. as - // opposed to in the actual dropped-down part). If - // unspecified, the appropriate child element is used as - // in the dropped-down menu. - getShortOption: React.PropTypes.func, - value: React.PropTypes.string, -} diff --git a/src/components/views/login/CountryDropdown.js b/src/components/views/login/CountryDropdown.js deleted file mode 100644 index fc1e89661b..0000000000 --- a/src/components/views/login/CountryDropdown.js +++ /dev/null @@ -1,123 +0,0 @@ -/* -Copyright 2017 Vector Creations Ltd - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import React from 'react'; - -import sdk from '../../../index'; - -import { COUNTRIES } from '../../../phonenumber'; -import { charactersToImageNode } from '../../../HtmlUtils'; - -const COUNTRIES_BY_ISO2 = new Object(null); -for (const c of COUNTRIES) { - COUNTRIES_BY_ISO2[c.iso2] = c; -} - -function countryMatchesSearchQuery(query, country) { - if (country.name.toUpperCase().indexOf(query.toUpperCase()) == 0) return true; - if (country.iso2 == query.toUpperCase()) return true; - if (country.prefix == query) return true; - return false; -} - -const MAX_DISPLAYED_ROWS = 2; - -export default class CountryDropdown extends React.Component { - constructor(props) { - super(props); - this._onSearchChange = this._onSearchChange.bind(this); - - this.state = { - searchQuery: '', - } - - if (!props.value) { - // If no value is given, we start with the first - // country selected, but our parent component - // doesn't know this, therefore we do this. - this.props.onOptionChange(COUNTRIES[0].iso2); - } - } - - _onSearchChange(search) { - this.setState({ - searchQuery: search, - }); - } - - _flagImgForIso2(iso2) { - // Unicode Regional Indicator Symbol letter 'A' - const RIS_A = 0x1F1E6; - const ASCII_A = 65; - return charactersToImageNode(iso2, - RIS_A + (iso2.charCodeAt(0) - ASCII_A), - RIS_A + (iso2.charCodeAt(1) - ASCII_A), - ); - } - - render() { - const Dropdown = sdk.getComponent('elements.Dropdown'); - - let displayedCountries; - if (this.state.searchQuery) { - displayedCountries = COUNTRIES.filter( - countryMatchesSearchQuery.bind(this, this.state.searchQuery), - ); - if ( - this.state.searchQuery.length == 2 && - COUNTRIES_BY_ISO2[this.state.searchQuery.toUpperCase()] - ) { - // exact ISO2 country name match: make the first result the matches ISO2 - const matched = COUNTRIES_BY_ISO2[this.state.searchQuery.toUpperCase()]; - displayedCountries = displayedCountries.filter((c) => { - return c.iso2 != matched.iso2; - }); - displayedCountries.unshift(matched); - } - } else { - displayedCountries = COUNTRIES; - } - - if (displayedCountries.length > MAX_DISPLAYED_ROWS) { - displayedCountries = displayedCountries.slice(0, MAX_DISPLAYED_ROWS); - } - - const options = displayedCountries.map((country) => { - return
- {this._flagImgForIso2(country.iso2)} - {country.name} -
; - }); - - // default value here too, otherwise we need to handle null / undefined - // values between mounting and the initial value propgating - const value = this.props.value || COUNTRIES[0].iso2; - - return - {options} - - } -} - -CountryDropdown.propTypes = { - className: React.PropTypes.string, - onOptionChange: React.PropTypes.func.isRequired, - value: React.PropTypes.string, -}; diff --git a/src/components/views/login/InteractiveAuthEntryComponents.js b/src/components/views/login/InteractiveAuthEntryComponents.js index 2d8abf9216..e75cb082d4 100644 --- a/src/components/views/login/InteractiveAuthEntryComponents.js +++ b/src/components/views/login/InteractiveAuthEntryComponents.js @@ -16,8 +16,6 @@ limitations under the License. */ import React from 'react'; -import url from 'url'; -import classnames from 'classnames'; import sdk from '../../../index'; @@ -257,137 +255,6 @@ export const EmailIdentityAuthEntry = React.createClass({ }, }); -export const MsisdnAuthEntry = React.createClass({ - displayName: 'MsisdnAuthEntry', - - statics: { - LOGIN_TYPE: "m.login.msisdn", - }, - - propTypes: { - inputs: React.PropTypes.shape({ - phoneCountry: React.PropTypes.string, - phoneNumber: React.PropTypes.string, - }), - fail: React.PropTypes.func, - clientSecret: React.PropTypes.func, - submitAuthDict: React.PropTypes.func.isRequired, - matrixClient: React.PropTypes.object, - submitAuthDict: React.PropTypes.func, - }, - - getInitialState: function() { - return { - token: '', - requestingToken: false, - }; - }, - - componentWillMount: function() { - this._sid = null; - this._msisdn = null; - this._tokenBox = null; - - this.setState({requestingToken: true}); - this._requestMsisdnToken().catch((e) => { - this.props.fail(e); - }).finally(() => { - this.setState({requestingToken: false}); - }).done(); - }, - - /* - * Requests a verification token by SMS. - */ - _requestMsisdnToken: function() { - return this.props.matrixClient.requestRegisterMsisdnToken( - this.props.inputs.phoneCountry, - this.props.inputs.phoneNumber, - this.props.clientSecret, - 1, // TODO: Multiple send attempts? - ).then((result) => { - this._sid = result.sid; - this._msisdn = result.msisdn; - }); - }, - - _onTokenChange: function(e) { - this.setState({ - token: e.target.value, - }); - }, - - _onFormSubmit: function(e) { - e.preventDefault(); - if (this.state.token == '') return; - - this.setState({ - errorText: null, - }); - - this.props.matrixClient.submitMsisdnToken( - this._sid, this.props.clientSecret, this.state.token - ).then((result) => { - if (result.success) { - const idServerParsedUrl = url.parse( - this.props.matrixClient.getIdentityServerUrl(), - ) - this.props.submitAuthDict({ - type: MsisdnAuthEntry.LOGIN_TYPE, - threepid_creds: { - sid: this._sid, - client_secret: this.props.clientSecret, - id_server: idServerParsedUrl.host, - }, - }); - } else { - this.setState({ - errorText: "Token incorrect", - }); - } - }).catch((e) => { - this.props.fail(e); - console.log("Failed to submit msisdn token"); - }).done(); - }, - - render: function() { - if (this.state.requestingToken) { - const Loader = sdk.getComponent("elements.Spinner"); - return ; - } else { - const enableSubmit = Boolean(this.state.token); - const submitClasses = classnames({ - mx_InteractiveAuthEntryComponents_msisdnSubmit: true, - mx_UserSettings_button: true, // XXX button classes - }); - return ( -
-

A text message has been sent to +{this._msisdn}

-

Please enter the code it contains:

-
-
- -
- -
-
- {this.state.errorText} -
-
-
- ); - } - }, -}); - export const FallbackAuthEntry = React.createClass({ displayName: 'FallbackAuthEntry', @@ -446,7 +313,6 @@ const AuthEntryComponents = [ PasswordAuthEntry, RecaptchaAuthEntry, EmailIdentityAuthEntry, - MsisdnAuthEntry, ]; export function getEntryComponentForLoginType(loginType) { diff --git a/src/components/views/login/PasswordLogin.js b/src/components/views/login/PasswordLogin.js index 61cb3da652..6f6081858b 100644 --- a/src/components/views/login/PasswordLogin.js +++ b/src/components/views/login/PasswordLogin.js @@ -1,6 +1,5 @@ /* Copyright 2015, 2016 OpenMarket Ltd -Copyright 2017 Vector Creations Ltd Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. @@ -18,7 +17,6 @@ limitations under the License. import React from 'react'; import ReactDOM from 'react-dom'; import classNames from 'classnames'; -import sdk from '../../../index'; import {field_input_incorrect} from '../../../UiEffects'; @@ -30,12 +28,8 @@ module.exports = React.createClass({displayName: 'PasswordLogin', onSubmit: React.PropTypes.func.isRequired, // fn(username, password) onForgotPasswordClick: React.PropTypes.func, // fn() initialUsername: React.PropTypes.string, - initialPhoneCountry: React.PropTypes.string, - initialPhoneNumber: React.PropTypes.string, initialPassword: React.PropTypes.string, onUsernameChanged: React.PropTypes.func, - onPhoneCountryChanged: React.PropTypes.func, - onPhoneNumberChanged: React.PropTypes.func, onPasswordChanged: React.PropTypes.func, loginIncorrect: React.PropTypes.bool, }, @@ -44,11 +38,7 @@ module.exports = React.createClass({displayName: 'PasswordLogin', return { onUsernameChanged: function() {}, onPasswordChanged: function() {}, - onPhoneCountryChanged: function() {}, - onPhoneNumberChanged: function() {}, initialUsername: "", - initialPhoneCountry: "", - initialPhoneNumber: "", initialPassword: "", loginIncorrect: false, }; @@ -58,8 +48,6 @@ module.exports = React.createClass({displayName: 'PasswordLogin', return { username: this.props.initialUsername, password: this.props.initialPassword, - phoneCountry: this.props.initialPhoneCountry, - phoneNumber: this.props.initialPhoneNumber, }; }, @@ -75,12 +63,7 @@ module.exports = React.createClass({displayName: 'PasswordLogin', onSubmitForm: function(ev) { ev.preventDefault(); - this.props.onSubmit( - this.state.username, - this.state.phoneCountry, - this.state.phoneNumber, - this.state.password, - ); + this.props.onSubmit(this.state.username, this.state.password); }, onUsernameChanged: function(ev) { @@ -88,16 +71,6 @@ module.exports = React.createClass({displayName: 'PasswordLogin', this.props.onUsernameChanged(ev.target.value); }, - onPhoneCountryChanged: function(country) { - this.setState({phoneCountry: country}); - this.props.onPhoneCountryChanged(country); - }, - - onPhoneNumberChanged: function(ev) { - this.setState({phoneNumber: ev.target.value}); - this.props.onPhoneNumberChanged(ev.target.value); - }, - onPasswordChanged: function(ev) { this.setState({password: ev.target.value}); this.props.onPasswordChanged(ev.target.value); @@ -119,28 +92,13 @@ module.exports = React.createClass({displayName: 'PasswordLogin', error: this.props.loginIncorrect, }); - const CountryDropdown = sdk.getComponent('views.login.CountryDropdown'); return (
- - or -
- - -

{this._passwordField = e;}} type="password" name="password" diff --git a/src/components/views/login/RegistrationForm.js b/src/components/views/login/RegistrationForm.js index 4868c9de63..93e3976834 100644 --- a/src/components/views/login/RegistrationForm.js +++ b/src/components/views/login/RegistrationForm.js @@ -19,12 +19,9 @@ import React from 'react'; import { field_input_incorrect } from '../../../UiEffects'; import sdk from '../../../index'; import Email from '../../../email'; -import { looksValid as phoneNumberLooksValid } from '../../../phonenumber'; import Modal from '../../../Modal'; const FIELD_EMAIL = 'field_email'; -const FIELD_PHONE_COUNTRY = 'field_phone_country'; -const FIELD_PHONE_NUMBER = 'field_phone_number'; const FIELD_USERNAME = 'field_username'; const FIELD_PASSWORD = 'field_password'; const FIELD_PASSWORD_CONFIRM = 'field_password_confirm'; @@ -38,8 +35,6 @@ module.exports = React.createClass({ propTypes: { // Values pre-filled in the input boxes when the component loads defaultEmail: React.PropTypes.string, - defaultPhoneCountry: React.PropTypes.string, - defaultPhoneNumber: React.PropTypes.string, defaultUsername: React.PropTypes.string, defaultPassword: React.PropTypes.string, teamsConfig: React.PropTypes.shape({ @@ -76,8 +71,6 @@ module.exports = React.createClass({ return { fieldValid: {}, selectedTeam: null, - // The ISO2 country code selected in the phone number entry - phoneCountry: this.props.defaultPhoneCountry, }; }, @@ -92,7 +85,6 @@ module.exports = React.createClass({ this.validateField(FIELD_PASSWORD_CONFIRM); this.validateField(FIELD_PASSWORD); this.validateField(FIELD_USERNAME); - this.validateField(FIELD_PHONE_NUMBER); this.validateField(FIELD_EMAIL); var self = this; @@ -126,8 +118,6 @@ module.exports = React.createClass({ username: this.refs.username.value.trim() || this.props.guestUsername, password: this.refs.password.value.trim(), email: email, - phoneCountry: this.state.phoneCountry, - phoneNumber: this.refs.phoneNumber.value.trim(), }); if (promise) { @@ -184,11 +174,6 @@ module.exports = React.createClass({ const emailValid = email === '' || Email.looksValid(email); this.markFieldValid(field_id, emailValid, "RegistrationForm.ERR_EMAIL_INVALID"); break; - case FIELD_PHONE_NUMBER: - const phoneNumber = this.refs.phoneNumber.value; - const phoneNumberValid = phoneNumber === '' || phoneNumberLooksValid(phoneNumber); - this.markFieldValid(field_id, phoneNumberValid, "RegistrationForm.ERR_PHONE_NUMBER_INVALID"); - break; case FIELD_USERNAME: // XXX: SPEC-1 var username = this.refs.username.value.trim() || this.props.guestUsername; @@ -248,8 +233,6 @@ module.exports = React.createClass({ switch (field_id) { case FIELD_EMAIL: return this.refs.email; - case FIELD_PHONE_NUMBER: - return this.refs.phoneNumber; case FIELD_USERNAME: return this.refs.username; case FIELD_PASSWORD: @@ -268,12 +251,6 @@ module.exports = React.createClass({ return cls; }, - _onPhoneCountryChange(newVal) { - this.setState({ - phoneCountry: newVal, - }); - }, - render: function() { var self = this; @@ -309,25 +286,6 @@ module.exports = React.createClass({ } } - const CountryDropdown = sdk.getComponent('views.login.CountryDropdown'); - const phoneSection = ( -
- - -
- ); - const registerButton = ( ); @@ -342,7 +300,6 @@ module.exports = React.createClass({ {emailSection} {belowEmailSection} - {phoneSection}