implemented session

app/client/pages/register.tsx

@@ -2,9 +2,10 @@ import { gql } from '@apollo/client';
 import { Heading, Input, Stack } from '@chakra-ui/react';
 import { Button } from '@client/components/ui/button';
 import { Field } from '@client/components/ui/field';
+import { PasswordInput } from '@client/components/ui/password-input';
 import { Session } from '@generated/types';
 import { valibotResolver } from '@hookform/resolvers/valibot';
-import { createFileRoute, redirect } from '@tanstack/react-router';
+import { createFileRoute, useNavigate } from '@tanstack/react-router';
 import { useForm } from 'react-hook-form';
 import * as v from 'valibot';
 import { useToastMutation } from '../hooks/useToastMutation';
@@ -30,7 +31,11 @@ interface FormValues {
 }
 
 function SignUpForm() {
-  const { update: signUp } = useToastMutation<Session>({ mutation });
+  const navigate = useNavigate();
+  const { update: signUp } = useToastMutation<Session>({
+    mutation,
+    successMsg: 'Account created successfully'
+  });
 
   const schema = v.pipe(
     v.object({
@@ -65,7 +70,7 @@ function SignUpForm() {
         }
       }
     });
-    redirect({
+    navigate({
       to: '/login'
     });
   });
@@ -88,14 +93,14 @@ function SignUpForm() {
           invalid={errors.password != null}
           errorText={errors.password?.message}
         >
-          <Input {...register('password')} />
+          <PasswordInput {...register('password')} />
         </Field>
         <Field
           label="Confirm password"
           invalid={errors.confirm_password != null}
           errorText={errors.confirm_password?.message}
         >
-          <Input {...register('confirm_password')} />
+          <PasswordInput {...register('confirm_password')} />
         </Field>
         <Button type="submit">Submit</Button>
       </Stack>