feature(wallet): add wallet route and active nav links

app/routes.js

@@ -3,10 +3,12 @@ import React from 'react'
 import { Switch, Route } from 'react-router'
 import App from './routes/app'
 import Activity from './routes/activity'
+import Wallet from './routes/wallet'
 
 export default () => (
   <App>
     <Switch>
+      <Route path='/wallet' component={Wallet} />
       <Route path='/' component={Activity} />
     </Switch>
   </App>

app/routes/app/components/App.js

@@ -29,7 +29,8 @@ class App extends Component {
       payInvoice,
       children
     } = this.props
-
+    
+    console.log('children: ', this.props.children)
     return (
       <div>
         <Form

app/routes/app/components/components/Nav.js

@@ -1,6 +1,6 @@
 // @flow
 import React, { Component } from 'react'
-import { Link } from 'react-router-dom'
+import { NavLink } from 'react-router-dom'
 import ReactSVG from 'react-svg'
 import { MdAccountBalanceWallet, MdSettings } from 'react-icons/lib/md'
 import { FaClockO, FaBitcoin, FaDollar } from 'react-icons/lib/fa'
@@ -15,6 +15,7 @@ class Nav extends Component {
       setCurrency,
       formClicked
     } = this.props
+
     return (
       <nav className={styles.nav}>
         <ul className={styles.info}>
@@ -65,17 +66,23 @@ class Nav extends Component {
         </div>
 
         <ul className={styles.links}>
-          <li className={styles.link}>
-            <FaClockO />
-            <span>Activity</span>
+          <li>
+            <NavLink exact to='/' activeClassName={styles.active} className={styles.link}>
+              <FaClockO />
+              <span>Activity</span>
+            </NavLink>
           </li>
-          <li className={styles.link}>
-            <MdAccountBalanceWallet />
-            <span>Wallet</span>
+          <li>
+            <NavLink exact to='/wallet' activeClassName={styles.active} className={styles.link}>
+              <MdAccountBalanceWallet />
+              <span>Wallet</span>
+            </NavLink>
           </li>
-          <li className={styles.link}>
-            <MdSettings />
-            <span>Settings</span>
+          <li>
+            <NavLink to='/settings' activeClassName={styles.active} className={styles.link}>
+              <MdSettings />
+              <span>Settings</span>
+            </NavLink>
           </li>
         </ul>  
         <div className={styles.buttons}>

app/routes/app/components/components/Nav.scss

@@ -70,13 +70,14 @@
 	margin: 0 auto;
 
 	.link {
+  	color: $main;
 	  margin-bottom: 20px;
 	  padding: 0 10px;
 	  opacity: 0.5;
 	  cursor: pointer;
+	  text-decoration: none;
 
-	  &:first-child {
-	  	color: $main;
+	  &.active {
 	  	opacity: 1.0;
 	  }
 

app/routes/wallet/components/Wallet.js

@@ -0,0 +1,16 @@
+// @flow
+import React, { Component } from 'react'
+import styles from './Wallet.scss'
+
+class Wallet extends Component {
+  render() {
+    return (
+      <div>
+        Wallet
+      </div>
+    )
+  }
+}
+
+
+export default Wallet

app/routes/wallet/containers/WalletContainer.js

@@ -0,0 +1,8 @@
+import { connect } from 'react-redux'
+import Wallet from '../components/Wallet'
+
+const mapDispatchToProps = {}
+
+const mapStateToProps = (state) => ({})
+
+export default connect(mapStateToProps, mapDispatchToProps)(Wallet)

app/routes/wallet/index.js

@@ -0,0 +1,3 @@
+import WalletContainer from './containers/WalletContainer'
+
+export default WalletContainer