import React from 'react';
import { LoginProps } from './types';
import LoginComponent from './login-component';
import ResetPasswordComponent from './reset-password-component';
import ConfirmComponent from './confirm-component';

const Login: React.FC<LoginProps> = ({
  tideClientConfig,
  portalId,
  languageCode,
  imageSrc,
  logo,
  isMemberConfirmation,
  isLoginPage,
  isResetPassword,
  member,
  setMember,
  handleBackToHome,
  handleBackToLogin
}) => {
  return (
    <div className="login">
      <div className="login__img__wrapper">
        <img className="login__img" src={imageSrc ? imageSrc : 'https://cdn.pixabay.com/photo/2022/04/08/06/36/rock-7118843_1280.jpg'} alt="Login" />
      </div>

      <div className="login__container">
        <div className="login__card">
          {logo && <div className="login__logo">{logo}</div>}

          {isLoginPage && (
            <LoginComponent
              tideClientConfig={tideClientConfig}
              portalId={portalId}
              languageCode={languageCode}
              member={member}
              setMember={setMember}
              handleBackToHome={handleBackToHome}
              handleBackToLogin={handleBackToLogin}
            />
          )}
          {isResetPassword && (
            <ResetPasswordComponent
              tideClientConfig={tideClientConfig}
              portalId={portalId}
              languageCode={languageCode}
              member={member}
              setMember={setMember}
              handleBackToHome={handleBackToHome}
              handleBackToLogin={handleBackToLogin}
            />
          )}
          {isMemberConfirmation && (
            <ConfirmComponent
              tideClientConfig={tideClientConfig}
              portalId={portalId}
              languageCode={languageCode}
              member={member}
              setMember={setMember}
              handleBackToHome={handleBackToHome}
              handleBackToLogin={handleBackToLogin}
            />
          )}
        </div>
      </div>
    </div>
  );
};

export default Login;
