Sample of relay queries

SignIn.tsx

import {Button, EditText} from 'dooboo-ui';
import React, {FC, useState} from 'react';

import {RootStackNavigationProps} from '../navigations/RootStack';
import styled from '@emotion/native';

const Container = styled.View`
  flex: 1;
  background-color: transparent;
  padding: 0 40px;

  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
`;

interface Props {
  navigation: RootStackNavigationProps<'default'>;
}

const User: FC<Props> = () => {
  const [email, setEmail] = useState<string>('');
  const [password, setPassword] = useState<string>('');

  const signIn = (): void => {};

  return (
    <Container>
      <EditText
        style={{marginTop: 48}}
        labelText="Email"
        placeholder="email@email.com"
        value={email}
        onChangeText={(text) => {
          setEmail(text);
        }}
        onSubmitEditing={signIn}
      />
      <EditText
        style={{marginVertical: 24}}
        labelText="Password"
        secureTextEntry
        placeholder="******"
        value={password}
        onChangeText={(text) => {
          setPassword(text);
        }}
        onSubmitEditing={signIn}
      />
      <Button onPress={signIn} text="Sign In" loading={isInFlight} />
    </Container>
  );
};

export default User;