import { t } from "i18next";
import React, { useCallback } from "react";

import Header from "./Header";
import LoginForm from "./LoginForm";
import LoginSignUpWrapper from "./LoginSignUpWrapper";

const Login = ( ) => {
  const renderLoginForm = useCallback( ( { scrollViewRef } ) => (
    <>
      <Header
        headerText={t( "A-global-community-for-nature" )}
      />
      <LoginForm
        scrollViewRef={scrollViewRef}
      />
    </>
  ), [] );

  return (
    <LoginSignUpWrapper
      backgroundSource={require( "images/background/toucan.jpg" )}
    >
      {renderLoginForm}
    </LoginSignUpWrapper>
  );
};

export default Login;
