Added better success / fail handling for contact form

11ty-src/contact-fail.md

@@ -0,0 +1,10 @@
+---
+layout: default.njk
+title: Contact - failure
+---
+
+# {{ title }}
+
+Something went wrong, and your message was not sent.
+Please try again.
+[Go home](/).

11ty-src/contact-success.md

@@ -0,0 +1,9 @@
+---
+layout: default.njk
+title: Contact - success
+---
+
+# {{ title }}
+
+Your message was successfully sent.
+[Go home](/).

eleventy.config.js

@@ -17,7 +17,6 @@ export default async function (eleventyConfig) {
 		if ((this.page.outputPath || "").endsWith(".html")) {
 			let minified = htmlmin.minify(content, {
         collapseBooleanAttributes: true,
-        collapseInlineTagWhitespace: true,
 				collapseWhitespace: true,
         decodeEntities: true,
         minifyCSS: true,

functions/api/contact.js

@@ -9,21 +9,22 @@ export async function onRequest(context) {
   const fields = Object.fromEntries(formData.entries());
   fields.cf = context.request.cf;
   fields.headers = Object.fromEntries(context.request.headers.entries());
+  const url = new URL(context.request.url);
   if (fields[HONEYPOT_FIELD] === "") {
     delete fields[HONEYPOT_FIELD];
     const sent = await sendFormViaResend({
       apiKey: context.env.RESEND_KEY,
       emailFrom: context.env.EMAIL_FROM,
       emailTo: context.env.EMAIL_TO,
       fields,
-      subject: `Form submission from ${new URL(context.request.url).hostname}`,
+      subject: `Form submission from ${url.hostname}`,
     });
 
     if (!sent) {
-      return new Response("Oops! Something went wrong. Please try submitting the form again.", { status: 500 });
+      return Response.redirect(`https://${url.hostname}/contact-fail`, 303);
     }
   }
-  return Response.redirect(context.request.headers.get("Referer"), 303);
+  return Response.redirect(`https://${url.hostname}/contact-success`, 303);
 }
 
 async function sendFormViaResend({