src/pages/signup.tsx · super-fit-web-app

import { useEffect, FormEvent } from 'react';
import { useRouter } from 'next/router'
import SignUpForm from '@/components/app/SignUpForm';
import Head from 'next/head';
import MainLayout from '@/layouts/main-layout';
import { toast } from 'react-toastify';
import { trpc } from '@/utils/trpc';
import { useUserContext } from '@/context/UserContext';

interface SignUpFormProps {
  firstName: string;
  lastName: string;
  email: string;
  age: string;
  height: string;
  weight: string;
  gender: string;
  password: string;
}

export default function SignUp() {
  const { userData, session_valid, userSessionDataLoading } = useUserContext();
  const router = useRouter();

  if (session_valid && !userSessionDataLoading) router.push('/dashboard')

  const handleSignUp = async (data: SignUpFormProps, e: FormEvent<HTMLFormElement> & {target: HTMLFormElement}) => {
    try {
      await signUp(data)
      e.target.reset();
      router.push('/dashboard')
    } catch (err: any) {
      toast.error(err.response?.data?.message || err.message)
    }
  }

  const { data, mutateAsync: signUp, error } = trpc.auth.signUp.useMutation()

  return (
    <MainLayout>
      <Head>
        <title>Super Fit | Sign Up</title>
      </Head>
      <SignUpForm
        onSubmit={handleSignUp}
      />
    </MainLayout>
  );
}