/**
 * React Native Full App (https://store.enappd.com/product/react-native-full-app)
 *
 * Copyright © 2019-present Enappd. All rights reserved.
 *
 * This source code is licensed as per the terms found in the
 * LICENSE.md file in the root directory of this source tree.
 */
import React from 'react';
import { Form, Container, Content, H3, Item, Button, Text } from 'native-base';
import { Dimensions, KeyboardAvoidingView } from 'react-native';
import Constants from 'expo-constants';
import styles from './style';
import Firebase, { withFirebase } from '../../../firebase';
import InputBlock from '../../../components/firebase/InputBlock';
import ActionButton from '../../../components/firebase/ActionButton';
import AppIcon from '../../../components/firebase/AppIcon';
import { showToast } from '../../../utils';
import { NavigationStackScreenProps } from 'react-navigation-stack';

const keyboardOffSetAndroid = Constants.platform
  ? Constants.platform.android
    ? Dimensions.get('screen').height -
      Dimensions.get('window').height -
      Constants.statusBarHeight
    : 0
  : null;

interface Iprops extends NavigationStackScreenProps {
  firebase: Firebase;
}

class ForgotPassword extends React.Component<Iprops> {
  state = {
    email: '',
    isLoading: false,
  };

  onChangeEmail = (email: string) => this.setState({ email });

  sendEmail = async () => {
    this.setState({ isLoading: true });
    try {
      const { email } = this.state;
      await this.props.firebase.passwordReset(email);
      showToast('Password reset email sent successfully');
      const { navigate } = this.props.navigation;
      navigate('SignIn');
    } catch (e) {
      console.log(e);
      if (e.message) {
        showToast(e.message);
      }
    }
    this.setState({ isLoading: false });
  };

  gotoLogin = () => this.props.navigation.navigate('SignIn');

  render() {
    const { email, isLoading } = this.state;
    return (
      <Container>
        <KeyboardAvoidingView
          keyboardVerticalOffset={keyboardOffSetAndroid}
          style={styles.KeyboardAvoidingView}
          behavior="padding"
        >
          <Content padder={true} contentContainerStyle={styles.container}>
            <AppIcon />
            <Form>
              <Item style={styles.heading}>
                <H3>Forgot Password</H3>
              </Item>
              <InputBlock
                name="email"
                onChangeText={this.onChangeEmail}
                value={email}
                disabled={isLoading}
              />
              <ActionButton
                onPress={this.sendEmail}
                disabled={email.length < 1}
                displayText="Send Reset Email"
                activityLoading={isLoading}
              />
            </Form>
            <Button
              full={true}
              rounded={true}
              warning={true}
              style={styles.button}
              onPress={this.gotoLogin}
            >
              <Text>Go back to Sign In</Text>
            </Button>
          </Content>
        </KeyboardAvoidingView>
      </Container>
    );
  }
}

export default withFirebase(ForgotPassword);
