arno/trezor-wallet
1
0
Fork 0
mirror of https://github.com/trezor/trezor-wallet synced 2024-12-29 02:18:06 +00:00
Code Issues Releases Wiki Activity

Device list first part refactoring

Browse Source
This commit is contained in:
Vladimir Volek 2018-08-17 15:08:38 +02:00
parent 42a06eb816
commit 2d9bad285b
2 changed files with 52 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
src/js/views/Wallet/components/LeftNavigation/components/DeviceMenu/components/DeviceList/index.js Normal file
View File

@ -0,0 +1,47 @@
import React from 'react';
import styled from 'styled-components';
import deviceConstants from 'constants/device';
const Wrapper = styled.div``;
class DeviceList {
getStatus(device) {
let deviceStatus = '';
if (device.type === 'unacquired' || (device.features && device.status === 'occupied')) {
deviceStatus = 'Used in other window';
} else if (device.type === 'unreadable') {
deviceStatus = 'Connected';
} else if (!device.connected) {
deviceStatus = 'Disconnected';
} else if (!device.available) {
deviceStatus = 'Unavailable';
}
return deviceStatus;
}
render() {
return (
<Wrapper>
{this.props.devices.map((device, index) => (
<div key={index} className={css} onClick={() => this.props.onSelectDevice(device)}>
<div className="label-container">
<span className="label">{device.instanceLabel}</span>
<span className="status">{this.getStatus(device)}</span>
</div>
<div
className="forget-button"
onClick={(event) => {
event.stopPropagation();
event.preventDefault();
this.onDeviceMenuClick({ type: 'forget', label: '' }, device);
}}
/>
</div>
))}
</Wrapper>
);
}
}
export default DeviceList;

12
src/js/views/Wallet/components/LeftNavigation/components/DeviceMenu/index.js
View File

@ -1,14 +1,12 @@
/* @flow */
import React, { Component } from 'react';
import TrezorConnect from 'trezor-connect';
import styled from 'styled-components';
import type { TrezorDevice } from 'flowtype';
import type { Props } from '../common';
import Divider from '../Divider';
const Wrapper = styled.div``;
import AsideDivider from '../Divider';
export const DeviceSelect = (props: Props) => {
const { devices } = props;
@ -214,12 +212,12 @@ export class DeviceDropdown extends Component<Props> {
return (
<Wrapper>
<React.Fragment>
{currentDeviceMenu}
{deviceList.length > 1 ? <Divider textLeft="Other devices" borderBottom /> : null}
{deviceList.length > 1 ? <AsideDivider textLeft="Other devices" /> : null}
{deviceList}
{webUsbButton}
</Wrapper>
</React.Fragment>
);
}
}