Moved some codes about data moved to login container

This commit is contained in:
Mustafa Buyukcelebi 2018-12-21 11:59:46 +03:00
parent b812573a30
commit c1376d111d
2 changed files with 84 additions and 57 deletions

View File

@ -1,11 +1,21 @@
import React, { PureComponent } from 'react'; import React, { PureComponent } from 'react';
import { Alert, Linking } from 'react-native';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
// Services and Actions // Services and Actions
import { Login } from '../../../providers/steem/auth';
import { lookupAccounts } from '../../../providers/steem/dsteem';
import {
failedAccount,
addOtherAccount,
updateCurrentAccount,
} from '../../../redux/actions/accountAction';
import { login as loginAction, openPinCodeModal } from '../../../redux/actions/applicationActions';
// Middleware // Middleware
// Constants // Constants
import ROUTES from '../../../constants/routeNames';
// Utilities // Utilities
@ -21,15 +31,58 @@ import LoginScreen from '../screen/loginScreen';
class LoginContainer extends PureComponent { class LoginContainer extends PureComponent {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = {};
this.state = {
isLoading: false,
};
} }
// Component Life Cycle Functions // Component Life Cycle Functions
// Component Functions // Component Functions
_handleOnPressLogin = (username, password) => {
const { dispatch, setPinCodeState } = this.props;
this.setState({ isLoading: true });
Login(username, password)
.then((result) => {
if (result) {
dispatch(updateCurrentAccount({ ...result }));
dispatch(addOtherAccount({ username: result.name }));
dispatch(openPinCodeModal());
setPinCodeState({ navigateTo: ROUTES.DRAWER.MAIN });
dispatch(loginAction(true));
}
})
.catch((err) => {
// TODO: Change with global error handling
Alert.alert('Error', err.message);
dispatch(failedAccount(err.message));
this.setState({ isLoading: false });
});
};
_getAccountsWithUsername = async (username) => {
const validUsers = await lookupAccounts(username);
return validUsers;
};
_handleSignUp = () => {
Linking.openURL('https://signup.steemit.com/?ref=esteem').catch(err => alert('An error occurred', err));
};
render() { render() {
return <LoginScreen {...this.props} />; const { isLoading } = this.state;
return (
<LoginScreen
handleOnPressLogin={this._handleOnPressLogin}
getAccountsWithUsername={this._getAccountsWithUsername}
handleSignUp={this._handleSignUp}
isLoading={isLoading}
/>
);
} }
} }

View File

