Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- import React, { Component } from 'react';
- import { View, ActivityIndicator, TouchableHighlight } from 'react-native';
- import { getLogger, issueToText } from '../core/utils';
- import styles from '../core/styles';
- import { Card, Button, FormLabel, FormInput } from "react-native-elements";
- import { connect } from 'react-redux'
- import { loginAction } from '../actions/LoginActions'
- class LoginComponent extends Component {
- constructor(props) {
- super(props);
- this.login = this.login.bind(this)
- }
- render() {
- const { error, isLoading } = this.props;
- const inputFormProp = {
- username: '',
- password: ''
- };
- return (
- <View style={{ paddingVertical: 20 }}>
- <Card>
- <FormLabel>Email</FormLabel>
- <FormInput value={inputFormProp.username} onChangeText={(text) => inputFormProp.username = text} />
- <FormLabel>Password</FormLabel>
- <FormInput value={inputFormProp.password} onChangeText={(text) => inputFormProp.password = text} />
- <Button
- buttonStyle={{ marginTop: 20 }}
- backgroundColor="#03A9F4"
- title="SIGN IN"
- onPress={this.login(inputFormProp)}
- />
- </Card>
- <ActivityIndicator animating={this.props.isLoading} style={styles.activityIndicator} size="large" />
- </View>
- );
- }
- login(inputFormProp) {
- console.log(this.props)
- const { store } = this.props.screenProps.store;
- console.log(loginAction)
- const { dispatch } = this.props
- console.log(dispatch)
- dispatch(loginAction(inputFormProp))
- .then(() => {
- if (this.props.error === null && this.props.isLoading === false) {
- if (store.getState().auth.token) {
- this.props.navigation.navigate('ProductList', { token: store.getState().auth.token });
- }
- }
- })
- .catch(error => {
- });
- }
- }
- function mapStateToProps(state) {
- const { error, isLoading } = state.auth
- return {
- error,
- isLoading,
- }
- }
- export default connect(mapStateToProps)(LoginComponent)
- import React, { Component } from 'react';
- import { createStore, applyMiddleware, combineReducers, compose } from 'redux';
- import { createLogger } from 'redux-logger';
- import thunk from 'redux-thunk';
- import { authReducer } from "./src/reducers/LoginReducer";
- import { productReducer } from "./src/product/service";
- import { ProductList } from "./src/product/ProductList";
- import { LoginComponent } from "./src/components/Login";
- import { Provider, connect } from "react-redux";
- import { StackNavigator, addNavigationHelpers } from "react-navigation";
- import Routes from "./src/core/routes";
- const AppNavigator = StackNavigator(Routes, {
- navigationOptions: {
- title: ({ state }) => {
- if (state.params) {
- return `${state.params.title}`;
- }
- }
- }
- });
- const navReducer = (state, action) => {
- const newState = AppNavigator.router.getStateForAction(action, state);
- return newState || state;
- };
- @connect(state => ({
- nav: state.nav
- }))
- class AppWithNavigationState extends Component {
- render() {
- return (
- <AppNavigator
- navigation={addNavigationHelpers({
- dispatch: this.props.dispatch,
- state: this.props.nav
- })}
- />
- );
- }
- }
- const initialState = {
- auth: { isLoading: false, error: null },
- };
- const rootReducer = combineReducers({ product: productReducer, auth: authReducer, nav: navReducer });
- let store = createStore(rootReducer, initialState,
- compose(applyMiddleware(thunk, createLogger())));
- export default function App() {
- return (
- <Provider store={store}>
- <AppWithNavigationState />
- </Provider>
- );
- }
- import { ProductList } from "../product/ProductList";
- import { LoginComponent } from "../components/Login";
- const Routes = {
- Login: { screen: LoginComponent },
- ProductList: { screen: ProductList }
- };
- export default Routes;
Add Comment
Please, Sign In to add comment