WIP: Show login form when clicked on login button

app/main.wasp

@@ -201,10 +201,10 @@ page LoginPage {
   component: import Login from "@src/client/auth/LoginPage"
 }
 
-// route SignupRoute { path: "/signup", to: SignupPage }
-// page SignupPage {
-//   component: import { Signup } from "@src/client/auth/SignupPage"
-// }
+route SignupRoute { path: "/signup", to: SignupPage }
+page SignupPage {
+  component: import { Signup } from "@src/client/auth/SignupPage"
+}
 
 route TocPageRoute { path: "/toc", to: TocPage }
 page TocPage {

app/src/client/auth/LoginPage.tsx

@@ -2,11 +2,8 @@ import { createTheme } from '@stitches/react';
 import { useAuth } from 'wasp/client/auth';
 import { useHistory } from 'react-router-dom';
 import { useEffect } from 'react';
-import { Link } from 'react-router-dom';
-// import { LoginForm } from '@wasp/auth/forms/Login';
 import { AuthWrapper } from './authWrapper';
 import Auth from './Auth';
-// import { State } from 'wasp/auth/forms/types';
 import imgUrl from '../static/captn-logo-large.png';
 
 export enum State {
@@ -28,22 +25,6 @@ export default function Login() {
   return (
     <AuthWrapper>
       <LoginForm logo={imgUrl} state={State.Login} />
-      {/* <br />
-      <span className='text-sm font-medium text-captn-dark-blue dark:text-captn-dark-blue'>
-        Don't have an account yet?{' '}
-        <Link to='/signup' className='underline'>
-          go to signup
-        </Link>
-        .
-      </span>
-      <br />
-      <span className='text-sm font-medium text-captn-dark-blue'>
-        Forgot your password?{' '}
-        <Link to='/request-password-reset' className='underline'>
-          reset it
-        </Link>
-        .
-      </span> */}
     </AuthWrapper>
   );
 }

app/src/client/auth/LoginSignupForm.tsx

@@ -6,6 +6,7 @@ import { AuthContext } from './Auth';
 import config from './configs/config';
 import TosAndMarketingEmails from '../components/TosAndMarketingEmails';
 import { State } from './Auth';
+import { Link } from 'wasp/client/router';
 
 const SocialAuth = styled('div', {
   marginTop: '1.5rem',
@@ -192,15 +193,23 @@ export const LoginSignupForm = ({
       </SocialAuth>
       <div className='flex items-center justify-center'>
         <span className='text-sm block'>
-          {loginFlow === State.Login
+          {/* {loginFlow === State.Login
             ? "Don't have an account? "
-            : 'Already have an account? '}
-          <a
+            : 'Already have an account? '} */}
+          {/* <a
             className='no-underline hover:underline cursor-pointer'
             onClick={toggleLoginFlow}
           >
             {loginFlow === State.Login ? State.Signup : State.Login}
-          </a>
+          </a> */}
+          <Link
+            to={loginFlow === State.Login ? '/signup' : '/login'}
+            className='underline'
+          >
+            {loginFlow === State.Login
+              ? "Don't have an account? "
+              : 'Already have an account? '}
+          </Link>
         </span>
       </div>
     </>

app/src/client/auth/SignupPage.tsx

@@ -1,20 +1,11 @@
-import { SignupForm } from "wasp/client/auth";
-import { Link } from 'react-router-dom';
 import { AuthWrapper } from './authWrapper';
+import imgUrl from '../static/captn-logo-large.png';
+import { State, LoginForm } from './LoginPage';
 
 export function Signup() {
   return (
     <AuthWrapper>
-      <SignupForm />
-      <br />
-      <span className='text-sm font-medium text-captn-dark-blue'>
-        I already have an account (
-        <Link to='/login' className='underline'>
-          go to login
-        </Link>
-        ).
-      </span>
-      <br />
+      <LoginForm logo={imgUrl} state={State.Signup} />
     </AuthWrapper>
   );
 }