Merge pull request #4506 from matrix-org/dbkr/aggregate_device_verify_toasts

Aggregate device verify toasts
This commit is contained in:
David Baker 2020-04-28 11:00:52 +01:00 committed by GitHub
commit 60d51a0f1e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 110 additions and 98 deletions

View file

@ -181,9 +181,7 @@ function DeviceItem({userId, device}) {
});
const onDeviceClick = () => {
if (!isVerified) {
verifyDevice(cli.getUser(userId), device);
}
verifyDevice(cli.getUser(userId), device);
};
const deviceName = device.ambiguous ?
@ -191,17 +189,29 @@ function DeviceItem({userId, device}) {
device.getDisplayName();
let trustedLabel = null;
if (userTrust.isVerified()) trustedLabel = isVerified ? _t("Trusted") : _t("Not trusted");
return (
<AccessibleButton
className={classes}
title={device.deviceId}
onClick={onDeviceClick}
>
<div className={iconClasses} />
<div className="mx_UserInfo_device_name">{deviceName}</div>
<div className="mx_UserInfo_device_trusted">{trustedLabel}</div>
</AccessibleButton>
);
if (isVerified) {
return (
<div className={classes} title={device.deviceId} >
<div className={iconClasses} />
<div className="mx_UserInfo_device_name">{deviceName}</div>
<div className="mx_UserInfo_device_trusted">{trustedLabel}</div>
</div>
);
} else {
return (
<AccessibleButton
className={classes}
title={device.deviceId}
onClick={onDeviceClick}
>
<div className={iconClasses} />
<div className="mx_UserInfo_device_name">{deviceName}</div>
<div className="mx_UserInfo_device_trusted">{trustedLabel}</div>
</AccessibleButton>
);
}
}
function DevicesSection({devices, userId, loading}) {

View file

@ -15,52 +15,32 @@ limitations under the License.
*/
import React from 'react';
import PropTypes from 'prop-types';
import { _t } from '../../../languageHandler';
import Modal from "../../../Modal";
import dis from "../../../dispatcher";
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.UnverifiedSessionToast")
export default class UnverifiedSessionToast extends React.PureComponent {
static propTypes = {
toastKey: PropTypes.string.isRequired,
device: PropTypes.object.isRequired,
};
_onLaterClick = () => {
const { device } = this.props;
DeviceListener.sharedInstance().dismissVerification(device.deviceId);
DeviceListener.sharedInstance().dismissVerifications();
};
_onReviewClick = async () => {
const { device } = this.props;
DeviceListener.sharedInstance().dismissVerifications();
Modal.createTrackedDialog('New Session Review', 'Starting dialog', NewSessionReviewDialog, {
dis.dispatch({
action: 'view_user_info',
userId: MatrixClientPeg.get().getUserId(),
device,
onFinished: (r) => {
if (!r) {
/* This'll come back false if the user clicks "this wasn't me" and saw a warning dialog */
this._onLaterClick();
}
},
}, null, /* priority = */ false, /* static = */ true);
});
};
render() {
const { device } = this.props;
return (<div>
<div className="mx_Toast_description">
<span className="mx_Toast_deviceName">
{device.getDisplayName()}
</span> <span className="mx_Toast_deviceID">
({device.deviceId})
</span>
{_t("Verify your other sessions")}
</div>
<div className="mx_Toast_buttons" aria-live="off">
<FormButton label={_t("Later")} kind="danger" onClick={this._onLaterClick} />