janhesters

import LocalizedStrings from "react-native-localization";

let strings = new LocalizedStrings({
  en: {
    emailAddress: "Email address",
    password: "Password",
    invalidEmailFormat: "A valid email can only contain latin letters, numbers, '@' and '.'.",
    emailRequired: "An email address is required.",
    passwordRequired: "A password is required.",
    passwordMinLength: "A secure password must be at least 8 characters long."

janhesters

import LoginForm from "./LoginForm";

export default LoginForm;

janhesters

import strings from "./strings";
import styles from "./styles";
import { strings as loginStrings } from "../../screens/Login";
import React, { Component } from "react";
import { View } from "react-native";
import { Button, Input } from "react-native-elements";
import { NavigationScreenProp } from "react-navigation";

interface Props {
  navigation: NavigationScreenProp<any, any>

janhesters

// ... imports
import LoginForm from "../../components/LoginForm";
import { KeyboardAvoidingView, Platform } from "react-native";
import { NavigationScreenProp } from "react-navigation";

interface Props {
  navigation: NavigationScreenProp<any, any>
}

export default class LoginScreen extends Component<Props, object> {

janhesters

// ... imports
import { Formik, FormikProps, FormikActions } from "formik";

interface FormValues {
  email: string;
  password: string;
}

interface Props {
  navigation: NavigationScreenProp<any, any>

janhesters

handleSubmit = (values: FormValues, formikBag: FormikActions<FormValues>) => {
  formikBag.setSubmitting(true);
  // Here you would usually make a call to your API for a login.
  setTimeout(() => {
    formikBag.setSubmitting(false);
    this.props.navigation.navigate("HomeScreen");
  }, 3000);
};

janhesters

onSubmit={(values: FormValues, formikBag: FormikActions<FormValues>) =>
  this.handleSubmit(values, formikBag)
}

janhesters

import { object as yupObject, string as yupString } from "yup";

// ...

validationSchema={yupObject().shape({
  email: yupString()
    .email(strings.invalidEmailFormat)
    .required(strings.emailRequired),
  password: yupString()
    .min(8, strings.passwordMinLength)

janhesters

<KeyboardAvoidingView
  style={styles.container}
  behavior={Platform.OS === "ios" ? "padding" : undefined}
>

janhesters

describe("rendering", () => {
    let wrapper: ShallowWrapper;
    let props: Props;
    let Platform: PlatformStatic;
    beforeEach(() => {
      props = createTestProps({});
      wrapper = shallow(<LoginScreen {...props} />);
      Platform = require("react-native").Platform;
    });