Skip to content
This repository was archived by the owner on Sep 11, 2024. It is now read-only.

Commit 12e3ba8

Browse files
authored
Make device ID copyable in device list (#9297)
1 parent 45556e6 commit 12e3ba8

File tree

6 files changed

+100
-53
lines changed

6 files changed

+100
-53
lines changed

src/components/views/settings/devices/DeviceTile.tsx

Lines changed: 2 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -19,8 +19,6 @@ import React, { Fragment } from "react";
1919
import { Icon as InactiveIcon } from '../../../../../res/img/element-icons/settings/inactive.svg';
2020
import { _t } from "../../../../languageHandler";
2121
import { formatDate, formatRelativeTime } from "../../../../DateUtils";
22-
import TooltipTarget from "../../elements/TooltipTarget";
23-
import { Alignment } from "../../elements/Tooltip";
2422
import Heading from "../../typography/Heading";
2523
import { INACTIVE_DEVICE_AGE_DAYS, isDeviceInactive } from "./filter";
2624
import { DeviceWithVerification } from "./types";
@@ -32,18 +30,8 @@ export interface DeviceTileProps {
3230
}
3331

3432
const DeviceTileName: React.FC<{ device: DeviceWithVerification }> = ({ device }) => {
35-
if (device.display_name) {
36-
return <TooltipTarget
37-
alignment={Alignment.Top}
38-
label={`${device.display_name} (${device.device_id})`}
39-
>
40-
<Heading size='h4'>
41-
{ device.display_name }
42-
</Heading>
43-
</TooltipTarget>;
44-
}
4533
return <Heading size='h4'>
46-
{ device.device_id }
34+
{ device.display_name || device.device_id }
4735
</Heading>;
4836
};
4937

@@ -91,6 +79,7 @@ const DeviceTile: React.FC<DeviceTileProps> = ({ device, children, onClick }) =>
9179
{ id: 'isVerified', value: verificationStatus },
9280
{ id: 'lastActivity', value: lastActivity },
9381
{ id: 'lastSeenIp', value: device.last_seen_ip },
82+
{ id: 'deviceId', value: device.device_id },
9483
];
9584

9685
return <div className="mx_DeviceTile" data-testid={`device-tile-${device.device_id}`}>

