Skip to content

Commit

Permalink
refactor(screens): switch to bindActionCreators style
Browse files Browse the repository at this point in the history
  • Loading branch information
@lex111
lex111 committed Sep 20, 2017
1 parent 986687e commit 5890e2c
Show file tree
Hide file tree
Showing 20 changed files with 698 additions and 618 deletions.
26 changes: 13 additions & 13 deletions src/auth/screens/auth-profile.screen.js
View file
@@ -1,5 +1,6 @@
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import {
StyleSheet,
Text,
Expand All @@ -19,7 +20,7 @@ import {
EntityInfo,
} from 'components';
import { colors, fonts, normalize } from 'config';
import { getUser, getOrgs, signOut, getStarCount } from 'auth';
import { getUser, getOrgs, getStarCount } from 'auth';
import { emojifyText, openURLInView, translate } from 'utils';

const mapStateToProps = state => ({
Expand All @@ -32,12 +33,11 @@ const mapStateToProps = state => ({
hasInitialUser: state.auth.hasInitialUser,
});

const mapDispatchToProps = dispatch => ({
getUserByDispatch: () => dispatch(getUser()),
getOrgsByDispatch: () => dispatch(getOrgs()),
getStarCountByDispatch: () => dispatch(getStarCount()),
signOutByDispatch: () => dispatch(signOut()),
});
const mapDispatchToProps = dispatch => bindActionCreators({
getUser,
getOrgs,
getStarCount,
}, dispatch);

const styles = StyleSheet.create({
listTitle: {
Expand Down Expand Up @@ -74,9 +74,9 @@ const styles = StyleSheet.create({

class AuthProfile extends Component {
props: {
getUserByDispatch: Function,
getOrgsByDispatch: Function,
getStarCountByDispatch: Function,
getUser: Function,
getOrgs: Function,
getStarCount: Function,
user: Object,
orgs: Array,
language: string,
Expand All @@ -92,9 +92,9 @@ class AuthProfile extends Component {
}

refreshProfile = () => {
this.props.getUserByDispatch();
this.props.getOrgsByDispatch();
this.props.getStarCountByDispatch();
this.props.getUser();
this.props.getOrgs();
this.props.getStarCount();
};

render() {
Expand Down
7 changes: 4 additions & 3 deletions src/auth/screens/events.screen.js
View file
Expand Up @@ -2,6 +2,7 @@
/* eslint-disable no-shadow */
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import { StyleSheet, Text, FlatList, View } from 'react-native';
import moment from 'moment/min/moment-with-locales.min';

Expand All @@ -17,9 +18,9 @@ const mapStateToProps = state => ({
isPendingEvents: state.auth.isPendingEvents,
});

const mapDispatchToProps = dispatch => ({
getUserEvents: user => dispatch(getUserEvents(user)),
});
const mapDispatchToProps = dispatch => bindActionCreators({
getUserEvents,
}, dispatch);

const styles = StyleSheet.create({
descriptionContainer: {
Expand Down
190 changes: 98 additions & 92 deletions src/auth/screens/login.screen.js
View file
@@ -1,5 +1,7 @@
/* eslint-disable no-shadow */
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import { Linking, View, StyleSheet, Text, Platform, Image } from 'react-native';
import { Button, Icon } from 'react-native-elements';
import SafariView from 'react-native-safari-view';
Expand All @@ -20,6 +22,14 @@ const mapStateToProps = state => ({
isAuthenticated: state.auth.isAuthenticated,
});

const mapDispatchToProps = dispatch =>
bindActionCreators(
{
auth,
},
dispatch
);

const styles = StyleSheet.create({
container: {
flex: 1,
Expand Down Expand Up @@ -90,17 +100,12 @@ const styles = StyleSheet.create({
},
});

const mapDispatchToProps = dispatch => ({
authByDispatch: (code, state, navigation) =>
dispatch(auth(code, state, navigation)),
});

class Login extends Component {
props: {
isAuthenticated: boolean,
isLoggingIn: boolean,
language: string,
authByDispatch: Function,
auth: Function,
navigation: Object,
};

Expand Down Expand Up @@ -138,12 +143,12 @@ class Login extends Component {
handleOpenURL = ({ url }) => {
const [, queryStringFromUrl] = url.match(/\?(.*)/);
const { state, code } = queryString.parse(queryStringFromUrl);
const { authByDispatch, navigation } = this.props;
const { auth, navigation } = this.props;

if (stateRandom === state) {
this.setState({ code });

authByDispatch(code, state, navigation);
auth(code, state, navigation);
}

if (Platform.OS === 'ios') {
Expand All @@ -162,96 +167,97 @@ class Login extends Component {
return (
<ViewContainer barColor="light">
{!isAuthenticated &&
this.state.asyncStorageChecked &&
<View style={styles.container}>
<View style={styles.miniSection}>
<Image
style={styles.logo}
source={require('../../assets/logo.png')}
/>
</View>
this.state.asyncStorageChecked && (
<View style={styles.container}>
<View style={styles.miniSection}>
<Image
style={styles.logo}
source={require('../../assets/logo.png')}
/>
</View>

<View style={styles.contentSection}>
<AppIntro
activeDotColor={colors.white}
showSkipButton={false}
showDoneButton={false}
>
<View style={[styles.slide, styles.slide1]}>
<Image
style={styles.logo}
source={require('../../assets/logo.png')}
/>
<Text style={styles.title}>
{translate('auth.login.welcomeTitle', language)}
</Text>
<Text style={styles.message}>
{translate('auth.login.welcomeMessage', language)}
</Text>
</View>
<View style={styles.contentSection}>
<AppIntro
activeDotColor={colors.white}
showSkipButton={false}
showDoneButton={false}
>
<View style={[styles.slide, styles.slide1]}>
<Image
style={styles.logo}
source={require('../../assets/logo.png')}
/>
<Text style={styles.title}>
{translate('auth.login.welcomeTitle', language)}
</Text>
<Text style={styles.message}>
{translate('auth.login.welcomeMessage', language)}
</Text>
</View>

<View style={[styles.slide, styles.slide2]}>
<Icon
style={styles.icon}
color={colors.white}
size={85}
name="bell"
type="octicon"
/>
<Text style={styles.title}>
{translate('auth.login.notificationsTitle', language)}
</Text>
<Text style={styles.message}>
{translate('auth.login.notificationsMessage', language)}
</Text>
</View>
<View style={[styles.slide, styles.slide2]}>
<Icon
style={styles.icon}
color={colors.white}
size={85}
name="bell"
type="octicon"
/>
<Text style={styles.title}>
{translate('auth.login.notificationsTitle', language)}
</Text>
<Text style={styles.message}>
{translate('auth.login.notificationsMessage', language)}
</Text>
</View>

<View style={[styles.slide, styles.slide3]}>
<Icon
containerStyle={styles.iconMargin}
style={styles.icon}
color={colors.white}
size={85}
name="repo"
type="octicon"
/>
<Text style={styles.title}>
{translate('auth.login.reposTitle', language)}
</Text>
<Text style={styles.message}>
{translate('auth.login.reposMessage', language)}
</Text>
</View>
<View style={[styles.slide, styles.slide3]}>
<Icon
containerStyle={styles.iconMargin}
style={styles.icon}
color={colors.white}
size={85}
name="repo"
type="octicon"
/>
<Text style={styles.title}>
{translate('auth.login.reposTitle', language)}
</Text>
<Text style={styles.message}>
{translate('auth.login.reposMessage', language)}
</Text>
</View>

<View style={[styles.slide, styles.slide4]}>
<Icon
containerStyle={styles.iconMargin}
style={styles.icon}
color={colors.white}
size={85}
name="git-pull-request"
type="octicon"
/>
<Text style={styles.title}>
{translate('auth.login.issuesTitle', language)}
</Text>
<Text style={styles.message}>
{translate('auth.login.issuesMessage', language)}
</Text>
</View>
</AppIntro>
</View>
<View style={[styles.slide, styles.slide4]}>
<Icon
containerStyle={styles.iconMargin}
style={styles.icon}
color={colors.white}
size={85}
name="git-pull-request"
type="octicon"
/>
<Text style={styles.title}>
{translate('auth.login.issuesTitle', language)}
</Text>
<Text style={styles.message}>
{translate('auth.login.issuesMessage', language)}
</Text>
</View>
</AppIntro>
</View>

<View style={styles.miniSection}>
<Button
raised
title={translate('auth.login.signInButton', language)}
buttonStyle={styles.button}
textStyle={styles.buttonText}
onPress={() => this.signIn()}
/>
<View style={styles.miniSection}>
<Button
raised
title={translate('auth.login.signInButton', language)}
buttonStyle={styles.button}
textStyle={styles.buttonText}
onPress={() => this.signIn()}
/>
</View>
</View>
</View>}
)}

{isAuthenticated && <LoadingContainer animating={isLoggingIn} center />}
</ViewContainer>
Expand Down

0 comments on commit 5890e2c

Please sign in to comment.