From ccfbfb7585e278715d96d8d599245726c37baa65 Mon Sep 17 00:00:00 2001
From: Sarah Guthals <sarah@guthals.com>
Date: Wed, 13 Nov 2024 20:33:09 -0800
Subject: [PATCH 1/2] [launch week] Add submission form on the UI

---
 src/pages/FormSubmission.tsx | 71 ++++++++++++++++++++++++++++++++++++
 1 file changed, 71 insertions(+)
 create mode 100644 src/pages/FormSubmission.tsx

diff --git a/src/pages/FormSubmission.tsx b/src/pages/FormSubmission.tsx
new file mode 100644
index 0000000000..fb4ac75b2c
--- /dev/null
+++ b/src/pages/FormSubmission.tsx
@@ -0,0 +1,71 @@
+interface CustomFormData {
+  name: string
+  email: string
+  phoneNumber: string
+}
+
+const handleSubmit = (event: Event): void => {
+  event.preventDefault()
+
+  const form = event.target as HTMLFormElement
+  const formData: CustomFormData = {
+    name: (form.elements.namedItem('name') as HTMLInputElement).value,
+    email: (form.elements.namedItem('email') as HTMLInputElement).value,
+    phoneNumber: (form.elements.namedItem('phone') as HTMLInputElement).value,
+  }
+
+  const errors = validateFormData(formData)
+
+  try {
+    submitForm(formData)
+    if (errors.length > 0) {
+      displayErrors(errors)
+    } else {
+      displaySuccessMessage('Form submitted successfully!')
+    }
+  } catch (error) {
+    displayErrorMessage('Failed to submit the form.')
+  }
+}
+
+const validateFormData = (data: CustomFormData): string[] => {
+  const errors: string[] = []
+
+  if (!data.name.trim()) {
+    errors.push('Name is required.')
+  }
+
+  if (!data.email.trim()) {
+    errors.push('Email is required.')
+  } else if (!validateEmail(data.email)) {
+    errors.push('Email is invalid.')
+  }
+
+  return errors
+}
+
+const validateEmail = (email: string): boolean => {
+  const emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/
+  return emailPattern.test(email)
+}
+
+const submitForm = (data: CustomFormData): void => {
+  console.log('Submitting form:', data)
+}
+
+const displayErrors = (errors: string[]): void => {
+  console.error('Form errors:', errors)
+}
+
+const displaySuccessMessage = (message: string): void => {
+  console.log(message)
+}
+
+const displayErrorMessage = (message: string): void => {
+  console.error(message)
+}
+
+const form = document.querySelector('form')
+if (form) {
+  form.addEventListener('submit', handleSubmit)
+}
\ No newline at end of file

From 9f91f73514dec9967ad13d026384c5d74503fceb Mon Sep 17 00:00:00 2001
From: Sarah Guthals <sarah@guthals.com>
Date: Wed, 13 Nov 2024 20:40:02 -0800
Subject: [PATCH 2/2] Update src/pages/FormSubmission.tsx

Co-authored-by: codecov-ai[bot] <156709835+codecov-ai[bot]@users.noreply.github.com>
---
 src/pages/FormSubmission.tsx | 11 +++++------
 1 file changed, 5 insertions(+), 6 deletions(-)

diff --git a/src/pages/FormSubmission.tsx b/src/pages/FormSubmission.tsx
index fb4ac75b2c..18ff2308c0 100644
--- a/src/pages/FormSubmission.tsx
+++ b/src/pages/FormSubmission.tsx
@@ -16,13 +16,12 @@ const handleSubmit = (event: Event): void => {
 
   const errors = validateFormData(formData)
 
-  try {
+if (errors.length > 0) {
+    displayErrors(errors)
+  } else {
     submitForm(formData)
-    if (errors.length > 0) {
-      displayErrors(errors)
-    } else {
-      displaySuccessMessage('Form submitted successfully!')
-    }
+    displaySuccessMessage('Form submitted successfully!')
+  }
   } catch (error) {
     displayErrorMessage('Failed to submit the form.')
   }