From d3ad31feeea63a142ba524a387cd909124d08e9a Mon Sep 17 00:00:00 2001 From: "Jason R. Stevens, CFA" Date: Mon, 31 Jan 2022 18:44:49 -0600 Subject: [PATCH 1/4] :sparkles: add convertkit api func [sc-595] --- pages/api/convertkit.js | 35 +++++++++++++++++++++++++++++++++++ 1 file changed, 35 insertions(+) create mode 100644 pages/api/convertkit.js diff --git a/pages/api/convertkit.js b/pages/api/convertkit.js new file mode 100644 index 0000000..f3a40bf --- /dev/null +++ b/pages/api/convertkit.js @@ -0,0 +1,35 @@ +/* eslint-disable import/no-anonymous-default-export */ +export default async (req, res) => { + const {email} = req.body; + + if (!email) { + return res.status(400).json({error : 'Email is required'}); + } + + try { + const FORM_ID = process.env.CONVERTKIT_FORM_ID; + const API_KEY = process.env.CONVERTKIT_API_KEY; + const API_URL = process.env.CONVERTKIT_API_URL; + + // Send request to ConvertKit + const data = {email, api_key : API_KEY}; + + const response = await fetch(`${API_URL}forms/${FORM_ID}/subscribe`, { + body : JSON.stringify(data), + headers : { + 'Content-Type' : 'application/json', + }, + method : 'POST', + }); + + if (response.status >= 400) { + return res.status(400).json({ + error : `There was an error subscribing to the list.`, + }); + } + + return res.status(201).json({error : ''}); + } catch (error) { + return res.status(500).json({error : error.message || error.toString()}); + } +}; From a96605c1204baf91162595bf9d442336e9e2d4f9 Mon Sep 17 00:00:00 2001 From: "Jason R. Stevens, CFA" Date: Mon, 31 Jan 2022 18:44:52 -0600 Subject: [PATCH 2/4] :recycle: implement signup + error messages for newsletter [sc-595] --- components/Footer.jsx | 75 ++++++++++++++++++++++++++++++++++++++----- 1 file changed, 67 insertions(+), 8 deletions(-) diff --git a/components/Footer.jsx b/components/Footer.jsx index 738b4a3..49d52e8 100644 --- a/components/Footer.jsx +++ b/components/Footer.jsx @@ -1,7 +1,41 @@ import FooterColumn from "./FooterColumn"; import Image from "next/image"; +import { useState, useRef } from "react"; export default function Footer({ entityTitle, logoSrc, footerItems, socials }) { + const inputEl = useRef(null); + const [inputError, setInputError] = useState(false); + const [message, setMessage] = useState(""); + const [subscribed, setSubscribed] = useState(false); + + const subscribe = async (e) => { + e.preventDefault(); + + const res = await fetch(`/api/convertkit`, { + body: JSON.stringify({ + email: inputEl.current.value, + }), + headers: { + "Content-Type": "application/json", + }, + method: "POST", + }); + + const { error } = await res.json(); + if (error) { + setInputError(true); + setMessage( + "Your e-mail address is invalid or you are already subscribed!" + ); + return; + } + + inputEl.current.value = ""; + setInputError(false); + setSubscribed(true); + setMessage("Successfully! 🎉 You are now subscribed."); + }; + return (