mirror of
https://github.com/element-hq/element-web
synced 2024-11-28 04:21:57 +03:00
Merge remote-tracking branch 'origin/develop' into dbkr/better_flow_for_upgrade_on_login
This commit is contained in:
commit
de295cc350
16 changed files with 431 additions and 149 deletions
|
@ -2,19 +2,16 @@ module.exports = {
|
|||
"sourceMaps": "inline",
|
||||
"presets": [
|
||||
["@babel/preset-env", {
|
||||
"targets": {
|
||||
"browsers": [
|
||||
"last 2 versions"
|
||||
]
|
||||
},
|
||||
"modules": "commonjs"
|
||||
"targets": [
|
||||
"last 2 Chrome versions", "last 2 Firefox versions", "last 2 Safari versions"
|
||||
],
|
||||
}],
|
||||
"@babel/preset-typescript",
|
||||
"@babel/preset-flow",
|
||||
"@babel/preset-react"
|
||||
],
|
||||
"plugins": [
|
||||
["@babel/plugin-proposal-decorators", { "legacy": true }],
|
||||
["@babel/plugin-proposal-decorators", {legacy: true}],
|
||||
"@babel/plugin-proposal-export-default-from",
|
||||
"@babel/plugin-proposal-numeric-separator",
|
||||
"@babel/plugin-proposal-class-properties",
|
||||
|
|
|
@ -66,7 +66,9 @@
|
|||
@import "./views/dialogs/_IncomingSasDialog.scss";
|
||||
@import "./views/dialogs/_InviteDialog.scss";
|
||||
@import "./views/dialogs/_MessageEditHistoryDialog.scss";
|
||||
@import "./views/dialogs/_NewSessionReviewDialog.scss";
|
||||
@import "./views/dialogs/_RoomSettingsDialog.scss";
|
||||
@import "./views/dialogs/_RoomSettingsDialogBridges.scss";
|
||||
@import "./views/dialogs/_RoomUpgradeDialog.scss";
|
||||
@import "./views/dialogs/_RoomUpgradeWarningDialog.scss";
|
||||
@import "./views/dialogs/_SetEmailDialog.scss";
|
||||
|
|
37
res/css/views/dialogs/_NewSessionReviewDialog.scss
Normal file
37
res/css/views/dialogs/_NewSessionReviewDialog.scss
Normal file
|
@ -0,0 +1,37 @@
|
|||
/*
|
||||
Copyright 2020 The Matrix.org Foundation C.I.C.
|
||||
|
||||
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.
|
||||
*/
|
||||
|
||||
.mx_NewSessionReviewDialog_header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.mx_NewSessionReviewDialog_headerIcon {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
margin-right: 4px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.mx_NewSessionReviewDialog_deviceName {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.mx_NewSessionReviewDialog_deviceID {
|
||||
font-size: 12px;
|
||||
color: $notice-secondary-color;
|
||||
}
|
|
@ -56,16 +56,3 @@ limitations under the License.
|
|||
mask-position: center;
|
||||
}
|
||||
|
||||
.mx_RoomSettingsDialog_BridgeList {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.mx_RoomSettingsDialog_BridgeList li {
|
||||
list-style-type: none;
|
||||
padding: 5px;
|
||||
margin-bottom: 5px;
|
||||
border-width: 1px 0px;
|
||||
border-color: #dee1f3;
|
||||
border-style: solid;
|
||||
}
|
||||
|
||||
|
|
112
res/css/views/dialogs/_RoomSettingsDialogBridges.scss
Normal file
112
res/css/views/dialogs/_RoomSettingsDialogBridges.scss
Normal file
|
@ -0,0 +1,112 @@
|
|||
/*
|
||||
Copyright 2020 The Matrix.org Foundation C.I.C.
|
||||
|
||||
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.
|
||||
*/
|
||||
|
||||
.mx_RoomSettingsDialog_BridgeList {
|
||||
padding: 0;
|
||||
|
||||
.mx_AccessibleButton {
|
||||
display: inline;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_RoomSettingsDialog_BridgeList li {
|
||||
list-style-type: none;
|
||||
padding: 5px;
|
||||
margin-bottom: 8px;
|
||||
border-width: 1px 1px;
|
||||
border-color: $primary-hairline-color;
|
||||
border-style: solid;
|
||||
border-radius: 5px;
|
||||
|
||||
.column-icon {
|
||||
float: left;
|
||||
padding-right: 10px;
|
||||
|
||||
* {
|
||||
border-radius: 5px;
|
||||
border: 1px solid $input-darker-bg-color;
|
||||
}
|
||||
|
||||
.noProtocolIcon {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
background: $input-darker-bg-color;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.protocol-icon {
|
||||
float: left;
|
||||
margin-right: 5px;
|
||||
img {
|
||||
border-radius: 5px;
|
||||
border-width: 1px 1px;
|
||||
border-color: $primary-hairline-color;
|
||||
}
|
||||
span {
|
||||
/* Correct letter placement */
|
||||
left: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.column-data {
|
||||
display: inline-block;
|
||||
width: 85%;
|
||||
|
||||
> h3 {
|
||||
margin-top: 0px;
|
||||
margin-bottom: 0px;
|
||||
font-size: 16pt;
|
||||
color: $primary-fg-color;
|
||||
}
|
||||
|
||||
> * {
|
||||
margin-top: 4px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.workspace-channel-details {
|
||||
color: $primary-fg-color;
|
||||
font-weight: 600;
|
||||
|
||||
.channel {
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_showMore {
|
||||
display: block;
|
||||
text-align: left;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.metadata {
|
||||
color: $muted-fg-color;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.metadata.visible {
|
||||
overflow-y: visible;
|
||||
text-overflow: ellipsis;
|
||||
white-space: normal;
|
||||
}
|
||||
}
|
||||
}
|
|
@ -20,6 +20,7 @@ class Skinner {
|
|||
}
|
||||
|
||||
getComponent(name) {
|
||||
if (!name) throw new Error(`Invalid component name: ${name}`);
|
||||
if (this.components === null) {
|
||||
throw new Error(
|
||||
"Attempted to get a component before a skin has been loaded."+
|
||||
|
@ -41,13 +42,7 @@ class Skinner {
|
|||
};
|
||||
|
||||
// Check the skin first
|
||||
let comp = doLookup(this.components);
|
||||
|
||||
// If that failed, check against our own components
|
||||
if (!comp) {
|
||||
// Lazily load our own components because they might end up calling .getComponent()
|
||||
comp = doLookup(require("./component-index").components);
|
||||
}
|
||||
const comp = doLookup(this.components);
|
||||
|
||||
// Just return nothing instead of erroring - the consumer should be smart enough to
|
||||
// handle this at this point.
|
||||
|
@ -75,6 +70,13 @@ class Skinner {
|
|||
const comp = skinObject.components[compKeys[i]];
|
||||
this.addComponent(compKeys[i], comp);
|
||||
}
|
||||
|
||||
// Now that we have a skin, load our components too
|
||||
const idx = require("./component-index");
|
||||
if (!idx || !idx.components) throw new Error("Invalid react-sdk component index");
|
||||
for (const c in idx.components) {
|
||||
if (!this.components[c]) this.components[c] = idx.components[c];
|
||||
}
|
||||
}
|
||||
|
||||
addComponent(name, comp) {
|
||||
|
|
|
@ -1834,6 +1834,7 @@ export default createReactClass({
|
|||
this._accountPassword = null;
|
||||
this._accountPasswordTimer = null;
|
||||
}, 60 * 5 * 1000);
|
||||
|
||||
// Wait for the client to be logged in (but not started)
|
||||
// which is enough to ask the server about account data.
|
||||
const loggedIn = new Promise(resolve => {
|
||||
|
@ -1867,6 +1868,9 @@ export default createReactClass({
|
|||
}
|
||||
|
||||
if (masterKeyInStorage) {
|
||||
// Auto-enable cross-signing for the new session when key found in
|
||||
// secret storage.
|
||||
SettingsStore.setFeatureEnabled("feature_cross_signing", true);
|
||||
this.setStateForNewView({ view: VIEWS.COMPLETE_SECURITY });
|
||||
} else if (SettingsStore.isFeatureEnabled("feature_cross_signing")) {
|
||||
// This will only work if the feature is set to 'enable' in the config,
|
||||
|
|
|
@ -811,7 +811,7 @@ export default createReactClass({
|
|||
debuglog("e2e verified", verified, "unverified", unverified);
|
||||
|
||||
/* Check all verified user devices. */
|
||||
for (const userId of verified) {
|
||||
for (const userId of [...verified, cli.getUserId()]) {
|
||||
const devices = await cli.getStoredDevicesForUser(userId);
|
||||
const anyDeviceNotVerified = devices.some(({deviceId}) => {
|
||||
return !cli.checkDeviceTrust(userId, deviceId).isVerified();
|
||||
|
|
91
src/components/views/dialogs/NewSessionReviewDialog.js
Normal file
91
src/components/views/dialogs/NewSessionReviewDialog.js
Normal file
|
@ -0,0 +1,91 @@
|
|||
/*
|
||||
Copyright 2020 The Matrix.org Foundation C.I.C.
|
||||
|
||||
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 Modal from '../../../Modal';
|
||||
import { replaceableComponent } from '../../../utils/replaceableComponent';
|
||||
import DeviceVerifyDialog from './DeviceVerifyDialog';
|
||||
import BaseDialog from './BaseDialog';
|
||||
import DialogButtons from '../elements/DialogButtons';
|
||||
|
||||
@replaceableComponent("views.dialogs.NewSessionReviewDialog")
|
||||
export default class NewSessionReviewDialog extends React.PureComponent {
|
||||
static propTypes = {
|
||||
userId: PropTypes.string.isRequired,
|
||||
device: PropTypes.object.isRequired,
|
||||
onFinished: PropTypes.func.isRequired,
|
||||
}
|
||||
|
||||
onCancelClick = () => {
|
||||
this.props.onFinished(false);
|
||||
}
|
||||
|
||||
onContinueClick = () => {
|
||||
const { userId, device } = this.props;
|
||||
Modal.createTrackedDialog('New Session Verification', 'Starting dialog', DeviceVerifyDialog, {
|
||||
userId,
|
||||
device,
|
||||
}, null, /* priority = */ false, /* static = */ true);
|
||||
}
|
||||
|
||||
render() {
|
||||
const { device } = this.props;
|
||||
|
||||
const icon = <span className="mx_NewSessionReviewDialog_headerIcon mx_E2EIcon_warning"></span>;
|
||||
const titleText = _t("New session");
|
||||
|
||||
const title = <h2 className="mx_NewSessionReviewDialog_header">
|
||||
{icon}
|
||||
{titleText}
|
||||
</h2>;
|
||||
|
||||
return (
|
||||
<BaseDialog
|
||||
title={title}
|
||||
onFinished={this.props.onFinished}
|
||||
>
|
||||
<div className="mx_NewSessionReviewDialog_body">
|
||||
<p>{_t(
|
||||
"Use this session to verify your new one, " +
|
||||
"granting it access to encrypted messages:",
|
||||
)}</p>
|
||||
<div className="mx_NewSessionReviewDialog_deviceInfo">
|
||||
<div>
|
||||
<span className="mx_NewSessionReviewDialog_deviceName">
|
||||
{device.getDisplayName()}
|
||||
</span> <span className="mx_NewSessionReviewDialog_deviceID">
|
||||
({device.deviceId})
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<p>{_t(
|
||||
"If you didn’t sign in to this session, " +
|
||||
"your account may be compromised.",
|
||||
)}</p>
|
||||
<DialogButtons
|
||||
cancelButton={_t("This wasn't me")}
|
||||
cancelButtonClass="danger"
|
||||
primaryButton={_t("Continue")}
|
||||
onCancel={this.onCancelClick}
|
||||
onPrimaryButtonClick={this.onContinueClick}
|
||||
/>
|
||||
</div>
|
||||
</BaseDialog>
|
||||
);
|
||||
}
|
||||
}
|
|
@ -54,9 +54,6 @@ export default class RoomSettingsDialog extends React.Component {
|
|||
|
||||
_getTabs() {
|
||||
const tabs = [];
|
||||
const featureFlag = SettingsStore.isFeatureEnabled("feature_bridge_state");
|
||||
const shouldShowBridgeIcon = featureFlag &&
|
||||
BridgeSettingsTab.getBridgeStateEvents(this.props.roomId).length > 0;
|
||||
|
||||
tabs.push(new Tab(
|
||||
_td("General"),
|
||||
|
@ -79,9 +76,9 @@ export default class RoomSettingsDialog extends React.Component {
|
|||
<NotificationSettingsTab roomId={this.props.roomId} />,
|
||||
));
|
||||
|
||||
if (shouldShowBridgeIcon) {
|
||||
if (SettingsStore.isFeatureEnabled("feature_bridge_state")) {
|
||||
tabs.push(new Tab(
|
||||
_td("Bridge Info"),
|
||||
_td("Bridges"),
|
||||
"mx_RoomSettingsDialog_bridgesIcon",
|
||||
<BridgeSettingsTab roomId={this.props.roomId} />,
|
||||
));
|
||||
|
|
|
@ -83,7 +83,7 @@ export default createReactClass({
|
|||
// primary in the DOM so will get form submissions unless we make it not a submit.
|
||||
type="button"
|
||||
onClick={this._onCancelClick}
|
||||
className={this.props.cancelButtonClass}
|
||||
className={this.props.cancelButtonClass}
|
||||
disabled={this.props.disabled}
|
||||
>
|
||||
{ this.props.cancelButton || _t("Cancel") }
|
||||
|
|
|
@ -166,7 +166,7 @@ export default createReactClass({
|
|||
});
|
||||
|
||||
/* Check all verified user devices. */
|
||||
for (const userId of verified) {
|
||||
for (const userId of [...verified, cli.getUserId()]) {
|
||||
const devices = await cli.getStoredDevicesForUser(userId);
|
||||
const allDevicesVerified = devices.every(({deviceId}) => {
|
||||
return cli.checkDeviceTrust(userId, deviceId).isVerified();
|
||||
|
|
114
src/components/views/settings/BridgeTile.js
Normal file
114
src/components/views/settings/BridgeTile.js
Normal file
|
@ -0,0 +1,114 @@
|
|||
/*
|
||||
Copyright 2020 The Matrix.org Foundation C.I.C.
|
||||
|
||||
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 {getHttpUriForMxc} from "matrix-js-sdk/src/content-repo";
|
||||
import {_t} from "../../../languageHandler";
|
||||
import {MatrixClientPeg} from "../../../MatrixClientPeg";
|
||||
import Pill from "../elements/Pill";
|
||||
import {makeUserPermalink} from "../../../utils/permalinks/Permalinks";
|
||||
import BaseAvatar from "../avatars/BaseAvatar";
|
||||
import AccessibleButton from "../elements/AccessibleButton";
|
||||
import {replaceableComponent} from "../../../utils/replaceableComponent";
|
||||
|
||||
@replaceableComponent("views.settings.BridgeTile")
|
||||
export default class BridgeTile extends React.PureComponent {
|
||||
static propTypes = {
|
||||
ev: PropTypes.object.isRequired,
|
||||
room: PropTypes.object.isRequired,
|
||||
}
|
||||
|
||||
state = {
|
||||
visible: false,
|
||||
}
|
||||
|
||||
_toggleVisible() {
|
||||
this.setState({
|
||||
visible: !this.state.visible,
|
||||
});
|
||||
}
|
||||
|
||||
render() {
|
||||
const content = this.props.ev.getContent();
|
||||
const { channel, network, protocol } = content;
|
||||
const protocolName = protocol.displayname || protocol.id;
|
||||
const channelName = channel.displayname || channel.id;
|
||||
const networkName = network ? network.displayname || network.id : protocolName;
|
||||
|
||||
let creator = null;
|
||||
if (content.creator) {
|
||||
creator = _t("This bridge was provisioned by <user />.", {}, {
|
||||
user: <Pill
|
||||
type={Pill.TYPE_USER_MENTION}
|
||||
room={this.props.room}
|
||||
url={makeUserPermalink(content.creator)}
|
||||
shouldShowPillAvatar={true}
|
||||
/>,
|
||||
});
|
||||
}
|
||||
|
||||
const bot = _t("This bridge is managed by <user />.", {}, {
|
||||
user: <Pill
|
||||
type={Pill.TYPE_USER_MENTION}
|
||||
room={this.props.room}
|
||||
url={makeUserPermalink(this.props.ev.getSender())}
|
||||
shouldShowPillAvatar={true}
|
||||
/>,
|
||||
});
|
||||
|
||||
let networkIcon;
|
||||
|
||||
if (protocol.avatar) {
|
||||
const avatarUrl = getHttpUriForMxc(
|
||||
MatrixClientPeg.get().getHomeserverUrl(),
|
||||
protocol.avatar, 64, 64, "crop",
|
||||
);
|
||||
|
||||
networkIcon = <BaseAvatar className="protocol-icon"
|
||||
width={48}
|
||||
height={48}
|
||||
resizeMethod='crop'
|
||||
name={ protocolName }
|
||||
idName={ protocolName }
|
||||
url={ avatarUrl }
|
||||
/>;
|
||||
} else {
|
||||
networkIcon = <div class="noProtocolIcon"></div>;
|
||||
}
|
||||
|
||||
const id = this.props.ev.getId();
|
||||
const metadataClassname = "metadata" + (this.state.visible ? " visible" : "");
|
||||
return (<li key={id}>
|
||||
<div className="column-icon">
|
||||
{networkIcon}
|
||||
</div>
|
||||
<div className="column-data">
|
||||
<h3>{protocolName}</h3>
|
||||
<p className="workspace-channel-details">
|
||||
<span>{_t("Workspace: %(networkName)s", {networkName})}</span>
|
||||
<span className="channel">{_t("Channel: %(channelName)s", {channelName})}</span>
|
||||
</p>
|
||||
<p className={metadataClassname}>
|
||||
{creator} {bot}
|
||||
</p>
|
||||
<AccessibleButton className="mx_showMore" kind="secondary" onClick={this._toggleVisible.bind(this)}>
|
||||
{ this.state.visible ? _t("Show less") : _t("Show more") }
|
||||
</AccessibleButton>
|
||||
</div>
|
||||
</li>);
|
||||
}
|
||||
}
|
|
@ -18,16 +18,15 @@ import React from 'react';
|
|||
import PropTypes from 'prop-types';
|
||||
import {_t} from "../../../../../languageHandler";
|
||||
import {MatrixClientPeg} from "../../../../../MatrixClientPeg";
|
||||
import Pill from "../../../elements/Pill";
|
||||
import {makeUserPermalink} from "../../../../../utils/permalinks/Permalinks";
|
||||
import BaseAvatar from "../../../avatars/BaseAvatar";
|
||||
import {getHttpUriForMxc} from "matrix-js-sdk/src/content-repo";
|
||||
import BridgeTile from "../../BridgeTile";
|
||||
|
||||
const BRIDGE_EVENT_TYPES = [
|
||||
"uk.half-shot.bridge",
|
||||
// m.bridge
|
||||
];
|
||||
|
||||
const BRIDGES_LINK = "https://matrix.org/bridges/";
|
||||
|
||||
export default class BridgeSettingsTab extends React.Component {
|
||||
static propTypes = {
|
||||
roomId: PropTypes.string.isRequired,
|
||||
|
@ -38,99 +37,7 @@ export default class BridgeSettingsTab extends React.Component {
|
|||
if (!content || !content.channel || !content.protocol) {
|
||||
return null;
|
||||
}
|
||||
const { channel, network } = content;
|
||||
const protocolName = content.protocol.displayname || content.protocol.id;
|
||||
const channelName = channel.displayname || channel.id;
|
||||
const networkName = network ? network.displayname || network.id : protocolName;
|
||||
|
||||
let creator = null;
|
||||
if (content.creator) {
|
||||
creator = <p> { _t("This bridge was provisioned by <user />", {}, {
|
||||
user: <Pill
|
||||
type={Pill.TYPE_USER_MENTION}
|
||||
room={room}
|
||||
url={makeUserPermalink(content.creator)}
|
||||
shouldShowPillAvatar={true}
|
||||
/>,
|
||||
})}</p>;
|
||||
}
|
||||
|
||||
const bot = (<p> {_t("This bridge is managed by <user />.", {}, {
|
||||
user: <Pill
|
||||
type={Pill.TYPE_USER_MENTION}
|
||||
room={room}
|
||||
url={makeUserPermalink(event.getSender())}
|
||||
shouldShowPillAvatar={true}
|
||||
/>,
|
||||
})} </p>);
|
||||
let channelLink = channelName;
|
||||
if (channel.external_url) {
|
||||
channelLink = <a target="_blank" href={channel.external_url} rel="noopener">{channelName}</a>;
|
||||
}
|
||||
|
||||
let networkLink = networkName;
|
||||
if (network && network.external_url) {
|
||||
networkLink = <a target="_blank" href={network.external_url} rel="noopener">{networkName}</a>;
|
||||
}
|
||||
|
||||
const chanAndNetworkInfo = (
|
||||
_t("Bridged into <channelLink /> <networkLink />, on <protocolName />", {}, {
|
||||
channelLink,
|
||||
networkLink,
|
||||
protocolName,
|
||||
})
|
||||
);
|
||||
|
||||
let networkIcon = null;
|
||||
if (networkName && network.avatar) {
|
||||
const avatarUrl = getHttpUriForMxc(
|
||||
MatrixClientPeg.get().getHomeserverUrl(),
|
||||
network.avatar, 32, 32, "crop",
|
||||
);
|
||||
networkIcon = <BaseAvatar
|
||||
width={32}
|
||||
height={32}
|
||||
resizeMethod='crop'
|
||||
name={ networkName }
|
||||
idName={ networkName }
|
||||
url={ avatarUrl }
|
||||
/>;
|
||||
}
|
||||
|
||||
let channelIcon = null;
|
||||
if (channel.avatar) {
|
||||
const avatarUrl = getHttpUriForMxc(
|
||||
MatrixClientPeg.get().getHomeserverUrl(),
|
||||
channel.avatar, 32, 32, "crop",
|
||||
);
|
||||
channelIcon = <BaseAvatar
|
||||
width={32}
|
||||
height={32}
|
||||
resizeMethod='crop'
|
||||
name={ networkName }
|
||||
idName={ networkName }
|
||||
url={ avatarUrl }
|
||||
/>;
|
||||
}
|
||||
|
||||
const heading = _t("Connected to <channelIcon /> <channelName /> on <networkIcon /> <networkName />", { }, {
|
||||
channelIcon,
|
||||
channelName,
|
||||
networkName,
|
||||
networkIcon,
|
||||
});
|
||||
|
||||
return (<li key={event.stateKey}>
|
||||
<div>
|
||||
<h3>{heading}</h3>
|
||||
<p>{_t("Connected via %(protocolName)s", { protocolName })}</p>
|
||||
<details>
|
||||
{creator}
|
||||
{bot}
|
||||
<p>{chanAndNetworkInfo}</p>
|
||||
</details>
|
||||
</div>
|
||||
</li>);
|
||||
return <BridgeTile room={room} ev={event}></BridgeTile>;
|
||||
}
|
||||
|
||||
static getBridgeStateEvents(roomId) {
|
||||
|
@ -151,14 +58,40 @@ export default class BridgeSettingsTab extends React.Component {
|
|||
const client = MatrixClientPeg.get();
|
||||
const room = client.getRoom(this.props.roomId);
|
||||
|
||||
let content = null;
|
||||
|
||||
if (bridgeEvents.length > 0) {
|
||||
content = <div>
|
||||
<p>{_t(
|
||||
"This room is bridging messages to the following platforms. " +
|
||||
"<a>Learn more.</a>", {},
|
||||
{
|
||||
// TODO: We don't have this link yet: this will prevent the translators
|
||||
// having to re-translate the string when we do.
|
||||
a: sub => <a href={BRIDGES_LINK} target="_blank" rel="noopener">{sub}</a>,
|
||||
},
|
||||
)}</p>
|
||||
<ul className="mx_RoomSettingsDialog_BridgeList">
|
||||
{ bridgeEvents.map((event) => this._renderBridgeCard(event, room)) }
|
||||
</ul>
|
||||
</div>;
|
||||
} else {
|
||||
content = <p>{_t(
|
||||
"This room isn’t bridging messages to any platforms. " +
|
||||
"<a>Learn more.</a>", {},
|
||||
{
|
||||
// TODO: We don't have this link yet: this will prevent the translators
|
||||
// having to re-translate the string when we do.
|
||||
a: sub => <a href={BRIDGES_LINK} target="_blank" rel="noopener">{sub}</a>,
|
||||
},
|
||||
)}</p>;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="mx_SettingsTab">
|
||||
<div className="mx_SettingsTab_heading">{_t("Bridge Info")}</div>
|
||||
<div className="mx_SettingsTab_heading">{_t("Bridges")}</div>
|
||||
<div className='mx_SettingsTab_section mx_SettingsTab_subsectionText'>
|
||||
<p>{ _t("Below is a list of bridges connected to this room.") }</p>
|
||||
<ul className="mx_RoomSettingsDialog_BridgeList">
|
||||
{ bridgeEvents.map((event) => this._renderBridgeCard(event, room)) }
|
||||
</ul>
|
||||
{content}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
|
|
@ -16,12 +16,15 @@ limitations under the License.
|
|||
|
||||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import * as sdk from "../../../index";
|
||||
import { _t } from '../../../languageHandler';
|
||||
import Modal from "../../../Modal";
|
||||
import { MatrixClientPeg } from '../../../MatrixClientPeg';
|
||||
import DeviceListener from '../../../DeviceListener';
|
||||
import NewSessionReviewDialog from '../dialogs/NewSessionReviewDialog';
|
||||
import FormButton from '../elements/FormButton';
|
||||
import { replaceableComponent } from '../../../utils/replaceableComponent';
|
||||
|
||||
@replaceableComponent("views.toasts.VerifySessionToast")
|
||||
export default class VerifySessionToast extends React.PureComponent {
|
||||
static propTypes = {
|
||||
toastKey: PropTypes.string.isRequired,
|
||||
|
@ -34,18 +37,16 @@ export default class VerifySessionToast extends React.PureComponent {
|
|||
|
||||
_onReviewClick = async () => {
|
||||
const cli = MatrixClientPeg.get();
|
||||
const DeviceVerifyDialog = sdk.getComponent('views.dialogs.DeviceVerifyDialog');
|
||||
|
||||
const device = await cli.getStoredDevice(cli.getUserId(), this.props.deviceId);
|
||||
|
||||
Modal.createTrackedDialog('New Session Verify', 'Starting dialog', DeviceVerifyDialog, {
|
||||
Modal.createTrackedDialog('New Session Review', 'Starting dialog', NewSessionReviewDialog, {
|
||||
userId: MatrixClientPeg.get().getUserId(),
|
||||
device,
|
||||
}, null, /* priority = */ false, /* static = */ true);
|
||||
};
|
||||
|
||||
render() {
|
||||
const FormButton = sdk.getComponent("elements.FormButton");
|
||||
return (<div>
|
||||
<div className="mx_Toast_description">{_t("Review & verify your new session")}</div>
|
||||
<div className="mx_Toast_buttons" aria-live="off">
|
||||
|
|
|
@ -524,6 +524,12 @@
|
|||
"Accept <policyLink /> to continue:": "Accept <policyLink /> to continue:",
|
||||
"Upload": "Upload",
|
||||
"Remove": "Remove",
|
||||
"This bridge was provisioned by <user />.": "This bridge was provisioned by <user />.",
|
||||
"This bridge is managed by <user />.": "This bridge is managed by <user />.",
|
||||
"Workspace: %(networkName)s": "Workspace: %(networkName)s",
|
||||
"Channel: %(channelName)s": "Channel: %(channelName)s",
|
||||
"Show less": "Show less",
|
||||
"Show more": "Show more",
|
||||
"Failed to upload profile picture!": "Failed to upload profile picture!",
|
||||
"Upload new:": "Upload new:",
|
||||
"No display name": "No display name",
|
||||
|
@ -792,13 +798,9 @@
|
|||
"Room version:": "Room version:",
|
||||
"Developer options": "Developer options",
|
||||
"Open Devtools": "Open Devtools",
|
||||
"This bridge was provisioned by <user />": "This bridge was provisioned by <user />",
|
||||
"This bridge is managed by <user />.": "This bridge is managed by <user />.",
|
||||
"Bridged into <channelLink /> <networkLink />, on <protocolName />": "Bridged into <channelLink /> <networkLink />, on <protocolName />",
|
||||
"Connected to <channelIcon /> <channelName /> on <networkIcon /> <networkName />": "Connected to <channelIcon /> <channelName /> on <networkIcon /> <networkName />",
|
||||
"Connected via %(protocolName)s": "Connected via %(protocolName)s",
|
||||
"Bridge Info": "Bridge Info",
|
||||
"Below is a list of bridges connected to this room.": "Below is a list of bridges connected to this room.",
|
||||
"This room is bridging messages to the following platforms. <a>Learn more.</a>": "This room is bridging messages to the following platforms. <a>Learn more.</a>",
|
||||
"This room isn’t bridging messages to any platforms. <a>Learn more.</a>": "This room isn’t bridging messages to any platforms. <a>Learn more.</a>",
|
||||
"Bridges": "Bridges",
|
||||
"Room Addresses": "Room Addresses",
|
||||
"Publish this room to the public in %(domain)s's room directory?": "Publish this room to the public in %(domain)s's room directory?",
|
||||
"URL Previews": "URL Previews",
|
||||
|
@ -1485,7 +1487,6 @@
|
|||
"Recent Conversations": "Recent Conversations",
|
||||
"Suggestions": "Suggestions",
|
||||
"Recently Direct Messaged": "Recently Direct Messaged",
|
||||
"Show more": "Show more",
|
||||
"If you can't find someone, ask them for their username, share your username (%(userId)s) or <a>profile link</a>.": "If you can't find someone, ask them for their username, share your username (%(userId)s) or <a>profile link</a>.",
|
||||
"Go": "Go",
|
||||
"If you can't find someone, ask them for their username (e.g. @user:server.com) or <a>share this room</a>.": "If you can't find someone, ask them for their username (e.g. @user:server.com) or <a>share this room</a>.",
|
||||
|
@ -1508,6 +1509,10 @@
|
|||
"Are you sure you want to sign out?": "Are you sure you want to sign out?",
|
||||
"Your homeserver doesn't seem to support this feature.": "Your homeserver doesn't seem to support this feature.",
|
||||
"Message edits": "Message edits",
|
||||
"New session": "New session",
|
||||
"Use this session to verify your new one, granting it access to encrypted messages:": "Use this session to verify your new one, granting it access to encrypted messages:",
|
||||
"If you didn’t sign in to this session, your account may be compromised.": "If you didn’t sign in to this session, your account may be compromised.",
|
||||
"This wasn't me": "This wasn't me",
|
||||
"If you run into any bugs or have feedback you'd like to share, please let us know on GitHub.": "If you run into any bugs or have feedback you'd like to share, please let us know on GitHub.",
|
||||
"To help avoid duplicate issues, please <existingIssuesLink>view existing issues</existingIssuesLink> first (and add a +1) or <newIssueLink>create a new issue</newIssueLink> if you can't find it.": "To help avoid duplicate issues, please <existingIssuesLink>view existing issues</existingIssuesLink> first (and add a +1) or <newIssueLink>create a new issue</newIssueLink> if you can't find it.",
|
||||
"Report bugs & give feedback": "Report bugs & give feedback",
|
||||
|
|
Loading…
Reference in a new issue