# All files / forgot/components ForgotForm.tsx

88.89% Statements 8/9
100% Branches 2/2
50% Functions 1/2
88.89% Lines 8/9

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    723x
    3x
    3x

    3x

    3x

    3x

    7x

    3x
     import React from 'react';
    import { View } from 'react-native';
    import {
      CrossEditor,
      CrossButton,
      ICrossButtonProps,
    } from 'react-native-cross-components';
    import styles from '../../styles';
    import { IEmailProps } from '../../types';
    import { Colors } from 'react-native-cross-components';

    /**
     * Properties for {@link ForgotForm} component. Required prop is {@link onSubmit}.
     */
    export interface IForgotFormProps extends IEmailProps {
      /**
       * Occurs when the user clicks "reset password" button. Required.
       */
      onSubmit: () => void;
      /**
       * Optional props for the submit button. Typically used to change the `title` prop.
       *
       * Read more:
       * https://crossplatformsweden.github.io/react-native-components/interfaces/_components_buttons_crossbutton_.icrossbuttonprops.html
       *
       * @example
       *  <ForgotForm buttonProps={{title: 'Warp'}}>
       *     <Text>Custom layouts here</Text>
       *  </ForgotForm>
       */
      buttonProps?: ICrossButtonProps | undefined;
      testID: string;
    }

    /**
     * Allows the user to input e-mail and press "Resend password" button.
     *
     * Expects {@link IForgotFormProps.onSubmit} callback event.
     *
     * Properties are {@link IForgotFormProps}.
     */
    export class ForgotForm extends React.Component<IForgotFormProps> {
      render() {
        return (
          <View style={[styles.container]} testID={this.props.testID}>
            {this.props.children}
            <CrossEditor
              label="E-mail"
              placeholder="E-mail"
              autoCapitalize="none"
              clearButtonMode="always"
              autoCorrect={false}
              value={this.props.initialEmail || ''}
              onChangeText={(text: string) => this.props.onEmailChanged(text)}
              {...this.props.emailInputProps}
            />
            <CrossButton
              style={styles.marginTop10}
              buttonStyle={styles.buttonStyle}
              onPress={this.props.onSubmit}
              mode="contained"
              title="Reset password"
              backgroundColor={Colors.NextButton}
              {...this.props.buttonProps}
            />
          </View>
        );
      }
    }

    export default ForgotForm;