Use api route to store juris-leads in firebase

pages/api/jurisdictions-leads.ts

@@ -0,0 +1,23 @@
+import { NextApiRequest, NextApiResponse } from 'next'
+
+import { firebase, pushover } from './_services'
+
+export default async (req: NextApiRequest, res: NextApiResponse) => {
+  const fields = req.body
+
+  // Store submission in Firestore
+  await firebase
+    .firestore()
+    .collection('jurisdictions-leads')
+    .doc(new Date().toISOString() + ' ' + String(Math.random()).slice(2, 7))
+    .set({
+      ...fields,
+      created_at: new Date().toString(),
+    })
+
+  // Notify admin via Pushover
+  pushover(`SIV jurisdiction-lead: ${fields.name} (${fields.location})`, `${fields.email}\n\n${fields.message}`)
+
+  // Send back success
+  return res.status(201).json({ success: true })
+}

src/for-governments/GiveYourVoters.tsx

@@ -1,7 +1,6 @@
 const darkBlue = '#002868'
 
 import { BoxProps, NoSsr, TextField, TextFieldProps } from '@material-ui/core'
-import { firestore } from 'firebase/app'
 import { omit } from 'lodash-es'
 import { useState } from 'react'
 import { Element } from 'react-scroll'
@@ -51,7 +50,7 @@ export function GiveYourVoters({ idKey }: { idKey: string }): JSX.Element {
           <OnClickButton
             disabled={saved}
             style={{ marginRight: 0 }}
-            onClick={() => {
+            onClick={async () => {
               const fields: Record<string, string | Date> = { created_at: new Date().toString(), idKey }
 
               // Get data from input fields
@@ -59,20 +58,8 @@ export function GiveYourVoters({ idKey }: { idKey: string }): JSX.Element {
                 fields[field] = (document.getElementById(toID(field)) as HTMLInputElement).value
               })
 
-              // Store submission in Firestore
-              firestore()
-                .collection('jurisdictions-leads')
-                .doc(new Date().toISOString() + ' ' + String(Math.random()).slice(2, 7))
-                .set(fields)
-                .then(() => {
-                  setSaved(true)
-
-                  // Notify via Pushover
-                  api('pushover', {
-                    message: `${fields.email}\n\n${fields.message}`,
-                    title: `SIV jurisdiction-lead: ${fields.name} (${fields.location})`,
-                  })
-                })
+              const { status } = await api('/jurisdictions-leads', fields)
+              if (status === 201) setSaved(true)
             }}
           >
             Send