Nest authuser components route

src/App.tsx

@@ -9,12 +9,13 @@ import { NotFound } from 'components/NotFound/NotFound';
 import { ProfilePage } from 'components/ProfilePage/ProfilePage';
 import { Roles } from 'components/api/userRoles';
 import { Unauthorized } from 'components/Unauthorized/Unauthorized';
+import { SignUpForm } from 'components/AuthUser/SignUpForm/SignUpForm';
 
 export const App: FC = () => (
   <Router>
     <div data-testid="App">
       <Switch>
-        <Route path={NonAuthRoutes.signIn} component={AuthUser} />
+        <Route path={NonAuthRoutes.auth} component={AuthUser} />
         <Route exact path={NonAuthRoutes.home} component={LandingPage} />
         <PrivateRoute
           path={AuthRoutes.dashboard}

src/components/AuthUser/AuthUser.tsx

 import React, { FC, useEffect } from 'react';
 import axios from 'axios';
 import Container from '@material-ui/core/Container';
-import { SignInForm } from './SignInForm/SignInForm';
+import { Route, useRouteMatch } from 'react-router-dom';
+import { NonAuthRoutes } from 'components/api/routes';
+import { SignInForm } from 'components/AuthUser/SignInForm/SignInForm';
+import { SignUpForm } from 'components/AuthUser/SignUpForm/SignUpForm';
 
 const configDjangoCookieName = (): void => {
   axios.defaults.xsrfHeaderName = 'X-CSRFTOKEN';
@@ -10,6 +13,7 @@ const configDjangoCookieName = (): void => {
 };
 
 export const AuthUser: FC = () => {
+  const { path } = useRouteMatch();
   configDjangoCookieName();
   useEffect(() => {
     axios
@@ -23,7 +27,8 @@ export const AuthUser: FC = () => {
   }, []);
   return (
     <Container maxWidth="sm">
-      <SignInForm />
+      <Route path={`${path}${NonAuthRoutes.signIn}`} component={SignInForm} />
+      <Route path={`${path}${NonAuthRoutes.signUp}`} component={SignUpForm} />
     </Container>
   );
 };