Removed logger, fixed deviceHeader props

src/js/components/DeviceHeader/index.js

@@ -162,15 +162,15 @@ class DeviceHeader extends Component {
     }
 }
 
-
 DeviceHeader.propTypes = {
-    deviceCount: PropTypes.number,
+    device: PropTypes.object,
+    devices: PropTypes.array,
+    transport: PropTypes.object,
+    icon: PropTypes.element,
+    isHoverable: PropTypes.bool,
     disabled: PropTypes.bool,
     isOpen: PropTypes.bool,
-    trezorModel: PropTypes.string.isRequired,
     onClickWrapper: PropTypes.func.isRequired,
-    status: PropTypes.string.isRequired,
-    label: PropTypes.string.isRequired,
 };
 
 export default DeviceHeader;

src/js/store/index.js

@@ -39,19 +39,8 @@ if (process.env.NODE_ENV === 'development') {
         return pass.length === 0;
     };
 
-    const logger = createLogger({
-        level: 'info',
-        predicate: excludeLogger,
-        collapsed: true,
-    });
-
-    const devToolsExtension: ?Function = window.devToolsExtension;
-    if (typeof devToolsExtension === 'function') {
-        enhancers.push(devToolsExtension());
-    }
-
     composedEnhancers = compose(
-        applyMiddleware(...middleware, logger, ...services),
+        applyMiddleware(...middleware, ...services),
         ...enhancers,
     );
 } else {

src/js/views/Wallet/components/LeftNavigation/components/DeviceMenu/components/Submenu/index.js

@@ -0,0 +1,55 @@
+import React, { Component } from 'react';
+import styled from 'styled-components';
+import Icon from 'components/Icon';
+import DeviceHeader from 'components/DeviceHeader';
+import icons from 'config/icons';
+import colors from 'config/colors';
+
+const Wrapper = styled.div``;
+const IconClick = styled.div``;
+
+class DeviceList extends Component {
+    sortByInstance(a, b) {
+        if (!a.instance || !b.instance) return -1;
+        return a.instance > b.instance ? 1 : -1;
+    }
+
+    render() {
+        const { devices, selectedDevice, onSelectDevice } = this.props;
+        return (
+            <Wrapper>
+                {devices
+                    .sort(this.sortByInstance)
+                    .map(device => (
+                        device !== selectedDevice && (
+                            <DeviceHeader
+                                key={`${device.instanceLabel}`}
+                                onClickWrapper={() => this.props.onSelectDevice(device)}
+                                onClickIcon={() => this.onDeviceMenuClick({ type: 'forget', label: '' }, device)}
+                                icon={(
+                                    <IconClick onClick={(event) => {
+                                        event.stopPropagation();
+                                        event.preventDefault();
+                                        this.onDeviceMenuClick({ type: 'forget', label: '' }, device);
+                                    }}
+                                    >
+                                        <Icon
+                                            icon={icons.EJECT}
+                                            size={25}
+                                            color={colors.TEXT_SECONDARY}
+                                        />
+                                    </IconClick>
+                                )}
+                                device={device}
+                                devices={devices}
+                                isHoverable
+                            />
+                        )
+                    ))}
+
+            </Wrapper>
+        );
+    }
+}
+
+export default DeviceList;

src/js/views/Wallet/components/LeftNavigation/components/DeviceMenu/index.js

@@ -24,7 +24,7 @@ export const DeviceSelect = (props: Props) => {
             onClickWrapper={handleOpen}
             device={props.wallet.selectedDevice}
             transport={props.connect.transport}
-            devices={props.devices.length}
+            devices={props.devices}
             isOpen={props.deviceDropdownOpened}
         />
     );
@@ -101,6 +101,10 @@ export class DeviceDropdown extends Component<Props> {
         return this.props.devices.length > 1;
     }
 
+    getMenu() {
+
+    }
+
     render() {
         const { devices, onSelectDevice } = this.props;
         const { transport } = this.props.connect;

src/js/views/Wallet/views/DeviceSettings/index.js

@@ -33,6 +33,7 @@ const DeviceSettings = () => (
     <Section>
         <Row>
             <Icon
+                size={60}
                 color={colors.WARNING_PRIMARY}
                 icon={ICONS.WARNING}
             />