react-native-redux login example github
import React, { Component } from 'react';
import { StyleSheet, View } from 'react-native';
import { Provider } from 'react-redux';
import { applyMiddleware, createStore } from 'redux';
import thunk from 'redux-thunk';
import GitAccount from './GitAccount';
import { accountReducer, initialState } from './reducer';
console.log(`${Date()} 1111111111>>> initialization of Redux for the application.`);
const rootReducer = accountReducer;
const middlewares = [thunk];
const store = createStore(rootReducer, initialState, applyMiddleware(...middlewares));
export default class App extends Component {
render() {
console.log(`${Date()} 2222222222>>> Provider is a wrapper to the application and responsible for providing access to the created store`);
return (
<Provider store={store}>
<View style={styles.container}>
<GitAccount />
</View>
</Provider>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#fff',
marginTop: 50
}
});
import { FETCH_ACCOUNT_ERROR, FETCH_ACCOUNT_LOADING, FETCH_ACCOUNT_SUCCESS } from './actions';
export const initialState = {
loading: false,
account: [],
error: null
}
function selectInterestedAccountInfo(account) {
return Object.keys(account).reduce(function(obj, k) {
if (["login", "url", "name", "created_at", "bio", "email", "public_repos"].includes(k)) {
obj[k] = account[k];
}
return obj;
}, {});
}
export function accountReducer(state = initialState, action) {
switch(action.type) {
case FETCH_ACCOUNT_LOADING:
return {
...state,
loading: true
}
case FETCH_ACCOUNT_SUCCESS:
return {
...state,
loading: false,
account: selectInterestedAccountInfo(action.payload)
}
case FETCH_ACCOUNT_ERROR:
return {
...state,
loading: false,
error: action.error
}
default:
return state;
}
}
export const getAccountSuccess = state => state.account;
export const getAccountLoading = state => state.loading;
export const getAccountError = state => state.error;
