From 82c215dc81fafea3d5efe8b37f52fb6fbad620d5 Mon Sep 17 00:00:00 2001
From: Vasek Mlejnsky <vasek.mlejnsky@gmail.com>
Date: Thu, 16 Aug 2018 11:27:30 +0200
Subject: [PATCH] Add folder structure

---
 .../wallet/aside/{ => row}/AsideRow.js         |  5 +++++
 .../aside/{ => row/account}/AsideRowAccount.js | 18 ++++++++----------
 .../wallet/aside/{ => row/coin}/CoinName.js    |  2 +-
 3 files changed, 14 insertions(+), 11 deletions(-)
 rename src/js/components/wallet/aside/{ => row}/AsideRow.js (85%)
 rename src/js/components/wallet/aside/{ => row/account}/AsideRowAccount.js (83%)
 rename src/js/components/wallet/aside/{ => row/coin}/CoinName.js (91%)

diff --git a/src/js/components/wallet/aside/AsideRow.js b/src/js/components/wallet/aside/row/AsideRow.js
similarity index 85%
rename from src/js/components/wallet/aside/AsideRow.js
rename to src/js/components/wallet/aside/row/AsideRow.js
index 0f1b2812..ab5478aa 100644
--- a/src/js/components/wallet/aside/AsideRow.js
+++ b/src/js/components/wallet/aside/row/AsideRow.js
@@ -7,6 +7,7 @@ import { TRANSITION_TIME } from 'config/variables';
 
 const Wrapper = styled.div`
     padding: 16px 24px;
+    height: 100%;
 
     display: flex;
     flex-direction: row;
@@ -29,6 +30,10 @@ const AsideRow = ({ children, column = false }) => (
 );
 
 AsideRow.propTypes = {
+    children: PropTypes.oneOfType([
+        PropTypes.arrayOf(PropTypes.node),
+        PropTypes.node,
+    ]),
     column: PropTypes.bool,
 };
 
diff --git a/src/js/components/wallet/aside/AsideRowAccount.js b/src/js/components/wallet/aside/row/account/AsideRowAccount.js
similarity index 83%
rename from src/js/components/wallet/aside/AsideRowAccount.js
rename to src/js/components/wallet/aside/row/account/AsideRowAccount.js
index 54938263..e6e3b7c7 100644
--- a/src/js/components/wallet/aside/AsideRowAccount.js
+++ b/src/js/components/wallet/aside/row/account/AsideRowAccount.js
@@ -3,14 +3,16 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { NavLink } from 'react-router-dom';
 
-import AsideRow from './AsideRow';
+import AsideRow from '../AsideRow';
 
 import colors from 'config/colors';
 import { FONT_SIZE, BORDER_WIDTH } from 'config/variables';
 
 const Wrapper = styled.div`
     height: 64px;
+
     font-size: ${FONT_SIZE.SMALL};
+    color: ${colors.TEXT_PRIMARY};
 
     border-top: 1px solid ${colors.DIVIDER};
     span {
@@ -18,7 +20,7 @@ const Wrapper = styled.div`
         color: ${colors.TEXT_SECONDARY};
     }
 
-    ${props => props.selected && css`
+    ${props => props.isSelected && css`
         border-left: ${BORDER_WIDTH.SELECTED} solid ${colors.GREEN_PRIMARY};
         background: ${colors.WHITE};
 
@@ -32,11 +34,11 @@ const Wrapper = styled.div`
     `}
 `;
 
-const AsideRowAccount = ({ accountIndex, balance, url, selected }) => (
+const AsideRowAccount = ({ accountIndex, balance, url, isSelected = false }) => (
     <NavLink to={url}>
         <Wrapper
             to={url}
-            selected={selected}
+            isSelected={isSelected}
         >
             <AsideRow column>
                 Account #{accountIndex + 1}
@@ -52,13 +54,9 @@ const AsideRowAccount = ({ accountIndex, balance, url, selected }) => (
 
 AsideRowAccount.propTypes = {
     accountIndex: PropTypes.number.isRequired,
-    balance: PropTypes.string,
     url: PropTypes.string.isRequired,
-    selected: PropTypes.bool,
-};
-
-AsideRowAccount.defaultProps = {
-    selected: true,
+    balance: PropTypes.string,
+    isSelected: PropTypes.bool,
 };
 
 export default AsideRowAccount;
diff --git a/src/js/components/wallet/aside/CoinName.js b/src/js/components/wallet/aside/row/coin/CoinName.js
similarity index 91%
rename from src/js/components/wallet/aside/CoinName.js
rename to src/js/components/wallet/aside/row/coin/CoinName.js
index 22b5dbc3..48321f58 100644
--- a/src/js/components/wallet/aside/CoinName.js
+++ b/src/js/components/wallet/aside/row/coin/CoinName.js
@@ -19,7 +19,7 @@ const Logo = styled.div`
     background-repeat: no-repeat;
     background-position: center;
     background-size: auto ${ICON_SIZE.BASE};
-    background-image: url('images/${props => props.coinImg}-logo.png');
+    background-image: url('${props => props.coinImg}');
 `;
 
 const CoinName = ({ coinImg, text }) => (