test/components/views/settings/__snapshots__/DevicesPanel-test.tsx.snap

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -141,6 +141,12 @@ exports[`<DevicesPanel /> renders device panel with devices 1`] = `
141141
>
142142
Unverified
143143
</span>
144+
·
145+
<span
146+
data-testid="device-metadata-deviceId"
147+
>
148+
device_1
149+
</span>
144150
</div>
145151
</div>
146152
<div
@@ -257,6 +263,12 @@ exports[`<DevicesPanel /> renders device panel with devices 1`] = `
257263
>
258264
Unverified
259265
</span>
266+
·
267+
<span
268+
data-testid="device-metadata-deviceId"
269+
>
270+
device_2
271+
</span>
260272
</div>
261273
</div>
262274
<div
@@ -332,6 +344,12 @@ exports[`<DevicesPanel /> renders device panel with devices 1`] = `
332344
>
333345
Unverified
334346
</span>
347+
·
348+
<span
349+
data-testid="device-metadata-deviceId"
350+
>
351+
device_3
352+
</span>
335353
</div>
336354
</div>
337355
<div

test/components/views/settings/devices/__snapshots__/CurrentDeviceSection-test.tsx.snap

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -212,6 +212,12 @@ exports[`<CurrentDeviceSection /> renders device and correct security card when
212212
>
213213
Unverified
214214
</span>
215+
·
216+
<span
217+
data-testid="device-metadata-deviceId"
218+
>
219+
alices_device
220+
</span>
215221
</div>
216222
</div>
217223
<div
@@ -322,6 +328,12 @@ exports[`<CurrentDeviceSection /> renders device and correct security card when
322328
>
323329
Unverified
324330
</span>
331+
·
332+
<span
333+
data-testid="device-metadata-deviceId"
334+
>
335+
alices_device
336+
</span>
325337
</div>
326338
</div>
327339
<div

test/components/views/settings/devices/__snapshots__/DeviceTile-test.tsx.snap

Lines changed: 28 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,12 @@ exports[`<DeviceTile /> renders a device with no metadata 1`] = `
3636
>
3737
Unverified
3838
</span>
39+
·
40+
<span
41+
data-testid="device-metadata-deviceId"
42+
>
43+
123
44+
</span>
3945
</div>
4046
</div>
4147
<div
@@ -81,6 +87,12 @@ exports[`<DeviceTile /> renders a verified device with no metadata 1`] = `
8187
>
8288
Unverified
8389
</span>
90+
·
91+
<span
92+
data-testid="device-metadata-deviceId"
93+
>
94+
123
95+
</span>
8496
</div>
8597
</div>
8698
<div
@@ -113,15 +125,11 @@ exports[`<DeviceTile /> renders display name with a tooltip 1`] = `
113125
<div
114126
class="mx_DeviceTile_info"
115127
>
116-
<div
117-
tabindex="0"
128+
<h4
129+
class="mx_Heading_h4"
118130
>
119-
<h4
120-
class="mx_Heading_h4"
121-
>
122-
My device
123-
</h4>
124-
</div>
131+
My device
132+
</h4>
125133
<div
126134
class="mx_DeviceTile_metadata"
127135
>
@@ -130,6 +138,12 @@ exports[`<DeviceTile /> renders display name with a tooltip 1`] = `
130138
>
131139
Unverified
132140
</span>
141+
·
142+
<span
143+
data-testid="device-metadata-deviceId"
144+
>
145+
123
146+
</span>
133147
</div>
134148
</div>
135149
<div
@@ -187,6 +201,12 @@ exports[`<DeviceTile /> separates metadata with a dot 1`] = `
187201
>
188202
1.2.3.4
189203
</span>
204+
·
205+
<span
206+
data-testid="device-metadata-deviceId"
207+
>
208+
123
209+
</span>
190210
</div>
191211
</div>
192212
<div

test/components/views/settings/devices/__snapshots__/SelectableDeviceTile-test.tsx.snap

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -53,15 +53,11 @@ exports[`<SelectableDeviceTile /> renders unselected device tile with checkbox 1
5353
<div
5454
class="mx_DeviceTile_info"
5555
>
56-
<div
57-
tabindex="0"
56+
<h4
57+
class="mx_Heading_h4"
5858
>
59-
<h4
60-
class="mx_Heading_h4"
61-
>
62-
My Device
63-
</h4>
64-
</div>
59+
My Device
60+
</h4>
6561
<div
6662
class="mx_DeviceTile_metadata"
6763
>
@@ -76,6 +72,12 @@ exports[`<SelectableDeviceTile /> renders unselected device tile with checkbox 1
7672
>
7773
123.456.789
7874
</span>
75+
·
76+
<span
77+
data-testid="device-metadata-deviceId"
78+
>
79+
my-device
80+
</span>
7981
</div>
8082
</div>
8183
<div

test/components/views/settings/tabs/user/__snapshots__/SessionManagerTab-test.tsx.snap

Lines changed: 30 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -85,15 +85,11 @@ exports[`<SessionManagerTab /> renders current session section with a verified s
8585
<div
8686
class="mx_DeviceTile_info"
8787
>
88-
<div
89-
tabindex="0"
88+
<h4
89+
class="mx_Heading_h4"
9090
>
91-
<h4
92-
class="mx_Heading_h4"
93-
>
94-
Alices device
95-
</h4>
96-
</div>
91+
Alices device
92+
</h4>
9793
<div
9894
class="mx_DeviceTile_metadata"
9995
>
@@ -102,6 +98,12 @@ exports[`<SessionManagerTab /> renders current session section with a verified s
10298
>
10399
Verified
104100
</span>
101+
·
102+
<span
103+
data-testid="device-metadata-deviceId"
104+
>
105+
alices_device
106+
</span>
105107
</div>
106108
</div>
107109
<div
@@ -185,15 +187,11 @@ exports[`<SessionManagerTab /> renders current session section with an unverifie
185187
<div
186188
class="mx_DeviceTile_info"
187189
>
188-
<div
189-
tabindex="0"
190+
<h4
191+
class="mx_Heading_h4"
190192
>
191-
<h4
192-
class="mx_Heading_h4"
193-
>
194-
Alices device
195-
</h4>
196-
</div>
193+
Alices device
194+
</h4>
197195
<div
198196
class="mx_DeviceTile_metadata"
199197
>
@@ -202,6 +200,12 @@ exports[`<SessionManagerTab /> renders current session section with an unverifie
202200
>
203201
Unverified
204202
</span>
203+
·
204+
<span
205+
data-testid="device-metadata-deviceId"
206+
>
207+
alices_device
208+
</span>
205209
</div>
206210
</div>
207211
<div
@@ -285,15 +289,11 @@ exports[`<SessionManagerTab /> sets device verification status correctly 1`] = `
285289
<div
286290
class="mx_DeviceTile_info"
287291
>
288-
<div
289-
tabindex="0"
292+
<h4
293+
class="mx_Heading_h4"
290294
>
291-
<h4
292-
class="mx_Heading_h4"
293-
>
294-
Alices device
295-
</h4>
296-
</div>
295+
Alices device
296+
</h4>
297297
<div
298298
class="mx_DeviceTile_metadata"
299299
>
@@ -302,6 +302,12 @@ exports[`<SessionManagerTab /> sets device verification status correctly 1`] = `
302302
>
303303
Verified
304304
</span>
305+
·
306+
<span
307+
data-testid="device-metadata-deviceId"
308+
>
309+
alices_device
310+
</span>
305311
</div>
306312
</div>
307313
<div

0 commit comments

Comments
 (0)