Make device ID copyable in device list (#9297)

This commit is contained in:
Faye Duxovni 2022-09-23 09:21:04 -04:00 committed by GitHub
parent 45556e6662
commit 12e3ba8e5a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 100 additions and 53 deletions

View file

@ -19,8 +19,6 @@ import React, { Fragment } from "react";
import { Icon as InactiveIcon } from '../../../../../res/img/element-icons/settings/inactive.svg';
import { _t } from "../../../../languageHandler";
import { formatDate, formatRelativeTime } from "../../../../DateUtils";
import TooltipTarget from "../../elements/TooltipTarget";
import { Alignment } from "../../elements/Tooltip";
import Heading from "../../typography/Heading";
import { INACTIVE_DEVICE_AGE_DAYS, isDeviceInactive } from "./filter";
import { DeviceWithVerification } from "./types";
@ -32,18 +30,8 @@ export interface DeviceTileProps {
}
const DeviceTileName: React.FC<{ device: DeviceWithVerification }> = ({ device }) => {
if (device.display_name) {
return <TooltipTarget
alignment={Alignment.Top}
label={`${device.display_name} (${device.device_id})`}
>
<Heading size='h4'>
{ device.display_name }
</Heading>
</TooltipTarget>;
}
return <Heading size='h4'>
{ device.device_id }
{ device.display_name || device.device_id }
</Heading>;
};
@ -91,6 +79,7 @@ const DeviceTile: React.FC<DeviceTileProps> = ({ device, children, onClick }) =>
{ id: 'isVerified', value: verificationStatus },
{ id: 'lastActivity', value: lastActivity },
{ id: 'lastSeenIp', value: device.last_seen_ip },
{ id: 'deviceId', value: device.device_id },
];
return <div className="mx_DeviceTile" data-testid={`device-tile-${device.device_id}`}>

View file

@ -141,6 +141,12 @@ exports[`<DevicesPanel /> renders device panel with devices 1`] = `
>
Unverified
</span>
·
<span
data-testid="device-metadata-deviceId"
>
device_1
</span>
</div>
</div>
<div
@ -257,6 +263,12 @@ exports[`<DevicesPanel /> renders device panel with devices 1`] = `
>
Unverified
</span>
·
<span
data-testid="device-metadata-deviceId"
>
device_2
</span>
</div>
</div>
<div
@ -332,6 +344,12 @@ exports[`<DevicesPanel /> renders device panel with devices 1`] = `
>
Unverified
</span>
·
<span
data-testid="device-metadata-deviceId"
>
device_3
</span>
</div>
</div>
<div

View file

@ -212,6 +212,12 @@ exports[`<CurrentDeviceSection /> renders device and correct security card when
>
Unverified
</span>
·
<span
data-testid="device-metadata-deviceId"
>
alices_device
</span>
</div>
</div>
<div
@ -322,6 +328,12 @@ exports[`<CurrentDeviceSection /> renders device and correct security card when
>
Unverified
</span>
·
<span
data-testid="device-metadata-deviceId"
>
alices_device
</span>
</div>
</div>
<div

View file

@ -36,6 +36,12 @@ exports[`<DeviceTile /> renders a device with no metadata 1`] = `
>
Unverified
</span>
·
<span
data-testid="device-metadata-deviceId"
>
123
</span>
</div>
</div>
<div
@ -81,6 +87,12 @@ exports[`<DeviceTile /> renders a verified device with no metadata 1`] = `
>
Unverified
</span>
·
<span
data-testid="device-metadata-deviceId"
>
123
</span>
</div>
</div>
<div
@ -112,16 +124,12 @@ exports[`<DeviceTile /> renders display name with a tooltip 1`] = `
</div>
<div
class="mx_DeviceTile_info"
>
<div
tabindex="0"
>
<h4
class="mx_Heading_h4"
>
My device
</h4>
</div>
<div
class="mx_DeviceTile_metadata"
>
@ -130,6 +138,12 @@ exports[`<DeviceTile /> renders display name with a tooltip 1`] = `
>
Unverified
</span>
·
<span
data-testid="device-metadata-deviceId"
>
123
</span>
</div>
</div>
<div
@ -187,6 +201,12 @@ exports[`<DeviceTile /> separates metadata with a dot 1`] = `
>
1.2.3.4
</span>
·
<span
data-testid="device-metadata-deviceId"
>
123
</span>
</div>
</div>
<div

View file

@ -52,16 +52,12 @@ exports[`<SelectableDeviceTile /> renders unselected device tile with checkbox 1
</div>
<div
class="mx_DeviceTile_info"
>
<div
tabindex="0"
>
<h4
class="mx_Heading_h4"
>
My Device
</h4>
</div>
<div
class="mx_DeviceTile_metadata"
>
@ -76,6 +72,12 @@ exports[`<SelectableDeviceTile /> renders unselected device tile with checkbox 1
>
123.456.789
</span>
·
<span
data-testid="device-metadata-deviceId"
>
my-device
</span>
</div>
</div>
<div

View file

@ -84,16 +84,12 @@ exports[`<SessionManagerTab /> renders current session section with a verified s
</div>
<div
class="mx_DeviceTile_info"
>
<div
tabindex="0"
>
<h4
class="mx_Heading_h4"
>
Alices device
</h4>
</div>
<div
class="mx_DeviceTile_metadata"
>
@ -102,6 +98,12 @@ exports[`<SessionManagerTab /> renders current session section with a verified s
>
Verified
</span>
·
<span
data-testid="device-metadata-deviceId"
>
alices_device
</span>
</div>
</div>
<div
@ -184,16 +186,12 @@ exports[`<SessionManagerTab /> renders current session section with an unverifie
</div>
<div
class="mx_DeviceTile_info"
>
<div
tabindex="0"
>
<h4
class="mx_Heading_h4"
>
Alices device
</h4>
</div>
<div
class="mx_DeviceTile_metadata"
>
@ -202,6 +200,12 @@ exports[`<SessionManagerTab /> renders current session section with an unverifie
>
Unverified
</span>
·
<span
data-testid="device-metadata-deviceId"
>
alices_device
</span>
</div>
</div>
<div
@ -284,16 +288,12 @@ exports[`<SessionManagerTab /> sets device verification status correctly 1`] = `
</div>
<div
class="mx_DeviceTile_info"
>
<div
tabindex="0"
>
<h4
class="mx_Heading_h4"
>
Alices device
</h4>
</div>
<div
class="mx_DeviceTile_metadata"
>
@ -302,6 +302,12 @@ exports[`<SessionManagerTab /> sets device verification status correctly 1`] = `
>
Verified
</span>
·
<span
data-testid="device-metadata-deviceId"
>
alices_device
</span>
</div>
</div>
<div