Better handling of menu rendering

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

@@ -150,22 +150,19 @@ class LeftNavigation extends Component {
     }
 
     render() {
-        const { selectedDevice } = this.props.wallet;
         return (
             <StickyContainer
                 location={this.props.location.pathname}
                 deviceSelection={this.props.deviceDropdownOpened}
             >
-                {selectedDevice && (
+                <DeviceHeader
-                    <DeviceHeader
+                    onClickWrapper={() => this.handleOpen()}
-                        onClickWrapper={() => this.handleOpen()}
+                    device={this.props.wallet.selectedDevice}
-                        device={this.props.wallet.selectedDevice}
+                    transport={this.props.connect.transport}
-                        transport={this.props.connect.transport}
+                    devices={this.props.devices}
-                        devices={this.props.devices}
+                    isOpen={this.props.deviceDropdownOpened}
-                        isOpen={this.props.deviceDropdownOpened}
+                    {...this.props}
-                        {...this.props}
+                />
-                    />
-                ) }
                 <MenuWrapper>
                     {this.state.shouldRenderDeviceSelection && <DeviceMenu {...this.props} />}
                     {this.shouldRenderAccounts() && this.getMenuTransition(<AccountMenu {...this.props} />)}

src/views/Wallet/index.js

@@ -83,7 +83,7 @@ const Wallet = (props: WalletContainerProps) => (
     <AppWrapper>
         <Header />
         <WalletWrapper>
-            <LeftNavigation />
+            {props.wallet.selectedDevice && <LeftNavigation />}
             <MainContent>
                 <Navigation>
                     <Route path="/device/:device/network/:network/account/:account" component={TopNavigationAccount} />