@ -1,31 +1,21 @@
import React, { PureComponent } from 'react'; import React, { PureComponent } from 'react';
import { import { View, StatusBar, Platform } from 'react-native';
View, Linking, StatusBar, Platform, Alert,
} from 'react-native';
import { KeyboardAwareScrollView } from 'react-native-keyboard-aware-scroll-view'; import { KeyboardAwareScrollView } from 'react-native-keyboard-aware-scroll-view';
import ScrollableTabView from '@esteemapp/react-native-scrollable-tab-view'; import ScrollableTabView from '@esteemapp/react-native-scrollable-tab-view';
import { injectIntl } from 'react-intl'; import { injectIntl } from 'react-intl';
// Actions // Actions
import { import SteemConnect from '../../steem-connect/steemConnect';
failedAccount,
addOtherAccount,
updateCurrentAccount,
} from '../../../redux/actions/accountAction';
import { login as loginAction, openPinCodeModal } from '../../../redux/actions/applicationActions';
// Internal Components // Internal Components
import { FormInput } from '../../../components/formInput'; import { FormInput } from '../../../components/formInput';
import { InformationArea } from '../../../components/informationArea'; import { InformationArea } from '../../../components/informationArea';
import { Login } from '../../../providers/steem/auth';
import { LoginHeader } from '../../../components/loginHeader'; import { LoginHeader } from '../../../components/loginHeader';
import { lookupAccounts } from '../../../providers/steem/dsteem';
import { MainButton } from '../../../components/mainButton'; import { MainButton } from '../../../components/mainButton';
import { Modal } from '../../../components'; import { Modal } from '../../../components';
import { TabBar } from '../../../components/tabBar'; import { TabBar } from '../../../components/tabBar';
import { TextButton } from '../../../components/buttons'; import { TextButton } from '../../../components/buttons';
import STEEM_CONNECT_LOGO from '../../../assets/steem_connect.png'; import STEEM_CONNECT_LOGO from '../../../assets/steem_connect.png';
import SteemConnect from '../../steem-connect/steemConnect';
// Constants // Constants
import { default as ROUTES } from '../../../constants/routeNames'; import { default as ROUTES } from '../../../constants/routeNames';
@ -40,63 +30,44 @@ class LoginScreen extends PureComponent {
this.state = { this.state = {
username: '', username: '',
password: '', password: '',
isLoading: false,
isUsernameValid: true, isUsernameValid: true,
keyboardIsOpen: false, keyboardIsOpen: false,
isModalOpen: false, isModalOpen: false,
}; };
} }
_handleOnPressLogin = () => {
const { dispatch, setPinCodeState } = this.props;
const { password, username } = this.state;
this.setState({ isLoading: true });
Login(username, password)
.then((result) => {
if (result) {
dispatch(updateCurrentAccount({ ...result }));
dispatch(addOtherAccount({ username: result.name }));
dispatch(openPinCodeModal());
setPinCodeState({ navigateTo: ROUTES.DRAWER.MAIN });
dispatch(loginAction(true));
}
})
.catch((err) => {
// TODO: Change with global error handling
Alert.alert('Error', err.message);
dispatch(failedAccount(err.message));
this.setState({ isLoading: false });
});
};
_handleUsernameChange = async (username) => {
await this.setState({ username });
const validUsers = await lookupAccounts(username);
const isValid = validUsers.includes(username);
this.setState({ isUsernameValid: isValid });
};
_handleOnPasswordChange = (value) => { _handleOnPasswordChange = (value) => {
this.setState({ password: value }); this.setState({ password: value });
}; };
_handleSignUp = () => { _handleUsernameChange = (username) => {
Linking.openURL('https://signup.steemit.com/?ref=esteem').catch(err => alert('An error occurred', err)); const { getAccountsWithUsername } = this.props;
};
this.setState({ username });
getAccountsWithUsername(username).then((res) => {
const isValid = res.includes(username);
this.setState({ isUsernameValid: isValid });
});
};
_handleOnModalToggle = () => { _handleOnModalToggle = () => {
const { isModalOpen } = this.state; const { isModalOpen } = this.state;
this.setState({ isModalOpen: !isModalOpen }); this.setState({ isModalOpen: !isModalOpen });
} };
render() { render() {
const { navigation, intl, setPinCodeState } = this.props;
const { const {
isLoading, username, isUsernameValid, keyboardIsOpen, password, isModalOpen, navigation,
intl,
setPinCodeState,
handleOnPressLogin,
handleSignUp,
isLoading,
} = this.props;
const {
username, isUsernameValid, keyboardIsOpen, password, isModalOpen,
} = this.state; } = this.state;
return ( return (
@ -110,7 +81,7 @@ class LoginScreen extends PureComponent {
description={intl.formatMessage({ description={intl.formatMessage({
id: 'login.signin_title', id: 'login.signin_title',
})} })}
onPress={() => this._handleSignUp()} onPress={() => handleSignUp()}
rightButtonText={intl.formatMessage({ rightButtonText={intl.formatMessage({
id: 'login.signup', id: 'login.signup',
})} })}
@ -121,7 +92,7 @@ class LoginScreen extends PureComponent {
renderTabBar={() => ( renderTabBar={() => (
<TabBar <TabBar
style={styles.tabbar} style={styles.tabbar}
tabUnderlineDefaultWidth={100} // default containerWidth / (numberOfTabs * 4) tabUnderlineDefaultWidth={100}
tabUnderlineScaleX={2} // default 3 tabUnderlineScaleX={2} // default 3
activeColor="#357ce6" activeColor="#357ce6"
inactiveColor="#222" inactiveColor="#222"
@ -182,7 +153,7 @@ class LoginScreen extends PureComponent {
})} })}
/> />
<MainButton <MainButton
onPress={this._handleOnPressLogin} onPress={() => handleOnPressLogin(username, password)}
iconName="md-person" iconName="md-person"
iconColor="white" iconColor="white"
text={intl.formatMessage({ text={intl.formatMessage({
@ -217,7 +188,10 @@ class LoginScreen extends PureComponent {
handleOnModalClose={this._handleOnModalToggle} handleOnModalClose={this._handleOnModalToggle}
title="Steemconnect Login" title="Steemconnect Login"
> >
<SteemConnect handleOnModalClose={this._handleOnModalToggle} setPinCodeState={setPinCodeState} /> <SteemConnect
handleOnModalClose={this._handleOnModalToggle}
setPinCodeState={setPinCodeState}
/>
</Modal> </Modal>
</View> </View>
); );