import React, { FC } from 'react';
import Container from '@material-ui/core/Container';
import { Redirect, Route, useRouteMatch } from 'react-router-dom';
import { AuthRoutes, NonAuthRoutes } from 'api/routes';
import { ChoseRole } from 'components/Auth/ChoseRole/ChoseRole';
import { SignInForm } from 'components/Auth/SignInForm/SignInForm';
import { SignUpForm } from 'components/Auth/SignUpForm/SignUpForm';

/**
 * Keeps all components related to SignIn/SignOut logic.
 */
export const AuthUser: FC = () => {
  const { path } = useRouteMatch();
  return (
    <Container maxWidth="sm">
      <Route path={`${path}${NonAuthRoutes.signIn}`} component={SignInForm} />
      <Route path={`${path}${NonAuthRoutes.signUp}`} component={SignUpForm} />
      <Route path={`${path}${AuthRoutes.choseRole}`} component={ChoseRole} />
    </Container>
  );
};