From 7ac29763272f56a002ebb6d46ef8c766b3296fb7 Mon Sep 17 00:00:00 2001
From: saim hashmi <hashmisaim037@gmail.com>
Date: Sun, 8 Dec 2024 00:06:51 -0500
Subject: [PATCH 1/6] feat(contact): created contact page skeleton

---
 libs/website/feature/contactpage/contact.tsx  | 234 ++++++++++++++++++
 .../contactpage/contactFormValidation.ts      |  49 ++++
 libs/website/pages/home.tsx                   |   3 +
 .../navbar/constants/navbar.constants.ts      |   1 +
 4 files changed, 287 insertions(+)
 create mode 100644 libs/website/feature/contactpage/contact.tsx
 create mode 100644 libs/website/feature/contactpage/contactFormValidation.ts

diff --git a/libs/website/feature/contactpage/contact.tsx b/libs/website/feature/contactpage/contact.tsx
new file mode 100644
index 000000000..74e22b342
--- /dev/null
+++ b/libs/website/feature/contactpage/contact.tsx
@@ -0,0 +1,234 @@
+import type { FormData, FormErrors } from './contactFormValidation'
+import cuHackingLogo from '@cuhacking/shared/assets/logos/cuHacking/cuhacking-logo-1.svg'
+import { GlassmorphicCard } from '@cuhacking/shared/ui/src/cuHacking/components/glassmorphic-card'
+import { TerminalText } from '@cuhacking/shared/ui/src/cuHacking/components/terminal-text'
+import React, { useState } from 'react'
+import { validateForm } from './contactFormValidation'
+
+export default function ContactPage() {
+  const [formData, setFormData] = useState<FormData>({
+    name: '',
+    email: '',
+    subject: '',
+    message: '',
+  })
+
+  const [errors, setErrors] = useState<FormErrors>({})
+  const [isLoading, setIsLoading] = useState(false)
+  const [submitStatus, setSubmitStatus] = useState<'idle' | 'success' | 'error'>('idle')
+
+  const handleChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {
+    const { name, value } = e.target
+    setFormData(prev => ({
+      ...prev,
+      [name]: value,
+    }))
+    if (errors[name as keyof FormErrors]) {
+      setErrors(prev => ({
+        ...prev,
+        [name]: undefined,
+      }))
+    }
+  }
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault()
+    setIsLoading(true)
+    setSubmitStatus('idle')
+
+    const validationErrors = validateForm(formData)
+    if (Object.keys(validationErrors).length > 0) {
+      setErrors(validationErrors)
+      setIsLoading(false)
+      return
+    }
+
+    try {
+      await new Promise(resolve => setTimeout(resolve, 1500))
+      setSubmitStatus('success')
+      setFormData({
+        name: '',
+        email: '',
+        subject: '',
+        message: '',
+      })
+    }
+    catch {
+      setSubmitStatus('error')
+    }
+    finally {
+      setIsLoading(false)
+    }
+  }
+
+  return (
+    <div className="flex justify-center w-full bg-black text-white min-h-screen">
+      <div className="w-full max-w-screen-xl px-5 py-5 lg:px-20 lg:py-14">
+        {/* GlassmorphicCard Wrapper */}
+        <GlassmorphicCard className="flex flex-col justify-between gap-8 w-full h-auto p-6">
+          <div className="mb-8">
+            <h1 className="text-3xl font-bold mb-3 pl-5 sm:pl-10">
+              Contact Us
+            </h1>
+            <TerminalText>
+              <p className="text-lg pl-5 sm:pl-10">
+                Feel free to ask us anything! We're here to help.
+              </p>
+            </TerminalText>
+          </div>
+
+          <div className="flex flex-col md:flex-row gap-8">
+            {/* Contact Form in a Separate Glass Card */}
+            <GlassmorphicCard className="w-full md:w-2/3 p-6 h-auto">
+              <form onSubmit={handleSubmit} className="flex flex-col gap-y-6">
+                {/* Status Messages */}
+                {submitStatus === 'success' && (
+                  <div className="p-4 bg-green-500 bg-opacity-20 rounded-lg text-green-400">
+                    Message sent successfully!
+                  </div>
+                )}
+                {submitStatus === 'error' && (
+                  <div className="p-4 bg-red-500 bg-opacity-20 rounded-lg text-red-400">
+                    Failed to send message. Please try again.
+                  </div>
+                )}
+
+                <div className="grid grid-cols-1 sm:grid-cols-2 gap-6">
+                  {/* Name Field */}
+                  <div className="flex flex-col gap-y-1">
+                    <input
+                      type="text"
+                      name="name"
+                      value={formData.name}
+                      onChange={handleChange}
+                      className={`p-3 bg-gray-900 rounded-lg text-white focus:outline-none focus:ring-2 ${
+                        errors.name ? 'ring-2 ring-red-500' : 'focus:ring-green-500'
+                      } transition-all`}
+                      placeholder="Your Name"
+                      required
+                    />
+                    {errors.name && (
+                      <span className="text-red-400 text-sm">{errors.name}</span>
+                    )}
+                  </div>
+
+                  {/* Email Field */}
+                  <div className="flex flex-col gap-y-1">
+                    <input
+                      type="email"
+                      name="email"
+                      value={formData.email}
+                      onChange={handleChange}
+                      className={`p-3 bg-gray-900 rounded-lg text-white focus:outline-none focus:ring-2 ${
+                        errors.email
+                          ? 'ring-2 ring-red-500'
+                          : 'focus:ring-green-500'
+                      } transition-all`}
+                      placeholder="Your Email"
+                      required
+                    />
+                    {errors.email && (
+                      <span className="text-red-400 text-sm">{errors.email}</span>
+                    )}
+                  </div>
+                </div>
+
+                {/* Subject Field */}
+                <div className="flex flex-col gap-y-1">
+                  <input
+                    type="text"
+                    name="subject"
+                    value={formData.subject}
+                    onChange={handleChange}
+                    className={`p-3 bg-gray-900 rounded-lg text-white focus:outline-none focus:ring-2 ${
+                      errors.subject
+                        ? 'ring-2 ring-red-500'
+                        : 'focus:ring-green-500'
+                    } transition-all`}
+                    placeholder="Subject"
+                    required
+                  />
+                  {errors.subject && (
+                    <span className="text-red-400 text-sm">
+                      {errors.subject}
+                    </span>
+                  )}
+                </div>
+
+                {/* Message Field */}
+                <div className="flex flex-col gap-y-1">
+                  <textarea
+                    name="message"
+                    value={formData.message}
+                    onChange={handleChange}
+                    className={`p-3 bg-gray-900 rounded-lg text-white focus:outline-none focus:ring-2 ${
+                      errors.message
+                        ? 'ring-2 ring-red-500'
+                        : 'focus:ring-green-500'
+                    } resize-none transition-all`}
+                    rows={5}
+                    placeholder="Your Message"
+                    required
+                  />
+                  {errors.message && (
+                    <span className="text-red-400 text-sm">
+                      {errors.message}
+                    </span>
+                  )}
+                </div>
+
+                {/* Submit Button */}
+                <button
+                  type="submit"
+                  disabled={isLoading}
+                  className="py-3 px-8 bg-green-500 text-black font-semibold tracking-wide rounded-lg hover:bg-green-600 transition-all duration-200 w-full sm:w-auto disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center"
+                >
+                  {isLoading
+                    ? (
+                        <>
+                          <svg
+                            className="animate-spin -ml-1 mr-3 h-5 w-5 text-black"
+                            xmlns="http://www.w3.org/2000/svg"
+                            fill="none"
+                            viewBox="0 0 24 24"
+                          >
+                            <circle
+                              className="opacity-25"
+                              cx="12"
+                              cy="12"
+                              r="10"
+                              stroke="currentColor"
+                              strokeWidth="4"
+                            >
+                            </circle>
+                            <path
+                              className="opacity-75"
+                              fill="currentColor"
+                              d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
+                            >
+                            </path>
+                          </svg>
+                          Sending...
+                        </>
+                      )
+                    : (
+                        'Send Message'
+                      )}
+                </button>
+              </form>
+            </GlassmorphicCard>
+
+            {/* Right Side: Logo */}
+            <GlassmorphicCard className="p-6 flex-1 flex items-center justify-center">
+              <img
+                src={cuHackingLogo}
+                alt="cuHacking logo"
+                className="w-48 md:w-56 lg:w-64 transition-transform duration-300 hover:scale-105"
+              />
+            </GlassmorphicCard>
+          </div>
+        </GlassmorphicCard>
+      </div>
+    </div>
+  )
+}
diff --git a/libs/website/feature/contactpage/contactFormValidation.ts b/libs/website/feature/contactpage/contactFormValidation.ts
new file mode 100644
index 000000000..31b3f4658
--- /dev/null
+++ b/libs/website/feature/contactpage/contactFormValidation.ts
@@ -0,0 +1,49 @@
+export interface FormData {
+  name: string
+  email: string
+  subject: string
+  message: string
+}
+
+export interface FormErrors {
+  name?: string
+  email?: string
+  subject?: string
+  message?: string
+}
+
+/* Correct function definition */
+export function validateForm(values: FormData): FormErrors {
+  const errors: FormErrors = {}
+
+  /* Name validation */
+  if (!values.name.trim()) {
+    errors.name = 'Name is required'
+  }
+  else if (values.name.length < 2) {
+    errors.name = 'Name must be at least 2 characters'
+  }
+  /* Email validation */
+  if (!values.email) {
+    errors.email = 'Email is required'
+  }
+  else if (!/^[\w.%+-]+@[A-Z0-9.-]+\.[A-Z]{2,}$/i.test(values.email)) {
+    errors.email = 'Invalid email address'
+  }
+  /* Subject validation */
+  if (!values.subject.trim()) {
+    errors.subject = 'Subject is required'
+  }
+  else if (values.subject.length < 3) {
+    errors.subject = 'Subject must be at least 3 characters'
+  }
+  /* Message validation */
+  if (!values.message.trim()) {
+    errors.message = 'Message is required'
+  }
+  else if (values.message.length < 10) {
+    errors.message = 'Message must be at least 10 characters'
+  }
+
+  return errors
+}
diff --git a/libs/website/pages/home.tsx b/libs/website/pages/home.tsx
index 76a3302ae..4c8a5abe7 100644
--- a/libs/website/pages/home.tsx
+++ b/libs/website/pages/home.tsx
@@ -1,8 +1,10 @@
 import React from 'react'
