appNavigations.js

import React from 'react';
import { connect } from 'react-redux';
import PropTypes from 'prop-types';
/*Navigation stuff*/
import { addNavigationHelpers, StackNavigator } from 'react-navigation';

/*Custom components*/
import Login from '../components/Login/Login';
import WeeksPage from '../components/WeeksPage/WeeksPage';

import HomePage from '../components/HomePage/HomePage';
import Clients from '../components/HomePage/Components/Clients/Clients';
import FinishDaily from '../components/HomePage/Components/FinishDaily/FinishDaily';

/*Components related with products*/
import ProductsList from '../components/HomePage/Components/Order/Components/ProductsList/ProductsList';
import ProductsDetail from '../components/HomePage/Components/Order/Components/ProductsDetail/ProductsDetail';
import ProductsRemove from '../components/HomePage/Components/Order/Components/ProductsRemove/ProductsRemove';

import Order from '../components/HomePage/Components/Order/Order';
import PendingOrder from '../components/HomePage/Components/PendingOrder/PendingOrder';
import Customer from '../components/Customer/Customer';
import CustomerDetail from '../components/CustomerDetail/CustomerDetail';
import CreateClient from '../components/HomePage/Components/CreateClient/CreateClient';
import SalesReport from '../components/HomePage/Components/SalesReport/SalesReport';

export const AppNavigator = StackNavigator({
  Login: {
    screen: Login,
    navigationOptions: ({ navigation }) => ({
      header: null,
    }),
  },
  WeeksPage: {
    screen: WeeksPage,
    navigationOptions: ({ navigation }) => ({
      title: `Listado de Rutas`,
    })
  },
  HomePage: {
    screen: HomePage,
    navigationOptions: ({ navigation }) => ({
      title: `Menu principal`,
    })
  },
  SalesReport: {
    screen: SalesReport,
    navigationOptions: ({ navigation }) => ({
      header: null,
    })
  },
  Clients: {
    screen: Clients
  },
  FinishDaily: {
    screen: FinishDaily,
    navigationOptions: ({ navigation }) => ({
      title: ``,
    })
  },
  Customer: {
    screen: Customer,
  },
  CustomerDetail: {
    screen: CustomerDetail,
    navigationOptions: ({ navigation }) => ({
      title: 'Información Cliente',
    })
  },
  Order: {
    screen: Order
  },
  PendingOrder: {
    screen: PendingOrder,
    navigationOptions: ({ navigation }) => ({
      title: 'Pedidos pendientes',
    })
  },
  ProductsList: {
    screen: ProductsList,
    navigationOptions: ({ navigation }) => ({
      title: `Listado de productos`,
    })
  },
  ProductsDetail: {
    screen: ProductsDetail,
    navigationOptions: ({ navigation }) => ({
      title: `Adicionar Cantidad`,
    })
  },
  ProductsRemove: {
    screen: ProductsRemove,
    navigationOptions: ({ navigation }) => ({
      title: `Eliminar Cantidad`,
    })
  },
  CreateClient: {
    screen: CreateClient,
    navigationOptions: ({ navigation }) => ({
      title: 'Nuevo Cliente',
    })
  }
},
  {
    initialRouteName: "Login"
  }
);

const AppWithNavigationState = ({ dispatch, nav }) => (
  <AppNavigator navigation={addNavigationHelpers({ dispatch, state: nav })} />
);

AppWithNavigationState.propTypes = {
  dispatch: PropTypes.func.isRequired,
  nav: PropTypes.object.isRequired,
};

const mapStateToProps = state => ({
  nav: state.nav,
});

export default connect(mapStateToProps)(AppWithNavigationState);