/* @flow */ 'use strict'; import React, { Component } from 'react'; import Select from 'react-select'; import TrezorConnect from 'trezor-connect'; import { findSelectedDevice } from '~/js/reducers/TrezorConnectReducer'; import type { Props } from './index'; import type { TrezorDevice } from '~/flowtype'; export const DeviceSelect = (props: Props) => { const { devices, transport } = props.connect; const selected: ?TrezorDevice = findSelectedDevice(props.connect); if (!selected) return null; let deviceStatus: string = "Connected"; let css: string = "device-select device"; if (props.deviceDropdownOpened) css += " opened"; if (!selected.connected) { css += " disconnected"; deviceStatus = "Disconnected"; } else if (!selected.available) { css += " unavailable"; deviceStatus = "Unavailable"; } else { if (selected.unacquired) { css += " unacquired"; deviceStatus = "Used in other window"; } if (selected.isUsedElsewhere) { css += " used-elsewhere"; deviceStatus = "Used in other window"; } else if (selected.featuresNeedsReload) { css += " reload-features"; } } if (selected.features && selected.features.major_version > 1) { css += " trezor-t"; } const handleOpen = () => { props.toggleDeviceDropdown(props.deviceDropdownOpened ? false : true); } const deviceCount = devices.length; const webusb: boolean = (transport && transport.version.indexOf('webusb') >= 0) ? true : false; const disabled: boolean = (devices.length < 1 && !webusb) || (devices.length === 1 && !selected.features); if (disabled) { css += " disabled"; } return (