chore: fixed forms

Signed-off-by: tyloo <[email protected]>

Author: tyloo

.env.example

@@ -1,4 +1,5 @@
 RESEND_API_KEY=
+RESEND_AUDIENCE_ID=
 CONTACT_SENDER_NAME=
 CONTACT_SENDER_EMAIL=
 CONTACT_RECIPIENT_NAME=

src/components/contact-form.tsx

@@ -20,8 +20,8 @@ export default function ContactForm() {
   const [captchaEnabled, setCaptchaEnabled] = useState(false)
 
   const {
-    watch,
     register,
+    watch,
     handleSubmit,
     reset,
     formState: { errors, isSubmitting }

src/components/newsletter-form.tsx

@@ -20,8 +20,8 @@ export default function NewsletterForm() {
   const [captchaEnabled, setCaptchaEnabled] = useState(false)
 
   const {
-    watch,
     register,
+    watch,
     handleSubmit,
     reset,
     formState: { errors, isSubmitting }
@@ -40,7 +40,9 @@ export default function NewsletterForm() {
   }
 
   const processForm: SubmitHandler<Inputs> = async data => {
-    const result = await subscribe(data)
+    const captcha = (await captchaRef.current?.executeAsync()) as string
+
+    const result = await subscribe({ ...data, captcha })
 
     if (result?.error) {
       toast.error('An error occurred! Please try again.')

src/lib/actions.ts

@@ -29,17 +29,17 @@ async function checkRecaptcha(recaptcha: string): Promise<boolean> {
   return response.success
 }
 
-export async function sendEmail(data: ContactFormInputs) {
-  const result = ContactFormSchema.safeParse(data)
+export async function sendEmail(ContactFormInput: ContactFormInputs) {
+  const result = ContactFormSchema.safeParse(ContactFormInput)
 
   if (result.error) {
     return { error: result.error.format() }
   }
 
   try {
-    checkRecaptcha(result.data.captcha)
+    const { name, email, message, captcha } = result.data
+    checkRecaptcha(captcha)
 
-    const { name, email, message } = result.data
     const { data, error } = await resend.emails.send({
       from: `${process.env.CONTACT_SENDER_NAME} <${process.env.CONTACT_SENDER_EMAIL}>`,
       to: [
@@ -60,20 +60,20 @@ export async function sendEmail(data: ContactFormInputs) {
   }
 }
 
-export async function subscribe(data: NewsletterFormInputs) {
-  const result = NewsletterFormSchema.safeParse(data)
+export async function subscribe(newwsletterFormInput: NewsletterFormInputs) {
+  const result = NewsletterFormSchema.safeParse(newwsletterFormInput)
 
   if (result.error) {
     return { error: result.error.format() }
   }
 
   try {
-    checkRecaptcha(result.data.captcha)
+    const { email, captcha } = result.data
+    checkRecaptcha(captcha)
 
-    const { email } = result.data
     const { data, error } = await resend.contacts.create({
-      email: email,
-      audienceId: process.env.RESEND_AUDIENCE_ID as string
+      audienceId: process.env.RESEND_AUDIENCE_ID as string,
+      email: email
     })
 
     if (!data || error) {

src/lib/schemas.ts

@@ -7,10 +7,10 @@ export const ContactFormSchema = z.object({
     .min(2, 'Must be at least 2 characters.'),
   email: z.string().email().min(1, 'Email is required.'),
   message: z.string().min(1, 'Message is required.'),
-  captcha: z.string().min(1, 'Captcha is required.')
+  captcha: z.string()
 })
 
 export const NewsletterFormSchema = z.object({
   email: z.string().email('Invalid email.'),
-  captcha: z.string().min(1, 'Captcha is required.')
+  captcha: z.string()
 })