Events

// app/events/page.tsx
import { createClient } from '@01.software/sdk'
import { registerRsvp } from './actions'

export const dynamic = 'force-dynamic'

export default async function EventsPage() {
  const client = createClient({
    publishableKey: process.env.NEXT_PUBLIC_SOFTWARE_PUBLISHABLE_KEY!,
    apiUrl: process.env.SOFTWARE_API_URL,
  })
  const range = await client.events.getRange({ limit: 10 })
  const occurrences = range.docs.filter(
    (row) =>
      row.status === 'scheduled' &&
      ['rsvp', 'approval'].includes(row.event.registrationPolicy ?? ''),
  )
  if (occurrences.length === 0)
    return <p>No open RSVP occurrences in this range.</p>
  return (
    <ul>
      {occurrences.map((occurrence) => (
        <li key={occurrence.id}>
          <h2>{occurrence.event.title ?? 'Untitled event'}</h2>
          <p>
            {occurrence.isAllDay
              ? `${occurrence.allDayStartDate} / ${occurrence.allDayEndDateExclusive} (exclusive)`
              : occurrence.startsAt}
          </p>
          <form action={registerRsvp}>
            <input
              type="hidden"
              name="event"
              value={String(occurrence.event.id)}
            />
            <input
              type="hidden"
              name="occurrence"
              value={String(occurrence.id)}
            />
            <input
              name="email"
              type="email"
              required
              aria-label="Attendee email"
            />
            <button>RSVP</button>
          </form>
        </li>
      ))}
    </ul>
  )
}

// app/events/actions.ts
'use server'

import { cookies } from 'next/headers'
import { redirect } from 'next/navigation'
import { currentCustomer, cookieOptions } from '@/lib/customer'

// App-owned policy. false permits guests; true gates this app's action only.
const signupRequired = true

export async function registerRsvp(form: FormData) {
  const { client, customer, hadToken } = await currentCustomer()
  if ((signupRequired || hadToken) && !customer) redirect('/api/account/login')
  const event = String(form.get('event') ?? '')
  const occurrence = String(form.get('occurrence') ?? '')
  const email = String(form.get('email') ?? '').trim()
  if (!event || !occurrence || !email)
    throw new Error('Select an event and enter an email')
  const result = await client.events.register({
    event,
    occurrence,
    quantity: 1,
    attendee: { email },
  })
  // Token is a capability: never put it in a URL, log, or public response.
  const jar = await cookies()
  jar.set('__Host-rsvp-token', result.guestToken, {
    ...cookieOptions,
    expires: new Date(result.guestTokenExpiresAt),
  })
  redirect('/events/manage')
}

// app/events/manage/page.tsx
import { cookies } from 'next/headers'
import { customerClient, cookieOptions } from '@/lib/customer'
import { CancelRsvp } from './cancel-form'

export const dynamic = 'force-dynamic'

export default async function ManageRsvp() {
  const token = (await cookies()).get('__Host-rsvp-token')?.value
  const registration = token
    ? (await customerClient().events.getGuestRegistration(token)).registration
    : null
  async function cancel(): Promise<'canceled'> {
    'use server'
    const jar = await cookies()
    const current = jar.get('__Host-rsvp-token')?.value
    if (!current) throw new Error('RSVP token missing')
    const result =
      await customerClient().events.cancelGuestRegistration(current)
    if (result.registration.registrationStatus !== 'canceled')
      throw new Error('Cancellation unconfirmed')
    // Successful cancellation revokes the guest token; never look it up again.
    jar.set('__Host-rsvp-token', '', { ...cookieOptions, maxAge: 0 })
    return 'canceled'
  }
  return (
    <main>
      <h1>Manage RSVP</h1>
      <CancelRsvp
        registrationStatus={registration?.registrationStatus ?? null}
        cancel={cancel}
      />
    </main>
  )
}

// app/events/manage/cancel-form.tsx
'use client'

import { useActionState } from 'react'

type CancelState = 'ready' | 'canceled' | 'failed'

export function CancelRsvp({
  registrationStatus,
  cancel,
}: {
  registrationStatus: string | null
  cancel: () => Promise<'canceled'>
}) {
  const [state, submit, pending] = useActionState<CancelState, FormData>(
    async () => {
      try {
        return await cancel()
      } catch {
        return 'failed'
      }
    },
    'ready',
  )
  if (state === 'canceled') return <p role="status">RSVP canceled.</p>
  if (!registrationStatus)
    return (
      <p>
        No RSVP token in this browser. Make a new reservation or contact
        support.
      </p>
    )
  if (!['pending', 'going', 'waitlisted'].includes(registrationStatus))
    return <p>RSVP: {registrationStatus}. Contact support for changes.</p>
  return (
    <form action={submit}>
      <p>RSVP: {registrationStatus}</p>
      {state === 'failed' && (
        <p role="alert">
          Cancellation unconfirmed. Contact support before retrying.
        </p>
      )}
      <button disabled={pending}>Cancel RSVP</button>
    </form>
  )
}