feat: add catapult mailer support (#54)

* Update fetch.js this might not work..... Signed-off-by: Emperor Numerius <[email protected]> * Delete netlify/functions/fetch directory deleted Signed-off-by: Emperor Numerius <[email protected]> * Update index.astro add the fetch functionality i think Signed-off-by: Emperor Numerius <[email protected]> * Delete netlify.toml Signed-off-by: Emperor Numerius <[email protected]> * Create netlify.toml Signed-off-by: Emperor Numerius <[email protected]> * d * j * should work now * now it should work * i forgot about the semicolon * bugs * h * f * text * gh * , * n * fgds * Delete .vscode/settings.json Signed-off-by: Kieran Klukas <[email protected]> * bug: fix js Signed-off-by: Kieran Klukas <[email protected]> * Update index.astro Signed-off-by: Kieran Klukas <[email protected]> * fix: handle error response in index.astro * chore: Update Astro config for server output and Netlify adapter * chore: run prettier --------- Signed-off-by: Emperor Numerius <[email protected]> Signed-off-by: Kieran Klukas <[email protected]> Co-authored-by: Kieran Klukas <[email protected]>
thepurplebubble · Jun 1, 2024 · 9f169c3 · 9f169c3
1 parent ffdfd7e
commit 9f169c3
Show file tree

Hide file tree

Showing 7 changed files with 45 additions and 59 deletions.
diff --git a/astro.config.mjs b/astro.config.mjs
@@ -1,8 +1,12 @@
 import { defineConfig } from "astro/config";
 
+import netlify from "@astrojs/netlify/functions";
+
 // https://astro.build/config
 export default defineConfig({
   redirects: {
     "/branding": "/brand",
   },
+  output: "server",
+  adapter: netlify(),
 });
diff --git a/bun.lockb b/bun.lockb
diff --git a/netlify.toml b/netlify.toml
@@ -8,4 +8,4 @@
 [[redirects]]
   from = "/api/*"
   to = "/.netlify/functions/:splat"
-  status = 200
+  status = 200
diff --git a/netlify/functions/fetch/fetch.js b/netlify/functions/fetch/fetch.js
diff --git a/package.json b/package.json
@@ -3,10 +3,11 @@
   "version": "1.1.0",
   "private": true,
   "dependencies": {
+    "@astrojs/netlify": "^5.2.1",
     "astro": "^4.0.4",
+    "axios": "^1.6.2",
     "magick.css": "^1.0.5",
     "normalize.css": "^8.0.1",
-    "axios": "^1.6.2",
     "qs": "^6.12.0"
   },
   "scripts": {

diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
@@ -29,7 +29,10 @@ const year = new Date().getFullYear();
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <meta charset="utf-8" />
     <meta property="twitter:card" content="summary_large_image" />
-    <script defer src="https://umami.purplebubble.org/script.js" data-website-id="3d88503b-9747-416a-a176-7507ffb7c090"></script>
+    <script
+      defer
+      src="https://umami.purplebubble.org/script.js"
+      data-website-id="3d88503b-9747-416a-a176-7507ffb7c090"></script>
     <link
       rel="apple-touch-icon"
       sizes="180x180"

diff --git a/src/pages/index.astro b/src/pages/index.astro
@@ -1,5 +1,37 @@
 ---
 import Layout from "../layouts/Layout.astro";
+
+let error;
+if (Astro.request.method === "POST") {
+  try {
+    const data = await Astro.request.formData();
+    const name = data.get("name");
+    const email = data.get("email");
+
+    const response = await fetch(
+      "https://catapult.purplebubble.org/api/subscribe",
+      {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+        },
+        body: JSON.stringify({ name, email }),
+      },
+    );
+
+    const jsondata = await response.json();
+    console.log(jsondata);
+    if ((jsondata.ok = true)) {
+      //do nothing
+    } else {
+      error = jsondata.error;
+    }
+  } catch (anError) {
+    if (anError instanceof Error) {
+      console.log(anError);
+    }
+  }
+}
 ---
 
 <Layout title="Purple Bubble" fiscalSponsor="true">
@@ -24,11 +56,8 @@ import Layout from "../layouts/Layout.astro";
     </p>
   </section>
   <section>
-    <form
-      action="https://postal.hackclub.com/subscribe"
-      method="POST"
-      accept-charset="utf-8"
-    >
+    {error && <p class="text-red-500">Error: {error}</p>}
+    <form method="POST" accept-charset="utf-8">
       <label for="name">Name</label><br />
       <input
         type="text"