'use client' import React from 'react' import { zodResolver } from '@hookform/resolvers/zod' import { useForm } from 'react-hook-form' import * as z from 'zod' import { PLACEHOLDER_EMAIL_FORM } from '@/lib/constants' import { graphql } from '@/lib/gql/generates/gql' import { RequestInvitationEmailMutation } from '@/lib/gql/generates/graphql' import { useMutation } from '@/lib/tabby/gql' import { Button } from '@/components/ui/button' import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from '@/components/ui/form' import { IconSpinner } from '@/components/ui/icons' import { Input } from '@/components/ui/input' const requestInvitationEmailMutation = graphql(/* GraphQL */ ` mutation requestInvitationEmail($input: RequestInvitationInput!) { requestInvitationEmail(input: $input) { email code } } `) const formSchema = z.object({ email: z.string().email('Invalid email address') }) type FormValeus = z.infer interface SelfSignupFormProps { onSuccess?: ( data: RequestInvitationEmailMutation['requestInvitationEmail'] ) => void } export const SelfSignupForm: React.FC = ({ onSuccess }) => { const form = useForm({ resolver: zodResolver(formSchema) }) const { isSubmitting } = form.formState const requestInvitationEmail = useMutation(requestInvitationEmailMutation, { form }) const onSubmit = (values: FormValeus) => { return requestInvitationEmail({ input: values }).then(res => { if (res?.data?.requestInvitationEmail?.code) { onSuccess?.(res.data.requestInvitationEmail) } }) } return ( ) }