Moved some codes about data moved to login container

src/screens/login/container/loginContainer.js

@@ -1,11 +1,21 @@
 import React, { PureComponent } from 'react';
+import { Alert, Linking } from 'react-native';
 import { connect } from 'react-redux';
 
 // 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
 
 // Constants
+import ROUTES from '../../../constants/routeNames';
 
 // Utilities
 
@@ -21,15 +31,58 @@ import LoginScreen from '../screen/loginScreen';
 class LoginContainer extends PureComponent {
   constructor(props) {
     super(props);
-    this.state = {};
+
+    this.state = {
+      isLoading: false,
+    };
   }
 
   // Component Life Cycle 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() {
-    return <LoginScreen {...this.props} />;
+    const { isLoading } = this.state;
+    return (
+      <LoginScreen
+        handleOnPressLogin={this._handleOnPressLogin}
+        getAccountsWithUsername={this._getAccountsWithUsername}
+        handleSignUp={this._handleSignUp}
+        isLoading={isLoading}
+      />
+    );
   }
 }
 

src/screens/login/screen/loginScreen.js

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