Merge branch 'develop' of github.com:element-hq/matrix-react-sdk into t3chguy/wat/230.1
# Conflicts: # src/components/views/settings/CryptographyPanel.tsx # test/components/views/settings/tabs/user/__snapshots__/SecurityUserSettingsTab-test.tsx.snap
This commit is contained in:
commit
dd7479accb
6 changed files with 130 additions and 48 deletions
|
@ -7,6 +7,7 @@ Please see LICENSE files in the repository root for full details.
|
|||
*/
|
||||
|
||||
import React from "react";
|
||||
import { logger } from "matrix-js-sdk/src/logger";
|
||||
|
||||
import type ExportE2eKeysDialog from "../../../async-components/views/dialogs/security/ExportE2eKeysDialog";
|
||||
import type ImportE2eKeysDialog from "../../../async-components/views/dialogs/security/ImportE2eKeysDialog";
|
||||
|
@ -22,25 +23,53 @@ import SettingsSubsection, { SettingsSubsectionText } from "./shared/SettingsSub
|
|||
|
||||
interface IProps {}
|
||||
|
||||
interface IState {}
|
||||
interface IState {
|
||||
/** The device's base64-encoded Ed25519 identity key, or:
|
||||
*
|
||||
* * `undefined`: not yet loaded
|
||||
* * `null`: encryption is not supported (or the crypto stack was not correctly initialized)
|
||||
*/
|
||||
deviceIdentityKey: string | undefined | null;
|
||||
}
|
||||
|
||||
export default class CryptographyPanel extends React.Component<IProps, IState> {
|
||||
public constructor(props: IProps) {
|
||||
super(props);
|
||||
|
||||
const client = MatrixClientPeg.safeGet();
|
||||
const crypto = client.getCrypto();
|
||||
if (!crypto) {
|
||||
this.state = { deviceIdentityKey: null };
|
||||
} else {
|
||||
this.state = { deviceIdentityKey: undefined };
|
||||
crypto
|
||||
.getOwnDeviceKeys()
|
||||
.then((keys) => {
|
||||
this.setState({ deviceIdentityKey: keys.ed25519 });
|
||||
})
|
||||
.catch((e) => {
|
||||
logger.error(`CryptographyPanel: Error fetching own device keys: ${e}`);
|
||||
this.setState({ deviceIdentityKey: null });
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
public render(): React.ReactNode {
|
||||
const client = MatrixClientPeg.safeGet();
|
||||
const deviceId = client.deviceId;
|
||||
let identityKey = client.getDeviceEd25519Key();
|
||||
if (!identityKey) {
|
||||
let identityKey = this.state.deviceIdentityKey;
|
||||
if (identityKey === undefined) {
|
||||
// Should show a spinner here really, but since this will be very transitional, I can't be doing with the
|
||||
// necessary styling.
|
||||
identityKey = "...";
|
||||
} else if (identityKey === null) {
|
||||
identityKey = _t("encryption|not_supported");
|
||||
} else {
|
||||
identityKey = FormattingUtils.formatCryptoKey(identityKey);
|
||||
}
|
||||
|
||||
let importExportButtons: JSX.Element | undefined;
|
||||
if (client.isCryptoEnabled()) {
|
||||
if (client.getCrypto()) {
|
||||
importExportButtons = (
|
||||
<div className="mx_CryptographyPanel_importExportButtons">
|
||||
<AccessibleButton kind="primary_outline" onClick={this.onExportE2eKeysClicked}>
|
||||
|
@ -68,20 +97,22 @@ export default class CryptographyPanel extends React.Component<IProps, IState> {
|
|||
<SettingsSubsection heading={_t("settings|security|cryptography_section")}>
|
||||
<SettingsSubsectionText>
|
||||
<table className="mx_CryptographyPanel_sessionInfo">
|
||||
<tr>
|
||||
<th scope="row">{_t("settings|security|session_id")}</th>
|
||||
<td>
|
||||
<code>{deviceId}</code>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">{_t("settings|security|session_key")}</th>
|
||||
<td>
|
||||
<code>
|
||||
<strong>{identityKey}</strong>
|
||||
</code>
|
||||
</td>
|
||||
</tr>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">{_t("settings|security|session_id")}</th>
|
||||
<td>
|
||||
<code>{deviceId}</code>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">{_t("settings|security|session_key")}</th>
|
||||
<td>
|
||||
<code>
|
||||
<strong>{identityKey}</strong>
|
||||
</code>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</SettingsSubsectionText>
|
||||
{importExportButtons}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue