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

Device manager - data fetching (PSG-637) (#9151)

Browse source 
* add session manager tab to user settings

* fussy import ordering

* i18n

* extract device fetching logic into hook

* use new extended device type in device tile, add verified metadata

* add current session section, test

* tidy

* update types for DeviceWithVerification
This commit is contained in:
Kerry 2022-08-10 18:14:59 +02:00 • committed by GitHub
parent 4e30d3c0fc
commit b7872f2ff7
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
12 changed files with 434 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

10
src/components/views/settings/devices/DeviceTile.tsx
View file

@ -15,21 +15,21 @@ limitations under the License.
*/
import React, { Fragment } from "react";
import { IMyDevice } from "matrix-js-sdk/src/matrix";
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 { DeviceWithVerification } from "./useOwnDevices";
export interface DeviceTileProps {
device: IMyDevice;
device: DeviceWithVerification;
children?: React.ReactNode;
onClick?: () => void;
}
const DeviceTileName: React.FC<{ device: IMyDevice }> = ({ device }) => {
const DeviceTileName: React.FC<{ device: DeviceWithVerification }> = ({ device }) => {
if (device.display_name) {
return <TooltipTarget
alignment={Alignment.Top}
@ -62,12 +62,14 @@ const DeviceMetadata: React.FC<{ value: string, id: string }> = ({ value, id })
const DeviceTile: React.FC<DeviceTileProps> = ({ device, children, onClick }) => {
const lastActivity = device.last_seen_ts && `${_t('Last activity')} ${formatLastActivity(device.last_seen_ts)}`;
const verificationStatus = device.isVerified ? _t('Verified') : _t('Unverified');
const metadata = [
{ id: 'isVerified', value: verificationStatus },
{ id: 'lastActivity', value: lastActivity },
{ id: 'lastSeenIp', value: device.last_seen_ip },
];
return <div className="mx_DeviceTile">
return <div className="mx_DeviceTile" data-testid={`device-tile-${device.device_id}`}>
<div className="mx_DeviceTile_info" onClick={onClick}>
<DeviceTileName device={device} />
<div className="mx_DeviceTile_metadata">