), + }); + } } + return addrs; } diff --git a/src/SlashCommands.js b/src/SlashCommands.js index 8a34ba7ab13..24328d63729 100644 --- a/src/SlashCommands.js +++ b/src/SlashCommands.js @@ -26,6 +26,7 @@ import Modal from './Modal'; import SettingsStore, {SettingLevel} from './settings/SettingsStore'; import {MATRIXTO_URL_PATTERN} from "./linkify-matrix"; import * as querystring from "querystring"; +import MultiInviter from './utils/MultiInviter'; class Command { @@ -142,7 +143,15 @@ export const CommandMap = { if (args) { const matches = args.match(/^(\S+)$/); if (matches) { - return success(MatrixClientPeg.get().invite(roomId, matches[1])); + // We use a MultiInviter to re-use the invite logic, even though + // we're only inviting one user. + const userId = matches[1]; + const inviter = new MultiInviter(roomId); + return success(inviter.invite([userId]).then(() => { + if (inviter.getCompletionState(userId) !== "invited") { + throw new Error(inviter.getErrorText(userId)); + } + })); } } return reject(this.getUsage()); diff --git a/src/async-components/views/dialogs/keybackup/CreateKeyBackupDialog.js b/src/async-components/views/dialogs/keybackup/CreateKeyBackupDialog.js index 2f43d18072c..a097e84cdbf 100644 --- a/src/async-components/views/dialogs/keybackup/CreateKeyBackupDialog.js +++ b/src/async-components/views/dialogs/keybackup/CreateKeyBackupDialog.js @@ -17,6 +17,7 @@ limitations under the License. import React from 'react'; import sdk from '../../../../index'; import MatrixClientPeg from '../../../../MatrixClientPeg'; +import { scorePassword } from '../../../../utils/PasswordScorer'; import FileSaver from 'file-saver'; @@ -30,6 +31,8 @@ const PHASE_BACKINGUP = 4; const PHASE_DONE = 5; const PHASE_OPTOUT_CONFIRM = 6; +const PASSWORD_MIN_SCORE = 4; // So secure, many characters, much complex, wow, etc, etc. + // XXX: copied from ShareDialog: factor out into utils function selectText(target) { const range = document.createRange(); @@ -52,6 +55,8 @@ export default React.createClass({ passPhraseConfirm: '', copied: false, downloaded: false, + zxcvbnResult: null, + setPassPhrase: false, }; }, @@ -87,25 +92,33 @@ export default React.createClass({ }); }, - _createBackup: function() { + _createBackup: async function() { this.setState({ phase: PHASE_BACKINGUP, error: null, }); - this._createBackupPromise = MatrixClientPeg.get().createKeyBackupVersion( - this._keyBackupInfo, - ).then((info) => { - return MatrixClientPeg.get().backupAllGroupSessions(info.version); - }).then(() => { + let info; + try { + info = await MatrixClientPeg.get().createKeyBackupVersion( + this._keyBackupInfo, + ); + await MatrixClientPeg.get().backupAllGroupSessions(info.version); this.setState({ phase: PHASE_DONE, }); - }).catch(e => { + } catch (e) { console.log("Error creating key backup", e); + // TODO: If creating a version succeeds, but backup fails, should we + // delete the version, disable backup, or do nothing? If we just + // disable without deleting, we'll enable on next app reload since + // it is trusted. + if (info) { + MatrixClientPeg.get().deleteKeyBackupVersion(info.version); + } this.setState({ error: e, }); - }); + } }, _onCancel: function() { @@ -128,6 +141,7 @@ export default React.createClass({ this._keyBackupInfo = await MatrixClientPeg.get().prepareKeyBackupVersion(); this.setState({ copied: false, + downloaded: false, phase: PHASE_SHOWKEY, }); }, @@ -145,7 +159,9 @@ export default React.createClass({ _onPassPhraseConfirmNextClick: async function() { this._keyBackupInfo = await MatrixClientPeg.get().prepareKeyBackupVersion(this.state.passPhrase); this.setState({ + setPassPhrase: true, copied: false, + downloaded: false, phase: PHASE_SHOWKEY, }); }, @@ -173,6 +189,10 @@ export default React.createClass({ _onPassPhraseChange: function(e) { this.setState({ passPhrase: e.target.value, + // precompute this and keep it in state: zxcvbn is fast but + // we use it in a couple of different places so no point recomputing + // it unnecessarily. + zxcvbnResult: scorePassword(e.target.value), }); }, @@ -183,24 +203,55 @@ export default React.createClass({ }, _passPhraseIsValid: function() { - return this.state.passPhrase !== ''; + return this.state.zxcvbnResult && this.state.zxcvbnResult.score >= PASSWORD_MIN_SCORE; }, _renderPhasePassPhrase: function() { const DialogButtons = sdk.getComponent('views.elements.DialogButtons'); const AccessibleButton = sdk.getComponent('elements.AccessibleButton'); + + let strengthMeter; + let helpText; + if (this.state.zxcvbnResult) { + if (this.state.zxcvbnResult.score >= PASSWORD_MIN_SCORE) { + helpText = _t("Great! This passphrase looks strong enough."); + } else { + const suggestions = []; + for (let i = 0; i < this.state.zxcvbnResult.feedback.suggestions.length; ++i) { + suggestions.push(
{this.state.zxcvbnResult.feedback.suggestions[i]}
);
+ }
+ const suggestionBlock = suggestions.length > 0 ?
+ {suggestions}
+
: null;
+
+ helpText =
+ {this.state.zxcvbnResult.feedback.warning}
+ {suggestionBlock}
+
;
+ }
+ strengthMeter =
+
+
;
+ }
+
return {_t("Secure your encrypted message history with a Recovery Passphrase.")}
{_t("You'll need it if you log out or lose access to this device.")}
-
+
+
+
+ {strengthMeter}
+ {helpText}
+
+ {_t( - "If you don't want encrypted message history to be availble on other devices, "+ + "If you don't want encrypted message history to be available on other devices, "+ ".", {}, { @@ -268,16 +319,18 @@ export default React.createClass({ "somewhere safe.", )}
- {passPhraseMatch}
-
- { label }
- { contextMenuButton }
- { badge }
+
-
+
+
+
+
+ {passPhraseMatch}
{_t("Make a copy of this Recovery Key and keep it safe.")}
-{_t("As a safety net, you can use it to restore your encrypted message history if you forget your Recovery Passphrase.")}
+{bodyText}
-
{_t("Your Recovery Key")}
-
-
- {
- // FIXME REDESIGN: buttons should be adjacent but insufficient room in current design
- }
-
- +{ name } ;
@@ -337,9 +353,12 @@ module.exports = React.createClass({
{ dmIndicator }
- +
+ {_t("Your Recovery Key")}
-
-
diff --git a/src/async-components/views/dialogs/keybackup/IgnoreRecoveryReminderDialog.js b/src/async-components/views/dialogs/keybackup/IgnoreRecoveryReminderDialog.js new file mode 100644 index 00000000000..a9df3cca6e2 --- /dev/null +++ b/src/async-components/views/dialogs/keybackup/IgnoreRecoveryReminderDialog.js @@ -0,0 +1,70 @@ +/* +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. +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 PropTypes from "prop-types"; +import sdk from "../../../../index"; +import { _t } from "../../../../languageHandler"; + +export default class IgnoreRecoveryReminderDialog extends React.PureComponent { + static propTypes = { + onDontAskAgain: PropTypes.func.isRequired, + onFinished: PropTypes.func.isRequired, + onSetup: PropTypes.func.isRequired, + } + + onDontAskAgainClick = () => { + this.props.onFinished(); + this.props.onDontAskAgain(); + } + + onSetupClick = () => { + this.props.onFinished(); + this.props.onSetup(); + } + + render() { + const BaseDialog = sdk.getComponent("views.dialogs.BaseDialog"); + const DialogButtons = sdk.getComponent("views.elements.DialogButtons"); + + return ( +
+
+ );
+ }
+}
diff --git a/src/async-components/views/dialogs/keybackup/NewRecoveryMethodDialog.js b/src/async-components/views/dialogs/keybackup/NewRecoveryMethodDialog.js
new file mode 100644
index 00000000000..e88e0444bc8
--- /dev/null
+++ b/src/async-components/views/dialogs/keybackup/NewRecoveryMethodDialog.js
@@ -0,0 +1,110 @@
+/*
+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.
+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 PropTypes from "prop-types";
+import sdk from "../../../../index";
+import MatrixClientPeg from '../../../../MatrixClientPeg';
+import dis from "../../../../dispatcher";
+import { _t } from "../../../../languageHandler";
+import Modal from "../../../../Modal";
+
+export default class NewRecoveryMethodDialog extends React.PureComponent {
+ static propTypes = {
+ onFinished: PropTypes.func.isRequired,
+ }
+
+ onGoToSettingsClick = () => {
+ this.props.onFinished();
+ dis.dispatch({ action: 'view_user_settings' });
+ }
+
+ onSetupClick = async() => {
+ // TODO: Should change to a restore key backup flow that checks the
+ // recovery passphrase while at the same time also cross-signing the
+ // device as well in a single flow. Since we don't have that yet, we'll
+ // look for an unverified device and verify it. Note that this means
+ // we won't restore keys yet; instead we'll only trust the backup for
+ // sending our own new keys to it.
+ let backupSigStatus;
+ try {
+ const backupInfo = await MatrixClientPeg.get().getKeyBackupVersion();
+ backupSigStatus = await MatrixClientPeg.get().isKeyBackupTrusted(backupInfo);
+ } catch (e) {
+ console.log("Unable to fetch key backup status", e);
+ return;
+ }
+
+ let unverifiedDevice;
+ for (const sig of backupSigStatus.sigs) {
+ if (!sig.device.isVerified()) {
+ unverifiedDevice = sig.device;
+ break;
+ }
+ }
+ if (!unverifiedDevice) {
+ console.log("Unable to find a device to verify.");
+ return;
+ }
+
+ const DeviceVerifyDialog = sdk.getComponent('views.dialogs.DeviceVerifyDialog');
+ Modal.createTrackedDialog('Device Verify Dialog', '', DeviceVerifyDialog, {
+ userId: MatrixClientPeg.get().credentials.userId,
+ device: unverifiedDevice,
+ onFinished: this.props.onFinished,
+ });
+ }
+
+ render() {
+ const BaseDialog = sdk.getComponent("views.dialogs.BaseDialog");
+ const DialogButtons = sdk.getComponent("views.elements.DialogButtons");
+ const title =
+ {_t("New Recovery Method")}
+ ;
+
+ return (
+
+
+ );
+ }
+}
diff --git a/src/components/structures/GroupView.js b/src/components/structures/GroupView.js
index 478126db75b..937e07d31e5 100644
--- a/src/components/structures/GroupView.js
+++ b/src/components/structures/GroupView.js
@@ -473,7 +473,7 @@ export default React.createClass({
GroupStore.registerListener(groupId, this.onGroupStoreUpdated.bind(this, firstInit));
let willDoOnboarding = false;
// XXX: This should be more fluxy - let's get the error from GroupStore .getError or something
- GroupStore.on('error', (err, errorGroupId) => {
+ GroupStore.on('error', (err, errorGroupId, stateKey) => {
if (this._unmounted || groupId !== errorGroupId) return;
if (err.errcode === 'M_GUEST_ACCESS_FORBIDDEN' && !willDoOnboarding) {
dis.dispatch({
@@ -486,11 +486,13 @@ export default React.createClass({
dis.dispatch({action: 'require_registration'});
willDoOnboarding = true;
}
- this.setState({
- summary: null,
- error: err,
- editing: false,
- });
+ if (stateKey === GroupStore.STATE_KEY.Summary) {
+ this.setState({
+ summary: null,
+ error: err,
+ editing: false,
+ });
+ }
});
},
@@ -514,7 +516,6 @@ export default React.createClass({
isUserMember: GroupStore.getGroupMembers(this.props.groupId).some(
(m) => m.userId === this._matrixClient.credentials.userId,
),
- error: null,
});
// XXX: This might not work but this.props.groupIsNew unused anyway
if (this.props.groupIsNew && firstInit) {
@@ -1079,6 +1080,7 @@ export default React.createClass({
},
_getJoinableNode: function() {
+ const InlineSpinner = sdk.getComponent('elements.InlineSpinner');
return this.state.editing ?
{ _t('Who can join this community?') }
@@ -1160,7 +1162,7 @@ export default React.createClass({
if (this.state.summaryLoading && this.state.error === null || this.state.saving) {
return
);
} else {
+ // TODO: Remove temporary logging for riot-web#7838
+ console.log("[riot-web#7838] Falling back to showing cannot post in room error");
controls.push(
{this._keyBackupInfo.recovery_key}
+
+
+
+ {this._keyBackupInfo.recovery_key}
+
+
+
+
diff --git a/src/async-components/views/dialogs/keybackup/IgnoreRecoveryReminderDialog.js b/src/async-components/views/dialogs/keybackup/IgnoreRecoveryReminderDialog.js new file mode 100644 index 00000000000..a9df3cca6e2 --- /dev/null +++ b/src/async-components/views/dialogs/keybackup/IgnoreRecoveryReminderDialog.js @@ -0,0 +1,70 @@ +/* +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. +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 PropTypes from "prop-types"; +import sdk from "../../../../index"; +import { _t } from "../../../../languageHandler"; + +export default class IgnoreRecoveryReminderDialog extends React.PureComponent { + static propTypes = { + onDontAskAgain: PropTypes.func.isRequired, + onFinished: PropTypes.func.isRequired, + onSetup: PropTypes.func.isRequired, + } + + onDontAskAgainClick = () => { + this.props.onFinished(); + this.props.onDontAskAgain(); + } + + onSetupClick = () => { + this.props.onFinished(); + this.props.onSetup(); + } + + render() { + const BaseDialog = sdk.getComponent("views.dialogs.BaseDialog"); + const DialogButtons = sdk.getComponent("views.elements.DialogButtons"); + + return ( +
+
+ {_t( + "Without setting up Secure Message Recovery, " + + "you'll lose your secure message history when you " + + "log out.", + )}
+{_t( + "If you don't want to set this up now, you can later " + + "in Settings.", + )}
+
+
+
+
+ {_t( + "A new recovery passphrase and key for Secure " + + "Messages has been detected.", + )}
+{_t( + "Setting up Secure Messages on this device " + + "will re-encrypt this device's message history with " + + "the new recovery method.", + )}
+{_t( + "If you didn't set the new recovery method, an " + + "attacker may be trying to access your account. " + + "Change your account password and set a new recovery " + + "method immediately in Settings.", + )}
+
{ _t('Who can join this community?') }
@@ -1160,7 +1162,7 @@ export default React.createClass({
if (this.state.summaryLoading && this.state.error === null || this.state.saving) {
return { _t('Updates') }
@@ -988,8 +990,7 @@ module.exports = React.createClass({
},
_renderElectronSettings: function() {
- const settings = this.state.electron_settings;
- if (!settings) return;
+ if (!PlatformPeg.get().supportsAutoLaunch()) return;
// TODO: This should probably be a granular setting, but it only applies to electron
// and ends up being get/set outside of matrix anyways (local system setting).
@@ -999,7 +1000,7 @@ module.exports = React.createClass({
@@ -1009,8 +1010,11 @@ module.exports = React.createClass({
},
_onAutoLaunchChanged: function(e) {
- const {ipcRenderer} = require('electron');
- ipcRenderer.send('settings_set', 'auto-launch', e.target.checked);
+ PlatformPeg.get().setAutoLaunchEnabled(e.target.checked).then(() => {
+ this.setState({
+ autoLaunchEnabled: e.target.checked,
+ });
+ });
},
_mapWebRtcDevicesToSpans: function(devices) {
@@ -1369,7 +1373,7 @@ module.exports = React.createClass({
{ this._renderBulkOptions() }
{ this._renderBugReport() }
- { PlatformPeg.get().isElectron() && this._renderElectronSettings() }
+ { this._renderElectronSettings() }
{ this._renderAnalyticsControl() }
diff --git a/src/components/structures/login/ForgotPassword.js b/src/components/structures/login/ForgotPassword.js
index 444f391258b..559136948ac 100644
--- a/src/components/structures/login/ForgotPassword.js
+++ b/src/components/structures/login/ForgotPassword.js
@@ -36,6 +36,14 @@ module.exports = React.createClass({
onLoginClick: PropTypes.func,
onRegisterClick: PropTypes.func,
onComplete: PropTypes.func.isRequired,
+
+ // The default server name to use when the user hasn't specified
+ // one. This is used when displaying the defaultHsUrl in the UI.
+ defaultServerName: PropTypes.string,
+
+ // An error passed along from higher up explaining that something
+ // went wrong when finding the defaultHsUrl.
+ defaultServerDiscoveryError: PropTypes.string,
},
getInitialState: function() {
@@ -45,6 +53,7 @@ module.exports = React.createClass({
progress: null,
password: null,
password2: null,
+ errorText: null,
};
},
@@ -81,6 +90,13 @@ module.exports = React.createClass({
onSubmitForm: function(ev) {
ev.preventDefault();
+ // Don't allow the user to register if there's a discovery error
+ // Without this, the user could end up registering on the wrong homeserver.
+ if (this.props.defaultServerDiscoveryError) {
+ this.setState({errorText: this.props.defaultServerDiscoveryError});
+ return;
+ }
+
if (!this.state.email) {
this.showErrorDialog(_t('The email address linked to your account must be entered.'));
} else if (!this.state.password || !this.state.password2) {
@@ -200,6 +216,12 @@ module.exports = React.createClass({
);
}
+ let errorText = null;
+ const err = this.state.errorText || this.props.defaultServerDiscoveryError;
+ if (err) {
+ errorText = { err };
+ }
+
const LanguageSelector = sdk.getComponent('structures.login.LanguageSelector');
resetPasswordJsx = (
@@ -230,6 +252,7 @@ module.exports = React.createClass({
{ serverConfigSection }
+ { errorText }
{ _t('Return to login screen') }
diff --git a/src/components/structures/login/Login.js b/src/components/structures/login/Login.js
index 92cddb0dc10..b94a1759cfe 100644
--- a/src/components/structures/login/Login.js
+++ b/src/components/structures/login/Login.js
@@ -26,10 +26,17 @@ import Login from '../../../Login';
import SdkConfig from '../../../SdkConfig';
import SettingsStore from "../../../settings/SettingsStore";
import { messageForResourceLimitError } from '../../../utils/ErrorUtils';
+import { AutoDiscovery } from "matrix-js-sdk";
// For validating phone numbers without country codes
const PHONE_NUMBER_REGEX = /^[0-9()\-\s]*$/;
+// These are used in several places, and come from the js-sdk's autodiscovery
+// stuff. We define them here so that they'll be picked up by i18n.
+_td("Invalid homeserver discovery response");
+_td("Invalid identity server discovery response");
+_td("General failure");
+
/**
* A wire component which glues together login UI components and Login logic
*/
@@ -50,6 +57,14 @@ module.exports = React.createClass({
// different home server without confusing users.
fallbackHsUrl: PropTypes.string,
+ // The default server name to use when the user hasn't specified
+ // one. This is used when displaying the defaultHsUrl in the UI.
+ defaultServerName: PropTypes.string,
+
+ // An error passed along from higher up explaining that something
+ // went wrong when finding the defaultHsUrl.
+ defaultServerDiscoveryError: PropTypes.string,
+
defaultDeviceDisplayName: PropTypes.string,
// login shouldn't know or care how registration is done.
@@ -74,6 +89,12 @@ module.exports = React.createClass({
phoneCountry: null,
phoneNumber: "",
currentFlow: "m.login.password",
+
+ // .well-known discovery
+ discoveredHsUrl: "",
+ discoveredIsUrl: "",
+ discoveryError: "",
+ findingHomeserver: false,
};
},
@@ -105,6 +126,10 @@ module.exports = React.createClass({
},
onPasswordLogin: function(username, phoneCountry, phoneNumber, password) {
+ // Prevent people from submitting their password when homeserver
+ // discovery went wrong
+ if (this.state.discoveryError || this.props.defaultServerDiscoveryError) return;
+
this.setState({
busy: true,
errorText: null,
@@ -221,6 +246,22 @@ module.exports = React.createClass({
this.setState({ username: username });
},
+ onUsernameBlur: function(username) {
+ this.setState({ username: username });
+ if (username[0] === "@") {
+ const serverName = username.split(':').slice(1).join(':');
+ try {
+ // we have to append 'https://' to make the URL constructor happy
+ // otherwise we get things like 'protocol: matrix.org, pathname: 8448'
+ const url = new URL("https://" + serverName);
+ this._tryWellKnownDiscovery(url.hostname);
+ } catch (e) {
+ console.error("Problem parsing URL or unhandled error doing .well-known discovery:", e);
+ this.setState({discoveryError: _t("Failed to perform homeserver discovery")});
+ }
+ }
+ },
+
onPhoneCountryChanged: function(phoneCountry) {
this.setState({ phoneCountry: phoneCountry });
},
@@ -256,6 +297,59 @@ module.exports = React.createClass({
});
},
+ _tryWellKnownDiscovery: async function(serverName) {
+ if (!serverName.trim()) {
+ // Nothing to discover
+ this.setState({discoveryError: "", discoveredHsUrl: "", discoveredIsUrl: "", findingHomeserver: false});
+ return;
+ }
+
+ this.setState({findingHomeserver: true});
+ try {
+ const discovery = await AutoDiscovery.findClientConfig(serverName);
+ const state = discovery["m.homeserver"].state;
+ if (state !== AutoDiscovery.SUCCESS && state !== AutoDiscovery.PROMPT) {
+ this.setState({
+ discoveredHsUrl: "",
+ discoveredIsUrl: "",
+ discoveryError: discovery["m.homeserver"].error,
+ findingHomeserver: false,
+ });
+ } else if (state === AutoDiscovery.PROMPT) {
+ this.setState({
+ discoveredHsUrl: "",
+ discoveredIsUrl: "",
+ discoveryError: "",
+ findingHomeserver: false,
+ });
+ } else if (state === AutoDiscovery.SUCCESS) {
+ this.setState({
+ discoveredHsUrl: discovery["m.homeserver"].base_url,
+ discoveredIsUrl:
+ discovery["m.identity_server"].state === AutoDiscovery.SUCCESS
+ ? discovery["m.identity_server"].base_url
+ : "",
+ discoveryError: "",
+ findingHomeserver: false,
+ });
+ } else {
+ console.warn("Unknown state for m.homeserver in discovery response: ", discovery);
+ this.setState({
+ discoveredHsUrl: "",
+ discoveredIsUrl: "",
+ discoveryError: _t("Unknown failure discovering homeserver"),
+ findingHomeserver: false,
+ });
+ }
+ } catch (e) {
+ console.error(e);
+ this.setState({
+ findingHomeserver: false,
+ discoveryError: _t("Unknown error discovering homeserver"),
+ });
+ }
+ },
+
_initLoginLogic: function(hsUrl, isUrl) {
const self = this;
hsUrl = hsUrl || this.state.enteredHomeserverUrl;
@@ -393,11 +487,14 @@ module.exports = React.createClass({
initialPhoneCountry={this.state.phoneCountry}
initialPhoneNumber={this.state.phoneNumber}
onUsernameChanged={this.onUsernameChanged}
+ onUsernameBlur={this.onUsernameBlur}
onPhoneCountryChanged={this.onPhoneCountryChanged}
onPhoneNumberChanged={this.onPhoneNumberChanged}
onForgotPasswordClick={this.props.onForgotPasswordClick}
loginIncorrect={this.state.loginIncorrect}
hsUrl={this.state.enteredHomeserverUrl}
+ hsName={this.props.defaultServerName}
+ disableSubmit={this.state.findingHomeserver}
/>
);
},
@@ -416,6 +513,8 @@ module.exports = React.createClass({
const ServerConfig = sdk.getComponent("login.ServerConfig");
const loader = this.state.busy ? { _t('Sign in') } { loader };
} else {
- if (!this.state.errorText) {
+ if (!errorText) {
header = { _t('Sign in to get started') } { loader }
;
}
}
let errorTextSection;
- if (this.state.errorText) {
+ if (errorText) {
errorTextSection = (
- { this.state.errorText }
+ { errorText }
);
}
diff --git a/src/components/structures/login/Registration.js b/src/components/structures/login/Registration.js
index 30afaf4f644..ad3ea5f19cd 100644
--- a/src/components/structures/login/Registration.js
+++ b/src/components/structures/login/Registration.js
@@ -57,6 +57,14 @@ module.exports = React.createClass({
}),
teamSelected: PropTypes.object,
+ // The default server name to use when the user hasn't specified
+ // one. This is used when displaying the defaultHsUrl in the UI.
+ defaultServerName: PropTypes.string,
+
+ // An error passed along from higher up explaining that something
+ // went wrong when finding the defaultHsUrl.
+ defaultServerDiscoveryError: PropTypes.string,
+
defaultDeviceDisplayName: PropTypes.string,
// registration shouldn't know or care how login is done.
@@ -170,6 +178,12 @@ module.exports = React.createClass({
},
onFormSubmit: function(formVals) {
+ // Don't allow the user to register if there's a discovery error
+ // Without this, the user could end up registering on the wrong homeserver.
+ if (this.props.defaultServerDiscoveryError) {
+ this.setState({errorText: this.props.defaultServerDiscoveryError});
+ return;
+ }
this.setState({
errorText: "",
busy: true,
@@ -328,7 +342,7 @@ module.exports = React.createClass({
errMsg = _t('A phone number is required to register on this homeserver.');
break;
case "RegistrationForm.ERR_USERNAME_INVALID":
- errMsg = _t('User names may only contain letters, numbers, dots, hyphens and underscores.');
+ errMsg = _t("Only use lower case letters, numbers and '=_-./'");
break;
case "RegistrationForm.ERR_USERNAME_BLANK":
errMsg = _t('You need to enter a user name.');
@@ -441,12 +455,13 @@ module.exports = React.createClass({
let header;
let errorText;
// FIXME: remove hardcoded Status team tweaks at some point
- if (theme === 'status' && this.state.errorText) {
- header = { this.state.errorText };
+ const err = this.state.errorText || this.props.defaultServerDiscoveryError;
+ if (theme === 'status' && err) {
+ header = { err };
} else {
header = { _t('Create an account') }
;
- if (this.state.errorText) {
- errorText = { this.state.errorText };
+ if (err) {
+ errorText = { err };
}
}
diff --git a/src/components/views/avatars/MemberStatusMessageAvatar.js b/src/components/views/avatars/MemberStatusMessageAvatar.js
new file mode 100644
index 00000000000..aebd1741b72
--- /dev/null
+++ b/src/components/views/avatars/MemberStatusMessageAvatar.js
@@ -0,0 +1,120 @@
+/*
+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.
+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 PropTypes from 'prop-types';
+import MatrixClientPeg from '../../../MatrixClientPeg';
+import AccessibleButton from '../elements/AccessibleButton';
+import MemberAvatar from '../avatars/MemberAvatar';
+import classNames from 'classnames';
+import * as ContextualMenu from "../../structures/ContextualMenu";
+import StatusMessageContextMenu from "../context_menus/StatusMessageContextMenu";
+import SettingsStore from "../../../settings/SettingsStore";
+
+export default class MemberStatusMessageAvatar extends React.Component {
+ static propTypes = {
+ member: PropTypes.object.isRequired,
+ width: PropTypes.number,
+ height: PropTypes.number,
+ resizeMethod: PropTypes.string,
+ };
+
+ static defaultProps = {
+ width: 40,
+ height: 40,
+ resizeMethod: 'crop',
+ };
+
+ constructor(props, context) {
+ super(props, context);
+ }
+
+ componentWillMount() {
+ if (this.props.member.userId !== MatrixClientPeg.get().getUserId()) {
+ throw new Error("Cannot use MemberStatusMessageAvatar on anyone but the logged in user");
+ }
+ }
+
+ componentDidMount() {
+ MatrixClientPeg.get().on("RoomState.events", this._onRoomStateEvents);
+
+ if (this.props.member.user) {
+ this.setState({message: this.props.member.user._unstable_statusMessage});
+ } else {
+ this.setState({message: ""});
+ }
+ }
+
+ componentWillUnmount() {
+ if (MatrixClientPeg.get()) {
+ MatrixClientPeg.get().removeListener("RoomState.events", this._onRoomStateEvents);
+ }
+ }
+
+ _onRoomStateEvents = (ev, state) => {
+ if (ev.getStateKey() !== MatrixClientPeg.get().getUserId()) return;
+ if (ev.getType() !== "im.vector.user_status") return;
+ // TODO: We should be relying on `this.props.member.user._unstable_statusMessage`
+ // We don't currently because the js-sdk doesn't emit a specific event for this
+ // change, and we don't want to race it. This should be improved when we rip out
+ // the im.vector.user_status stuff and replace it with a complete solution.
+ this.setState({message: ev.getContent()["status"]});
+ };
+
+ _onClick = (e) => {
+ e.stopPropagation();
+
+ const elementRect = e.target.getBoundingClientRect();
+
+ // The window X and Y offsets are to adjust position when zoomed in to page
+ const x = (elementRect.left + window.pageXOffset) - (elementRect.width / 2) + 3;
+ const chevronOffset = 12;
+ let y = elementRect.top + (elementRect.height / 2) + window.pageYOffset;
+ y = y - (chevronOffset + 4); // where 4 is 1/4 the height of the chevron
+
+ ContextualMenu.createMenu(StatusMessageContextMenu, {
+ chevronOffset: chevronOffset,
+ chevronFace: 'bottom',
+ left: x,
+ top: y,
+ menuWidth: 190,
+ user: this.props.member.user,
+ });
+ };
+
+ render() {
+ if (!SettingsStore.isFeatureEnabled("feature_custom_status")) {
+ return
+ ;
+ }
+}
diff --git a/src/components/views/context_menus/StatusMessageContextMenu.js b/src/components/views/context_menus/StatusMessageContextMenu.js
new file mode 100644
index 00000000000..f07220db44b
--- /dev/null
+++ b/src/components/views/context_menus/StatusMessageContextMenu.js
@@ -0,0 +1,86 @@
+/*
+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.
+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 PropTypes from 'prop-types';
+import { _t } from '../../../languageHandler';
+import MatrixClientPeg from '../../../MatrixClientPeg';
+import AccessibleButton from '../elements/AccessibleButton';
+import classNames from 'classnames';
+
+export default class StatusMessageContextMenu extends React.Component {
+ static propTypes = {
+ // js-sdk User object. Not required because it might not exist.
+ user: PropTypes.object,
+ };
+
+ constructor(props, context) {
+ super(props, context);
+
+ this.state = {
+ message: props.user ? props.user._unstable_statusMessage : "",
+ };
+ }
+
+ _onClearClick = async(e) => {
+ await MatrixClientPeg.get()._unstable_setStatusMessage("");
+ this.setState({message: ""});
+ };
+
+ _onSubmit = (e) => {
+ e.preventDefault();
+ MatrixClientPeg.get()._unstable_setStatusMessage(this.state.message);
+ };
+
+ _onStatusChange = (e) => {
+ this.setState({message: e.target.value});
+ };
+
+ render() {
+ const formSubmitClasses = classNames({
+ "mx_StatusMessageContextMenu_submit": true,
+ "mx_StatusMessageContextMenu_submitFaded": !this.state.message, // no message == faded
+ });
+
+ const form = ;
+
+ const clearIcon = this.state.message ? "img/cancel-red.svg" : "img/cancel.svg";
+ const clearButton =
+ 
+ {_t("Clear status")}
+ ;
+
+ const menuClasses = classNames({
+ "mx_StatusMessageContextMenu": true,
+ "mx_StatusMessageContextMenu_hasStatus": this.state.message,
+ });
+
+ return
+ { form }
+
+ { clearButton }
+ ;
+ }
+}
diff --git a/src/components/views/dialogs/AddressPickerDialog.js b/src/components/views/dialogs/AddressPickerDialog.js
index abc52f7b1d3..cbe80763a65 100644
--- a/src/components/views/dialogs/AddressPickerDialog.js
+++ b/src/components/views/dialogs/AddressPickerDialog.js
@@ -23,6 +23,7 @@ import MatrixClientPeg from '../../../MatrixClientPeg';
import Promise from 'bluebird';
import { addressTypes, getAddressType } from '../../../UserAddress.js';
import GroupStore from '../../../stores/GroupStore';
+import * as Email from "../../../email";
const TRUNCATE_QUERY_LIST = 40;
const QUERY_USER_DIRECTORY_DEBOUNCE_MS = 200;
@@ -419,6 +420,10 @@ module.exports = React.createClass({
// a perfectly valid address if there are close matches.
const addrType = getAddressType(query);
if (this.props.validAddressTypes.includes(addrType)) {
+ if (addrType === 'email' && !Email.looksValid(query)) {
+ this.setState({searchError: _t("That doesn't look like a valid email address")});
+ return;
+ }
suggestedList.unshift({
addressType: addrType,
address: query,
diff --git a/src/components/views/dialogs/BaseDialog.js b/src/components/views/dialogs/BaseDialog.js
index 8ec417a59b0..3e9052cc349 100644
--- a/src/components/views/dialogs/BaseDialog.js
+++ b/src/components/views/dialogs/BaseDialog.js
@@ -57,8 +57,7 @@ export default React.createClass({
className: PropTypes.string,
// Title for the dialog.
- // (could probably actually be something more complicated than a string if desired)
- title: PropTypes.string.isRequired,
+ title: PropTypes.node.isRequired,
// children should be the content of the dialog
children: PropTypes.node,
diff --git a/src/components/views/dialogs/ChangelogDialog.js b/src/components/views/dialogs/ChangelogDialog.js
index b93678b2abf..3c9414fd887 100644
--- a/src/components/views/dialogs/ChangelogDialog.js
+++ b/src/components/views/dialogs/ChangelogDialog.js
@@ -36,8 +36,12 @@ export default class ChangelogDialog extends React.Component {
for (let i=0; i {
- if (body == null) return;
+ const url = `https://api.github.com/repos/${REPOS[i]}/compare/${oldVersion}...${newVersion}`;
+ request(url, (err, response, body) => {
+ if (response.statusCode < 200 || response.statusCode >= 300) {
+ this.setState({ [REPOS[i]]: response.statusText });
+ return;
+ }
this.setState({[REPOS[i]]: JSON.parse(body).commits});
});
}
@@ -58,13 +62,20 @@ export default class ChangelogDialog extends React.Component {
const QuestionDialog = sdk.getComponent('dialogs.QuestionDialog');
const logs = REPOS.map(repo => {
- if (this.state[repo] == null) return {repo}
-
- {this.state[repo].map(this._elementsForCommit)}
-
+ {content}
);
});
diff --git a/src/components/views/dialogs/DeactivateAccountDialog.js b/src/components/views/dialogs/DeactivateAccountDialog.js
index 761a1e42096..6e87a816bb7 100644
--- a/src/components/views/dialogs/DeactivateAccountDialog.js
+++ b/src/components/views/dialogs/DeactivateAccountDialog.js
@@ -35,19 +35,10 @@ export default class DeactivateAccountDialog extends React.Component {
this._onPasswordFieldChange = this._onPasswordFieldChange.bind(this);
this._onEraseFieldChange = this._onEraseFieldChange.bind(this);
- const deactivationPreferences =
- MatrixClientPeg.get().getAccountData('im.riot.account_deactivation_preferences');
-
- const shouldErase = (
- deactivationPreferences &&
- deactivationPreferences.getContent() &&
- deactivationPreferences.getContent().shouldErase
- ) || false;
-
this.state = {
confirmButtonEnabled: false,
busy: false,
- shouldErase,
+ shouldErase: false,
errStr: null,
};
}
@@ -67,36 +58,6 @@ export default class DeactivateAccountDialog extends React.Component {
async _onOk() {
this.setState({busy: true});
- // Before we deactivate the account insert an event into
- // the user's account data indicating that they wish to be
- // erased from the homeserver.
- //
- // We do this because the API for erasing after deactivation
- // might not be supported by the connected homeserver. Leaving
- // an indication in account data is only best-effort, and
- // in the worse case, the HS maintainer would have to run a
- // script to erase deactivated accounts that have shouldErase
- // set to true in im.riot.account_deactivation_preferences.
- //
- // Note: The preferences are scoped to Riot, hence the
- // "im.riot..." event type.
- //
- // Note: This may have already been set on previous attempts
- // where, for example, the user entered the wrong password.
- // This is fine because the UI always indicates the preference
- // prior to us calling `deactivateAccount`.
- try {
- await MatrixClientPeg.get().setAccountData('im.riot.account_deactivation_preferences', {
- shouldErase: this.state.shouldErase,
- });
- } catch (err) {
- this.setState({
- busy: false,
- errStr: _t('Failed to indicate account erasure'),
- });
- return;
- }
-
try {
// This assumes that the HS requires password UI auth
// for this endpoint. In reality it could be any UI auth.
diff --git a/src/components/views/dialogs/SetMxIdDialog.js b/src/components/views/dialogs/SetMxIdDialog.js
index fb892c4a0a8..222a2c35fed 100644
--- a/src/components/views/dialogs/SetMxIdDialog.js
+++ b/src/components/views/dialogs/SetMxIdDialog.js
@@ -23,6 +23,7 @@ import MatrixClientPeg from '../../../MatrixClientPeg';
import classnames from 'classnames';
import { KeyCode } from '../../../Keyboard';
import { _t } from '../../../languageHandler';
+import { SAFE_LOCALPART_REGEX } from '../../../Registration';
// The amount of time to wait for further changes to the input username before
// sending a request to the server
@@ -110,12 +111,11 @@ export default React.createClass({
},
_doUsernameCheck: function() {
- // XXX: SPEC-1
- // Check if username is valid
- // Naive impl copied from https://github.com/matrix-org/matrix-react-sdk/blob/66c3a6d9ca695780eb6b662e242e88323053ff33/src/components/views/login/RegistrationForm.js#L190
- if (encodeURIComponent(this.state.username) !== this.state.username) {
+ // We do a quick check ahead of the username availability API to ensure the
+ // user ID roughly looks okay from a Matrix perspective.
+ if (!SAFE_LOCALPART_REGEX.test(this.state.username)) {
this.setState({
- usernameError: _t('User names may only contain letters, numbers, dots, hyphens and underscores.'),
+ usernameError: _t("Only use lower case letters, numbers and '=_-./'"),
});
return Promise.reject();
}
@@ -210,7 +210,6 @@ export default React.createClass({
render: function() {
const BaseDialog = sdk.getComponent('views.dialogs.BaseDialog');
const InteractiveAuth = sdk.getComponent('structures.InteractiveAuth');
- const Spinner = sdk.getComponent('elements.Spinner');
let auth;
if (this.state.doingUIAuth) {
@@ -230,9 +229,8 @@ export default React.createClass({
});
let usernameIndicator = null;
- let usernameBusyIndicator = null;
if (this.state.usernameBusy) {
- usernameBusyIndicator =
{ usernameIndicator }
diff --git a/src/components/views/elements/AppTile.js b/src/components/views/elements/AppTile.js
index 23b24adbb4a..f4f929a3c20 100644
--- a/src/components/views/elements/AppTile.js
+++ b/src/components/views/elements/AppTile.js
@@ -22,7 +22,6 @@ import qs from 'querystring';
import React from 'react';
import PropTypes from 'prop-types';
import MatrixClientPeg from '../../../MatrixClientPeg';
-import PlatformPeg from '../../../PlatformPeg';
import ScalarAuthClient from '../../../ScalarAuthClient';
import WidgetMessaging from '../../../WidgetMessaging';
import TintableSvgButton from './TintableSvgButton';
@@ -49,7 +48,6 @@ export default class AppTile extends React.Component {
this.state = this._getNewState(props);
this._onAction = this._onAction.bind(this);
- this._onMessage = this._onMessage.bind(this);
this._onLoaded = this._onLoaded.bind(this);
this._onEditClick = this._onEditClick.bind(this);
this._onDeleteClick = this._onDeleteClick.bind(this);
@@ -143,10 +141,6 @@ export default class AppTile extends React.Component {
}
componentDidMount() {
- // Legacy Jitsi widget messaging -- TODO replace this with standard widget
- // postMessaging API
- window.addEventListener('message', this._onMessage, false);
-
// Widget action listeners
this.dispatcherRef = dis.register(this._onAction);
}
@@ -155,9 +149,6 @@ export default class AppTile extends React.Component {
// Widget action listeners
dis.unregister(this.dispatcherRef);
- // Jitsi listener
- window.removeEventListener('message', this._onMessage);
-
// if it's not remaining on screen, get rid of the PersistedElement container
if (!ActiveWidgetStore.getWidgetPersistence(this.props.id)) {
ActiveWidgetStore.destroyPersistentWidget();
@@ -233,32 +224,6 @@ export default class AppTile extends React.Component {
}
}
- // Legacy Jitsi widget messaging
- // TODO -- This should be replaced with the new widget postMessaging API
- _onMessage(event) {
- if (this.props.type !== 'jitsi') {
- return;
- }
- if (!event.origin) {
- event.origin = event.originalEvent.origin;
- }
-
- const widgetUrlObj = url.parse(this.state.widgetUrl);
- const eventOrigin = url.parse(event.origin);
- if (
- eventOrigin.protocol !== widgetUrlObj.protocol ||
- eventOrigin.host !== widgetUrlObj.host
- ) {
- return;
- }
-
- if (event.data.widgetAction === 'jitsi_iframe_loaded') {
- const iframe = this.refs.appFrame.contentWindow
- .document.querySelector('iframe[id^="jitsiConferenceFrame"]');
- PlatformPeg.get().setupScreenSharingForIframe(iframe);
- }
- }
-
_canUserModify() {
// User widgets should always be modifiable by their creator
if (this.props.userWidget && MatrixClientPeg.get().credentials.userId === this.props.creatorUserId) {
@@ -544,7 +509,7 @@ export default class AppTile extends React.Component {
// Additional iframe feature pemissions
// (see - https://sites.google.com/a/chromium.org/dev/Home/chromium-security/deprecating-permissions-in-cross-origin-iframes and https://wicg.github.io/feature-policy/)
- const iframeFeatures = "microphone; camera; encrypted-media;";
+ const iframeFeatures = "microphone; camera; encrypted-media; autoplay;";
const appTileBodyClass = 'mx_AppTileBody' + (this.props.miniMode ? '_mini ' : ' ');
diff --git a/src/components/views/groups/GroupMemberList.js b/src/components/views/groups/GroupMemberList.js
index 46653f15994..9a8196f12b9 100644
--- a/src/components/views/groups/GroupMemberList.js
+++ b/src/components/views/groups/GroupMemberList.js
@@ -37,7 +37,9 @@ export default React.createClass({
getInitialState: function() {
return {
members: null,
+ membersError: null,
invitedMembers: null,
+ invitedMembersError: null,
truncateAt: INITIAL_LOAD_NUM_MEMBERS,
};
},
@@ -55,6 +57,19 @@ export default React.createClass({
GroupStore.registerListener(groupId, () => {
this._fetchMembers();
});
+ GroupStore.on('error', (err, errorGroupId, stateKey) => {
+ if (this._unmounted || groupId !== errorGroupId) return;
+ if (stateKey === GroupStore.STATE_KEY.GroupMembers) {
+ this.setState({
+ membersError: err,
+ });
+ }
+ if (stateKey === GroupStore.STATE_KEY.GroupInvitedMembers) {
+ this.setState({
+ invitedMembersError: err,
+ });
+ }
+ });
},
_fetchMembers: function() {
@@ -88,7 +103,11 @@ export default React.createClass({
this.setState({ searchQuery: ev.target.value });
},
- makeGroupMemberTiles: function(query, memberList) {
+ makeGroupMemberTiles: function(query, memberList, memberListError) {
+ if (memberListError) {
+ return
{ _t("Failed to load group members") };
+ }
+
const GroupMemberTile = sdk.getComponent("groups.GroupMemberTile");
const TruncatedList = sdk.getComponent("elements.TruncatedList");
query = (query || "").toLowerCase();
@@ -166,13 +185,25 @@ export default React.createClass({
);
const joined = this.state.members ?
- { this.makeGroupMemberTiles(this.state.searchQuery, this.state.members) }
+ {
+ this.makeGroupMemberTiles(
+ this.state.searchQuery,
+ this.state.members,
+ this.state.membersError,
+ )
+ }
: ;
const invited = (this.state.invitedMembers && this.state.invitedMembers.length > 0) ?
- { _t("Invited") }
- { this.makeGroupMemberTiles(this.state.searchQuery, this.state.invitedMembers) }
+ {_t("Invited")}
+ {
+ this.makeGroupMemberTiles(
+ this.state.searchQuery,
+ this.state.invitedMembers,
+ this.state.invitedMembersError,
+ )
+ }
: ;
let inviteButton;
diff --git a/src/components/views/login/PasswordLogin.js b/src/components/views/login/PasswordLogin.js
index a0e5ab0ddbb..59d4db379c2 100644
--- a/src/components/views/login/PasswordLogin.js
+++ b/src/components/views/login/PasswordLogin.js
@@ -30,6 +30,7 @@ class PasswordLogin extends React.Component {
static defaultProps = {
onError: function() {},
onUsernameChanged: function() {},
+ onUsernameBlur: function() {},
onPasswordChanged: function() {},
onPhoneCountryChanged: function() {},
onPhoneNumberChanged: function() {},
@@ -39,6 +40,8 @@ class PasswordLogin extends React.Component {
initialPassword: "",
loginIncorrect: false,
hsDomain: "",
+ hsName: null,
+ disableSubmit: false,
}
constructor(props) {
@@ -53,6 +56,7 @@ class PasswordLogin extends React.Component {
this.onSubmitForm = this.onSubmitForm.bind(this);
this.onUsernameChanged = this.onUsernameChanged.bind(this);
+ this.onUsernameBlur = this.onUsernameBlur.bind(this);
this.onLoginTypeChange = this.onLoginTypeChange.bind(this);
this.onPhoneCountryChanged = this.onPhoneCountryChanged.bind(this);
this.onPhoneNumberChanged = this.onPhoneNumberChanged.bind(this);
@@ -124,6 +128,10 @@ class PasswordLogin extends React.Component {
this.props.onUsernameChanged(ev.target.value);
}
+ onUsernameBlur(ev) {
+ this.props.onUsernameBlur(this.state.username);
+ }
+
onLoginTypeChange(loginType) {
this.props.onError(null); // send a null error to clear any error messages
this.setState({
@@ -167,6 +175,7 @@ class PasswordLogin extends React.Component {
type="text"
name="username" // make it a little easier for browser's remember-password
onChange={this.onUsernameChanged}
+ onBlur={this.onUsernameBlur}
placeholder="joe@example.com"
value={this.state.username}
autoFocus
@@ -182,6 +191,7 @@ class PasswordLogin extends React.Component {
type="text"
name="username" // make it a little easier for browser's remember-password
onChange={this.onUsernameChanged}
+ onBlur={this.onUsernameBlur}
placeholder={SdkConfig.get().disable_custom_urls ?
_t("Username on %(hs)s", {
hs: this.props.hsUrl.replace(/^https?:\/\//, ''),
@@ -242,13 +252,15 @@ class PasswordLogin extends React.Component {
);
}
- let matrixIdText = '';
- if (this.props.hsUrl) {
+ let matrixIdText = _t('Matrix ID');
+ if (this.props.hsName) {
+ matrixIdText = _t('%(serverName)s Matrix ID', {serverName: this.props.hsName});
+ } else {
try {
const parsedHsUrl = new URL(this.props.hsUrl);
matrixIdText = _t('%(serverName)s Matrix ID', {serverName: parsedHsUrl.hostname});
} catch (e) {
- // pass
+ // ignore
}
}
@@ -280,6 +292,8 @@ class PasswordLogin extends React.Component {
);
}
+ const disableSubmit = this.props.disableSubmit || matrixIdText === '';
+
return (
);
@@ -317,6 +331,8 @@ PasswordLogin.propTypes = {
onPhoneNumberChanged: PropTypes.func,
onPasswordChanged: PropTypes.func,
loginIncorrect: PropTypes.bool,
+ hsName: PropTypes.string,
+ disableSubmit: PropTypes.bool,
};
module.exports = PasswordLogin;
diff --git a/src/components/views/login/RegistrationForm.js b/src/components/views/login/RegistrationForm.js
index fe977025aea..137aeada914 100644
--- a/src/components/views/login/RegistrationForm.js
+++ b/src/components/views/login/RegistrationForm.js
@@ -25,7 +25,7 @@ import { looksValid as phoneNumberLooksValid } from '../../../phonenumber';
import Modal from '../../../Modal';
import { _t } from '../../../languageHandler';
import SdkConfig from '../../../SdkConfig';
-import SettingsStore from "../../../settings/SettingsStore";
+import { SAFE_LOCALPART_REGEX } from '../../../Registration';
const FIELD_EMAIL = 'field_email';
const FIELD_PHONE_COUNTRY = 'field_phone_country';
@@ -194,9 +194,8 @@ module.exports = React.createClass({
} else this.markFieldValid(field_id, phoneNumberValid, "RegistrationForm.ERR_PHONE_NUMBER_INVALID");
break;
case FIELD_USERNAME:
- // XXX: SPEC-1
- var username = this.refs.username.value.trim();
- if (encodeURIComponent(username) != username) {
+ const username = this.refs.username.value.trim();
+ if (!SAFE_LOCALPART_REGEX.test(username)) {
this.markFieldValid(
field_id,
false,
diff --git a/src/components/views/login/ServerConfig.js b/src/components/views/login/ServerConfig.js
index a6944ec20af..2f040112734 100644
--- a/src/components/views/login/ServerConfig.js
+++ b/src/components/views/login/ServerConfig.js
@@ -70,6 +70,23 @@ module.exports = React.createClass({
};
},
+ componentWillReceiveProps: function(newProps) {
+ if (newProps.customHsUrl === this.state.hs_url &&
+ newProps.customIsUrl === this.state.is_url) return;
+
+ this.setState({
+ hs_url: newProps.customHsUrl,
+ is_url: newProps.customIsUrl,
+ configVisible: !newProps.withToggleButton ||
+ (newProps.customHsUrl !== newProps.defaultHsUrl) ||
+ (newProps.customIsUrl !== newProps.defaultIsUrl),
+ });
+ this.props.onServerConfigChange({
+ hsUrl: newProps.customHsUrl,
+ isUrl: newProps.customIsUrl,
+ });
+ },
+
onHomeserverChanged: function(ev) {
this.setState({hs_url: ev.target.value}, function() {
this._hsTimeoutId = this._waitThenInvoke(this._hsTimeoutId, function() {
diff --git a/src/components/views/messages/SenderProfile.js b/src/components/views/messages/SenderProfile.js
index a40addf0d1d..a8c52e06b1c 100644
--- a/src/components/views/messages/SenderProfile.js
+++ b/src/components/views/messages/SenderProfile.js
@@ -85,8 +85,8 @@ export default React.createClass({
_getDisplayedGroups(userGroups, relatedGroups) {
let displayedGroups = userGroups || [];
if (relatedGroups && relatedGroups.length > 0) {
- displayedGroups = displayedGroups.filter((groupId) => {
- return relatedGroups.includes(groupId);
+ displayedGroups = relatedGroups.filter((groupId) => {
+ return displayedGroups.includes(groupId);
});
} else {
displayedGroups = [];
diff --git a/src/components/views/room_settings/AliasSettings.js b/src/components/views/room_settings/AliasSettings.js
index de5d3db6258..f68670b2f9b 100644
--- a/src/components/views/room_settings/AliasSettings.js
+++ b/src/components/views/room_settings/AliasSettings.js
@@ -130,7 +130,7 @@ module.exports = React.createClass({
},
isAliasValid: function(alias) {
- // XXX: FIXME SPEC-1
+ // XXX: FIXME https://github.com/matrix-org/matrix-doc/issues/668
return (alias.match(/^#([^\/:,]+?):(.+)$/) && encodeURI(alias) === alias);
},
diff --git a/src/components/views/rooms/EntityTile.js b/src/components/views/rooms/EntityTile.js
index 851352aa17d..3f3bdbf47ae 100644
--- a/src/components/views/rooms/EntityTile.js
+++ b/src/components/views/rooms/EntityTile.js
@@ -70,6 +70,7 @@ const EntityTile = React.createClass({
onClick: PropTypes.func,
suppressOnHover: PropTypes.bool,
showPresence: PropTypes.bool,
+ subtextLabel: PropTypes.string,
},
getDefaultProps: function() {
@@ -129,6 +130,9 @@ const EntityTile = React.createClass({
presenceState={this.props.presenceState} />;
nameClasses += ' mx_EntityTile_name_hover';
}
+ if (this.props.subtextLabel) {
+ presenceLabel = {this.props.subtextLabel};
+ }
nameEl = (
@@ -137,6 +141,15 @@ const EntityTile = React.createClass({
{presenceLabel}
);
+ } else if (this.props.subtextLabel) {
+ nameEl = (
+
+
+ {name}
+
+ {this.props.subtextLabel}
+
+ );
} else {
nameEl = (
{ name }
diff --git a/src/components/views/rooms/MemberInfo.js b/src/components/views/rooms/MemberInfo.js
index ef22f01faac..12dc2117a07 100644
--- a/src/components/views/rooms/MemberInfo.js
+++ b/src/components/views/rooms/MemberInfo.js
@@ -41,6 +41,8 @@ import withMatrixClient from '../../../wrappers/withMatrixClient';
import AccessibleButton from '../elements/AccessibleButton';
import RoomViewStore from '../../../stores/RoomViewStore';
import SdkConfig from '../../../SdkConfig';
+import MultiInviter from "../../../utils/MultiInviter";
+import SettingsStore from "../../../settings/SettingsStore";
module.exports = withMatrixClient(React.createClass({
displayName: 'MemberInfo',
@@ -714,12 +716,18 @@ module.exports = withMatrixClient(React.createClass({
const roomId = member && member.roomId ? member.roomId : RoomViewStore.getRoomId();
const onInviteUserButton = async() => {
try {
- await cli.invite(roomId, member.userId);
+ // We use a MultiInviter to re-use the invite logic, even though
+ // we're only inviting one user.
+ const inviter = new MultiInviter(roomId);
+ await inviter.invite([member.userId]).then(() => {
+ if (inviter.getCompletionState(userId) !== "invited")
+ throw new Error(inviter.getErrorText(userId));
+ });
} catch (err) {
const ErrorDialog = sdk.getComponent('dialogs.ErrorDialog');
Modal.createTrackedDialog('Failed to invite', '', ErrorDialog, {
title: _t('Failed to invite'),
- description: ((err && err.message) ? err.message : "Operation failed"),
+ description: ((err && err.message) ? err.message : _t("Operation failed")),
});
}
};
@@ -882,11 +890,16 @@ module.exports = withMatrixClient(React.createClass({
let presenceState;
let presenceLastActiveAgo;
let presenceCurrentlyActive;
+ let statusMessage;
if (this.props.member.user) {
presenceState = this.props.member.user.presence;
presenceLastActiveAgo = this.props.member.user.lastActiveAgo;
presenceCurrentlyActive = this.props.member.user.currentlyActive;
+
+ if (SettingsStore.isFeatureEnabled("feature_custom_status")) {
+ statusMessage = this.props.member.user._unstable_statusMessage;
+ }
}
const room = this.props.matrixClient.getRoom(this.props.member.roomId);
@@ -908,6 +921,11 @@ module.exports = withMatrixClient(React.createClass({
presenceState={presenceState} />;
}
+ let statusLabel = null;
+ if (statusMessage) {
+ statusLabel = { statusMessage };
+ }
+
let roomMemberDetails = null;
if (this.props.member.roomId) { // is in room
const PowerSelector = sdk.getComponent('elements.PowerSelector');
@@ -924,6 +942,7 @@ module.exports = withMatrixClient(React.createClass({
{presenceLabel}
+ {statusLabel}
;
}
diff --git a/src/components/views/rooms/MemberTile.js b/src/components/views/rooms/MemberTile.js
index 2359bc242cd..ba951792d08 100644
--- a/src/components/views/rooms/MemberTile.js
+++ b/src/components/views/rooms/MemberTile.js
@@ -16,6 +16,8 @@ limitations under the License.
'use strict';
+import SettingsStore from "../../../settings/SettingsStore";
+
const React = require('react');
import PropTypes from 'prop-types';
@@ -85,6 +87,11 @@ module.exports = React.createClass({
const active = -1;
const presenceState = member.user ? member.user.presence : null;
+ let statusMessage = null;
+ if (member.user && SettingsStore.isFeatureEnabled("feature_custom_status")) {
+ statusMessage = member.user._unstable_statusMessage;
+ }
+
const av = (
-
+ );
+ fileList.push(files[i]);
+ } else {
+ failedFiles.push(
+ { _t('Reason') + ": " + fileAcceptedOrError}
+ );
+ }
}
const isQuoting = Boolean(RoomViewStore.getQuotingEvent());
@@ -161,23 +173,47 @@ export default class MessageComposer extends React.Component {
};
}
+ const acceptedFilesPart = acceptedFiles.length === 0 ? null : (
+
+ { _t('Are you sure you want to upload the following files?') }
+
+ { acceptedFiles }
+
+
+ );
+
+ const failedFilesPart = failedFiles.length === 0 ? null : (
+
+ { _t('The following files cannot be uploaded:') }
+
+ { failedFiles }
+
+
+ );
+ let buttonText;
+ if (acceptedFiles.length > 0 && failedFiles.length > 0) {
+ buttonText = "Upload selected"
+ } else if (failedFiles.length > 0) {
+ buttonText = "Close"
+ }
+
Modal.createTrackedDialog('Upload Files confirmation', '', QuestionDialog, {
title: _t('Upload Files'),
description: (
- { _t('Are you sure you want to upload the following files?') }
-
- { fileList }
-
+ { acceptedFilesPart }
+ { failedFilesPart }
{ replyToWarning }
),
+ hasCancelButton: acceptedFiles.length > 0,
+ button: buttonText,
onFinished: (shouldUpload) => {
if (shouldUpload) {
// MessageComposer shouldn't have to rely on its parent passing in a callback to upload a file
- if (files) {
- for (let i=0; i
- ,
);
}
@@ -313,6 +349,34 @@ export default class MessageComposer extends React.Component {
const canSendMessages = !this.state.tombstone &&
this.props.room.maySendMessage();
+ // TODO: Remove temporary logging for riot-web#7838
+ // Note: we rip apart the power level event ourselves because we don't want to
+ // log too much data about it - just the bits we care about. Many of the variables
+ // logged here are to help figure out where in the stack the 'cannot post in room'
+ // warning is coming from. This means logging various numbers from the PL event to
+ // verify RoomState._maySendEventOfType is doing the right thing.
+ const room = this.props.room;
+ const plEvent = room.currentState.getStateEvents('m.room.power_levels', '');
+ let plEventString = "";
+ if (plEvent) {
+ const content = plEvent.getContent();
+ if (!content) {
+ plEventString = "";
+ } else {
+ const stringifyFalsey = (v) => v === null ? '' : (v === undefined ? '' : v);
+ const actualUserPl = stringifyFalsey(content.users ? content.users[room.myUserId] : "");
+ const usersPl = stringifyFalsey(content.users_default);
+ const actualEventPl = stringifyFalsey(content.events ? content.events['m.room.message'] : "");
+ const eventPl = stringifyFalsey(content.events_default);
+ plEventString = `actualUserPl=${actualUserPl} defaultUserPl=${usersPl} actualEventPl=${actualEventPl} defaultEventPl=${eventPl}`;
+ }
+ }
+ console.log(
+ `[riot-web#7838] renderComposer() hasTombstone=${!!this.state.tombstone} maySendMessage=${room.maySendMessage()}` +
+ ` myMembership=${room.getMyMembership()} maySendEvent=${room.currentState.maySendEvent('m.room.message', room.myUserId)}` +
+ ` myUserId=${room.myUserId} roomId=${room.roomId} hasPlEvent=${!!plEvent} powerLevels='${plEventString}'`
+ );
+
if (canSendMessages) {
// This also currently includes the call buttons. Really we should
// check separately for whether we can call, but this is slightly
@@ -389,6 +453,8 @@ export default class MessageComposer extends React.Component {
{ _t('Updates') }
@@ -988,8 +990,7 @@ module.exports = React.createClass({
},
_renderElectronSettings: function() {
- const settings = this.state.electron_settings;
- if (!settings) return;
+ if (!PlatformPeg.get().supportsAutoLaunch()) return;
// TODO: This should probably be a granular setting, but it only applies to electron
// and ends up being get/set outside of matrix anyways (local system setting).
@@ -999,7 +1000,7 @@ module.exports = React.createClass({
);
@@ -317,6 +331,8 @@ PasswordLogin.propTypes = {
onPhoneNumberChanged: PropTypes.func,
onPasswordChanged: PropTypes.func,
loginIncorrect: PropTypes.bool,
+ hsName: PropTypes.string,
+ disableSubmit: PropTypes.bool,
};
module.exports = PasswordLogin;
diff --git a/src/components/views/login/RegistrationForm.js b/src/components/views/login/RegistrationForm.js
index fe977025aea..137aeada914 100644
--- a/src/components/views/login/RegistrationForm.js
+++ b/src/components/views/login/RegistrationForm.js
@@ -25,7 +25,7 @@ import { looksValid as phoneNumberLooksValid } from '../../../phonenumber';
import Modal from '../../../Modal';
import { _t } from '../../../languageHandler';
import SdkConfig from '../../../SdkConfig';
-import SettingsStore from "../../../settings/SettingsStore";
+import { SAFE_LOCALPART_REGEX } from '../../../Registration';
const FIELD_EMAIL = 'field_email';
const FIELD_PHONE_COUNTRY = 'field_phone_country';
@@ -194,9 +194,8 @@ module.exports = React.createClass({
} else this.markFieldValid(field_id, phoneNumberValid, "RegistrationForm.ERR_PHONE_NUMBER_INVALID");
break;
case FIELD_USERNAME:
- // XXX: SPEC-1
- var username = this.refs.username.value.trim();
- if (encodeURIComponent(username) != username) {
+ const username = this.refs.username.value.trim();
+ if (!SAFE_LOCALPART_REGEX.test(username)) {
this.markFieldValid(
field_id,
false,
diff --git a/src/components/views/login/ServerConfig.js b/src/components/views/login/ServerConfig.js
index a6944ec20af..2f040112734 100644
--- a/src/components/views/login/ServerConfig.js
+++ b/src/components/views/login/ServerConfig.js
@@ -70,6 +70,23 @@ module.exports = React.createClass({
};
},
+ componentWillReceiveProps: function(newProps) {
+ if (newProps.customHsUrl === this.state.hs_url &&
+ newProps.customIsUrl === this.state.is_url) return;
+
+ this.setState({
+ hs_url: newProps.customHsUrl,
+ is_url: newProps.customIsUrl,
+ configVisible: !newProps.withToggleButton ||
+ (newProps.customHsUrl !== newProps.defaultHsUrl) ||
+ (newProps.customIsUrl !== newProps.defaultIsUrl),
+ });
+ this.props.onServerConfigChange({
+ hsUrl: newProps.customHsUrl,
+ isUrl: newProps.customIsUrl,
+ });
+ },
+
onHomeserverChanged: function(ev) {
this.setState({hs_url: ev.target.value}, function() {
this._hsTimeoutId = this._waitThenInvoke(this._hsTimeoutId, function() {
diff --git a/src/components/views/messages/SenderProfile.js b/src/components/views/messages/SenderProfile.js
index a40addf0d1d..a8c52e06b1c 100644
--- a/src/components/views/messages/SenderProfile.js
+++ b/src/components/views/messages/SenderProfile.js
@@ -85,8 +85,8 @@ export default React.createClass({
_getDisplayedGroups(userGroups, relatedGroups) {
let displayedGroups = userGroups || [];
if (relatedGroups && relatedGroups.length > 0) {
- displayedGroups = displayedGroups.filter((groupId) => {
- return relatedGroups.includes(groupId);
+ displayedGroups = relatedGroups.filter((groupId) => {
+ return displayedGroups.includes(groupId);
});
} else {
displayedGroups = [];
diff --git a/src/components/views/room_settings/AliasSettings.js b/src/components/views/room_settings/AliasSettings.js
index de5d3db6258..f68670b2f9b 100644
--- a/src/components/views/room_settings/AliasSettings.js
+++ b/src/components/views/room_settings/AliasSettings.js
@@ -130,7 +130,7 @@ module.exports = React.createClass({
},
isAliasValid: function(alias) {
- // XXX: FIXME SPEC-1
+ // XXX: FIXME https://github.com/matrix-org/matrix-doc/issues/668
return (alias.match(/^#([^\/:,]+?):(.+)$/) && encodeURI(alias) === alias);
},
diff --git a/src/components/views/rooms/EntityTile.js b/src/components/views/rooms/EntityTile.js
index 851352aa17d..3f3bdbf47ae 100644
--- a/src/components/views/rooms/EntityTile.js
+++ b/src/components/views/rooms/EntityTile.js
@@ -70,6 +70,7 @@ const EntityTile = React.createClass({
onClick: PropTypes.func,
suppressOnHover: PropTypes.bool,
showPresence: PropTypes.bool,
+ subtextLabel: PropTypes.string,
},
getDefaultProps: function() {
@@ -129,6 +130,9 @@ const EntityTile = React.createClass({
presenceState={this.props.presenceState} />;
nameClasses += ' mx_EntityTile_name_hover';
}
+ if (this.props.subtextLabel) {
+ presenceLabel = {this.props.subtextLabel};
+ }
nameEl = (
@@ -137,6 +141,15 @@ const EntityTile = React.createClass({
{presenceLabel}
);
+ } else if (this.props.subtextLabel) {
+ nameEl = (
+ { name }
diff --git a/src/components/views/rooms/MemberInfo.js b/src/components/views/rooms/MemberInfo.js
index ef22f01faac..12dc2117a07 100644
--- a/src/components/views/rooms/MemberInfo.js
+++ b/src/components/views/rooms/MemberInfo.js
@@ -41,6 +41,8 @@ import withMatrixClient from '../../../wrappers/withMatrixClient';
import AccessibleButton from '../elements/AccessibleButton';
import RoomViewStore from '../../../stores/RoomViewStore';
import SdkConfig from '../../../SdkConfig';
+import MultiInviter from "../../../utils/MultiInviter";
+import SettingsStore from "../../../settings/SettingsStore";
module.exports = withMatrixClient(React.createClass({
displayName: 'MemberInfo',
@@ -714,12 +716,18 @@ module.exports = withMatrixClient(React.createClass({
const roomId = member && member.roomId ? member.roomId : RoomViewStore.getRoomId();
const onInviteUserButton = async() => {
try {
- await cli.invite(roomId, member.userId);
+ // We use a MultiInviter to re-use the invite logic, even though
+ // we're only inviting one user.
+ const inviter = new MultiInviter(roomId);
+ await inviter.invite([member.userId]).then(() => {
+ if (inviter.getCompletionState(userId) !== "invited")
+ throw new Error(inviter.getErrorText(userId));
+ });
} catch (err) {
const ErrorDialog = sdk.getComponent('dialogs.ErrorDialog');
Modal.createTrackedDialog('Failed to invite', '', ErrorDialog, {
title: _t('Failed to invite'),
- description: ((err && err.message) ? err.message : "Operation failed"),
+ description: ((err && err.message) ? err.message : _t("Operation failed")),
});
}
};
@@ -882,11 +890,16 @@ module.exports = withMatrixClient(React.createClass({
let presenceState;
let presenceLastActiveAgo;
let presenceCurrentlyActive;
+ let statusMessage;
if (this.props.member.user) {
presenceState = this.props.member.user.presence;
presenceLastActiveAgo = this.props.member.user.lastActiveAgo;
presenceCurrentlyActive = this.props.member.user.currentlyActive;
+
+ if (SettingsStore.isFeatureEnabled("feature_custom_status")) {
+ statusMessage = this.props.member.user._unstable_statusMessage;
+ }
}
const room = this.props.matrixClient.getRoom(this.props.member.roomId);
@@ -908,6 +921,11 @@ module.exports = withMatrixClient(React.createClass({
presenceState={presenceState} />;
}
+ let statusLabel = null;
+ if (statusMessage) {
+ statusLabel = { statusMessage };
+ }
+
let roomMemberDetails = null;
if (this.props.member.roomId) { // is in room
const PowerSelector = sdk.getComponent('elements.PowerSelector');
@@ -924,6 +942,7 @@ module.exports = withMatrixClient(React.createClass({
@@ -1009,8 +1010,11 @@ module.exports = React.createClass({
},
_onAutoLaunchChanged: function(e) {
- const {ipcRenderer} = require('electron');
- ipcRenderer.send('settings_set', 'auto-launch', e.target.checked);
+ PlatformPeg.get().setAutoLaunchEnabled(e.target.checked).then(() => {
+ this.setState({
+ autoLaunchEnabled: e.target.checked,
+ });
+ });
},
_mapWebRtcDevicesToSpans: function(devices) {
@@ -1369,7 +1373,7 @@ module.exports = React.createClass({
{ this._renderBulkOptions() }
{ this._renderBugReport() }
- { PlatformPeg.get().isElectron() && this._renderElectronSettings() }
+ { this._renderElectronSettings() }
{ this._renderAnalyticsControl() }
diff --git a/src/components/structures/login/ForgotPassword.js b/src/components/structures/login/ForgotPassword.js
index 444f391258b..559136948ac 100644
--- a/src/components/structures/login/ForgotPassword.js
+++ b/src/components/structures/login/ForgotPassword.js
@@ -36,6 +36,14 @@ module.exports = React.createClass({
onLoginClick: PropTypes.func,
onRegisterClick: PropTypes.func,
onComplete: PropTypes.func.isRequired,
+
+ // The default server name to use when the user hasn't specified
+ // one. This is used when displaying the defaultHsUrl in the UI.
+ defaultServerName: PropTypes.string,
+
+ // An error passed along from higher up explaining that something
+ // went wrong when finding the defaultHsUrl.
+ defaultServerDiscoveryError: PropTypes.string,
},
getInitialState: function() {
@@ -45,6 +53,7 @@ module.exports = React.createClass({
progress: null,
password: null,
password2: null,
+ errorText: null,
};
},
@@ -81,6 +90,13 @@ module.exports = React.createClass({
onSubmitForm: function(ev) {
ev.preventDefault();
+ // Don't allow the user to register if there's a discovery error
+ // Without this, the user could end up registering on the wrong homeserver.
+ if (this.props.defaultServerDiscoveryError) {
+ this.setState({errorText: this.props.defaultServerDiscoveryError});
+ return;
+ }
+
if (!this.state.email) {
this.showErrorDialog(_t('The email address linked to your account must be entered.'));
} else if (!this.state.password || !this.state.password2) {
@@ -200,6 +216,12 @@ module.exports = React.createClass({
);
}
+ let errorText = null;
+ const err = this.state.errorText || this.props.defaultServerDiscoveryError;
+ if (err) {
+ errorText = { _t('Sign in') } { loader };
} else {
- if (!this.state.errorText) {
+ if (!errorText) {
header =
+ ;
+ }
+}
diff --git a/src/components/views/context_menus/StatusMessageContextMenu.js b/src/components/views/context_menus/StatusMessageContextMenu.js
new file mode 100644
index 00000000000..f07220db44b
--- /dev/null
+++ b/src/components/views/context_menus/StatusMessageContextMenu.js
@@ -0,0 +1,86 @@
+/*
+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.
+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 PropTypes from 'prop-types';
+import { _t } from '../../../languageHandler';
+import MatrixClientPeg from '../../../MatrixClientPeg';
+import AccessibleButton from '../elements/AccessibleButton';
+import classNames from 'classnames';
+
+export default class StatusMessageContextMenu extends React.Component {
+ static propTypes = {
+ // js-sdk User object. Not required because it might not exist.
+ user: PropTypes.object,
+ };
+
+ constructor(props, context) {
+ super(props, context);
+
+ this.state = {
+ message: props.user ? props.user._unstable_statusMessage : "",
+ };
+ }
+
+ _onClearClick = async(e) => {
+ await MatrixClientPeg.get()._unstable_setStatusMessage("");
+ this.setState({message: ""});
+ };
+
+ _onSubmit = (e) => {
+ e.preventDefault();
+ MatrixClientPeg.get()._unstable_setStatusMessage(this.state.message);
+ };
+
+ _onStatusChange = (e) => {
+ this.setState({message: e.target.value});
+ };
+
+ render() {
+ const formSubmitClasses = classNames({
+ "mx_StatusMessageContextMenu_submit": true,
+ "mx_StatusMessageContextMenu_submitFaded": !this.state.message, // no message == faded
+ });
+
+ const form = ;
+
+ const clearIcon = this.state.message ? "img/cancel-red.svg" : "img/cancel.svg";
+ const clearButton =
+
+ {_t("Clear status")}
+ ;
+
+ const menuClasses = classNames({
+ "mx_StatusMessageContextMenu": true,
+ "mx_StatusMessageContextMenu_hasStatus": this.state.message,
+ });
+
+ return {
- if (body == null) return;
+ const url = `https://api.github.com/repos/${REPOS[i]}/compare/${oldVersion}...${newVersion}`;
+ request(url, (err, response, body) => {
+ if (response.statusCode < 200 || response.statusCode >= 300) {
+ this.setState({ [REPOS[i]]: response.statusText });
+ return;
+ }
this.setState({[REPOS[i]]: JSON.parse(body).commits});
});
}
@@ -58,13 +62,20 @@ export default class ChangelogDialog extends React.Component {
const QuestionDialog = sdk.getComponent('dialogs.QuestionDialog');
const logs = REPOS.map(repo => {
- if (this.state[repo] == null) return
{ usernameIndicator }
{ err }
;
+ }
+
const LanguageSelector = sdk.getComponent('structures.login.LanguageSelector');
resetPasswordJsx = (
@@ -230,6 +252,7 @@ module.exports = React.createClass({
{ serverConfigSection }
+ { errorText }
{ _t('Return to login screen') }
diff --git a/src/components/structures/login/Login.js b/src/components/structures/login/Login.js
index 92cddb0dc10..b94a1759cfe 100644
--- a/src/components/structures/login/Login.js
+++ b/src/components/structures/login/Login.js
@@ -26,10 +26,17 @@ import Login from '../../../Login';
import SdkConfig from '../../../SdkConfig';
import SettingsStore from "../../../settings/SettingsStore";
import { messageForResourceLimitError } from '../../../utils/ErrorUtils';
+import { AutoDiscovery } from "matrix-js-sdk";
// For validating phone numbers without country codes
const PHONE_NUMBER_REGEX = /^[0-9()\-\s]*$/;
+// These are used in several places, and come from the js-sdk's autodiscovery
+// stuff. We define them here so that they'll be picked up by i18n.
+_td("Invalid homeserver discovery response");
+_td("Invalid identity server discovery response");
+_td("General failure");
+
/**
* A wire component which glues together login UI components and Login logic
*/
@@ -50,6 +57,14 @@ module.exports = React.createClass({
// different home server without confusing users.
fallbackHsUrl: PropTypes.string,
+ // The default server name to use when the user hasn't specified
+ // one. This is used when displaying the defaultHsUrl in the UI.
+ defaultServerName: PropTypes.string,
+
+ // An error passed along from higher up explaining that something
+ // went wrong when finding the defaultHsUrl.
+ defaultServerDiscoveryError: PropTypes.string,
+
defaultDeviceDisplayName: PropTypes.string,
// login shouldn't know or care how registration is done.
@@ -74,6 +89,12 @@ module.exports = React.createClass({
phoneCountry: null,
phoneNumber: "",
currentFlow: "m.login.password",
+
+ // .well-known discovery
+ discoveredHsUrl: "",
+ discoveredIsUrl: "",
+ discoveryError: "",
+ findingHomeserver: false,
};
},
@@ -105,6 +126,10 @@ module.exports = React.createClass({
},
onPasswordLogin: function(username, phoneCountry, phoneNumber, password) {
+ // Prevent people from submitting their password when homeserver
+ // discovery went wrong
+ if (this.state.discoveryError || this.props.defaultServerDiscoveryError) return;
+
this.setState({
busy: true,
errorText: null,
@@ -221,6 +246,22 @@ module.exports = React.createClass({
this.setState({ username: username });
},
+ onUsernameBlur: function(username) {
+ this.setState({ username: username });
+ if (username[0] === "@") {
+ const serverName = username.split(':').slice(1).join(':');
+ try {
+ // we have to append 'https://' to make the URL constructor happy
+ // otherwise we get things like 'protocol: matrix.org, pathname: 8448'
+ const url = new URL("https://" + serverName);
+ this._tryWellKnownDiscovery(url.hostname);
+ } catch (e) {
+ console.error("Problem parsing URL or unhandled error doing .well-known discovery:", e);
+ this.setState({discoveryError: _t("Failed to perform homeserver discovery")});
+ }
+ }
+ },
+
onPhoneCountryChanged: function(phoneCountry) {
this.setState({ phoneCountry: phoneCountry });
},
@@ -256,6 +297,59 @@ module.exports = React.createClass({
});
},
+ _tryWellKnownDiscovery: async function(serverName) {
+ if (!serverName.trim()) {
+ // Nothing to discover
+ this.setState({discoveryError: "", discoveredHsUrl: "", discoveredIsUrl: "", findingHomeserver: false});
+ return;
+ }
+
+ this.setState({findingHomeserver: true});
+ try {
+ const discovery = await AutoDiscovery.findClientConfig(serverName);
+ const state = discovery["m.homeserver"].state;
+ if (state !== AutoDiscovery.SUCCESS && state !== AutoDiscovery.PROMPT) {
+ this.setState({
+ discoveredHsUrl: "",
+ discoveredIsUrl: "",
+ discoveryError: discovery["m.homeserver"].error,
+ findingHomeserver: false,
+ });
+ } else if (state === AutoDiscovery.PROMPT) {
+ this.setState({
+ discoveredHsUrl: "",
+ discoveredIsUrl: "",
+ discoveryError: "",
+ findingHomeserver: false,
+ });
+ } else if (state === AutoDiscovery.SUCCESS) {
+ this.setState({
+ discoveredHsUrl: discovery["m.homeserver"].base_url,
+ discoveredIsUrl:
+ discovery["m.identity_server"].state === AutoDiscovery.SUCCESS
+ ? discovery["m.identity_server"].base_url
+ : "",
+ discoveryError: "",
+ findingHomeserver: false,
+ });
+ } else {
+ console.warn("Unknown state for m.homeserver in discovery response: ", discovery);
+ this.setState({
+ discoveredHsUrl: "",
+ discoveredIsUrl: "",
+ discoveryError: _t("Unknown failure discovering homeserver"),
+ findingHomeserver: false,
+ });
+ }
+ } catch (e) {
+ console.error(e);
+ this.setState({
+ findingHomeserver: false,
+ discoveryError: _t("Unknown error discovering homeserver"),
+ });
+ }
+ },
+
_initLoginLogic: function(hsUrl, isUrl) {
const self = this;
hsUrl = hsUrl || this.state.enteredHomeserverUrl;
@@ -393,11 +487,14 @@ module.exports = React.createClass({
initialPhoneCountry={this.state.phoneCountry}
initialPhoneNumber={this.state.phoneNumber}
onUsernameChanged={this.onUsernameChanged}
+ onUsernameBlur={this.onUsernameBlur}
onPhoneCountryChanged={this.onPhoneCountryChanged}
onPhoneNumberChanged={this.onPhoneNumberChanged}
onForgotPasswordClick={this.props.onForgotPasswordClick}
loginIncorrect={this.state.loginIncorrect}
hsUrl={this.state.enteredHomeserverUrl}
+ hsName={this.props.defaultServerName}
+ disableSubmit={this.state.findingHomeserver}
/>
);
},
@@ -416,6 +513,8 @@ module.exports = React.createClass({
const ServerConfig = sdk.getComponent("login.ServerConfig");
const loader = this.state.busy ? { _t('Sign in to get started') } { loader }
; } } let errorTextSection; - if (this.state.errorText) { + if (errorText) { errorTextSection = (
- { this.state.errorText }
+ { errorText }
);
}
diff --git a/src/components/structures/login/Registration.js b/src/components/structures/login/Registration.js
index 30afaf4f644..ad3ea5f19cd 100644
--- a/src/components/structures/login/Registration.js
+++ b/src/components/structures/login/Registration.js
@@ -57,6 +57,14 @@ module.exports = React.createClass({
}),
teamSelected: PropTypes.object,
+ // The default server name to use when the user hasn't specified
+ // one. This is used when displaying the defaultHsUrl in the UI.
+ defaultServerName: PropTypes.string,
+
+ // An error passed along from higher up explaining that something
+ // went wrong when finding the defaultHsUrl.
+ defaultServerDiscoveryError: PropTypes.string,
+
defaultDeviceDisplayName: PropTypes.string,
// registration shouldn't know or care how login is done.
@@ -170,6 +178,12 @@ module.exports = React.createClass({
},
onFormSubmit: function(formVals) {
+ // Don't allow the user to register if there's a discovery error
+ // Without this, the user could end up registering on the wrong homeserver.
+ if (this.props.defaultServerDiscoveryError) {
+ this.setState({errorText: this.props.defaultServerDiscoveryError});
+ return;
+ }
this.setState({
errorText: "",
busy: true,
@@ -328,7 +342,7 @@ module.exports = React.createClass({
errMsg = _t('A phone number is required to register on this homeserver.');
break;
case "RegistrationForm.ERR_USERNAME_INVALID":
- errMsg = _t('User names may only contain letters, numbers, dots, hyphens and underscores.');
+ errMsg = _t("Only use lower case letters, numbers and '=_-./'");
break;
case "RegistrationForm.ERR_USERNAME_BLANK":
errMsg = _t('You need to enter a user name.');
@@ -441,12 +455,13 @@ module.exports = React.createClass({
let header;
let errorText;
// FIXME: remove hardcoded Status team tweaks at some point
- if (theme === 'status' && this.state.errorText) {
- header = { this.state.errorText }
;
+ const err = this.state.errorText || this.props.defaultServerDiscoveryError;
+ if (theme === 'status' && err) {
+ header = { err }
;
} else {
header = { _t('Create an account') }
; - if (this.state.errorText) { - errorText ={ this.state.errorText }
;
+ if (err) {
+ errorText = { err }
;
}
}
diff --git a/src/components/views/avatars/MemberStatusMessageAvatar.js b/src/components/views/avatars/MemberStatusMessageAvatar.js
new file mode 100644
index 00000000000..aebd1741b72
--- /dev/null
+++ b/src/components/views/avatars/MemberStatusMessageAvatar.js
@@ -0,0 +1,120 @@
+/*
+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.
+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 PropTypes from 'prop-types';
+import MatrixClientPeg from '../../../MatrixClientPeg';
+import AccessibleButton from '../elements/AccessibleButton';
+import MemberAvatar from '../avatars/MemberAvatar';
+import classNames from 'classnames';
+import * as ContextualMenu from "../../structures/ContextualMenu";
+import StatusMessageContextMenu from "../context_menus/StatusMessageContextMenu";
+import SettingsStore from "../../../settings/SettingsStore";
+
+export default class MemberStatusMessageAvatar extends React.Component {
+ static propTypes = {
+ member: PropTypes.object.isRequired,
+ width: PropTypes.number,
+ height: PropTypes.number,
+ resizeMethod: PropTypes.string,
+ };
+
+ static defaultProps = {
+ width: 40,
+ height: 40,
+ resizeMethod: 'crop',
+ };
+
+ constructor(props, context) {
+ super(props, context);
+ }
+
+ componentWillMount() {
+ if (this.props.member.userId !== MatrixClientPeg.get().getUserId()) {
+ throw new Error("Cannot use MemberStatusMessageAvatar on anyone but the logged in user");
+ }
+ }
+
+ componentDidMount() {
+ MatrixClientPeg.get().on("RoomState.events", this._onRoomStateEvents);
+
+ if (this.props.member.user) {
+ this.setState({message: this.props.member.user._unstable_statusMessage});
+ } else {
+ this.setState({message: ""});
+ }
+ }
+
+ componentWillUnmount() {
+ if (MatrixClientPeg.get()) {
+ MatrixClientPeg.get().removeListener("RoomState.events", this._onRoomStateEvents);
+ }
+ }
+
+ _onRoomStateEvents = (ev, state) => {
+ if (ev.getStateKey() !== MatrixClientPeg.get().getUserId()) return;
+ if (ev.getType() !== "im.vector.user_status") return;
+ // TODO: We should be relying on `this.props.member.user._unstable_statusMessage`
+ // We don't currently because the js-sdk doesn't emit a specific event for this
+ // change, and we don't want to race it. This should be improved when we rip out
+ // the im.vector.user_status stuff and replace it with a complete solution.
+ this.setState({message: ev.getContent()["status"]});
+ };
+
+ _onClick = (e) => {
+ e.stopPropagation();
+
+ const elementRect = e.target.getBoundingClientRect();
+
+ // The window X and Y offsets are to adjust position when zoomed in to page
+ const x = (elementRect.left + window.pageXOffset) - (elementRect.width / 2) + 3;
+ const chevronOffset = 12;
+ let y = elementRect.top + (elementRect.height / 2) + window.pageYOffset;
+ y = y - (chevronOffset + 4); // where 4 is 1/4 the height of the chevron
+
+ ContextualMenu.createMenu(StatusMessageContextMenu, {
+ chevronOffset: chevronOffset,
+ chevronFace: 'bottom',
+ left: x,
+ top: y,
+ menuWidth: 190,
+ user: this.props.member.user,
+ });
+ };
+
+ render() {
+ if (!SettingsStore.isFeatureEnabled("feature_custom_status")) {
+ return
+ { form }
+
+ { clearButton } +
;
+ }
+}
diff --git a/src/components/views/dialogs/AddressPickerDialog.js b/src/components/views/dialogs/AddressPickerDialog.js
index abc52f7b1d3..cbe80763a65 100644
--- a/src/components/views/dialogs/AddressPickerDialog.js
+++ b/src/components/views/dialogs/AddressPickerDialog.js
@@ -23,6 +23,7 @@ import MatrixClientPeg from '../../../MatrixClientPeg';
import Promise from 'bluebird';
import { addressTypes, getAddressType } from '../../../UserAddress.js';
import GroupStore from '../../../stores/GroupStore';
+import * as Email from "../../../email";
const TRUNCATE_QUERY_LIST = 40;
const QUERY_USER_DIRECTORY_DEBOUNCE_MS = 200;
@@ -419,6 +420,10 @@ module.exports = React.createClass({
// a perfectly valid address if there are close matches.
const addrType = getAddressType(query);
if (this.props.validAddressTypes.includes(addrType)) {
+ if (addrType === 'email' && !Email.looksValid(query)) {
+ this.setState({searchError: _t("That doesn't look like a valid email address")});
+ return;
+ }
suggestedList.unshift({
addressType: addrType,
address: query,
diff --git a/src/components/views/dialogs/BaseDialog.js b/src/components/views/dialogs/BaseDialog.js
index 8ec417a59b0..3e9052cc349 100644
--- a/src/components/views/dialogs/BaseDialog.js
+++ b/src/components/views/dialogs/BaseDialog.js
@@ -57,8 +57,7 @@ export default React.createClass({
className: PropTypes.string,
// Title for the dialog.
- // (could probably actually be something more complicated than a string if desired)
- title: PropTypes.string.isRequired,
+ title: PropTypes.node.isRequired,
// children should be the content of the dialog
children: PropTypes.node,
diff --git a/src/components/views/dialogs/ChangelogDialog.js b/src/components/views/dialogs/ChangelogDialog.js
index b93678b2abf..3c9414fd887 100644
--- a/src/components/views/dialogs/ChangelogDialog.js
+++ b/src/components/views/dialogs/ChangelogDialog.js
@@ -36,8 +36,12 @@ export default class ChangelogDialog extends React.Component {
for (let i=0; i+ { clearButton } +
{repo}
--
- {this.state[repo].map(this._elementsForCommit)}
-
- {content}
{_t("Checking...")}
;
} else {
const usernameAvailable = this.state.username &&
this.state.usernameCheckSupport && !this.state.usernameError;
@@ -270,7 +268,6 @@ export default React.createClass({
size="30"
className={inputClasses}
/>
- { usernameBusyIndicator }
diff --git a/src/components/views/elements/AppTile.js b/src/components/views/elements/AppTile.js index 23b24adbb4a..f4f929a3c20 100644 --- a/src/components/views/elements/AppTile.js +++ b/src/components/views/elements/AppTile.js @@ -22,7 +22,6 @@ import qs from 'querystring'; import React from 'react'; import PropTypes from 'prop-types'; import MatrixClientPeg from '../../../MatrixClientPeg'; -import PlatformPeg from '../../../PlatformPeg'; import ScalarAuthClient from '../../../ScalarAuthClient'; import WidgetMessaging from '../../../WidgetMessaging'; import TintableSvgButton from './TintableSvgButton'; @@ -49,7 +48,6 @@ export default class AppTile extends React.Component { this.state = this._getNewState(props); this._onAction = this._onAction.bind(this); - this._onMessage = this._onMessage.bind(this); this._onLoaded = this._onLoaded.bind(this); this._onEditClick = this._onEditClick.bind(this); this._onDeleteClick = this._onDeleteClick.bind(this); @@ -143,10 +141,6 @@ export default class AppTile extends React.Component { } componentDidMount() { - // Legacy Jitsi widget messaging -- TODO replace this with standard widget - // postMessaging API - window.addEventListener('message', this._onMessage, false); - // Widget action listeners this.dispatcherRef = dis.register(this._onAction); } @@ -155,9 +149,6 @@ export default class AppTile extends React.Component { // Widget action listeners dis.unregister(this.dispatcherRef); - // Jitsi listener - window.removeEventListener('message', this._onMessage); - // if it's not remaining on screen, get rid of the PersistedElement container if (!ActiveWidgetStore.getWidgetPersistence(this.props.id)) { ActiveWidgetStore.destroyPersistentWidget(); @@ -233,32 +224,6 @@ export default class AppTile extends React.Component { } } - // Legacy Jitsi widget messaging - // TODO -- This should be replaced with the new widget postMessaging API - _onMessage(event) { - if (this.props.type !== 'jitsi') { - return; - } - if (!event.origin) { - event.origin = event.originalEvent.origin; - } - - const widgetUrlObj = url.parse(this.state.widgetUrl); - const eventOrigin = url.parse(event.origin); - if ( - eventOrigin.protocol !== widgetUrlObj.protocol || - eventOrigin.host !== widgetUrlObj.host - ) { - return; - } - - if (event.data.widgetAction === 'jitsi_iframe_loaded') { - const iframe = this.refs.appFrame.contentWindow - .document.querySelector('iframe[id^="jitsiConferenceFrame"]'); - PlatformPeg.get().setupScreenSharingForIframe(iframe); - } - } - _canUserModify() { // User widgets should always be modifiable by their creator if (this.props.userWidget && MatrixClientPeg.get().credentials.userId === this.props.creatorUserId) { @@ -544,7 +509,7 @@ export default class AppTile extends React.Component { // Additional iframe feature pemissions // (see - https://sites.google.com/a/chromium.org/dev/Home/chromium-security/deprecating-permissions-in-cross-origin-iframes and https://wicg.github.io/feature-policy/) - const iframeFeatures = "microphone; camera; encrypted-media;"; + const iframeFeatures = "microphone; camera; encrypted-media; autoplay;"; const appTileBodyClass = 'mx_AppTileBody' + (this.props.miniMode ? '_mini ' : ' '); diff --git a/src/components/views/groups/GroupMemberList.js b/src/components/views/groups/GroupMemberList.js index 46653f15994..9a8196f12b9 100644 --- a/src/components/views/groups/GroupMemberList.js +++ b/src/components/views/groups/GroupMemberList.js @@ -37,7 +37,9 @@ export default React.createClass({ getInitialState: function() { return { members: null, + membersError: null, invitedMembers: null, + invitedMembersError: null, truncateAt: INITIAL_LOAD_NUM_MEMBERS, }; }, @@ -55,6 +57,19 @@ export default React.createClass({ GroupStore.registerListener(groupId, () => { this._fetchMembers(); }); + GroupStore.on('error', (err, errorGroupId, stateKey) => { + if (this._unmounted || groupId !== errorGroupId) return; + if (stateKey === GroupStore.STATE_KEY.GroupMembers) { + this.setState({ + membersError: err, + }); + } + if (stateKey === GroupStore.STATE_KEY.GroupInvitedMembers) { + this.setState({ + invitedMembersError: err, + }); + } + }); }, _fetchMembers: function() { @@ -88,7 +103,11 @@ export default React.createClass({ this.setState({ searchQuery: ev.target.value }); }, - makeGroupMemberTiles: function(query, memberList) { + makeGroupMemberTiles: function(query, memberList, memberListError) { + if (memberListError) { + return
{ _t("Failed to load group members") }
;
+ }
+
const GroupMemberTile = sdk.getComponent("groups.GroupMemberTile");
const TruncatedList = sdk.getComponent("elements.TruncatedList");
query = (query || "").toLowerCase();
@@ -166,13 +185,25 @@ export default React.createClass({
);
const joined = this.state.members ?
- { this.makeGroupMemberTiles(this.state.searchQuery, this.state.members) }
+ {
+ this.makeGroupMemberTiles(
+ this.state.searchQuery,
+ this.state.members,
+ this.state.membersError,
+ )
+ }
: ;
const invited = (this.state.invitedMembers && this.state.invitedMembers.length > 0) ?
-
: ;
let inviteButton;
diff --git a/src/components/views/login/PasswordLogin.js b/src/components/views/login/PasswordLogin.js
index a0e5ab0ddbb..59d4db379c2 100644
--- a/src/components/views/login/PasswordLogin.js
+++ b/src/components/views/login/PasswordLogin.js
@@ -30,6 +30,7 @@ class PasswordLogin extends React.Component {
static defaultProps = {
onError: function() {},
onUsernameChanged: function() {},
+ onUsernameBlur: function() {},
onPasswordChanged: function() {},
onPhoneCountryChanged: function() {},
onPhoneNumberChanged: function() {},
@@ -39,6 +40,8 @@ class PasswordLogin extends React.Component {
initialPassword: "",
loginIncorrect: false,
hsDomain: "",
+ hsName: null,
+ disableSubmit: false,
}
constructor(props) {
@@ -53,6 +56,7 @@ class PasswordLogin extends React.Component {
this.onSubmitForm = this.onSubmitForm.bind(this);
this.onUsernameChanged = this.onUsernameChanged.bind(this);
+ this.onUsernameBlur = this.onUsernameBlur.bind(this);
this.onLoginTypeChange = this.onLoginTypeChange.bind(this);
this.onPhoneCountryChanged = this.onPhoneCountryChanged.bind(this);
this.onPhoneNumberChanged = this.onPhoneNumberChanged.bind(this);
@@ -124,6 +128,10 @@ class PasswordLogin extends React.Component {
this.props.onUsernameChanged(ev.target.value);
}
+ onUsernameBlur(ev) {
+ this.props.onUsernameBlur(this.state.username);
+ }
+
onLoginTypeChange(loginType) {
this.props.onError(null); // send a null error to clear any error messages
this.setState({
@@ -167,6 +175,7 @@ class PasswordLogin extends React.Component {
type="text"
name="username" // make it a little easier for browser's remember-password
onChange={this.onUsernameChanged}
+ onBlur={this.onUsernameBlur}
placeholder="joe@example.com"
value={this.state.username}
autoFocus
@@ -182,6 +191,7 @@ class PasswordLogin extends React.Component {
type="text"
name="username" // make it a little easier for browser's remember-password
onChange={this.onUsernameChanged}
+ onBlur={this.onUsernameBlur}
placeholder={SdkConfig.get().disable_custom_urls ?
_t("Username on %(hs)s", {
hs: this.props.hsUrl.replace(/^https?:\/\//, ''),
@@ -242,13 +252,15 @@ class PasswordLogin extends React.Component {
);
}
- let matrixIdText = '';
- if (this.props.hsUrl) {
+ let matrixIdText = _t('Matrix ID');
+ if (this.props.hsName) {
+ matrixIdText = _t('%(serverName)s Matrix ID', {serverName: this.props.hsName});
+ } else {
try {
const parsedHsUrl = new URL(this.props.hsUrl);
matrixIdText = _t('%(serverName)s Matrix ID', {serverName: parsedHsUrl.hostname});
} catch (e) {
- // pass
+ // ignore
}
}
@@ -280,6 +292,8 @@ class PasswordLogin extends React.Component {
);
}
+ const disableSubmit = this.props.disableSubmit || matrixIdText === '';
+
return (
{ _t("Invited") }
- { this.makeGroupMemberTiles(this.state.searchQuery, this.state.invitedMembers) } +{_t("Invited")}
+ { + this.makeGroupMemberTiles( + this.state.searchQuery, + this.state.invitedMembers, + this.state.invitedMembersError, + ) + }
+
+ {name}
+
+ {this.props.subtextLabel}
+
+ );
} else {
nameEl = (
{presenceLabel}
+ {statusLabel}
{ _t('Reason') + ": " + fileAcceptedOrError}
+
+
+ );
+
+ const failedFilesPart = failedFiles.length === 0 ? null : (
+ { _t('Are you sure you want to upload the following files?') }
+-
+ { acceptedFiles }
+
+
+ );
+ let buttonText;
+ if (acceptedFiles.length > 0 && failedFiles.length > 0) {
+ buttonText = "Upload selected"
+ } else if (failedFiles.length > 0) {
+ buttonText = "Close"
+ }
+
Modal.createTrackedDialog('Upload Files confirmation', '', QuestionDialog, {
title: _t('Upload Files'),
description: (
{ _t('The following files cannot be uploaded:') }
+-
+ { failedFiles }
+
-
),
+ hasCancelButton: acceptedFiles.length > 0,
+ button: buttonText,
onFinished: (shouldUpload) => {
if (shouldUpload) {
// MessageComposer shouldn't have to rely on its parent passing in a callback to upload a file
- if (files) {
- for (let i=0; i{ _t('Are you sure you want to upload the following files?') }
--
- { fileList }
-
{ _t('You do not have permission to post to this room') }
@@ -459,6 +525,9 @@ MessageComposer.propTypes = {
// callback when a file to upload is chosen
uploadFile: PropTypes.func.isRequired,
+ // function to test whether a file should be allowed to be uploaded.
+ uploadAllowed: PropTypes.func.isRequired,
+
// string representing the current room app drawer state
- showApps: PropTypes.bool,
+ showApps: PropTypes.bool
};
diff --git a/src/components/views/rooms/RoomList.js b/src/components/views/rooms/RoomList.js
index 7a06cc3da5d..c1cd7e5d574 100644
--- a/src/components/views/rooms/RoomList.js
+++ b/src/components/views/rooms/RoomList.js
@@ -83,6 +83,7 @@ module.exports = React.createClass({
isLoadingLeftRooms: false,
totalRoomCount: null,
lists: {},
+ incomingCallTag: null,
incomingCall: null,
selectedTags: [],
};
@@ -199,11 +200,13 @@ module.exports = React.createClass({
if (call && call.call_state === 'ringing') {
this.setState({
incomingCall: call,
+ incomingCallTag: this.getTagNameForRoomId(payload.room_id),
});
this._repositionIncomingCallBox(undefined, true);
} else {
this.setState({
incomingCall: null,
+ incomingCallTag: null,
});
}
break;
@@ -368,6 +371,26 @@ module.exports = React.createClass({
// this._lastRefreshRoomListTs = Date.now();
},
+ getTagNameForRoomId: function(roomId) {
+ const lists = RoomListStore.getRoomLists();
+ for (const tagName of Object.keys(lists)) {
+ for (const room of lists[tagName]) {
+ // Should be impossible, but guard anyways.
+ if (!room) {
+ continue;
+ }
+ const myUserId = MatrixClientPeg.get().getUserId();
+ if (HIDE_CONFERENCE_CHANS && Rooms.isConfCallRoom(room, myUserId, this.props.ConferenceHandler)) {
+ continue;
+ }
+
+ if (room.roomId === roomId) return tagName;
+ }
+ }
+
+ return null;
+ },
+
getRoomLists: function() {
const lists = RoomListStore.getRoomLists();
@@ -581,6 +604,12 @@ module.exports = React.createClass({
},
render: function() {
+ const incomingCallIfTaggedAs = (tagName) => {
+ if (!this.state.incomingCall) return null;
+ if (this.state.incomingCallTag !== tagName) return null;
+ return this.state.incomingCall;
+ };
+
let subLists = [
{
list: [],
@@ -593,6 +622,7 @@ module.exports = React.createClass({
list: this.state.lists['im.vector.fake.invite'],
label: _t('Invites'),
order: "recent",
+ incomingCall: incomingCallIfTaggedAs('im.vector.fake.invite'),
isInvite: true,
},
{
@@ -600,6 +630,7 @@ module.exports = React.createClass({
label: _t('Favourites'),
tagName: "m.favourite",
order: "manual",
+ incomingCall: incomingCallIfTaggedAs('m.favourite'),
},
{
list: this.state.lists['im.vector.fake.direct'],
@@ -607,6 +638,7 @@ module.exports = React.createClass({
tagName: "im.vector.fake.direct",
headerItems: this._getHeaderItems('im.vector.fake.direct'),
order: "recent",
+ incomingCall: incomingCallIfTaggedAs('im.vector.fake.direct'),
onAddRoom: () => {dis.dispatch({action: 'view_create_chat'})},
},
{
@@ -614,6 +646,7 @@ module.exports = React.createClass({
label: _t('Rooms'),
headerItems: this._getHeaderItems('im.vector.fake.recent'),
order: "recent",
+ incomingCall: incomingCallIfTaggedAs('im.vector.fake.recent'),
onAddRoom: () => {dis.dispatch({action: 'view_create_room'})},
},
];
@@ -627,6 +660,7 @@ module.exports = React.createClass({
label: labelForTagName(tagName),
tagName: tagName,
order: "manual",
+ incomingCall: incomingCallIfTaggedAs(tagName),
};
});
subLists = subLists.concat(tagSubLists);
@@ -636,11 +670,13 @@ module.exports = React.createClass({
label: _t('Low priority'),
tagName: "m.lowpriority",
order: "recent",
+ incomingCall: incomingCallIfTaggedAs('m.lowpriority'),
},
{
list: this.state.lists['im.vector.fake.archived'],
label: _t('Historical'),
order: "recent",
+ incomingCall: incomingCallIfTaggedAs('im.vector.fake.archived'),
startAsHidden: true,
showSpinner: this.state.isLoadingLeftRooms,
onHeaderClick: this.onArchivedHeaderClick,
@@ -650,6 +686,7 @@ module.exports = React.createClass({
label: _t('System Alerts'),
tagName: "m.lowpriority",
order: "recent",
+ incomingCall: incomingCallIfTaggedAs('m.server_notice'),
},
]);
@@ -661,4 +698,4 @@ module.exports = React.createClass({
);
},
-});
+});
\ No newline at end of file
diff --git a/src/components/views/rooms/RoomRecoveryReminder.js b/src/components/views/rooms/RoomRecoveryReminder.js
new file mode 100644
index 00000000000..d03c5fc96d7
--- /dev/null
+++ b/src/components/views/rooms/RoomRecoveryReminder.js
@@ -0,0 +1,170 @@
+/*
+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.
+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 PropTypes from "prop-types";
+import sdk from "../../../index";
+import { _t } from "../../../languageHandler";
+import Modal from "../../../Modal";
+import MatrixClientPeg from "../../../MatrixClientPeg";
+
+export default class RoomRecoveryReminder extends React.PureComponent {
+ static propTypes = {
+ onFinished: PropTypes.func.isRequired,
+ }
+
+ constructor(props) {
+ super(props);
+
+ this.state = {
+ loading: true,
+ error: null,
+ unverifiedDevice: null,
+ };
+ }
+
+ componentWillMount() {
+ this._loadBackupStatus();
+ }
+
+ async _loadBackupStatus() {
+ let backupSigStatus;
+ try {
+ const backupInfo = await MatrixClientPeg.get().getKeyBackupVersion();
+ backupSigStatus = await MatrixClientPeg.get().isKeyBackupTrusted(backupInfo);
+ } catch (e) {
+ console.log("Unable to fetch key backup status", e);
+ this.setState({
+ loading: false,
+ error: e,
+ });
+ return;
+ }
+
+ let unverifiedDevice;
+ for (const sig of backupSigStatus.sigs) {
+ if (!sig.device.isVerified()) {
+ unverifiedDevice = sig.device;
+ break;
+ }
+ }
+ this.setState({
+ loading: false,
+ unverifiedDevice,
+ });
+ }
+
+ showSetupDialog = () => {
+ if (this.state.unverifiedDevice) {
+ // A key backup exists for this account, but the creating device is not
+ // verified, so we'll show the device verify dialog.
+ // TODO: Should change to a restore key backup flow that checks the recovery
+ // passphrase while at the same time also cross-signing the device as well in
+ // a single flow (for cases where a key backup exists but the backup creating
+ // device is unverified). Since we don't have that yet, we'll look for an
+ // unverified device and verify it. Note that this means we won't restore
+ // keys yet; instead we'll only trust the backup for sending our own new keys
+ // to it.
+ const DeviceVerifyDialog = sdk.getComponent('views.dialogs.DeviceVerifyDialog');
+ Modal.createTrackedDialog('Device Verify Dialog', '', DeviceVerifyDialog, {
+ userId: MatrixClientPeg.get().credentials.userId,
+ device: this.state.unverifiedDevice,
+ onFinished: this.props.onFinished,
+ });
+ return;
+ }
+
+ // The default case assumes that a key backup doesn't exist for this account, so
+ // we'll show the create key backup flow.
+ Modal.createTrackedDialogAsync("Key Backup", "Key Backup",
+ import("../../../async-components/views/dialogs/keybackup/CreateKeyBackupDialog"),
+ {
+ onFinished: this.props.onFinished,
+ },
+ );
+ }
+
+ onDontAskAgainClick = () => {
+ // When you choose "Don't ask again" from the room reminder, we show a
+ // dialog to confirm the choice.
+ Modal.createTrackedDialogAsync("Ignore Recovery Reminder", "Ignore Recovery Reminder",
+ import("../../../async-components/views/dialogs/keybackup/IgnoreRecoveryReminderDialog"),
+ {
+ onDontAskAgain: () => {
+ // Report false to the caller, who should prevent the
+ // reminder from appearing in the future.
+ this.props.onFinished(false);
+ },
+ onSetup: () => {
+ this.showSetupDialog();
+ },
+ },
+ );
+ }
+
+ onSetupClick = () => {
+ this.showSetupDialog();
+ }
+
+ render() {
+ if (this.state.loading) {
+ return null;
+ }
+
+ const AccessibleButton = sdk.getComponent("views.elements.AccessibleButton");
+
+ let body;
+ if (this.state.error) {
+ body =
+ {_t("Unable to load key backup status")}
+
;
+ } else if (this.state.unverifiedDevice) {
+ // A key backup exists for this account, but the creating device is not
+ // verified.
+ body = _t(
+ "To view your secure message history and ensure you can view new " +
+ "messages on future devices, set up Secure Message Recovery.",
+ );
+ } else {
+ // The default case assumes that a key backup doesn't exist for this account.
+ // (This component doesn't currently check that itself.)
+ body = _t(
+ "If you log out or use another device, you'll lose your " +
+ "secure message history. To prevent this, set up Secure " +
+ "Message Recovery.",
+ );
+ }
+
+ return (
+
+
+ );
+ }
+}
diff --git a/src/components/views/rooms/RoomTile.js b/src/components/views/rooms/RoomTile.js
index 4e05fbcb8bc..ae83c70fcd2 100644
--- a/src/components/views/rooms/RoomTile.js
+++ b/src/components/views/rooms/RoomTile.js
@@ -30,6 +30,7 @@ import * as FormattingUtils from '../../../utils/FormattingUtils';
import AccessibleButton from '../elements/AccessibleButton';
import ActiveRoomObserver from '../../../ActiveRoomObserver';
import RoomViewStore from '../../../stores/RoomViewStore';
+import SettingsStore from "../../../settings/SettingsStore";
module.exports = React.createClass({
displayName: 'RoomTile',
@@ -251,6 +252,17 @@ module.exports = React.createClass({
const mentionBadges = this.props.highlight && this._shouldShowMentionBadge();
const badges = notifBadges || mentionBadges;
+ const isJoined = this.props.room.getMyMembership() === "join";
+ const looksLikeDm = this.props.room.getInvitedAndJoinedMemberCount() === 2;
+ let subtext = null;
+ if (!isInvite && isJoined && looksLikeDm && SettingsStore.isFeatureEnabled("feature_custom_status")) {
+ const selfId = MatrixClientPeg.get().getUserId();
+ const otherMember = this.props.room.currentState.getMembersExcept([selfId])[0];
+ if (otherMember && otherMember.user && otherMember.user._unstable_statusMessage) {
+ subtext = otherMember.user._unstable_statusMessage;
+ }
+ }
+
const classes = classNames({
'mx_RoomTile': true,
'mx_RoomTile_selected': this.state.selected,
@@ -261,6 +273,7 @@ module.exports = React.createClass({
'mx_RoomTile_menuDisplayed': this.state.menuDisplayed,
'mx_RoomTile_noBadges': !badges,
'mx_RoomTile_transparent': this.props.transparent,
+ 'mx_RoomTile_hasSubtext': subtext && !this.props.collapsed,
});
const avatarClasses = classNames({
@@ -286,6 +299,7 @@ module.exports = React.createClass({
const EmojiText = sdk.getComponent('elements.EmojiText');
let label;
+ let subtextLabel;
let tooltip;
if (!this.props.collapsed) {
const nameClasses = classNames({
@@ -294,6 +308,8 @@ module.exports = React.createClass({
'mx_RoomTile_badgeShown': badges || this.state.badgeHover || this.state.menuDisplayed,
});
+ subtextLabel = subtext ? { subtext } : null;
+
if (this.state.selected) {
const nameSelected = {_t(
+ "Secure Message Recovery",
+ )}
+ {body}
+
+
+ { _t("Don't ask again") }
+
+
+ { _t("Set up") }
+
+
+
+ { label }
+ { subtextLabel }
+ { contextMenuButton }
+ { badge }
+
{ /* { incomingCallBox } */ }
{ tooltip }
;
diff --git a/src/components/views/settings/KeyBackupPanel.js b/src/components/views/settings/KeyBackupPanel.js
index b08f4d0e78a..03b98d28a02 100644
--- a/src/components/views/settings/KeyBackupPanel.js
+++ b/src/components/views/settings/KeyBackupPanel.js
@@ -154,6 +154,7 @@ export default class KeyBackupPanel extends React.Component {
}
let backupSigStatuses = this.state.backupSigStatus.sigs.map((sig, i) => {
+ const deviceName = sig.device.getDisplayName() || sig.device.deviceId;
const sigStatusSubstitutions = {
validity: sub =>
@@ -163,7 +164,7 @@ export default class KeyBackupPanel extends React.Component {
{sub}
,
- device: sub => {sig.device.getDisplayName()},
+ device: sub => {deviceName},
};
let sigStatus;
if (sig.device.getFingerprint() === MatrixClientPeg.get().getDeviceEd25519Key()) {
@@ -174,7 +175,7 @@ export default class KeyBackupPanel extends React.Component {
} else if (sig.valid && sig.device.isVerified()) {
sigStatus = _t(
"Backup has a HTML for your community's page
\n\n Use the long description to introduce new members to the community, or distribute\n some important links\n
\n\n You can even use 'img' tags\n
\n": "HTML për faqen e bashkësisë tuaj
\n\n Përshkrimin e gjatë përdoreni për t’u paraqitur përdoruesve të rinj bashkësinë, ose për të dhënë\n një a disa lidhje të rëndësishme\n
\n\n Mund të përdorni madje etiketa 'img'\n
\n", + "Failed to add the following rooms to the summary of %(groupId)s:": "S’u arrit të shtoheshin dhomat vijuese te përmbledhja e %(groupId)s:", + "Failed to remove the room from the summary of %(groupId)s": "S’u arrit të hiqej dhoma prej përmbledhjes së %(groupId)s", + "Failed to remove a user from the summary of %(groupId)s": "S’u arrit të hiqej një përdorues nga përmbledhja e %(groupId)s", + "Changes made to your communityClick here to open settings and give it one!": "Bashkësia juaj s’ka ndonjë Përshkrim të Gjatë, një faqe HTML për t’ua shfaqur anëtarëve të bashkësisë.
Klikoni këtu që të hapni rregullimet dhe t’i krijoni një të tillë!", + "This room is not public. You will not be able to rejoin without an invite.": "Kjo dhomë s’është publike. S’do të jeni në gjendje të rihyni në të pa një ftesë.", + "This room is used for important messages from the Homeserver, so you cannot leave it.": "Kjo dhomë përdoret për mesazhe të rëndësishëm nga shërbyesi Home, ndaj s’mund ta braktisni.", + "To set up a filter, drag a community avatar over to the filter panel on the far left hand side of the screen. You can click on an avatar in the filter panel at any time to see only the rooms and people associated with that community.": "Që të ndërtoni një filtër, tërhiqeni avatarin e një bashkësie te paneli i filtrimeve në skajin e majtë të ekranit. Për të parë vetëm dhomat dhe personat e përshoqëruar asaj bashkësie, mund të klikoni në çfarëdo kohe mbi një avatar te panelit të filtrimeve.", + "You can't send any messages until you review and agree to
{_t("Sorry, your homeserver is too old to participate in this room.")}
diff --git a/src/utils/MultiInviter.js b/src/utils/MultiInviter.js index b3e7fc495a9..ad10f28edf5 100644 --- a/src/utils/MultiInviter.js +++ b/src/utils/MultiInviter.js @@ -1,6 +1,6 @@ /* Copyright 2016 OpenMarket Ltd -Copyright 2017 New Vector Ltd +Copyright 2017, 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. @@ -17,9 +17,9 @@ limitations under the License. import MatrixClientPeg from '../MatrixClientPeg'; import {getAddressType} from '../UserAddress'; -import {inviteToRoom} from '../RoomInvite'; import GroupStore from '../stores/GroupStore'; import Promise from 'bluebird'; +import {_t} from "../languageHandler"; /** * Invites multiple addresses to a room or group, handling rate limiting from the server @@ -49,7 +49,7 @@ export default class MultiInviter { * Invite users to this room. This may only be called once per * instance of the class. * - * @param {array} addresses Array of addresses to invite + * @param {array} addrs Array of addresses to invite * @returns {Promise} Resolved when all invitations in the queue are complete */ invite(addrs) { @@ -88,12 +88,30 @@ export default class MultiInviter { return this.errorTexts[addr]; } + async _inviteToRoom(roomId, addr) { + const addrType = getAddressType(addr); + + if (addrType === 'email') { + return MatrixClientPeg.get().inviteByEmail(roomId, addr); + } else if (addrType === 'mx-user-id') { + const profile = await MatrixClientPeg.get().getProfileInfo(addr); + if (!profile) { + return Promise.reject({errcode: "M_NOT_FOUND", error: "User does not have a profile."}); + } + + return MatrixClientPeg.get().invite(roomId, addr); + } else { + throw new Error('Unsupported address'); + } + } + + _inviteMore(nextIndex) { if (this._canceled) { return; } - if (nextIndex == this.addrs.length) { + if (nextIndex === this.addrs.length) { this.busy = false; this.deferred.resolve(this.completionStates); return; @@ -111,7 +129,7 @@ export default class MultiInviter { // don't re-invite (there's no way in the UI to do this, but // for sanity's sake) - if (this.completionStates[addr] == 'invited') { + if (this.completionStates[addr] === 'invited') { this._inviteMore(nextIndex + 1); return; } @@ -120,7 +138,7 @@ export default class MultiInviter { if (this.groupId !== null) { doInvite = GroupStore.inviteUserToGroup(this.groupId, addr); } else { - doInvite = inviteToRoom(this.roomId, addr); + doInvite = this._inviteToRoom(this.roomId, addr); } doInvite.then(() => { @@ -129,29 +147,34 @@ export default class MultiInviter { this.completionStates[addr] = 'invited'; this._inviteMore(nextIndex + 1); - }, (err) => { + }).catch((err) => { if (this._canceled) { return; } let errorText; let fatal = false; - if (err.errcode == 'M_FORBIDDEN') { + if (err.errcode === 'M_FORBIDDEN') { fatal = true; - errorText = 'You do not have permission to invite people to this room.'; - } else if (err.errcode == 'M_LIMIT_EXCEEDED') { + errorText = _t('You do not have permission to invite people to this room.'); + } else if (err.errcode === 'M_LIMIT_EXCEEDED') { // we're being throttled so wait a bit & try again setTimeout(() => { this._inviteMore(nextIndex); }, 5000); return; + } else if(err.errcode === "M_NOT_FOUND") { + errorText = _t("User %(user_id)s does not exist", {user_id: addr}); } else { - errorText = 'Unknown server error'; + errorText = _t('Unknown server error'); } this.completionStates[addr] = 'error'; this.errorTexts[addr] = errorText; this.busy = !fatal; + this.fatal = fatal; if (!fatal) { this._inviteMore(nextIndex + 1); + } else { + this.deferred.resolve(this.completionStates); } }); } diff --git a/src/utils/PasswordScorer.js b/src/utils/PasswordScorer.js new file mode 100644 index 00000000000..545686cdb66 --- /dev/null +++ b/src/utils/PasswordScorer.js @@ -0,0 +1,86 @@ +/* +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. +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 Zxcvbn from 'zxcvbn'; + +import MatrixClientPeg from '../MatrixClientPeg'; +import { _t, _td } from '../languageHandler'; + +const ZXCVBN_USER_INPUTS = [ + 'riot', + 'matrix', +]; + +// Translations for zxcvbn's suggestion strings +_td("Use a few words, avoid common phrases"); +_td("No need for symbols, digits, or uppercase letters"); +_td("Use a longer keyboard pattern with more turns"); +_td("Avoid repeated words and characters"); +_td("Avoid sequences"); +_td("Avoid recent years"); +_td("Avoid years that are associated with you"); +_td("Avoid dates and years that are associated with you"); +_td("Capitalization doesn't help very much"); +_td("All-uppercase is almost as easy to guess as all-lowercase"); +_td("Reversed words aren't much harder to guess"); +_td("Predictable substitutions like '@' instead of 'a' don't help very much"); +_td("Add another word or two. Uncommon words are better."); + +// and warnings +_td("Repeats like \"aaa\" are easy to guess"); +_td("Repeats like \"abcabcabc\" are only slightly harder to guess than \"abc\""); +_td("Sequences like abc or 6543 are easy to guess"); +_td("Recent years are easy to guess"); +_td("Dates are often easy to guess"); +_td("This is a top-10 common password"); +_td("This is a top-100 common password"); +_td("This is a very common password"); +_td("This is similar to a commonly used password"); +_td("A word by itself is easy to guess"); +_td("Names and surnames by themselves are easy to guess"); +_td("Common names and surnames are easy to guess"); +_td("Straight rows of keys are easy to guess"); +_td("Short keyboard patterns are easy to guess"); + +/** + * Wrapper around zxcvbn password strength estimation + * Include this only from async components: it pulls in zxcvbn + * (obviously) which is large. + */ +export function scorePassword(password) { + if (password.length === 0) return null; + + const userInputs = ZXCVBN_USER_INPUTS.slice(); + userInputs.push(MatrixClientPeg.get().getUserIdLocalpart()); + + let zxcvbnResult = Zxcvbn(password, userInputs); + // Work around https://github.com/dropbox/zxcvbn/issues/216 + if (password.includes(' ')) { + const resultNoSpaces = Zxcvbn(password.replace(/ /g, ''), userInputs); + if (resultNoSpaces.score < zxcvbnResult.score) zxcvbnResult = resultNoSpaces; + } + + for (let i = 0; i < zxcvbnResult.feedback.suggestions.length; ++i) { + // translate suggestions + zxcvbnResult.feedback.suggestions[i] = _t(zxcvbnResult.feedback.suggestions[i]); + } + // and warning, if any + if (zxcvbnResult.feedback.warning) { + zxcvbnResult.feedback.warning = _t(zxcvbnResult.feedback.warning); + } + + return zxcvbnResult; +} diff --git a/test/DecryptionFailureTracker-test.js b/test/DecryptionFailureTracker-test.js index 617c9d5d681..baa0545f775 100644 --- a/test/DecryptionFailureTracker-test.js +++ b/test/DecryptionFailureTracker-test.js @@ -54,7 +54,7 @@ describe('DecryptionFailureTracker', function() { // Immediately track the newest failures tracker.trackFailures(); - expect(count).toNotBe(0, 'should track a failure for an event that failed decryption'); + expect(count).not.toBe(0, 'should track a failure for an event that failed decryption'); done(); }); diff --git a/test/components/structures/GroupView-test.js b/test/components/structures/GroupView-test.js index 3b3510f26e0..b49c335bdfe 100644 --- a/test/components/structures/GroupView-test.js +++ b/test/components/structures/GroupView-test.js @@ -164,7 +164,7 @@ describe('GroupView', function() { it('should indicate failure after failed /summary', function() { const groupView = ReactTestUtils.findRenderedComponentWithType(root, GroupView); - const prom = waitForUpdate(groupView).then(() => { + const prom = waitForUpdate(groupView, 4).then(() => { ReactTestUtils.findRenderedDOMComponentWithClass(root, 'mx_GroupView_error'); }); @@ -179,27 +179,27 @@ describe('GroupView', function() { it('should show a group avatar, name, id and short description after successful /summary', function() { const groupView = ReactTestUtils.findRenderedComponentWithType(root, GroupView); - const prom = waitForUpdate(groupView).then(() => { + const prom = waitForUpdate(groupView, 4).then(() => { ReactTestUtils.findRenderedDOMComponentWithClass(root, 'mx_GroupView'); const avatar = ReactTestUtils.findRenderedComponentWithType(root, sdk.getComponent('avatars.GroupAvatar')); const img = ReactTestUtils.findRenderedDOMComponentWithTag(avatar, 'img'); const avatarImgElement = ReactDOM.findDOMNode(img); - expect(avatarImgElement).toExist(); - expect(avatarImgElement.src).toInclude( + expect(avatarImgElement).toBeTruthy(); + expect(avatarImgElement.src).toContain( 'https://my.home.server/_matrix/media/v1/thumbnail/' + 'someavatarurl?width=48&height=48&method=crop', ); const name = ReactTestUtils.findRenderedDOMComponentWithClass(root, 'mx_GroupView_header_name'); const nameElement = ReactDOM.findDOMNode(name); - expect(nameElement).toExist(); - expect(nameElement.innerText).toInclude('The name of a community'); - expect(nameElement.innerText).toInclude(groupId); + expect(nameElement).toBeTruthy(); + expect(nameElement.innerText).toContain('The name of a community'); + expect(nameElement.innerText).toContain(groupId); const shortDesc = ReactTestUtils.findRenderedDOMComponentWithClass(root, 'mx_GroupView_header_shortDesc'); const shortDescElement = ReactDOM.findDOMNode(shortDesc); - expect(shortDescElement).toExist(); + expect(shortDescElement).toBeTruthy(); expect(shortDescElement.innerText).toBe('This is a community'); }); @@ -214,12 +214,12 @@ describe('GroupView', function() { it('should show a simple long description after successful /summary', function() { const groupView = ReactTestUtils.findRenderedComponentWithType(root, GroupView); - const prom = waitForUpdate(groupView).then(() => { + const prom = waitForUpdate(groupView, 4).then(() => { ReactTestUtils.findRenderedDOMComponentWithClass(root, 'mx_GroupView'); const longDesc = ReactTestUtils.findRenderedDOMComponentWithClass(root, 'mx_GroupView_groupDesc'); const longDescElement = ReactDOM.findDOMNode(longDesc); - expect(longDescElement).toExist(); + expect(longDescElement).toBeTruthy(); expect(longDescElement.innerText).toBe('This is a LONG description.'); expect(longDescElement.innerHTML).toBe('
diff --git a/src/utils/MultiInviter.js b/src/utils/MultiInviter.js index b3e7fc495a9..ad10f28edf5 100644 --- a/src/utils/MultiInviter.js +++ b/src/utils/MultiInviter.js @@ -1,6 +1,6 @@ /* Copyright 2016 OpenMarket Ltd -Copyright 2017 New Vector Ltd +Copyright 2017, 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. @@ -17,9 +17,9 @@ limitations under the License. import MatrixClientPeg from '../MatrixClientPeg'; import {getAddressType} from '../UserAddress'; -import {inviteToRoom} from '../RoomInvite'; import GroupStore from '../stores/GroupStore'; import Promise from 'bluebird'; +import {_t} from "../languageHandler"; /** * Invites multiple addresses to a room or group, handling rate limiting from the server @@ -49,7 +49,7 @@ export default class MultiInviter { * Invite users to this room. This may only be called once per * instance of the class. * - * @param {array} addresses Array of addresses to invite + * @param {array} addrs Array of addresses to invite * @returns {Promise} Resolved when all invitations in the queue are complete */ invite(addrs) { @@ -88,12 +88,30 @@ export default class MultiInviter { return this.errorTexts[addr]; } + async _inviteToRoom(roomId, addr) { + const addrType = getAddressType(addr); + + if (addrType === 'email') { + return MatrixClientPeg.get().inviteByEmail(roomId, addr); + } else if (addrType === 'mx-user-id') { + const profile = await MatrixClientPeg.get().getProfileInfo(addr); + if (!profile) { + return Promise.reject({errcode: "M_NOT_FOUND", error: "User does not have a profile."}); + } + + return MatrixClientPeg.get().invite(roomId, addr); + } else { + throw new Error('Unsupported address'); + } + } + + _inviteMore(nextIndex) { if (this._canceled) { return; } - if (nextIndex == this.addrs.length) { + if (nextIndex === this.addrs.length) { this.busy = false; this.deferred.resolve(this.completionStates); return; @@ -111,7 +129,7 @@ export default class MultiInviter { // don't re-invite (there's no way in the UI to do this, but // for sanity's sake) - if (this.completionStates[addr] == 'invited') { + if (this.completionStates[addr] === 'invited') { this._inviteMore(nextIndex + 1); return; } @@ -120,7 +138,7 @@ export default class MultiInviter { if (this.groupId !== null) { doInvite = GroupStore.inviteUserToGroup(this.groupId, addr); } else { - doInvite = inviteToRoom(this.roomId, addr); + doInvite = this._inviteToRoom(this.roomId, addr); } doInvite.then(() => { @@ -129,29 +147,34 @@ export default class MultiInviter { this.completionStates[addr] = 'invited'; this._inviteMore(nextIndex + 1); - }, (err) => { + }).catch((err) => { if (this._canceled) { return; } let errorText; let fatal = false; - if (err.errcode == 'M_FORBIDDEN') { + if (err.errcode === 'M_FORBIDDEN') { fatal = true; - errorText = 'You do not have permission to invite people to this room.'; - } else if (err.errcode == 'M_LIMIT_EXCEEDED') { + errorText = _t('You do not have permission to invite people to this room.'); + } else if (err.errcode === 'M_LIMIT_EXCEEDED') { // we're being throttled so wait a bit & try again setTimeout(() => { this._inviteMore(nextIndex); }, 5000); return; + } else if(err.errcode === "M_NOT_FOUND") { + errorText = _t("User %(user_id)s does not exist", {user_id: addr}); } else { - errorText = 'Unknown server error'; + errorText = _t('Unknown server error'); } this.completionStates[addr] = 'error'; this.errorTexts[addr] = errorText; this.busy = !fatal; + this.fatal = fatal; if (!fatal) { this._inviteMore(nextIndex + 1); + } else { + this.deferred.resolve(this.completionStates); } }); } diff --git a/src/utils/PasswordScorer.js b/src/utils/PasswordScorer.js new file mode 100644 index 00000000000..545686cdb66 --- /dev/null +++ b/src/utils/PasswordScorer.js @@ -0,0 +1,86 @@ +/* +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. +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 Zxcvbn from 'zxcvbn'; + +import MatrixClientPeg from '../MatrixClientPeg'; +import { _t, _td } from '../languageHandler'; + +const ZXCVBN_USER_INPUTS = [ + 'riot', + 'matrix', +]; + +// Translations for zxcvbn's suggestion strings +_td("Use a few words, avoid common phrases"); +_td("No need for symbols, digits, or uppercase letters"); +_td("Use a longer keyboard pattern with more turns"); +_td("Avoid repeated words and characters"); +_td("Avoid sequences"); +_td("Avoid recent years"); +_td("Avoid years that are associated with you"); +_td("Avoid dates and years that are associated with you"); +_td("Capitalization doesn't help very much"); +_td("All-uppercase is almost as easy to guess as all-lowercase"); +_td("Reversed words aren't much harder to guess"); +_td("Predictable substitutions like '@' instead of 'a' don't help very much"); +_td("Add another word or two. Uncommon words are better."); + +// and warnings +_td("Repeats like \"aaa\" are easy to guess"); +_td("Repeats like \"abcabcabc\" are only slightly harder to guess than \"abc\""); +_td("Sequences like abc or 6543 are easy to guess"); +_td("Recent years are easy to guess"); +_td("Dates are often easy to guess"); +_td("This is a top-10 common password"); +_td("This is a top-100 common password"); +_td("This is a very common password"); +_td("This is similar to a commonly used password"); +_td("A word by itself is easy to guess"); +_td("Names and surnames by themselves are easy to guess"); +_td("Common names and surnames are easy to guess"); +_td("Straight rows of keys are easy to guess"); +_td("Short keyboard patterns are easy to guess"); + +/** + * Wrapper around zxcvbn password strength estimation + * Include this only from async components: it pulls in zxcvbn + * (obviously) which is large. + */ +export function scorePassword(password) { + if (password.length === 0) return null; + + const userInputs = ZXCVBN_USER_INPUTS.slice(); + userInputs.push(MatrixClientPeg.get().getUserIdLocalpart()); + + let zxcvbnResult = Zxcvbn(password, userInputs); + // Work around https://github.com/dropbox/zxcvbn/issues/216 + if (password.includes(' ')) { + const resultNoSpaces = Zxcvbn(password.replace(/ /g, ''), userInputs); + if (resultNoSpaces.score < zxcvbnResult.score) zxcvbnResult = resultNoSpaces; + } + + for (let i = 0; i < zxcvbnResult.feedback.suggestions.length; ++i) { + // translate suggestions + zxcvbnResult.feedback.suggestions[i] = _t(zxcvbnResult.feedback.suggestions[i]); + } + // and warning, if any + if (zxcvbnResult.feedback.warning) { + zxcvbnResult.feedback.warning = _t(zxcvbnResult.feedback.warning); + } + + return zxcvbnResult; +} diff --git a/test/DecryptionFailureTracker-test.js b/test/DecryptionFailureTracker-test.js index 617c9d5d681..baa0545f775 100644 --- a/test/DecryptionFailureTracker-test.js +++ b/test/DecryptionFailureTracker-test.js @@ -54,7 +54,7 @@ describe('DecryptionFailureTracker', function() { // Immediately track the newest failures tracker.trackFailures(); - expect(count).toNotBe(0, 'should track a failure for an event that failed decryption'); + expect(count).not.toBe(0, 'should track a failure for an event that failed decryption'); done(); }); diff --git a/test/components/structures/GroupView-test.js b/test/components/structures/GroupView-test.js index 3b3510f26e0..b49c335bdfe 100644 --- a/test/components/structures/GroupView-test.js +++ b/test/components/structures/GroupView-test.js @@ -164,7 +164,7 @@ describe('GroupView', function() { it('should indicate failure after failed /summary', function() { const groupView = ReactTestUtils.findRenderedComponentWithType(root, GroupView); - const prom = waitForUpdate(groupView).then(() => { + const prom = waitForUpdate(groupView, 4).then(() => { ReactTestUtils.findRenderedDOMComponentWithClass(root, 'mx_GroupView_error'); }); @@ -179,27 +179,27 @@ describe('GroupView', function() { it('should show a group avatar, name, id and short description after successful /summary', function() { const groupView = ReactTestUtils.findRenderedComponentWithType(root, GroupView); - const prom = waitForUpdate(groupView).then(() => { + const prom = waitForUpdate(groupView, 4).then(() => { ReactTestUtils.findRenderedDOMComponentWithClass(root, 'mx_GroupView'); const avatar = ReactTestUtils.findRenderedComponentWithType(root, sdk.getComponent('avatars.GroupAvatar')); const img = ReactTestUtils.findRenderedDOMComponentWithTag(avatar, 'img'); const avatarImgElement = ReactDOM.findDOMNode(img); - expect(avatarImgElement).toExist(); - expect(avatarImgElement.src).toInclude( + expect(avatarImgElement).toBeTruthy(); + expect(avatarImgElement.src).toContain( 'https://my.home.server/_matrix/media/v1/thumbnail/' + 'someavatarurl?width=48&height=48&method=crop', ); const name = ReactTestUtils.findRenderedDOMComponentWithClass(root, 'mx_GroupView_header_name'); const nameElement = ReactDOM.findDOMNode(name); - expect(nameElement).toExist(); - expect(nameElement.innerText).toInclude('The name of a community'); - expect(nameElement.innerText).toInclude(groupId); + expect(nameElement).toBeTruthy(); + expect(nameElement.innerText).toContain('The name of a community'); + expect(nameElement.innerText).toContain(groupId); const shortDesc = ReactTestUtils.findRenderedDOMComponentWithClass(root, 'mx_GroupView_header_shortDesc'); const shortDescElement = ReactDOM.findDOMNode(shortDesc); - expect(shortDescElement).toExist(); + expect(shortDescElement).toBeTruthy(); expect(shortDescElement.innerText).toBe('This is a community'); }); @@ -214,12 +214,12 @@ describe('GroupView', function() { it('should show a simple long description after successful /summary', function() { const groupView = ReactTestUtils.findRenderedComponentWithType(root, GroupView); - const prom = waitForUpdate(groupView).then(() => { + const prom = waitForUpdate(groupView, 4).then(() => { ReactTestUtils.findRenderedDOMComponentWithClass(root, 'mx_GroupView'); const longDesc = ReactTestUtils.findRenderedDOMComponentWithClass(root, 'mx_GroupView_groupDesc'); const longDescElement = ReactDOM.findDOMNode(longDesc); - expect(longDescElement).toExist(); + expect(longDescElement).toBeTruthy(); expect(longDescElement.innerText).toBe('This is a LONG description.'); expect(longDescElement.innerHTML).toBe('
This is a LONG description.
');
});
@@ -235,11 +235,11 @@ describe('GroupView', function() {
it('should show a placeholder if a long description is not set', function() {
const groupView = ReactTestUtils.findRenderedComponentWithType(root, GroupView);
- const prom = waitForUpdate(groupView).then(() => {
+ const prom = waitForUpdate(groupView, 4).then(() => {
const placeholder = ReactTestUtils
.findRenderedDOMComponentWithClass(root, 'mx_GroupView_groupDesc_placeholder');
const placeholderElement = ReactDOM.findDOMNode(placeholder);
- expect(placeholderElement).toExist();
+ expect(placeholderElement).toBeTruthy();
});
httpBackend
@@ -255,18 +255,18 @@ describe('GroupView', function() {
it('should show a complicated long description after successful /summary', function() {
const groupView = ReactTestUtils.findRenderedComponentWithType(root, GroupView);
- const prom = waitForUpdate(groupView).then(() => {
+ const prom = waitForUpdate(groupView, 4).then(() => {
const longDesc = ReactTestUtils.findRenderedDOMComponentWithClass(root, 'mx_GroupView_groupDesc');
const longDescElement = ReactDOM.findDOMNode(longDesc);
- expect(longDescElement).toExist();
+ expect(longDescElement).toBeTruthy();
- expect(longDescElement.innerHTML).toInclude('This is a more complicated group page
'); - expect(longDescElement.innerHTML).toInclude('With paragraphs
'); - expect(longDescElement.innerHTML).toInclude('- ');
- expect(longDescElement.innerHTML).toInclude('
- And lists! '); + expect(longDescElement.innerHTML).toContain('
- And lists! '); const imgSrc = "https://my.home.server/_matrix/media/v1/thumbnail/someimageurl?width=800&height=600"; - expect(longDescElement.innerHTML).toInclude('
This is a more complicated group page
'); + expect(longDescElement.innerHTML).toContain('With paragraphs
'); + expect(longDescElement.innerHTML).toContain('- ');
+ expect(longDescElement.innerHTML).toContain('