Added message to say it's in progress + error handling

src/api/signup-submit.js

@@ -1,6 +1,59 @@
 import { google } from 'googleapis';
 import { readFileSync } from 'fs';
 
+async function updateAttendees(api, calendarId, eventId, newAttendees) {
+  console.log(`Adding attendees to `, eventId, newAttendees)
+
+  await api.events.patch({
+    calendarId: calendarId,
+    eventId: eventId,
+    resource: {
+      attendees: newAttendees
+    },
+    sendUpdates: 'externalOnly'
+  })
+
+}
+
+async function addAttendeeToEvent(api, calendarId, event, email, addForReal) {
+
+  console.log(`Adding attendee to `, event.id, event.start, event.summary, addForReal)
+
+  const newAttendees = [
+    ...event.attendees,
+    {
+      email: email,
+    },
+  ]
+  const eventId = event.id
+
+  if (addForReal) {
+    return updateAttendees(api, calendarId, eventId, newAttendees)
+  }
+}
+
+async function updateEventRequest(api, calendarId, eventId, email) {
+  const event = (await api.events.get({
+    calendarId: calendarId,
+    eventId: eventId,
+  })).data
+
+  console.log(`Original Event:`, event)
+
+  const masterEventId = event.recurringEventId ? event.recurringEventId : event.id
+
+  console.log(`Master Event ID:`, masterEventId)
+
+  // update the series
+  const masterEvent = (masterEventId != eventId) ? (await api.events.get({
+    calendarId: calendarId,
+    eventId: masterEventId,
+  })).data : event
+
+  console.log(`Master Event:`, masterEvent)
+
+  await addAttendeeToEvent(api, calendarId, masterEvent, email, true)
+}
 
 export default async function handler(req, res) {
   console.log(`submitted form`, req.body, __filename)
@@ -14,8 +67,6 @@ export default async function handler(req, res) {
     JSON.parse(process.env.GOOGLE_SERVICE_ACCOUNT) :
     JSON.parse(readFileSync('./calendar-service-account.json'))
 
-  console.log(`CREDENTIALS`, CREDENTIALS)
-
   // Scopes required for the Google Calendar API
   const SCOPES = [
     'https://www.googleapis.com/auth/calendar'
@@ -31,31 +82,17 @@ export default async function handler(req, res) {
   });
 
   // Create a Calendar API client
-  const calendar = google.calendar({ version: 'v3', auth: await auth.getClient() });
-
-  const event = (await calendar.events.get({
-    calendarId: calendarId,
-    eventId: eventId,
-  })).data
-
-
-  console.log(`event`, event)
+  const api = google.calendar({ version: 'v3', auth: await auth.getClient() });
 
-  const existingAttendees = event.attendees ?? []
+  const individualEvents = eventId.split(',')
 
-  const done = await calendar.events.patch({
-    calendarId: calendarId,
-    eventId: eventId,
-    resource: {
-      attendees: [
-        ...existingAttendees,
-        {
-          email: req.body.email,
-        },
-      ]
-    },
-    sendUpdates: 'externalOnly'
-  })
+  try {
+    for (const individualEventId of individualEvents) {
+      await updateEventRequest(api, calendarId, individualEventId, req.body.email)
+    }
 
-  res.json(`ok bebob ${JSON.stringify("hello")}`)
+    res.json(`success`)
+  } catch (err) {
+    res.json(`Error updating calendar: ${err}`)
+  }
 }

src/pages/signup.js

@@ -10,6 +10,7 @@ export default function App({ location }) {
     formState: { errors },
   } = useForm()
   const onSubmit = data => {
+    setIsSubmitted('spinner')
     fetch(`/api/signup-submit`, {
       method: `POST`,
       body: JSON.stringify(data),
@@ -20,19 +21,36 @@ export default function App({ location }) {
       .then(res => res.json())
       .then(body => {
         console.log(`response from API:`, body)
-        setIsSubmitted(true)
+        setIsSubmitted(body)
+      }).catch(err => {
+        console.error(`Error updating calendar:`, err)
+        setIsSubmitted(`Error updating calendar: ${err}`)
       })
   }
 
   const params = new URLSearchParams(location.search)
 
-  if (isSubmitted) {
+  if (isSubmitted == 'spinner') {
     return (
-     <div className="signup form-container">
-        <h2>Thank you for signing up!</h2>
-        <p>Please check your inbox for a calendar invite for <b>{params.get("title")}</b>.</p>
+      <div className="signup form-container">
+        <h2>Please wait</h2>
+        <p>Updating the calendar and sending invite...</p>
       </div>
     )
+
+  } else if (isSubmitted) {
+    if (isSubmitted == 'success') {
+      return (
+        <div className="signup form-container">
+          <h2>Thank you for signing up!</h2>
+          <p>Please check your inbox for a calendar invite for <b>{params.get("title")}</b>.</p>
+        </div>
+      )
+    } else {
+      return (
+        <div className="signup form-container"><pre>{isSubmitted}</pre></div>
+      )
+    }
   } else {
     return (
       <div className="signup form-container">