Skip to content

Instantly share code, notes, and snippets.

@joeybaker
Created September 26, 2017 15:34
Show Gist options
  • Save joeybaker/a3efd0ed1ab0cdd746fd247eec98d9e6 to your computer and use it in GitHub Desktop.
Save joeybaker/a3efd0ed1ab0cdd746fd247eec98d9e6 to your computer and use it in GitHub Desktop.
// @flow
//
// This is a mininmal example, much of the real component is stripped out.
//
import React, { PureComponent } from 'react'
import { Image, Alert } from 'react-native'
import autobind from 'autobind-decorator'
import styled from 'styled-components/native'
import Form from '../../components/Form/Form.component'
import { getStatusBarHeight } from '../../lib/dimensions'
const ContactContainer = styled.View`
align-items: flex-end;
padding-top: ${getStatusBarHeight()}
`
const SecondaryButtonsContainer = styled.View`
flex-direction: row;
justify-content: space-between;
align-content: space-between;
`
const FormContainer = styled.View`
flex: 2;
`
const ImageContainer = styled.View`
flex: 1;
justify-content: center;
align-items: center;
`
const NewAccountContainer = styled.View`
flex-shrink: 1;
flex-grow: 0;
`
export default class Login extends PureComponent {
props: Props
state: State = {
formFields: {},
}
componentWillReceiveProps(nextProps: Props): void {
const oldProps = this.props
const {
loginLoading,
loginSuccess,
forgottenPasswordLoading,
forgottenPasswordError,
isConnected,
} = nextProps
const wasLoginLoading = oldProps.loginLoading && !loginLoading
const wasForgottenPasswordLoading =
oldProps.forgottenPasswordLoading
&& !forgottenPasswordLoading
const isNowLoggedIn =
oldProps.loginSuccess !== loginSuccess
&& loginSuccess
if (wasLoginLoading && isNowLoggedIn) {
this.props.navigate()
}
if (forgottenPasswordError && !oldProps.forgottenPasswordError) {
Alert.alert()
}
if (
wasForgottenPasswordLoading
&& !forgottenPasswordError
&& this.state.formFields.email
) {
Alert.alert()
}
}
componentWillUnmount() {
this.props.clearError()
}
valid(): boolean {
return !!this.state.formFields.email && !!this.state.formFields.password
}
@autobind
updateFormFields(field: string): (string) => void {
return (value: string) => {
const formFields = { ...this.state.formFields }
formFields[field] = value
this.setState({ formFields })
}
}
@autobind
onPressCreateNewAccount() {
this.props.navigate()
}
render() {
return (
<Form />
)
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment