From 1a9f240b14cc3a38cacfcecf9c030c34152aefc3 Mon Sep 17 00:00:00 2001
From: Cian Hughes <chughes000@gmail.com>
Date: Mon, 20 Jan 2025 17:18:54 +0000
Subject: [PATCH] Added email API endpoint

---
 src/lib/components/ContactForm.svelte | 62 +++++++++++++++++++++------
 src/routes/contact/+page.svelte       |  8 +++-
 2 files changed, 57 insertions(+), 13 deletions(-)

diff --git a/src/lib/components/ContactForm.svelte b/src/lib/components/ContactForm.svelte
index cc9f1ed..c5b3dd0 100644
--- a/src/lib/components/ContactForm.svelte
+++ b/src/lib/components/ContactForm.svelte
@@ -2,6 +2,8 @@
     import { Send, Loader2 } from "lucide-svelte";
     import "$lib/styles/ContactForm.scss";
 
+    export let emailEndpointApi;
+
     let formData = {
         name: "",
         email: "",
@@ -33,20 +35,56 @@
         if (!validateForm()) return;
 
         isSubmitting = true;
-        // Simulate API call - replace with your actual API endpoint
-        await new Promise((resolve) => setTimeout(resolve, 1500));
-        isSubmitting = false;
-        submitted = true;
-
-        // Reset form
-        formData = {
-            name: "",
-            email: "",
-            subject: "",
-            message: "",
-        };
+        await new Promise(async (resolve, reject) => {
+            try {
+                await dispatch_email(
+                    formData.name,
+                    formData.email,
+                    formData.subject,
+                    formData.message,
+                );
+                submitted = true;
+                // Reset form
+                formData = {
+                    name: "",
+                    email: "",
+                    subject: "",
+                    message: "",
+                };
+                resolve();
+            } catch (error) {
+                console.error("Error:", error);
+                reject(error);
+            } finally {
+                isSubmitting = false;
+            }
+        });
     };
 
+    async function dispatch_email(name, email, subject, message) {
+        try {
+            const response = await fetch(emailEndpointApi, {
+                method: "POST",
+                headers: {
+                    "Content-Type": "application/json",
+                },
+                body: JSON.stringify({
+                    name,
+                    email,
+                    subject,
+                    message,
+                }),
+            });
+
+            if (!response.ok) throw new Error("Failed to send message");
+
+            // Handle success (clear form, show success message, etc.)
+        } catch (error) {
+            // Handle error
+            console.error("Error:", error);
+        }
+    }
+
     const handleInput = (e) => {
         const target = e.target;
         formData[target.name] = target.value;
diff --git a/src/routes/contact/+page.svelte b/src/routes/contact/+page.svelte
index 58cece2..d751905 100644
--- a/src/routes/contact/+page.svelte
+++ b/src/routes/contact/+page.svelte
@@ -5,6 +5,9 @@
     import ContactForm from "$lib/components/ContactForm.svelte";
 
     import { CDN } from "$lib/constants";
+
+    const EMAIL_ENDPOINT =
+        "https://bst564m4ws3ouxg27nqrpfqv5a0jbhxi.lambda-url.eu-west-1.on.aws/";
 </script>
 
 <div class="contact-page">
@@ -20,7 +23,10 @@
                 community. Please use the form below to email our corresponding
                 researcher and they will reply as soon as they are able.
             </p>
-            <ContactForm class="contact-form" />
+            <ContactForm
+                class="contact-form"
+                emailEndpointApi={EMAIL_ENDPOINT}
+            />
         </div>
         <div class="contact-image-column">
             <img