imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge branch 'develop' into travis/upgrade-warning

Browse source
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
Download patch file Download diff file Expand all files Collapse all files

14
src/components/structures/CompatibilityPage.js
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>

4
src/components/structures/CustomRoomTagPanel.js
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}>

83
src/components/views/auth/RegistrationForm.js
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">

6
src/components/views/elements/Field.js
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);