imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Replace uses of checkDeviceTrust with getDeviceVerificationStatus (#10663)

Browse source 
matrix-org/matrix-js-sdk#3287 and matrix-org/matrix-js-sdk#3303 added a new API called getDeviceVerificationStatus. Let's use it.
This commit is contained in:
Richard van der Hoff 2023-04-24 14:19:46 +01:00 • committed by GitHub
parent aa8c0f5cc7
commit d7bb8043ea
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
22 changed files with 286 additions and 161 deletions
Download patch file Download diff file Expand all files Collapse all files

46
src/components/views/settings/DevicesPanel.tsx
View file

@ -26,14 +26,15 @@ import Spinner from "../elements/Spinner";
import AccessibleButton from "../elements/AccessibleButton";
import { deleteDevicesWithInteractiveAuth } from "./devices/deleteDevices";
import MatrixClientContext from "../../../contexts/MatrixClientContext";
import { isDeviceVerified } from "../../../utils/device/isDeviceVerified";
import { fetchExtendedDeviceInformation } from "./devices/useOwnDevices";
import { DevicesDictionary, ExtendedDevice } from "./devices/types";
interface IProps {
className?: string;
}
interface IState {
devices: IMyDevice[];
devices?: DevicesDictionary;
deviceLoadError?: string;
selectedDevices: string[];
deleting?: boolean;
@ -47,7 +48,6 @@ export default class DevicesPanel extends React.Component<IProps, IState> {
public constructor(props: IProps) {
super(props);
this.state = {
devices: [],
selectedDevices: [],
};
this.loadDevices = this.loadDevices.bind(this);
@ -70,18 +70,16 @@ export default class DevicesPanel extends React.Component<IProps, IState> {
private loadDevices(): void {
const cli = this.context;
cli.getDevices().then(
(resp) => {
fetchExtendedDeviceInformation(cli).then(
(devices) => {
if (this.unmounted) {
return;
}
this.setState((state, props) => {
const deviceIds = resp.devices.map((device) => device.device_id);
const selectedDevices = state.selectedDevices.filter((deviceId) => deviceIds.includes(deviceId));
return {
devices: resp.devices || [],
selectedDevices,
devices: devices,
selectedDevices: state.selectedDevices.filter((deviceId) => devices.hasOwnProperty(deviceId)),
};
});
},
@ -119,10 +117,6 @@ export default class DevicesPanel extends React.Component<IProps, IState> {
return idA < idB ? -1 : idA > idB ? 1 : 0;
}
private isDeviceVerified(device: IMyDevice): boolean | null {
return isDeviceVerified(this.context, device.device_id);
}
private onDeviceSelectionToggled = (device: IMyDevice): void => {
if (this.unmounted) {
return;
@ -205,15 +199,15 @@ export default class DevicesPanel extends React.Component<IProps, IState> {
}
};
private renderDevice = (device: IMyDevice): JSX.Element => {
const myDeviceId = this.context.getDeviceId();
const myDevice = this.state.devices.find((device) => device.device_id === myDeviceId);
private renderDevice = (device: ExtendedDevice): JSX.Element => {
const myDeviceId = this.context.getDeviceId()!;
const myDevice = this.state.devices?.[myDeviceId];
const isOwnDevice = device.device_id === myDeviceId;
// If our own device is unverified, it can't verify other
// devices, it can only request verification for itself
const canBeVerified = (myDevice && this.isDeviceVerified(myDevice)) || isOwnDevice;
const canBeVerified = (myDevice && myDevice.isVerified) || isOwnDevice;
return (
<DevicesPanelEntry
@ -221,7 +215,7 @@ export default class DevicesPanel extends React.Component<IProps, IState> {
device={device}
selected={this.state.selectedDevices.includes(device.device_id)}
isOwnDevice={isOwnDevice}
verified={this.isDeviceVerified(device)}
verified={device.isVerified}
canBeVerified={canBeVerified}
onDeviceChange={this.loadDevices}
onDeviceToggled={this.onDeviceSelectionToggled}
@ -242,21 +236,21 @@ export default class DevicesPanel extends React.Component<IProps, IState> {
return <Spinner />;
}
const myDeviceId = this.context.getDeviceId();
const myDevice = devices.find((device) => device.device_id === myDeviceId);
const myDeviceId = this.context.getDeviceId()!;
const myDevice = devices[myDeviceId];
if (!myDevice) {
return loadError;
}
const otherDevices = devices.filter((device) => device.device_id !== myDeviceId);
const otherDevices = Object.values(devices).filter((device) => device.device_id !== myDeviceId);
otherDevices.sort(this.deviceCompare);
const verifiedDevices: IMyDevice[] = [];
const unverifiedDevices: IMyDevice[] = [];
const nonCryptoDevices: IMyDevice[] = [];
const verifiedDevices: ExtendedDevice[] = [];
const unverifiedDevices: ExtendedDevice[] = [];
const nonCryptoDevices: ExtendedDevice[] = [];
for (const device of otherDevices) {
const verified = this.isDeviceVerified(device);
const verified = device.isVerified;
if (verified === true) {
verifiedDevices.push(device);
} else if (verified === false) {
@ -266,7 +260,7 @@ export default class DevicesPanel extends React.Component<IProps, IState> {
}
}
const section = (trustIcon: JSX.Element, title: string, deviceList: IMyDevice[]): JSX.Element => {
const section = (trustIcon: JSX.Element, title: string, deviceList: ExtendedDevice[]): JSX.Element => {
if (deviceList.length === 0) {
return <React.Fragment />;
}

34
src/components/views/settings/devices/useOwnDevices.ts
View file

@ -50,24 +50,26 @@ const parseDeviceExtendedInformation = (matrixClient: MatrixClient, device: IMyD
};
};
const fetchDevicesWithVerification = async (matrixClient: MatrixClient): Promise<DevicesState["devices"]> => {
/**
* Fetch extended details of the user's own devices
*
* @param matrixClient - Matrix Client
* @returns A dictionary mapping from device ID to ExtendedDevice
*/
export async function fetchExtendedDeviceInformation(matrixClient: MatrixClient): Promise<DevicesDictionary> {
const { devices } = await matrixClient.getDevices();
const devicesDict = devices.reduce(
(acc, device: IMyDevice) => ({
...acc,
[device.device_id]: {
...device,
isVerified: isDeviceVerified(matrixClient, device.device_id),
...parseDeviceExtendedInformation(matrixClient, device),
...parseUserAgent(device[UNSTABLE_MSC3852_LAST_SEEN_UA.name]),
},
}),
{},
);
const devicesDict: DevicesDictionary = {};
for (const device of devices) {
devicesDict[device.device_id] = {
...device,
isVerified: await isDeviceVerified(matrixClient, device.device_id),
...parseDeviceExtendedInformation(matrixClient, device),
...parseUserAgent(device[UNSTABLE_MSC3852_LAST_SEEN_UA.name]),
};
}
return devicesDict;
};
}
export enum OwnDevicesError {
Unsupported = "Unsupported",
@ -112,7 +114,7 @@ export const useOwnDevices = (): DevicesState => {
const refreshDevices = useCallback(async (): Promise<void> => {
setIsLoadingDeviceList(true);
try {
const devices = await fetchDevicesWithVerification(matrixClient);
const devices = await fetchExtendedDeviceInformation(matrixClient);
setDevices(devices);
const { pushers } = await matrixClient.getPushers();