diff --git a/babel.config.js b/babel.config.js index c83be72518..d5a97d56ce 100644 --- a/babel.config.js +++ b/babel.config.js @@ -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", diff --git a/package.json b/package.json index f0b7e04c73..78bbb5b4c6 100644 --- a/package.json +++ b/package.json @@ -80,7 +80,7 @@ "is-ip": "^2.0.0", "linkifyjs": "^2.1.6", "lodash": "^4.17.14", - "matrix-js-sdk": "4.0.0", + "matrix-js-sdk": "github:matrix-org/matrix-js-sdk#develop", "pako": "^1.0.5", "png-chunks-extract": "^1.0.0", "prop-types": "^15.5.8", diff --git a/res/css/_common.scss b/res/css/_common.scss index b92a618504..e062e0bd73 100644 --- a/res/css/_common.scss +++ b/res/css/_common.scss @@ -428,6 +428,11 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus { color: $accent-fg-color; } +.mx_Dialog button.warning, .mx_Dialog input[type="submit"].warning { + border: solid 1px $warning-color; + color: $warning-color; +} + .mx_Dialog button:disabled, .mx_Dialog input[type="submit"]:disabled, .mx_Dialog_buttons button:disabled, .mx_Dialog_buttons input[type="submit"]:disabled { background-color: $light-fg-color; border: solid 1px $light-fg-color; diff --git a/res/css/_components.scss b/res/css/_components.scss index 30b26d205f..22c9b73dca 100644 --- a/res/css/_components.scss +++ b/res/css/_components.scss @@ -36,6 +36,7 @@ @import "./views/auth/_AuthHeader.scss"; @import "./views/auth/_AuthHeaderLogo.scss"; @import "./views/auth/_AuthPage.scss"; +@import "./views/auth/_CompleteSecurityBody.scss"; @import "./views/auth/_CountryDropdown.scss"; @import "./views/auth/_InteractiveAuthEntryComponents.scss"; @import "./views/auth/_LanguageSelector.scss"; @@ -65,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"; @@ -150,10 +153,10 @@ @import "./views/rooms/_AuxPanel.scss"; @import "./views/rooms/_BasicMessageComposer.scss"; @import "./views/rooms/_E2EIcon.scss"; -@import "./views/rooms/_InviteOnlyIcon.scss"; @import "./views/rooms/_EditMessageComposer.scss"; @import "./views/rooms/_EntityTile.scss"; @import "./views/rooms/_EventTile.scss"; +@import "./views/rooms/_InviteOnlyIcon.scss"; @import "./views/rooms/_JumpToBottomButton.scss"; @import "./views/rooms/_LinkPreviewWidget.scss"; @import "./views/rooms/_MemberDeviceInfo.scss"; diff --git a/res/css/structures/auth/_CompleteSecurity.scss b/res/css/structures/auth/_CompleteSecurity.scss index c258ce4ec7..2bf51d9574 100644 --- a/res/css/structures/auth/_CompleteSecurity.scss +++ b/res/css/structures/auth/_CompleteSecurity.scss @@ -22,7 +22,7 @@ limitations under the License. .mx_CompleteSecurity_headerIcon { width: 24px; height: 24px; - margin: 0 4px; + margin-right: 4px; position: relative; } diff --git a/res/css/views/auth/_AuthBody.scss b/res/css/views/auth/_AuthBody.scss index 51b9775811..7c5b008535 100644 --- a/res/css/views/auth/_AuthBody.scss +++ b/res/css/views/auth/_AuthBody.scss @@ -1,5 +1,6 @@ /* Copyright 2019 New Vector Ltd +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. @@ -15,6 +16,9 @@ limitations under the License. */ .mx_AuthBody { + width: 500px; + font-size: 12px; + color: $authpage-secondary-color; background-color: $authpage-body-bg-color; border-radius: 0 4px 4px 0; padding: 25px 60px; @@ -92,16 +96,6 @@ limitations under the License. } } -.mx_AuthBody_noHeader { - border-radius: 4px; -} - -.mx_AuthBody_loginRegister { - width: 500px; - font-size: 12px; - color: $authpage-secondary-color; -} - .mx_AuthBody_editServerDetails { padding-left: 1em; font-size: 12px; diff --git a/res/css/views/auth/_CompleteSecurityBody.scss b/res/css/views/auth/_CompleteSecurityBody.scss new file mode 100644 index 0000000000..c7860fbe74 --- /dev/null +++ b/res/css/views/auth/_CompleteSecurityBody.scss @@ -0,0 +1,42 @@ +/* +Copyright 2019 New Vector Ltd +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_CompleteSecurityBody { + width: 600px; + color: $authpage-primary-color; + background-color: $authpage-body-bg-color; + border-radius: 4px; + padding: 20px; + box-sizing: border-box; + + h2 { + font-size: 24px; + font-weight: 600; + margin-top: 0; + } + + h3 { + font-size: 14px; + font-weight: 600; + } + + a:link, + a:hover, + a:visited { + @mixin mx_Dialog_link; + } +} diff --git a/res/css/views/dialogs/_NewSessionReviewDialog.scss b/res/css/views/dialogs/_NewSessionReviewDialog.scss new file mode 100644 index 0000000000..7e35fe941e --- /dev/null +++ b/res/css/views/dialogs/_NewSessionReviewDialog.scss @@ -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; +} diff --git a/res/css/views/dialogs/_RoomSettingsDialog.scss b/res/css/views/dialogs/_RoomSettingsDialog.scss index aa66e97f9e..2a4e62f9aa 100644 --- a/res/css/views/dialogs/_RoomSettingsDialog.scss +++ b/res/css/views/dialogs/_RoomSettingsDialog.scss @@ -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; -} - diff --git a/res/css/views/dialogs/_RoomSettingsDialogBridges.scss b/res/css/views/dialogs/_RoomSettingsDialogBridges.scss new file mode 100644 index 0000000000..a1793cc75e --- /dev/null +++ b/res/css/views/dialogs/_RoomSettingsDialogBridges.scss @@ -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; + } + } +} diff --git a/src/Skinner.js b/src/Skinner.js index 3baecc9fb3..87c5a7be7f 100644 --- a/src/Skinner.js +++ b/src/Skinner.js @@ -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) { diff --git a/src/async-components/views/dialogs/eventindex/DisableEventIndexDialog.js b/src/async-components/views/dialogs/eventindex/DisableEventIndexDialog.js new file mode 100644 index 0000000000..120b086ef6 --- /dev/null +++ b/src/async-components/views/dialogs/eventindex/DisableEventIndexDialog.js @@ -0,0 +1,73 @@ +/* +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 * as sdk from '../../../../index'; +import PropTypes from 'prop-types'; +import dis from "../../../../dispatcher"; +import { _t } from '../../../../languageHandler'; + +import SettingsStore, {SettingLevel} from "../../../../settings/SettingsStore"; +import EventIndexPeg from "../../../../indexing/EventIndexPeg"; + +/* + * Allows the user to disable the Event Index. + */ +export default class DisableEventIndexDialog extends React.Component { + static propTypes = { + onFinished: PropTypes.func.isRequired, + } + + constructor(props) { + super(props); + + this.state = { + disabling: false, + }; + } + + _onDisable = async () => { + this.setState({ + disabling: true, + }); + + await SettingsStore.setValue('enableEventIndexing', null, SettingLevel.DEVICE, false); + await EventIndexPeg.deleteEventIndex(); + this.props.onFinished(); + dis.dispatch({ action: 'view_user_settings' }); + } + + render() { + const BaseDialog = sdk.getComponent('views.dialogs.BaseDialog'); + const Spinner = sdk.getComponent('elements.Spinner'); + const DialogButtons = sdk.getComponent('views.elements.DialogButtons'); + + return ( + + {_t("If disabled, messages from encrypted rooms won't appear in search results.")} + {this.state.disabling ? :
} + + + ); + } +} diff --git a/src/async-components/views/dialogs/eventindex/ManageEventIndexDialog.js b/src/async-components/views/dialogs/eventindex/ManageEventIndexDialog.js new file mode 100644 index 0000000000..b7ea87b1b2 --- /dev/null +++ b/src/async-components/views/dialogs/eventindex/ManageEventIndexDialog.js @@ -0,0 +1,154 @@ +/* +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 * as sdk from '../../../../index'; +import PropTypes from 'prop-types'; +import { _t } from '../../../../languageHandler'; + +import Modal from '../../../../Modal'; +import {formatBytes, formatCountLong} from "../../../../utils/FormattingUtils"; +import EventIndexPeg from "../../../../indexing/EventIndexPeg"; + +/* + * Allows the user to introspect the event index state and disable it. + */ +export default class ManageEventIndexDialog extends React.Component { + static propTypes = { + onFinished: PropTypes.func.isRequired, + } + + constructor(props) { + super(props); + + this.state = { + eventIndexSize: 0, + eventCount: 0, + roomCount: 0, + currentRoom: null, + }; + } + + async updateCurrentRoom(room) { + const eventIndex = EventIndexPeg.get(); + const stats = await eventIndex.getStats(); + let currentRoom = null; + + if (room) currentRoom = room.name; + + this.setState({ + eventIndexSize: stats.size, + roomCount: stats.roomCount, + eventCount: stats.eventCount, + currentRoom: currentRoom, + }); + } + + componentWillUnmount(): void { + const eventIndex = EventIndexPeg.get(); + + if (eventIndex !== null) { + eventIndex.removeListener("changedCheckpoint", this.updateCurrentRoom.bind(this)); + } + } + + async componentWillMount(): void { + let eventIndexSize = 0; + let roomCount = 0; + let eventCount = 0; + let currentRoom = null; + + const eventIndex = EventIndexPeg.get(); + + if (eventIndex !== null) { + eventIndex.on("changedCheckpoint", this.updateCurrentRoom.bind(this)); + + const stats = await eventIndex.getStats(); + eventIndexSize = stats.size; + roomCount = stats.roomCount; + eventCount = stats.eventCount; + + const room = eventIndex.currentRoom(); + if (room) currentRoom = room.name; + } + + this.setState({ + eventIndexSize, + eventCount, + roomCount, + currentRoom, + }); + } + + _onDisable = async () => { + Modal.createTrackedDialogAsync("Disable message search", "Disable message search", + import("./DisableEventIndexDialog"), + null, null, /* priority = */ false, /* static = */ true, + ); + } + + _onDone = () => { + this.props.onFinished(true); + } + + render() { + let crawlerState; + + if (this.state.currentRoom === null) { + crawlerState = _t("Not currently downloading messages for any room."); + } else { + crawlerState = ( + _t("Downloading mesages for %(currentRoom)s.", { currentRoom: this.state.currentRoom }) + ); + } + + const eventIndexingSettings = ( +
+ { + _t( "Riot is securely caching encrypted messages locally for them " + + "to appear in search results:", + ) + } +
+ {_t("Space used:")} {formatBytes(this.state.eventIndexSize, 0)}
+ {_t("Indexed messages:")} {formatCountLong(this.state.eventCount)}
+ {_t("Number of rooms:")} {formatCountLong(this.state.roomCount)}
+ {crawlerState}
+
+
+ ); + + const BaseDialog = sdk.getComponent('views.dialogs.BaseDialog'); + const DialogButtons = sdk.getComponent('views.elements.DialogButtons'); + + return ( + + {eventIndexingSettings} + + + ); + } +} diff --git a/src/components/structures/MatrixChat.js b/src/components/structures/MatrixChat.js index 133d74db45..1b4d0e9609 100644 --- a/src/components/structures/MatrixChat.js +++ b/src/components/structures/MatrixChat.js @@ -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, diff --git a/src/components/structures/RoomView.js b/src/components/structures/RoomView.js index 60fff5f1e3..2d669f9243 100644 --- a/src/components/structures/RoomView.js +++ b/src/components/structures/RoomView.js @@ -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(); diff --git a/src/components/structures/auth/CompleteSecurity.js b/src/components/structures/auth/CompleteSecurity.js index 206cdb743e..29d8207d0a 100644 --- a/src/components/structures/auth/CompleteSecurity.js +++ b/src/components/structures/auth/CompleteSecurity.js @@ -112,7 +112,7 @@ export default class CompleteSecurity extends React.Component { render() { const AuthPage = sdk.getComponent("auth.AuthPage"); - const AuthBody = sdk.getComponent("auth.AuthBody"); + const CompleteSecurityBody = sdk.getComponent("auth.CompleteSecurityBody"); const AccessibleButton = sdk.getComponent("elements.AccessibleButton"); const { @@ -204,7 +204,7 @@ export default class CompleteSecurity extends React.Component { return ( - +

{icon} {title} @@ -212,7 +212,7 @@ export default class CompleteSecurity extends React.Component {
{body}
- + ); } diff --git a/src/components/structures/auth/E2eSetup.js b/src/components/structures/auth/E2eSetup.js index 29b4345761..9b390d24cc 100644 --- a/src/components/structures/auth/E2eSetup.js +++ b/src/components/structures/auth/E2eSetup.js @@ -34,16 +34,16 @@ export default class E2eSetup extends React.Component { render() { const AuthPage = sdk.getComponent("auth.AuthPage"); - const AuthBody = sdk.getComponent("auth.AuthBody"); + const CompleteSecurityBody = sdk.getComponent("auth.CompleteSecurityBody"); return ( - + - + ); } diff --git a/src/components/views/auth/AuthBody.js b/src/components/views/auth/AuthBody.js index b74b7d866a..9a078efb52 100644 --- a/src/components/views/auth/AuthBody.js +++ b/src/components/views/auth/AuthBody.js @@ -17,29 +17,10 @@ limitations under the License. 'use strict'; import React from 'react'; -import PropTypes from 'prop-types'; -import classnames from 'classnames'; export default class AuthBody extends React.PureComponent { - static PropTypes = { - header: PropTypes.bool, - }; - - static defaultProps = { - header: true, - }; - render() { - const classes = { - 'mx_AuthBody': true, - 'mx_AuthBody_noHeader': !this.props.header, - // XXX The login pages all use a smaller fonts size but we don't want this - // for subsequent auth screens like the e2e setup. Doing this a terrible way - // for now. - 'mx_AuthBody_loginRegister': this.props.header, - }; - - return
+ return
{ this.props.children }
; } diff --git a/src/components/views/auth/CaptchaForm.js b/src/components/views/auth/CaptchaForm.js index 2da837f029..efcc450067 100644 --- a/src/components/views/auth/CaptchaForm.js +++ b/src/components/views/auth/CaptchaForm.js @@ -62,7 +62,7 @@ export default createReactClass({ console.log("Loading recaptcha script..."); window.mx_on_recaptcha_loaded = () => {this._onCaptchaLoaded();}; let protocol = global.location.protocol; - if (protocol === "vector:") { + if (protocol !== "http:") { protocol = "https:"; } const scriptTag = document.createElement('script'); diff --git a/src/components/views/auth/CompleteSecurityBody.js b/src/components/views/auth/CompleteSecurityBody.js new file mode 100644 index 0000000000..d757de9fe0 --- /dev/null +++ b/src/components/views/auth/CompleteSecurityBody.js @@ -0,0 +1,27 @@ +/* +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. +*/ + +'use strict'; + +import React from 'react'; + +export default class CompleteSecurityBody extends React.PureComponent { + render() { + return
+ { this.props.children } +
; + } +} diff --git a/src/components/views/dialogs/NewSessionReviewDialog.js b/src/components/views/dialogs/NewSessionReviewDialog.js new file mode 100644 index 0000000000..2d2bcc8f35 --- /dev/null +++ b/src/components/views/dialogs/NewSessionReviewDialog.js @@ -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 = ; + const titleText = _t("New session"); + + const title =

+ {icon} + {titleText} +

; + + return ( + +
+

{_t( + "Use this session to verify your new one, " + + "granting it access to encrypted messages:", + )}

+
+
+ + {device.getDisplayName()} + + ({device.deviceId}) + +
+
+

{_t( + "If you didn’t sign in to this session, " + + "your account may be compromised.", + )}

+ +
+ + ); + } +} diff --git a/src/components/views/dialogs/RoomSettingsDialog.js b/src/components/views/dialogs/RoomSettingsDialog.js index a99141870b..76faf60eef 100644 --- a/src/components/views/dialogs/RoomSettingsDialog.js +++ b/src/components/views/dialogs/RoomSettingsDialog.js @@ -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 { , )); - if (shouldShowBridgeIcon) { + if (SettingsStore.isFeatureEnabled("feature_bridge_state")) { tabs.push(new Tab( - _td("Bridge Info"), + _td("Bridges"), "mx_RoomSettingsDialog_bridgesIcon", , )); diff --git a/src/components/views/elements/DialogButtons.js b/src/components/views/elements/DialogButtons.js index 7b37fdb4eb..9223b5ade8 100644 --- a/src/components/views/elements/DialogButtons.js +++ b/src/components/views/elements/DialogButtons.js @@ -43,6 +43,10 @@ export default createReactClass({ // should there be a cancel button? default: true hasCancel: PropTypes.bool, + // The class of the cancel button, only used if a cancel button is + // enabled + cancelButtonClass: PropTypes.node, + // onClick handler for the cancel button. onCancel: PropTypes.func, @@ -72,12 +76,14 @@ export default createReactClass({ primaryButtonClassName += " " + this.props.primaryButtonClass; } let cancelButton; + if (this.props.cancelButton || this.props.hasCancel) { cancelButton =