navigation without react-navigation

package.json

@@ -41,7 +41,6 @@
     "react-dev-utils": "^4.0.0",
     "react-dom": "^16.0.0-beta.5",
     "react-native": "0.47.2",
-    "react-navigation": "^1.0.0-beta.11",
     "react-redux": "^5.0.6",
     "redux": "^3.7.2",
     "style-loader": "0.18.2",

src/shared/containers/Navigation.js

@@ -0,0 +1,39 @@
+import React from 'react';
+import { connect } from 'react-redux';
+import { filter } from 'shared/actions/todo';
+import styled from 'styled-primitives';
+
+const filters = ['All', 'Completed', 'Uncompleted'];
+
+const Wrapper = styled.View`
+  flex-direction: row;
+  display: flex;
+  width: 100%;
+  justify-content: space-between;
+`;
+
+const NavigateButton = styled.Touchable`
+  width: 30%;
+  height: 50;
+`;
+
+const Text = styled.Text`
+  text-align: center;
+  padding: 10px 0;
+`;
+
+const Navigation = ({ navigateTo }) =>
+  (<Wrapper>
+      {filters.map(filterName =>
+        <NavigateButton
+          onPress={() => { navigateTo(filterName); }}
+          key={filterName}
+        >
+          <Text>{filterName}</Text>
+        </NavigateButton>
+      )}
+  </Wrapper>);
+
+export default connect(null, (dispatch) => ({
+  navigateTo: (filterName) => { dispatch(filter(filterName)); },
+}))(Navigation);

src/shared/scenes/TodoScene.js

@@ -2,6 +2,7 @@ import React from 'react';
 import styled from 'styled-primitives';
 import { connect } from 'react-redux';
 import { getFiltered } from 'shared/selectors/todo';
+import Navigation from 'shared/containers/Navigation';
 import AddTodo from 'shared/containers/AddTodo';
 import TodoList from 'shared/components/TodoList';
 
@@ -20,6 +21,7 @@ const Header = styled.Text`
 const TodoScene = ({ title, todos }) => {
   return (
     <Wrapper>
+      <Navigation />
       <Header>{title}</Header>
       <AddTodo />
       <TodoList todos={todos} />
@@ -28,4 +30,5 @@ const TodoScene = ({ title, todos }) => {
 
 export default connect((state) => ({
   todos: getFiltered(state),
+  title: state.todo.filter,
 }))(TodoScene);