From 94e788191a7bf1152a5cefd044fe4e9d3791e60b Mon Sep 17 00:00:00 2001 From: ue Date: Thu, 27 Sep 2018 01:07:57 +0300 Subject: [PATCH] created informationArea component for login side --- src/components/formInput/formInput.js | 12 --- .../formInput/view/formInputView.js | 12 +-- src/components/index.js | 2 +- src/components/informationArea/index.js | 3 + .../view/informationAreaStyles.js | 20 +++++ .../view/informationAreaView.js | 41 ++++++++++ src/screens/login/screen/loginScreen.js | 76 ++++------------- src/screens/login/screen/loginStyles.js | 81 +++++++++---------- 8 files changed, 128 insertions(+), 119 deletions(-) delete mode 100644 src/components/formInput/formInput.js create mode 100644 src/components/informationArea/index.js create mode 100644 src/components/informationArea/view/informationAreaStyles.js create mode 100644 src/components/informationArea/view/informationAreaView.js diff --git a/src/components/formInput/formInput.js b/src/components/formInput/formInput.js deleted file mode 100644 index ff63f4b2b..000000000 --- a/src/components/formInput/formInput.js +++ /dev/null @@ -1,12 +0,0 @@ -import React from "react"; -import { View, TextInput } from "react-native"; - -import styles from "../../styles/formInput.styles"; - -const FormInput = props => ( - - - -); - -export default FormInput; diff --git a/src/components/formInput/view/formInputView.js b/src/components/formInput/view/formInputView.js index 0dee6d175..440e31883 100644 --- a/src/components/formInput/view/formInputView.js +++ b/src/components/formInput/view/formInputView.js @@ -13,11 +13,13 @@ import styles from "./formInputStyles"; class FormInputView extends Component { /* Props * ------------------------------------------------ - * @prop { string } placeholder - Title for header string. - * @prop { string } type - Description for header string. - * @prop { string } isFirstImage - Description for header string. - * @prop { string } isEditable - Description for header string. - * @prop { string } isValid - Description for header string. + * @prop { string } placeholder - Place holder text. + * @prop { string } type - Input type. + * @prop { boolean } isFirstImage - Render image from steem. + * @prop { boolean } isEditable - Can permission edit. + * @prop { boolean } isValid - This delegate input valit or not. + * @prop { boolean } secureTextEntry - For hiding password value. + * * * */ diff --git a/src/components/index.js b/src/components/index.js index 9fcf3bedf..7ee056a36 100644 --- a/src/components/index.js +++ b/src/components/index.js @@ -3,6 +3,6 @@ import Comment from "./comment/comment"; import PostCard from "./post-card/postCard"; import Reply from "./reply/reply"; import Search from "./search/search"; -import FormInput from "./formInput/formInput"; +import { FormInput } from "./formInput"; export { Logo, Comment, PostCard, Reply, Search, FormInput }; diff --git a/src/components/informationArea/index.js b/src/components/informationArea/index.js new file mode 100644 index 000000000..d6d50dc6c --- /dev/null +++ b/src/components/informationArea/index.js @@ -0,0 +1,3 @@ +import InformationArea from "./view/informationAreaView"; + +export { InformationArea }; diff --git a/src/components/informationArea/view/informationAreaStyles.js b/src/components/informationArea/view/informationAreaStyles.js new file mode 100644 index 000000000..d6565c9f3 --- /dev/null +++ b/src/components/informationArea/view/informationAreaStyles.js @@ -0,0 +1,20 @@ +import EStyleSheet from "react-native-extended-stylesheet"; + +export default EStyleSheet.create({ + container: { + flexDirection: "row", + paddingLeft: 50, + paddingRight: 32, + marginTop: 10, + }, + infoIcon: { + flex: 0.125, + fontSize: 20, + alignSelf: "center", + }, + infoText: { + flex: 0.875, + fontSize: 12, + color: "#788187", + }, +}); diff --git a/src/components/informationArea/view/informationAreaView.js b/src/components/informationArea/view/informationAreaView.js new file mode 100644 index 000000000..273693b34 --- /dev/null +++ b/src/components/informationArea/view/informationAreaView.js @@ -0,0 +1,41 @@ +import React, { Component } from "react"; +import { View, Text } from "react-native"; +import Ionicons from "react-native-vector-icons/Ionicons"; + +// Constants + +// Components + +// Styles +import styles from "./informationAreaStyles"; + +class FormInputView extends Component { + /* Props + * ------------------------------------------------ + * @prop { string } description - Description texts. + * @prop { string } iconName - For icon render name. + * + */ + constructor(props) { + super(props); + + this.state = {}; + } + + // Component Life Cycles + + // Component Functions + + render() { + const { description, iconName } = this.props; + + return ( + + + {description} + + ); + } +} + +export default FormInputView; diff --git a/src/screens/login/screen/loginScreen.js b/src/screens/login/screen/loginScreen.js index 2045c1be0..45a5a6bbf 100644 --- a/src/screens/login/screen/loginScreen.js +++ b/src/screens/login/screen/loginScreen.js @@ -18,6 +18,7 @@ import FastImage from "react-native-fast-image"; import { TabBar } from "../../../components/tabBar"; import { LoginHeader } from "../../../components/loginHeader"; import { FormInput } from "../../../components/formInput"; +import { InformationArea } from "../../../components/informationArea"; import ScrollableTabView from "@esteemapp/react-native-scrollable-tab-view"; import { Login } from "../../../providers/steem/auth"; @@ -71,8 +72,6 @@ class LoginScreen extends Component { password: "", isLoading: false, isUsernameValid: true, - usernameBorderColor: "#c1c5c7", - passwordBorderColor: "#c1c5c7", }; } @@ -90,18 +89,16 @@ class LoginScreen extends Component { BackHandler.removeEventListener("hardwareBackPress"); } - doLogin = () => { - const { componentId } = this.props; + _handleOnPressLogin = () => { + const { componentId, dispatch } = this.props; + const { password, username } = this.state; this.setState({ isLoading: true }); - let password = this.state.password; - let username = this.state.username; - Login(username, password) .then(result => { if (result) { - this.props.dispatch(addNewAccount(result)); + dispatch(addNewAccount(result)); Navigation.setStackRoot(componentId, { component: { name: "navigation.eSteem.PinCode", @@ -125,6 +122,7 @@ class LoginScreen extends Component { const validUsers = await lookupAccounts(username); await this.setState({ isUsernameValid: validUsers.includes(username) }); }; + _handleOnPasswordChange = value => { this.setState({ password: value }); }; @@ -195,28 +193,12 @@ class LoginScreen extends Component { secureTextEntry type="password" /> - - - - User credentials are kept locally on the device. Credentials are - removed upon logout! - - + - - - - - If you don't want to keep your password encrypted and saved on - your device, you can use Steemconnect. - - - +