+import Contactcard from '../feature/contactpage/contact'
 import { EventSection } from '../feature/events'
 import { FAQSection } from '../feature/faq'
 import { MissionSection, WelcomeSection } from '../feature/introduction'
 import { SponsorshipSection } from '../feature/sponsorship'
+
 import { Layout } from '../layouts/base'
 
 export function Home() {
@@ -13,6 +15,7 @@ export function Home() {
       <EventSection />
       <SponsorshipSection />
       <FAQSection />
+      <Contactcard />
     </Layout>
   )
 }
diff --git a/libs/website/shared/ui/navigation/navbar/constants/navbar.constants.ts b/libs/website/shared/ui/navigation/navbar/constants/navbar.constants.ts
index f8d663877..66d212fb6 100644
--- a/libs/website/shared/ui/navigation/navbar/constants/navbar.constants.ts
+++ b/libs/website/shared/ui/navigation/navbar/constants/navbar.constants.ts
@@ -14,6 +14,7 @@ const links = [
   { name: 'EVENTS', link: '/#events' },
   { name: 'SPONSORS', link: '/#sponsors' },
   { name: 'FAQ', link: '/#faq' },
+  { name: 'CONTACT US', link: '/#contactpage' },
 ]
 
 const socials = [

From a2d801408ee2a3b3e9be533131e38bffbeb78690 Mon Sep 17 00:00:00 2001
From: saim hashmi <hashmisaim037@gmail.com>
Date: Sun, 8 Dec 2024 00:22:19 -0500
Subject: [PATCH 2/6] feat(contact): contact page navlink updated

---
 libs/website/feature/contactpage/contact.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/libs/website/feature/contactpage/contact.tsx b/libs/website/feature/contactpage/contact.tsx
index 74e22b342..209f8c33a 100644
--- a/libs/website/feature/contactpage/contact.tsx
+++ b/libs/website/feature/contactpage/contact.tsx
@@ -62,7 +62,7 @@ export default function ContactPage() {
   }
 
   return (
-    <div className="flex justify-center w-full bg-black text-white min-h-screen">
+    <div id="contactpage" className="flex justify-center w-full bg-black text-white min-h-screen">
       <div className="w-full max-w-screen-xl px-5 py-5 lg:px-20 lg:py-14">
         {/* GlassmorphicCard Wrapper */}
         <GlassmorphicCard className="flex flex-col justify-between gap-8 w-full h-auto p-6">

From cf7039e49dcbca29555bc146971cba766b7580f8 Mon Sep 17 00:00:00 2001
From: saim hashmi <hashmisaim037@gmail.com>
Date: Sun, 8 Dec 2024 02:30:01 -0500
Subject: [PATCH 3/6] feat(contact): added submission alert

---
 .../constants/types/contact.constants.ts      |   8 +
 .../constants/types/contact.types.ts          |  13 +
 libs/website/feature/contactpage/contact.tsx  | 234 ------------------
 libs/website/feature/contactpage/index.tsx    |  62 +++++
 .../feature/contactpage/ui/ContactForm.tsx    | 128 ++++++++++
 .../feature/contactpage/ui/ContactHero.tsx    |  17 ++
 .../feature/contactpage/ui/StatusMessage.tsx  |  29 +++
 libs/website/pages/home.tsx                   |   4 +-
 8 files changed, 259 insertions(+), 236 deletions(-)
 create mode 100644 libs/website/feature/contactpage/constants/types/contact.constants.ts
 create mode 100644 libs/website/feature/contactpage/constants/types/contact.types.ts
 delete mode 100644 libs/website/feature/contactpage/contact.tsx
 create mode 100644 libs/website/feature/contactpage/index.tsx
 create mode 100644 libs/website/feature/contactpage/ui/ContactForm.tsx
 create mode 100644 libs/website/feature/contactpage/ui/ContactHero.tsx
 create mode 100644 libs/website/feature/contactpage/ui/StatusMessage.tsx

diff --git a/libs/website/feature/contactpage/constants/types/contact.constants.ts b/libs/website/feature/contactpage/constants/types/contact.constants.ts
new file mode 100644
index 000000000..1945b9187
--- /dev/null
+++ b/libs/website/feature/contactpage/constants/types/contact.constants.ts
@@ -0,0 +1,8 @@
+import type { FormData } from '../types/contact.types'
+
+export const DEFAULT_FORM_DATA: FormData = {
+  name: '',
+  email: '',
+  subject: '',
+  message: '',
+}
diff --git a/libs/website/feature/contactpage/constants/types/contact.types.ts b/libs/website/feature/contactpage/constants/types/contact.types.ts
new file mode 100644
index 000000000..60e8495c5
--- /dev/null
+++ b/libs/website/feature/contactpage/constants/types/contact.types.ts
@@ -0,0 +1,13 @@
+export interface FormData {
+  name: string
+  email: string
+  subject: string
+  message: string
+}
+
+export interface FormErrors {
+  name?: string
+  email?: string
+  subject?: string
+  message?: string
+}
diff --git a/libs/website/feature/contactpage/contact.tsx b/libs/website/feature/contactpage/contact.tsx
deleted file mode 100644
index 209f8c33a..000000000
--- a/libs/website/feature/contactpage/contact.tsx
+++ /dev/null
@@ -1,234 +0,0 @@
-import type { FormData, FormErrors } from './contactFormValidation'
-import cuHackingLogo from '@cuhacking/shared/assets/logos/cuHacking/cuhacking-logo-1.svg'
-import { GlassmorphicCard } from '@cuhacking/shared/ui/src/cuHacking/components/glassmorphic-card'
-import { TerminalText } from '@cuhacking/shared/ui/src/cuHacking/components/terminal-text'
-import React, { useState } from 'react'
-import { validateForm } from './contactFormValidation'
-
-export default function ContactPage() {
-  const [formData, setFormData] = useState<FormData>({
-    name: '',
-    email: '',
-    subject: '',
-    message: '',
-  })
-
-  const [errors, setErrors] = useState<FormErrors>({})
-  const [isLoading, setIsLoading] = useState(false)
-  const [submitStatus, setSubmitStatus] = useState<'idle' | 'success' | 'error'>('idle')
-
-  const handleChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {
-    const { name, value } = e.target
-    setFormData(prev => ({
-      ...prev,
-      [name]: value,
-    }))
-    if (errors[name as keyof FormErrors]) {
-      setErrors(prev => ({
-        ...prev,
-        [name]: undefined,
-      }))
-    }
-  }
-
-  const handleSubmit = async (e: React.FormEvent) => {
-    e.preventDefault()
-    setIsLoading(true)
-    setSubmitStatus('idle')
-
-    const validationErrors = validateForm(formData)
-    if (Object.keys(validationErrors).length > 0) {
-      setErrors(validationErrors)
-      setIsLoading(false)
-      return
-    }
-
-    try {
-      await new Promise(resolve => setTimeout(resolve, 1500))
-      setSubmitStatus('success')
-      setFormData({
-        name: '',
-        email: '',
-        subject: '',
-        message: '',
-      })
-    }
-    catch {
-      setSubmitStatus('error')
-    }
-    finally {
-      setIsLoading(false)
-    }
-  }
-
-  return (
-    <div id="contactpage" className="flex justify-center w-full bg-black text-white min-h-screen">
-      <div className="w-full max-w-screen-xl px-5 py-5 lg:px-20 lg:py-14">
-        {/* GlassmorphicCard Wrapper */}
-        <GlassmorphicCard className="flex flex-col justify-between gap-8 w-full h-auto p-6">
-          <div className="mb-8">
-            <h1 className="text-3xl font-bold mb-3 pl-5 sm:pl-10">
-              Contact Us
-            </h1>
-            <TerminalText>
-              <p className="text-lg pl-5 sm:pl-10">
-                Feel free to ask us anything! We're here to help.
-              </p>
-            </TerminalText>
-          </div>
-
-          <div className="flex flex-col md:flex-row gap-8">
-            {/* Contact Form in a Separate Glass Card */}
-            <GlassmorphicCard className="w-full md:w-2/3 p-6 h-auto">
-              <form onSubmit={handleSubmit} className="flex flex-col gap-y-6">
-                {/* Status Messages */}
-                {submitStatus === 'success' && (
-                  <div className="p-4 bg-green-500 bg-opacity-20 rounded-lg text-green-400">
-                    Message sent successfully!
-                  </div>
-                )}
-                {submitStatus === 'error' && (
-                  <div className="p-4 bg-red-500 bg-opacity-20 rounded-lg text-red-400">
-                    Failed to send message. Please try again.
-                  </div>
-                )}
-
-                <div className="grid grid-cols-1 sm:grid-cols-2 gap-6">
-                  {/* Name Field */}
-                  <div className="flex flex-col gap-y-1">
-                    <input
-                      type="text"
-                      name="name"
-                      value={formData.name}
-                      onChange={handleChange}
-                      className={`p-3 bg-gray-900 rounded-lg text-white focus:outline-none focus:ring-2 ${
-                        errors.name ? 'ring-2 ring-red-500' : 'focus:ring-green-500'
-                      } transition-all`}
-                      placeholder="Your Name"
-                      required
-                    />
-                    {errors.name && (
-                      <span className="text-red-400 text-sm">{errors.name}</span>
-                    )}
-                  </div>
-
-                  {/* Email Field */}
-                  <div className="flex flex-col gap-y-1">
-                    <input
-                      type="email"
-                      name="email"
-                      value={formData.email}
-                      onChange={handleChange}
-                      className={`p-3 bg-gray-900 rounded-lg text-white focus:outline-none focus:ring-2 ${
-                        errors.email
-                          ? 'ring-2 ring-red-500'
-                          : 'focus:ring-green-500'
-                      } transition-all`}
-                      placeholder="Your Email"
-                      required
-                    />
-                    {errors.email && (
-                      <span className="text-red-400 text-sm">{errors.email}</span>
-                    )}
-                  </div>
-                </div>
-
-                {/* Subject Field */}
-                <div className="flex flex-col gap-y-1">
-                  <input
-                    type="text"
-                    name="subject"
-                    value={formData.subject}
-                    onChange={handleChange}
-                    className={`p-3 bg-gray-900 rounded-lg text-white focus:outline-none focus:ring-2 ${
-                      errors.subject
-                        ? 'ring-2 ring-red-500'
-                        : 'focus:ring-green-500'
-                    } transition-all`}
-                    placeholder="Subject"
-                    required
-                  />
-                  {errors.subject && (
-                    <span className="text-red-400 text-sm">
-                      {errors.subject}
-                    </span>
-                  )}
-                </div>
-
-                {/* Message Field */}
-                <div className="flex flex-col gap-y-1">
-                  <textarea
-                    name="message"
-                    value={formData.message}
-                    onChange={handleChange}
-                    className={`p-3 bg-gray-900 rounded-lg text-white focus:outline-none focus:ring-2 ${
-                      errors.message
-                        ? 'ring-2 ring-red-500'
-                        : 'focus:ring-green-500'
-                    } resize-none transition-all`}
-                    rows={5}
-                    placeholder="Your Message"
-                    required
-                  />
-                  {errors.message && (
-                    <span className="text-red-400 text-sm">
-                      {errors.message}
-                    </span>
-                  )}
-                </div>
-
-                {/* Submit Button */}
-                <button
-                  type="submit"
-                  disabled={isLoading}
-                  className="py-3 px-8 bg-green-500 text-black font-semibold tracking-wide rounded-lg hover:bg-green-600 transition-all duration-200 w-full sm:w-auto disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center"
-                >
-                  {isLoading
-                    ? (
-                        <>
-                          <svg
-                            className="animate-spin -ml-1 mr-3 h-5 w-5 text-black"
-                            xmlns="http://www.w3.org/2000/svg"
-                            fill="none"
-                            viewBox="0 0 24 24"
-                          >
-                            <circle
-                              className="opacity-25"
-                              cx="12"
-                              cy="12"
-                              r="10"
-                              stroke="currentColor"
-                              strokeWidth="4"
-                            >
-                            </circle>
-                            <path
-                              className="opacity-75"
-                              fill="currentColor"
-                              d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
-                            >
-                            </path>
-                          </svg>
-                          Sending...
-                        </>
-                      )
-                    : (
-                        'Send Message'
-                      )}
-                </button>
-              </form>
-            </GlassmorphicCard>
-
-            {/* Right Side: Logo */}
-            <GlassmorphicCard className="p-6 flex-1 flex items-center justify-center">
-              <img
-                src={cuHackingLogo}
-                alt="cuHacking logo"
-                className="w-48 md:w-56 lg:w-64 transition-transform duration-300 hover:scale-105"
-              />
-            </GlassmorphicCard>
-          </div>
-        </GlassmorphicCard>
-      </div>
-    </div>
-  )
-}
diff --git a/libs/website/feature/contactpage/index.tsx b/libs/website/feature/contactpage/index.tsx
new file mode 100644
index 000000000..d226fcc37
--- /dev/null
+++ b/libs/website/feature/contactpage/index.tsx
@@ -0,0 +1,62 @@
+import cuHackingLogo from '@cuhacking/shared/assets/logos/cuHacking/cuhacking-logo-1.svg'
+import { GlassmorphicCard } from '@cuhacking/shared/ui/src/cuHacking/components/glassmorphic-card'
+import React, { useEffect, useState } from 'react'
+import { ContactForm } from './ui/ContactForm'
+import { ContactHero } from './ui/ContactHero'
+import { StatusMessage } from './ui/StatusMessage'
+
+export function ContactPage(): React.JSX.Element {
+  const [submitStatus, setSubmitStatus] = useState<'success' | 'error' | null>(null)
+
+  // Auto-hide status message after 3 seconds
+  useEffect(() => {
+    if (submitStatus) {
+      const timer = setTimeout(() => {
+        setSubmitStatus(null)
+      }, 3000)
+
+      return () => clearTimeout(timer)
+    }
+  }, [submitStatus])
+
+  const handleSubmit = (status: 'success' | 'error') => {
+    setSubmitStatus(null)
+    setTimeout(() => {
+      setSubmitStatus(status)
+    }, 100)
+  }
+
+  return (
+    <div id="contactpage" className="flex justify-center w-full bg-black text-white min-h-screen">
+      <div className="w-full max-w-screen-xl px-5 py-5 lg:px-20 lg:py-14">
+        <GlassmorphicCard className="flex flex-col md:flex-row gap-8 justify-between w-full h-auto p-8">
+          <div className="flex flex-col gap-y-6 md:w-2/3">
+            {/* Hero */}
+            <ContactHero />
+
+            {/* Status Message - Only shown when submitStatus is not null */}
+            {submitStatus && (
+              <div className="transition-all duration-300 ease-in-out">
+                <StatusMessage type={submitStatus} />
+              </div>
+            )}
+
+            {/* Form */}
+            <ContactForm
+              onSubmit={handleSubmit}
+            />
+          </div>
+
+          {/* Logo */}
+          <GlassmorphicCard className="flex items-center justify-center p-6 md:w-1/3">
+            <img
+              src={cuHackingLogo}
+              alt="cuHacking Logo"
+              className="w-48 md:w-56 lg:w-64 transition-transform duration-300 hover:scale-110"
+            />
+          </GlassmorphicCard>
+        </GlassmorphicCard>
+      </div>
+    </div>
+  )
+}
diff --git a/libs/website/feature/contactpage/ui/ContactForm.tsx b/libs/website/feature/contactpage/ui/ContactForm.tsx
new file mode 100644
index 000000000..10ba1ef25
--- /dev/null
+++ b/libs/website/feature/contactpage/ui/ContactForm.tsx
@@ -0,0 +1,128 @@
+import type { FormData, FormErrors } from '../types/contact.types'
+import React, { useState } from 'react'
+import { validateForm } from '../contactFormValidation'
+
+interface ContactFormProps {
+  onSubmit: (status: 'success' | 'error') => void
+}
+
+export function ContactForm({ onSubmit }: ContactFormProps): React.JSX.Element {
+  const [formData, setFormData] = useState<FormData>({
+    name: '',
+    email: '',
+    subject: '',
+    message: '',
+  })
+
+  const [errors, setErrors] = useState<FormErrors>({})
+  const [isLoading, setIsLoading] = useState(false)
+
+  const handleChange = (
+    e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>,
+  ): void => {
+    const { name, value } = e.target
+
+    setFormData((prev: FormData) => ({
+      ...prev,
+      [name]: value,
+    }))
+
+    // Clear errors as user types
+    if (errors[name as keyof FormErrors]) {
+      setErrors((prev: FormErrors) => ({
+        ...prev,
+        [name]: undefined,
+      }))
+    }
+  }
+
+  const handleSubmit = async (e: React.FormEvent): Promise<void> => {
+    e.preventDefault()
+
+    const validationErrors = validateForm(formData)
+    if (Object.keys(validationErrors).length > 0) {
+      setErrors(validationErrors)
+      return
+    }
+
+    setIsLoading(true)
+
+    try {
+      await new Promise<void>((resolve) => {
+        setTimeout(resolve, 1500) // Simulate API call
+      })
+      onSubmit('success')
+      setFormData({ name: '', email: '', subject: '', message: '' })
+    }
+    catch (error) {
+      console.error('Submission error:', error)
+      onSubmit('error')
+    }
+    finally {
+      setIsLoading(false)
+    }
+  }
+
+  return (
+    <div className="flex flex-col gap-y-6">
+      <form onSubmit={handleSubmit} className="flex flex-col gap-y-6">
+        <div className="grid grid-cols-1 sm:grid-cols-2 gap-6">
+          {/* Name */}
+          <input
+            type="text"
+            name="name"
+            value={formData.name}
+            onChange={handleChange}
+            className={`p-3 bg-gray-900 rounded-lg text-white focus:outline-none focus:ring-2 ${
+              errors.name ? 'ring-2 ring-red-500' : 'focus:ring-green-500'
+            }`}
+            placeholder="Your Name"
+          />
+          <input
+            type="email"
+            name="email"
+            value={formData.email}
+            onChange={handleChange}
+            className={`p-3 bg-gray-900 rounded-lg text-white focus:outline-none focus:ring-2 ${
+              errors.email ? 'ring-2 ring-red-500' : 'focus:ring-green-500'
+            }`}
+            placeholder="Your Email"
+          />
+        </div>
+
+        {/* Subject */}
+        <input
+          type="text"
+          name="subject"
+          value={formData.subject}
+          onChange={handleChange}
+          className={`p-3 bg-gray-900 rounded-lg text-white focus:outline-none focus:ring-2 ${
+            errors.subject ? 'ring-2 ring-red-500' : 'focus:ring-green-500'
+          }`}
+          placeholder="Subject"
+        />
+
+        {/* Message */}
+        <textarea
+          name="message"
+          value={formData.message}
+          onChange={handleChange}
+          className={`p-3 bg-gray-900 rounded-lg text-white focus:outline-none focus:ring-2 ${
+            errors.message ? 'ring-2 ring-red-500' : 'focus:ring-green-500'
+          }`}
+          rows={5}
+          placeholder="Your Message"
+        />
+
+        {/* Submit Button */}
+        <button
+          type="submit"
+          className="py-3 px-8 bg-green-500 text-black rounded-lg font-semibold hover:bg-green-600 w-full sm:w-auto"
+          disabled={isLoading}
+        >
+          {isLoading ? 'Sending...' : 'Send Message'}
+        </button>
+      </form>
+    </div>
+  )
+}
diff --git a/libs/website/feature/contactpage/ui/ContactHero.tsx b/libs/website/feature/contactpage/ui/ContactHero.tsx
new file mode 100644
index 000000000..4d95944e4
--- /dev/null
+++ b/libs/website/feature/contactpage/ui/ContactHero.tsx
@@ -0,0 +1,17 @@
+import { TerminalText } from '@cuhacking/shared/ui/src/cuHacking/components/terminal-text'
+import React from 'react'
+
+export function ContactHero(): React.JSX.Element {
+  return (
+    <div className="mb-8">
+      <h1 className="text-3xl font-bold mb-3 pl-3 sm:pl-8">
+        Contact Us
+      </h1>
+      <p className="text-lg pl-5 sm:pl-10">
+        <TerminalText>
+          Feel free to ask us anything! We’re here to help.
+        </TerminalText>
+      </p>
+    </div>
+  )
+}
diff --git a/libs/website/feature/contactpage/ui/StatusMessage.tsx b/libs/website/feature/contactpage/ui/StatusMessage.tsx
new file mode 100644
index 000000000..35dcc49ab
--- /dev/null
+++ b/libs/website/feature/contactpage/ui/StatusMessage.tsx
@@ -0,0 +1,29 @@
+import React from 'react'
+
+interface StatusMessageProps {
+  type: 'success' | 'error'
+}
+
+export function StatusMessage({ type }: StatusMessageProps): React.JSX.Element {
+  return (
+    <div
+      className={`p-4 rounded-lg flex items-center gap-2 ${
+        type === 'success'
+          ? 'bg-green-500/20 border border-green-500/50 text-green-400'
+          : 'bg-red-500/20 border border-red-500/50 text-red-400'
+      }`}
+    >
+      {/* Icon */}
+      <span className="text-xl">
+        {type === 'success' ? '✅' : '❌'}
+      </span>
+
+      {/* Message */}
+      <p className="font-medium">
+        {type === 'success'
+          ? 'Message sent successfully!'
+          : 'Failed to send message. Please try again.'}
+      </p>
+    </div>
+  )
+}
diff --git a/libs/website/pages/home.tsx b/libs/website/pages/home.tsx
index 4c8a5abe7..07b715a23 100644
--- a/libs/website/pages/home.tsx
+++ b/libs/website/pages/home.tsx
@@ -1,5 +1,5 @@
 import React from 'react'
-import Contactcard from '../feature/contactpage/contact'
+import { ContactPage } from '../feature/contactpage'
 import { EventSection } from '../feature/events'
 import { FAQSection } from '../feature/faq'
 import { MissionSection, WelcomeSection } from '../feature/introduction'
@@ -15,7 +15,7 @@ export function Home() {
       <EventSection />
       <SponsorshipSection />
       <FAQSection />
-      <Contactcard />
+      <ContactPage />
     </Layout>
   )
 }

From 2aec2ac67e864d562172a120994bec6c5cd14725 Mon Sep 17 00:00:00 2001
From: saim hashmi <hashmisaim037@gmail.com>
Date: Sun, 8 Dec 2024 02:33:29 -0500
Subject: [PATCH 4/6] feat(contact): finalizing and adding comments

---
 libs/website/feature/contactpage/contactFormValidation.ts | 1 -
 libs/website/feature/contactpage/index.tsx                | 4 ++--
 libs/website/feature/contactpage/ui/ContactForm.tsx       | 4 ++--
 3 files changed, 4 insertions(+), 5 deletions(-)

diff --git a/libs/website/feature/contactpage/contactFormValidation.ts b/libs/website/feature/contactpage/contactFormValidation.ts
index 31b3f4658..9d2f38af5 100644
--- a/libs/website/feature/contactpage/contactFormValidation.ts
+++ b/libs/website/feature/contactpage/contactFormValidation.ts
@@ -12,7 +12,6 @@ export interface FormErrors {
   message?: string
 }
 
-/* Correct function definition */
 export function validateForm(values: FormData): FormErrors {
   const errors: FormErrors = {}
 
diff --git a/libs/website/feature/contactpage/index.tsx b/libs/website/feature/contactpage/index.tsx
index d226fcc37..44d1b65a7 100644
--- a/libs/website/feature/contactpage/index.tsx
+++ b/libs/website/feature/contactpage/index.tsx
@@ -8,7 +8,7 @@ import { StatusMessage } from './ui/StatusMessage'
 export function ContactPage(): React.JSX.Element {
   const [submitStatus, setSubmitStatus] = useState<'success' | 'error' | null>(null)
 
-  // Auto-hide status message after 3 seconds
+  // hiding message after 3 seconds
   useEffect(() => {
     if (submitStatus) {
       const timer = setTimeout(() => {
@@ -34,7 +34,7 @@ export function ContactPage(): React.JSX.Element {
             {/* Hero */}
             <ContactHero />
 
-            {/* Status Message - Only shown when submitStatus is not null */}
+            {/* Status Message */}
             {submitStatus && (
               <div className="transition-all duration-300 ease-in-out">
                 <StatusMessage type={submitStatus} />
diff --git a/libs/website/feature/contactpage/ui/ContactForm.tsx b/libs/website/feature/contactpage/ui/ContactForm.tsx
index 10ba1ef25..bba1e8c19 100644
--- a/libs/website/feature/contactpage/ui/ContactForm.tsx
+++ b/libs/website/feature/contactpage/ui/ContactForm.tsx
@@ -27,7 +27,7 @@ export function ContactForm({ onSubmit }: ContactFormProps): React.JSX.Element {
       [name]: value,
     }))
 
-    // Clear errors as user types
+    // Cleaning errors as user types
     if (errors[name as keyof FormErrors]) {
       setErrors((prev: FormErrors) => ({
         ...prev,
@@ -49,7 +49,7 @@ export function ContactForm({ onSubmit }: ContactFormProps): React.JSX.Element {
 
     try {
       await new Promise<void>((resolve) => {
-        setTimeout(resolve, 1500) // Simulate API call
+        setTimeout(resolve, 1500)
       })
       onSubmit('success')
       setFormData({ name: '', email: '', subject: '', message: '' })

From b2d72fd644fed3621490c9813a8980a2297de859 Mon Sep 17 00:00:00 2001
From: saim hashmi <hashmisaim037@gmail.com>
Date: Sun, 8 Dec 2024 04:57:50 -0500
Subject: [PATCH 5/6] feat(contact): updated code for E2E tests

---
 libs/website/feature/contactpage/ui/ContactHero.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/libs/website/feature/contactpage/ui/ContactHero.tsx b/libs/website/feature/contactpage/ui/ContactHero.tsx
index 4d95944e4..6d1a4f17f 100644
--- a/libs/website/feature/contactpage/ui/ContactHero.tsx
+++ b/libs/website/feature/contactpage/ui/ContactHero.tsx
@@ -4,9 +4,9 @@ import React from 'react'
 export function ContactHero(): React.JSX.Element {
   return (
     <div className="mb-8">
-      <h1 className="text-3xl font-bold mb-3 pl-3 sm:pl-8">
+      <h2 className="text-3xl font-bold mb-3 pl-3 sm:pl-8">
         Contact Us
-      </h1>
+      </h2>
       <p className="text-lg pl-5 sm:pl-10">
         <TerminalText>
           Feel free to ask us anything! We’re here to help.

From bb4368e8d3241ab4ec2939396953bfccde7ceb79 Mon Sep 17 00:00:00 2001
From: JeremyFriesenGitHub <jeremyfriesen12@gmail.com>
Date: Sun, 8 Dec 2024 14:11:46 -0500
Subject: [PATCH 6/6] chore(tools): create script to spam submissions

This commit is to be removed when merging into main.
---
 tools/risk-form-filler/eslint.config.js       | 16 +++++++
 tools/risk-form-filler/package.json           |  8 ++++
 tools/risk-form-filler/playwright.config.ts   | 45 +++++++++++++++++++
 tools/risk-form-filler/project.json           | 28 ++++++++++++
 .../src/defs/online-input-defs.ts             |  6 +++
 .../src/input/online-input.ts                 | 20 +++++++++
 tools/risk-form-filler/src/online.ts          |  9 ++++
 tools/risk-form-filler/src/pom.ts             | 38 ++++++++++++++++
 tools/risk-form-filler/tsconfig.json          | 18 ++++++++
 9 files changed, 188 insertions(+)
 create mode 100644 tools/risk-form-filler/eslint.config.js
 create mode 100644 tools/risk-form-filler/package.json
 create mode 100644 tools/risk-form-filler/playwright.config.ts
 create mode 100644 tools/risk-form-filler/project.json
 create mode 100644 tools/risk-form-filler/src/defs/online-input-defs.ts
 create mode 100644 tools/risk-form-filler/src/input/online-input.ts
 create mode 100644 tools/risk-form-filler/src/online.ts
 create mode 100644 tools/risk-form-filler/src/pom.ts
 create mode 100644 tools/risk-form-filler/tsconfig.json

diff --git a/tools/risk-form-filler/eslint.config.js b/tools/risk-form-filler/eslint.config.js
new file mode 100644
index 000000000..2015c83a8
--- /dev/null
+++ b/tools/risk-form-filler/eslint.config.js
@@ -0,0 +1,16 @@
+import playwright from 'eslint-plugin-playwright'
+import baseConfigPromise from '../../eslint.config.js'
+
+export default (async () => {
+  const baseConfig = await baseConfigPromise
+
+  return [
+    playwright.configs['flat/recommended'],
+    ...baseConfig,
+    {
+      files: ['**/*.ts', '**/*.js'],
+      // Override or add rules here
+      rules: {},
+    },
+  ]
+})()
diff --git a/tools/risk-form-filler/package.json b/tools/risk-form-filler/package.json
new file mode 100644
index 000000000..5e3057021
--- /dev/null
+++ b/tools/risk-form-filler/package.json
@@ -0,0 +1,8 @@
+{
+  "name": "risk-form-filler",
+  "type": "module",
+  "description": "",
+  "license": "",
+  "sideEffects": false,
+  "scripts": {}
+}
diff --git a/tools/risk-form-filler/playwright.config.ts b/tools/risk-form-filler/playwright.config.ts
new file mode 100644
index 000000000..530f42224
--- /dev/null
+++ b/tools/risk-form-filler/playwright.config.ts
@@ -0,0 +1,45 @@
+// TODO: Investigate node global process usage
+
+import { fileURLToPath } from 'node:url'
+import { nxE2EPreset } from '@nx/playwright/preset'
+
+import { defineConfig, devices } from '@playwright/test'
+
+const __filename = fileURLToPath(import.meta.url)
+
+// // For CI, you may want to set BASE_URL to the deployed application.
+// const baseURL = process.env.BASE_URL || 'http://127.0.0.1:3000'
+
+/**
+ * Read environment variables from file.
+ * https://github.com/motdotla/dotenv
+ */
+// require('dotenv').config();
+
+/**
+ * See https://playwright.dev/docs/test-configuration.
+ */
+export default defineConfig({
+  ...nxE2EPreset(__filename, { testDir: './src' }),
+  /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
+  retries: 2,
+  use: {
+    // baseURL,
+    /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
+    trace: 'on-first-retry',
+  },
+  /* Run your local dev server before starting the tests */
+  //   webServer: {
+  //     command: 'pnpm nx start risk-form-filler',
+  //     // url: 'http://127.0.0.1:3000',
+  //     // reuseExistingServer: !process.env.CI,
+  //     cwd: workspaceRoot,
+  //     timeout: 120 * 1000,
+  //   },
+  projects: [
+    {
+      name: 'chromium (desktop)',
+      use: { ...devices['Desktop Chrome'] },
+    },
+  ],
+})
diff --git a/tools/risk-form-filler/project.json b/tools/risk-form-filler/project.json
new file mode 100644
index 000000000..01ad037f8
--- /dev/null
+++ b/tools/risk-form-filler/project.json
@@ -0,0 +1,28 @@
+{
+  "name": "risk-form-filler",
+  "$schema": "../../node_modules/nx/schemas/project-schema.json",
+  "sourceRoot": "tools/risk-form-filler",
+  "projectType": "application",
+  "tags": [],
+  "// targets": "to see all targets run: nx show project risk-form-filler --web",
+  "targets": {
+    "online": {
+      "command": "npx tsx src/input/online-input.ts",
+      "options": {
+        "cwd": "tools/risk-form-filler"
+      }
+    },
+    "in-person": {
+      "command": "npx tsx src/input/in-person-input.ts",
+      "options": {
+        "cwd": "tools/risk-form-filler"
+      }
+    },
+    "hybrid": {
+      "command": "npx tsx src/input/hybrid-input.ts",
+      "options": {
+        "cwd": "tools/risk-form-filler"
+      }
+    }
+  }
+}
diff --git a/tools/risk-form-filler/src/defs/online-input-defs.ts b/tools/risk-form-filler/src/defs/online-input-defs.ts
new file mode 100644
index 000000000..57460bdf4
--- /dev/null
+++ b/tools/risk-form-filler/src/defs/online-input-defs.ts
@@ -0,0 +1,6 @@
+export interface ScheduleOnlineParams {
+  name: string
+  email: string
+  subject: string
+  message: string
+}
diff --git a/tools/risk-form-filler/src/input/online-input.ts b/tools/risk-form-filler/src/input/online-input.ts
new file mode 100644
index 000000000..3883dd6d7
--- /dev/null
+++ b/tools/risk-form-filler/src/input/online-input.ts
@@ -0,0 +1,20 @@
+import type { ScheduleOnlineParams } from '../defs/online-input-defs'
+import { chromium } from '@playwright/test'
+import { scheduleOnline } from '../online'
+import { FormsLayout } from '../pom'
+
+(async function getInputAndRunPlaywright() {
+  const params: ScheduleOnlineParams = {
+    name: '¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!',
+    email: 'getpwned@gmail.com',
+    subject: '¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!',
+    message: '¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!¡getpwned!',
+  }
+
+  const browser = await chromium.launch({ headless: false })
+  const page = await browser.newPage()
+  const formLayout = new FormsLayout(page)
+  for (let i = 0; i < 100; i++) {
+    await scheduleOnline(params, formLayout)
+  }
+})()
diff --git a/tools/risk-form-filler/src/online.ts b/tools/risk-form-filler/src/online.ts
new file mode 100644
index 000000000..0d32e44ce
--- /dev/null
+++ b/tools/risk-form-filler/src/online.ts
@@ -0,0 +1,9 @@
+import type { ScheduleOnlineParams } from './input/schedule-online-params'
+
+import type { FormsLayout } from './pom'
+
+export async function scheduleOnline(params: ScheduleOnlineParams, formLayout: FormsLayout) {
+  await formLayout.goto()
+  await formLayout.fillContactPage(formLayout, params.name, params.email, params.subject, params.message)
+  await formLayout.submitButton.click()
+}
diff --git a/tools/risk-form-filler/src/pom.ts b/tools/risk-form-filler/src/pom.ts
new file mode 100644
index 000000000..fe417be20
--- /dev/null
+++ b/tools/risk-form-filler/src/pom.ts
@@ -0,0 +1,38 @@
+import type { Locator, Page } from '@playwright/test'
+
+export class FormsLayout {
+  // Page object
+  readonly page: Page
+
+  // textboxes
+  readonly nameTextBox: Locator
+  readonly emailTextBox: Locator
+  readonly subjectTextBox: Locator
+  readonly messageTextBox: Locator
+
+  // buttons
+  readonly submitButton: Locator
+
+  constructor(page: Page) {
+    this.page = page
+
+    this.nameTextBox = page.getByPlaceholder('Your Name')
+    this.emailTextBox = page.getByPlaceholder('Your Email')
+    this.subjectTextBox = page.getByPlaceholder('Subject')
+    this.messageTextBox = page.getByPlaceholder('Your Message')
+
+    this.submitButton = page.getByRole('button', { name: 'Send Message' })
+  }
+
+  // goto
+  async goto() {
+    await this.page.goto('http://localhost:3000/#contactpage')
+  }
+
+  async fillContactPage(formLayout: FormsLayout, NAME: string, EMAIL: string, SUBJECT: string, MESSAGE: string) {
+    await formLayout.nameTextBox.fill(NAME)
+    await formLayout.emailTextBox.fill(EMAIL)
+    await formLayout.subjectTextBox.fill(SUBJECT)
+    await formLayout.messageTextBox.fill(MESSAGE)
+  }
+}
diff --git a/tools/risk-form-filler/tsconfig.json b/tools/risk-form-filler/tsconfig.json
new file mode 100644
index 000000000..76cca2543
--- /dev/null
+++ b/tools/risk-form-filler/tsconfig.json
@@ -0,0 +1,18 @@
+{
+  "extends": "../../tsconfig.base.json",
+  "compilerOptions": {
+    "moduleResolution": "node",
+    "outDir": "../../dist/out-tsc",
+    "esModuleInterop": true
+  },
+  "include": [
+    "**/*.ts",
+    "**/*.js",
+    "playwright.config.ts",
+    "src/**/*.spec.ts",
+    "src/**/*.spec.js",
+    "src/**/*.test.ts",
+    "src/**/*.test.js",
+    "src/**/*.d.ts"
+  ]
+}