Connects tabs component to Redux route

DalerAsrorov · Oct 13, 2017 · 434d5cb · 434d5cb
1 parent e29c993
commit 434d5cb
Show file tree

Hide file tree

Showing 5 changed files with 18 additions and 15 deletions.
diff --git a/src/components/Login/index.js b/src/components/Login/index.js
@@ -20,18 +20,6 @@ const styles = theme => ({
 });
 
 class Login extends PureComponent {
-    // componentDidMount() {
-    // fetch('/userstatus', {
-    //     method: 'GET'
-    // })
-    //     .then(response => response.json())
-    //     .then(({ isAuthenticated }) => {
-    //         if (isAuthenticated) {
-    //             window.location
-    //         }
-    //     });
-    // }
-
     static propTypes = {
         classes: PropTypes.object
     };

diff --git a/src/components/Main/index.js b/src/components/Main/index.js
@@ -1,7 +1,7 @@
 import React from 'react';
 import { Route } from 'react-router';
-import Nav from '../Nav';
 import PublicPlaylists from '../PublicPlaylists';
+import Nav from '../../containers/Nav';
 import MyPlaylists from '../../containers/MyPlaylists';
 
 const Main = ({ match: { url } }) => {

diff --git a/src/components/Nav/index.js b/src/components/Nav/index.js
@@ -7,6 +7,11 @@ import PersonPin from 'material-ui-icons/PersonPin';
 import Public from 'material-ui-icons/Public';
 import FlashOn from 'material-ui-icons/FlashOn';
 
+const ROUTE_INDEX_MAP = {
+    0: '/app',
+    1: '/app/public'
+};
+
 const styles = theme => ({
     root: {
         width: '100%',
@@ -18,12 +23,13 @@ const styles = theme => ({
 
 class Nav extends PureComponent {
     static propTypes = {
-        classes: PropTypes.object
+        classes: PropTypes.object,
+        navigateTo: PropTypes.func.isRequired
     };
 
     _handleChange = (event, value) => {
         event.preventDefault();
-        console.log(event, value);
+        this.props.navigateTo(ROUTE_INDEX_MAP[value]);
     };
 
     render() {

diff --git a/src/connectPage.js b/src/connectPage.js
@@ -1,4 +1,5 @@
 import { connect } from 'react-redux';
+import { push } from 'react-router-redux';
 import { fetchMyPlaylists } from './actions';
 
 const mapStateToProps = state => ({
@@ -8,6 +9,10 @@ const mapStateToProps = state => ({
 export const mapDispatchToProps = dispatch => ({
     fetchMyPlaylists() {
         dispatch(fetchMyPlaylists());
+    },
+
+    navigateTo(path) {
+        dispatch(push(path));
     }
 });
 

diff --git a/src/containers/Nav.js b/src/containers/Nav.js
@@ -0,0 +1,4 @@
+import { connectStream } from '../connectPage';
+import Nav from '../components/Nav';
+
+export default connectStream(Nav);