/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 *
 * @format
 * @flow
 */

import React from 'react';
import {
  Text,
  View,
} from 'react-native';
import { compose } from 'redux';
import { connect } from 'react-redux';
import { push, tab } from '../../BasicNavigator/actions';
import NavigationBar from '../../components/NavigationBar';
import BackButton from '../../components/BackButton';
import Button from '../../components/ThemeButton';
import Styles from '../../theme/Styles';

type Props = {
  pushTo: ()=> void,
  tabTo: ()=> void
};

function JSPage(props: Props) {
  console.log('JSPage_props:', props);
  //console.log('JSPage props from lastPage', this.props.navigation.state);
  return (
    <View style={Styles.container}>
      <NavigationBar
        left={<BackButton />}
        title="ThemeDemo"
      />
      <View style={[Styles.container, { justifyContent: 'center' }]}>
        <Text style={Styles.instructions}>第一个页面</Text>
        <Button
          containerStyle={{ height: 40, margin: 10 }}
          onPress={() => { props.pushTo('NativePage', { may: '22' }); }}
          title="跳转第二个页"
        />
        <Button
          containerStyle={{ height: 40, margin: 10 }}
          onPress={() => { props.tabTo('ServicePage'); }}
          title="返回首页Tab切换"
        />
      </View>
    </View>
  );
}

function propsMapping(props) {
  const { nav } = props;
  return {
    nav,
  };
}
function actionMapping(dispatch) {
  return {
    pushTo: compose(dispatch, push),
    tabTo: compose(dispatch, tab),
  };
}
//const mapDispatchToProps = dispatch => (bindActionCreators({goNext}, dispatch))

export default connect(propsMapping, actionMapping)(JSPage);
