diff --git a/res/css/_components.scss b/res/css/_components.scss index d8e5247f9d..c8985cbb51 100644 --- a/res/css/_components.scss +++ b/res/css/_components.scss @@ -98,6 +98,7 @@ @import "./views/dialogs/_SpaceSettingsDialog.scss"; @import "./views/dialogs/_TabbedIntegrationManagerDialog.scss"; @import "./views/dialogs/_TermsDialog.scss"; +@import "./views/dialogs/_UntrustedDeviceDialog.scss"; @import "./views/dialogs/_UploadConfirmDialog.scss"; @import "./views/dialogs/_UserSettingsDialog.scss"; @import "./views/dialogs/_WidgetCapabilitiesPromptDialog.scss"; diff --git a/res/css/views/dialogs/_UntrustedDeviceDialog.scss b/res/css/views/dialogs/_UntrustedDeviceDialog.scss new file mode 100644 index 0000000000..0ecd9d4f71 --- /dev/null +++ b/res/css/views/dialogs/_UntrustedDeviceDialog.scss @@ -0,0 +1,26 @@ +/* +Copyright 2021 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_UntrustedDeviceDialog { + .mx_Dialog_title { + display: flex; + align-items: center; + + .mx_E2EIcon { + margin-left: 0; + } + } +} diff --git a/src/components/views/dialogs/UntrustedDeviceDialog.js b/src/components/views/dialogs/UntrustedDeviceDialog.js new file mode 100644 index 0000000000..11cbef39a1 --- /dev/null +++ b/src/components/views/dialogs/UntrustedDeviceDialog.js @@ -0,0 +1,61 @@ +/* +Copyright 2019, 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 { _t } from '../../../languageHandler'; +import * as sdk from '../../../index'; +import {MatrixClientPeg} from '../../../MatrixClientPeg'; +import E2EIcon from "../rooms/E2EIcon"; + +function UntrustedDeviceDialog(props) { + const {device, user, onFinished} = props; + const BaseDialog = sdk.getComponent("dialogs.BaseDialog"); + const AccessibleButton = sdk.getComponent("elements.AccessibleButton"); + let askToVerifyText; + let newSessionText; + + if (MatrixClientPeg.get().getUserId() === user.userId) { + newSessionText = _t("You signed in to a new session without verifying it:"); + askToVerifyText = _t("Verify your other session using one of the options below."); + } else { + newSessionText = _t("%(name)s (%(userId)s) signed in to a new session without verifying it:", + {name: user.displayName, userId: user.userId}); + askToVerifyText = _t("Ask this user to verify their session, or manually verify it below."); + } + + return + + { _t("Not Trusted")} + } + > +
+

{newSessionText}

+

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

+

{askToVerifyText}

+
+
+ onFinished("legacy")}>{_t("Manually Verify by Text")} + onFinished("sas")}>{_t("Interactively verify by Emoji")} + onFinished()}>{_t("Done")} +
+
; +} + +export default UntrustedDeviceDialog; diff --git a/src/verification.js b/src/verification.js index 74e3897d3a..69577384a1 100644 --- a/src/verification.js +++ b/src/verification.js @@ -18,12 +18,12 @@ import {MatrixClientPeg} from './MatrixClientPeg'; import dis from "./dispatcher/dispatcher"; import Modal from './Modal'; import * as sdk from './index'; -import { _t } from './languageHandler'; import {RightPanelPhases} from "./stores/RightPanelStorePhases"; import {findDMForUser} from './createRoom'; import {accessSecretStorage} from './SecurityManager'; import {verificationMethods} from 'matrix-js-sdk/src/crypto'; import {Action} from './dispatcher/actions'; +import UntrustedDeviceDialog from "./components/views/dialogs/UntrustedDeviceDialog"; async function enable4SIfNeeded() { const cli = MatrixClientPeg.get(); @@ -39,39 +39,6 @@ async function enable4SIfNeeded() { return true; } -function UntrustedDeviceDialog(props) { - const {device, user, onFinished} = props; - const BaseDialog = sdk.getComponent("dialogs.BaseDialog"); - const AccessibleButton = sdk.getComponent("elements.AccessibleButton"); - let askToVerifyText; - let newSessionText; - - if (MatrixClientPeg.get().getUserId() === user.userId) { - newSessionText = _t("You signed in to a new session without verifying it:"); - askToVerifyText = _t("Verify your other session using one of the options below."); - } else { - newSessionText = _t("%(name)s (%(userId)s) signed in to a new session without verifying it:", - {name: user.displayName, userId: user.userId}); - askToVerifyText = _t("Ask this user to verify their session, or manually verify it below."); - } - - return -
-

{newSessionText}

-

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

-

{askToVerifyText}

-
-
- onFinished("legacy")}>{_t("Manually Verify by Text")} - onFinished("sas")}>{_t("Interactively verify by Emoji")} - onFinished()}>{_t("Done")} -
-
; -} - export async function verifyDevice(user, device) { const cli = MatrixClientPeg.get(); if (cli.isGuest()) {