Merge branch 'develop' into travis/upgrade-warning

This commit is contained in:
Travis Ralston 2019-03-15 15:32:49 -06:00
commit da61e5e9d9
19 changed files with 172 additions and 118 deletions

View file

@ -48,19 +48,13 @@ module.exports = React.createClass({
</p>
<p>
{ _t(
'Please install <chromeLink>Chrome</chromeLink> or <firefoxLink>Firefox</firefoxLink> ' +
'for the best experience.',
'Please install <chromeLink>Chrome</chromeLink>, <firefoxLink>Firefox</firefoxLink>, ' +
'or <safariLink>Safari</safariLink> for the best experience.',
{},
{
'chromeLink': (sub) => <a href="https://www.google.com/chrome">{sub}</a>,
'firefoxLink': (sub) => <a href="https://getfirefox.com">{sub}</a>,
},
)}
{ _t('<safariLink>Safari</safariLink> and <operaLink>Opera</operaLink> work too.',
{},
{
'safariLink': (sub) => <a href="http://apple.com/safari">{sub}</a>,
'operaLink': (sub) => <a href="http://opera.com">{sub}</a>,
'firefoxLink': (sub) => <a href="https://firefox.com">{sub}</a>,
'safariLink': (sub) => <a href="https://apple.com/safari">{sub}</a>,
},
)}
</p>

View file

@ -84,7 +84,7 @@ class CustomRoomTagTile extends React.Component {
render() {
const BaseAvatar = sdk.getComponent('avatars.BaseAvatar');
const AccessibleButton = sdk.getComponent('elements.AccessibleButton');
const RoomTooltip = sdk.getComponent('rooms.RoomTooltip');
const Tooltip = sdk.getComponent('rooms.Tooltip');
const tag = this.props.tag;
const avatarHeight = 40;
@ -103,7 +103,7 @@ class CustomRoomTagTile extends React.Component {
}
const tip = (this.state.hover ?
<RoomTooltip className="mx_TagTile_tooltip" label={name} /> :
<Tooltip className="mx_TagTile_tooltip" label={name} /> :
<div />);
return (
<AccessibleButton className={className} onClick={this.onClick}>

View file

@ -70,6 +70,11 @@ module.exports = React.createClass({
fieldErrors: {},
// The ISO2 country code selected in the phone number entry
phoneCountry: this.props.defaultPhoneCountry,
username: "",
email: "",
phoneNumber: "",
password: "",
passwordConfirm: "",
};
},
@ -89,7 +94,7 @@ module.exports = React.createClass({
const self = this;
if (this.allFieldsValid()) {
if (this.refs.email.value == '') {
if (this.state.email == '') {
const QuestionDialog = sdk.getComponent("dialogs.QuestionDialog");
Modal.createTrackedDialog('If you don\'t specify an email address...', '', QuestionDialog, {
title: _t("Warning!"),
@ -112,13 +117,13 @@ module.exports = React.createClass({
},
_doSubmit: function(ev) {
const email = this.refs.email.value.trim();
const email = this.state.email.trim();
const promise = this.props.onRegisterClick({
username: this.refs.username.value.trim(),
password: this.refs.password.value.trim(),
username: this.state.username.trim(),
password: this.state.password.trim(),
email: email,
phoneCountry: this.state.phoneCountry,
phoneNumber: this.refs.phoneNumber ? this.refs.phoneNumber.value.trim() : '',
phoneNumber: this.state.phoneNumber,
});
if (promise) {
@ -143,13 +148,13 @@ module.exports = React.createClass({
},
validateField: function(fieldID, eventType) {
const pwd1 = this.refs.password.value.trim();
const pwd2 = this.refs.passwordConfirm.value.trim();
const pwd1 = this.state.password.trim();
const pwd2 = this.state.passwordConfirm.trim();
const allowEmpty = eventType === "blur";
switch (fieldID) {
case FIELD_EMAIL: {
const email = this.refs.email.value;
const email = this.state.email;
const emailValid = email === '' || Email.looksValid(email);
if (this._authStepIsRequired('m.login.email.identity') && (!emailValid || email === '')) {
this.markFieldValid(fieldID, false, "RegistrationForm.ERR_MISSING_EMAIL");
@ -157,7 +162,7 @@ module.exports = React.createClass({
break;
}
case FIELD_PHONE_NUMBER: {
const phoneNumber = this.refs.phoneNumber ? this.refs.phoneNumber.value : '';
const phoneNumber = this.state.phoneNumber;
const phoneNumberValid = phoneNumber === '' || phoneNumberLooksValid(phoneNumber);
if (this._authStepIsRequired('m.login.msisdn') && (!phoneNumberValid || phoneNumber === '')) {
this.markFieldValid(fieldID, false, "RegistrationForm.ERR_MISSING_PHONE_NUMBER");
@ -165,7 +170,7 @@ module.exports = React.createClass({
break;
}
case FIELD_USERNAME: {
const username = this.refs.username.value.trim();
const username = this.state.username;
if (allowEmpty && username === '') {
this.markFieldValid(fieldID, true);
} else if (!SAFE_LOCALPART_REGEX.test(username)) {
@ -230,21 +235,6 @@ module.exports = React.createClass({
this.props.onValidationChange(fieldErrors);
},
fieldElementById(fieldID) {
switch (fieldID) {
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:
return this.refs.password;
case FIELD_PASSWORD_CONFIRM:
return this.refs.passwordConfirm;
}
},
_classForField: function(fieldID, ...baseClasses) {
let cls = baseClasses.join(' ');
if (this.state.fieldErrors[fieldID]) {
@ -258,14 +248,32 @@ module.exports = React.createClass({
this.validateField(FIELD_EMAIL, ev.type);
},
onEmailChange(ev) {
this.setState({
email: ev.target.value,
});
},
onPasswordBlur(ev) {
this.validateField(FIELD_PASSWORD, ev.type);
},
onPasswordChange(ev) {
this.setState({
password: ev.target.value,
});
},
onPasswordConfirmBlur(ev) {
this.validateField(FIELD_PASSWORD_CONFIRM, ev.type);
},
onPasswordConfirmChange(ev) {
this.setState({
passwordConfirm: ev.target.value,
});
},
onPhoneCountryChange(newVal) {
this.setState({
phoneCountry: newVal.iso2,
@ -277,10 +285,22 @@ module.exports = React.createClass({
this.validateField(FIELD_PHONE_NUMBER, ev.type);
},
onPhoneNumberChange(ev) {
this.setState({
phoneNumber: ev.target.value,
});
},
onUsernameBlur(ev) {
this.validateField(FIELD_USERNAME, ev.type);
},
onUsernameChange(ev) {
this.setState({
username: ev.target.value,
});
},
/**
* A step is required if all flows include that step.
*
@ -343,12 +363,12 @@ module.exports = React.createClass({
<Field
className={this._classForField(FIELD_EMAIL)}
id="mx_RegistrationForm_email"
ref="email"
type="text"
label={emailPlaceholder}
defaultValue={this.props.defaultEmail}
value={this.state.email}
onBlur={this.onEmailBlur}
onChange={this.onEmailChange}
/>
);
}
@ -370,13 +390,13 @@ module.exports = React.createClass({
phoneSection = <Field
className={this._classForField(FIELD_PHONE_NUMBER)}
id="mx_RegistrationForm_phoneNumber"
ref="phoneNumber"
type="text"
label={phoneLabel}
defaultValue={this.props.defaultPhoneNumber}
value={this.state.phoneNumber}
prefix={phoneCountry}
onBlur={this.onPhoneNumberBlur}
onChange={this.onPhoneNumberChange}
/>;
}
@ -395,32 +415,35 @@ module.exports = React.createClass({
<Field
className={this._classForField(FIELD_USERNAME)}
id="mx_RegistrationForm_username"
ref="username"
type="text"
autoFocus={true}
label={_t("Username")}
defaultValue={this.props.defaultUsername}
value={this.state.username}
onBlur={this.onUsernameBlur}
onChange={this.onUsernameChange}
/>
</div>
<div className="mx_AuthBody_fieldRow">
<Field
className={this._classForField(FIELD_PASSWORD)}
id="mx_RegistrationForm_password"
ref="password"
type="password"
label={_t("Password")}
defaultValue={this.props.defaultPassword}
value={this.state.password}
onBlur={this.onPasswordBlur}
onChange={this.onPasswordChange}
/>
<Field
className={this._classForField(FIELD_PASSWORD_CONFIRM)}
id="mx_RegistrationForm_passwordConfirm"
ref="passwordConfirm"
type="password"
label={_t("Confirm")}
defaultValue={this.props.defaultPassword}
value={this.state.passwordConfirm}
onBlur={this.onPasswordConfirmBlur}
onChange={this.onPasswordConfirmChange}
/>
</div>
<div className="mx_AuthBody_fieldRow">

View file

@ -53,12 +53,6 @@ export default class Field extends React.PureComponent {
};
}
/* TODO: Remove this once `RegistrationForm` no longer uses refs */
get value() {
if (!this.refs.fieldInput) return null;
return this.refs.fieldInput.value;
}
onChange = (ev) => {
if (this.props.onValidate) {
const result = this.props.onValidate(ev.target.value);

View file

@ -1293,8 +1293,7 @@
"Find other public servers or use a custom server": "Find other public servers or use a custom server",
"Sorry, your browser is <b>not</b> able to run Riot.": "Sorry, your browser is <b>not</b> able to run Riot.",
"Riot uses many advanced browser features, some of which are not available or experimental in your current browser.": "Riot uses many advanced browser features, some of which are not available or experimental in your current browser.",
"Please install <chromeLink>Chrome</chromeLink> or <firefoxLink>Firefox</firefoxLink> for the best experience.": "Please install <chromeLink>Chrome</chromeLink> or <firefoxLink>Firefox</firefoxLink> for the best experience.",
"<safariLink>Safari</safariLink> and <operaLink>Opera</operaLink> work too.": "<safariLink>Safari</safariLink> and <operaLink>Opera</operaLink> work too.",
"Please install <chromeLink>Chrome</chromeLink>, <firefoxLink>Firefox</firefoxLink>, or <safariLink>Safari</safariLink> for the best experience.": "Please install <chromeLink>Chrome</chromeLink>, <firefoxLink>Firefox</firefoxLink>, or <safariLink>Safari</safariLink> for the best experience.",
"With your current browser, the look and feel of the application may be completely incorrect, and some or all features may not function. If you want to try it anyway you can continue, but you are on your own in terms of any issues you may encounter!": "With your current browser, the look and feel of the application may be completely incorrect, and some or all features may not function. If you want to try it anyway you can continue, but you are on your own in terms of any issues you may encounter!",
"I understand the risks and wish to continue": "I understand the risks and wish to continue",
"Couldn't load page": "Couldn't load page",