@acms-subir/core 0.3.40 → 0.3.42

package/CHANGELOG.md

@@ -1,5 +1,29 @@
 # @acms-subir/core
 
+## 0.3.42
+
+### Patch Changes
+
+- b5964fd: Staff can send a test notification to their own phone before anything goes out. Admin → Announcements and Admin → Mobile app have a **Test phones** panel: **Link my phone** shows a 6-digit code that works once for 10 minutes; in the app, open Notifications, choose **Staff? Link this phone** and enter it. The panel lists your linked phones (when linked, when the app was last opened) with **Remove**; each person sees only their own. Signed in with the owner password, there's no account to link a phone to, so the panel says to use a Team account with an email. When a phone is linked, its owner gets an email, "A phone was linked to your account", in the site's main language with a link back to the panel; it goes out whenever email is set up, even with staff notifications off, because it's a security notice.
+
+  **Send test to my phone**, under the preview in the announcement composer and the Mobile app composer, sends the draft as it stands (title, message, and the button's link or the app's home as the tap) to your linked phones only, titled "[Test] …" in the language chosen in the preview ("[Prueba]" in Spanish, "[Teste]" in Portuguese). An urgent draft uses the urgent channel, so you see how it looks. Tests show in the delivery log as "Test by …", never count toward the weekly pace, and are limited to 10 an hour per person. With no phone linked, the button opens the Test phones panel.
+
+  Codes are stored only as a hash. Guessing is capped: 5 tries per phone and 5 per address in 10 minutes, and after 20 wrong codes across the site every waiting code stops working (make a new one). The app API adds `POST /api/v1/devices/{token}/staff-link` (body `{ code }`, answers `{ linked, staff: { name } }`) and `DELETE` to unlink; device responses carry `staff` (the name only, never an email), test pushes carry `data.test: true` and `source: 'test'`, and turning notifications off unlinks the phone. Migration 62 adds `push_devices.staff_user_id` and `staff_linked_at` and the `push_link_codes` table.
+
+  The privacy notice now says staff can link their own phone to their account to receive test notifications and that the link is removed when they remove it or turn notifications off, so its "Last updated" date moves on sites with push; the app store answers say the device ID is linked to a staff member only then. The push recipe's Notifications screen gets the row (only while notifications are on) and a new `/link-phone` screen; update it with `npx acms mobile recipe add push --force`, which overwrites the recipe's files, including any changes you made to them, and needs this release's `@acms-subir/native`. Describe the screen in App Review Notes: "Notifications has a staff-only screen to receive test notifications; it needs a code from the website admin."
+
+## 0.3.41
+
+### Patch Changes
+
+- 4fed854: Events can keep a waitlist. Turn on **Offer a waitlist when it's full** in the event's CTA card (it needs a number of seats; it's off for every event, including existing ones). When a date is full, the event page says "Full", "40 going · no spots left" and "Join the waitlist and we'll email you if a spot opens.", and **Join the waitlist** opens the same form: name, email, seats and the event's questions. A place in line takes no seats, counts as that email's RSVP for the date (a second one gets the usual "You already have an RSVP" notice), and can only be taken while RSVPs are open. The person gets "You're on the waitlist" by email, with their place in line, and their RSVP's page shows "#3 in line · 2 seats" and **Leave the waitlist**. Staff get no email for it.
+
+  When seats free up (someone cancels or is declined, staff raise the number of seats, or a held spot runs out), the next people in line whose seats fit are offered them, in the order they joined; a larger request keeps its place. Each gets "A spot opened" by email, and the spot is held for them for 24 hours: their page says "A spot is yours until Fri, Oct 24 at 9 PM" with **Confirm my spot** and **Release it**. Confirming makes it an RSVP like any other (waiting for approval when the event approves RSVPs), with the usual confirmation and the hosts' "New RSVP" email. A spot nobody confirms in time is released and goes to the next person. Offers keep going after the RSVP deadline, since those in line joined in time, but stop once the date starts. Each offer counts the seats in the same database write, so offers, cancellations and new RSVPs at once never go over the limit. The scheduler checks every minute. Emails are in the language the person used; a cancelled date or event cancels the line too.
+
+  Bookings has a **Waitlist** tab and a Waitlist group under Upcoming, with "#2 in line", "Spot offered" (and until when) and "Hold expired"; staff can remove someone or take back a held spot, and an event's registrations say "40 going · 3 waiting". The app API takes `waitlist: true` on an RSVP to a full date (the booking's status is `waitlisted`), and the REST booking API does too. `GET /api/v1/events/:slug/rsvp` has `waitlist` (`enabled`, `waiting`, `seats`, `maxSeats`), and held spots count as taken in `going` and `left`. Bookings have three new statuses, `waitlisted`, `offered` and `expired`; `GET /api/v1/bookings/manage` adds `booking.position`, `booking.holdUntil` and `can.confirm`, and the new `POST /api/v1/bookings/manage/confirm` takes a held spot (410 once it ran out). Editor documents and the events API carry `rsvp.waitlist`; saves that leave it out keep it. The editor app's bookings inbox filters by `waitlist`. Theme event templates get `rsvp.waitlist`. Migration 61 adds `bookings.hold_until`.
+
+  The privacy notice now says that when a date is full and someone joins its waitlist, the request is kept like an RSVP and a freed spot is held for 24 hours, so its "Last updated" date moves; the app store answers mention waitlist requests. The RSVP panel in the app recipes shows the waitlist too; update it with `npx acms mobile recipe add rsvp --force`, which overwrites `components/RsvpPanel.tsx`, including any changes you made to it, and needs this release's `@acms-subir/native`.
+
 ## 0.3.40
 
 ### Patch Changes

package/cli/migrations.generated.mjs

@@ -1116,6 +1116,21 @@ var MIGRATIONS = [
   // emails and links follow it; '' = the main language, so older rows need no backfill
   { version: 60, statements: [
     `ALTER TABLE bookings ADD COLUMN locale TEXT NOT NULL DEFAULT ''`
+  ] },
+  // RSVP waitlists: an offered spot is held until hold_until (ms); null for
+  // everything else, so older rows need no backfill
+  { version: 61, statements: [
+    `ALTER TABLE bookings ADD COLUMN hold_until INTEGER`
+  ] },
+  // staff test phones: a device a staff member linked with a one-time code
+  // (only its SHA-256 is stored, keyed by it: the app sends the code alone)
+  // gets their "Send test to my phone" pushes. Not public, so no cache trigger.
+  { version: 62, statements: [
+    `ALTER TABLE push_devices ADD COLUMN staff_user_id TEXT`,
+    `ALTER TABLE push_devices ADD COLUMN staff_linked_at INTEGER`,
+    `CREATE INDEX push_devices_staff ON push_devices (staff_user_id)`,
+    `CREATE TABLE push_link_codes (code_hash TEXT PRIMARY KEY, user_id TEXT NOT NULL, expires_at INTEGER NOT NULL, created_at INTEGER NOT NULL)`,
+    `CREATE INDEX push_link_codes_user ON push_link_codes (user_id)`
   ] }
 ];
 var CURRENT_CONTENT_VERSION_COLUMNS = {

package/docs/mobile.md

@@ -120,8 +120,9 @@ Read the app's `AGENTS.md` too: it holds the same rules, next to the code.
 | `useSearch(text, { types, collection, limit })` | site-wide search: `data.posts`, `data.pages`, `data.events` (each with `snippet.text` + `snippet.highlights`), `data.more`; debounced, blank text fetches nothing |
 | `useEvents({ calendar, from, to, limit, q })` | `data.occurrences[]` (`start`, `end`, `allDay`, `event`) in a window (default 30 days, max 90). `from`/`to` take a site-local day (`'2026-10-01'`) or an ISO date-time with a zone (`new Date().toISOString()`) |
 | `useEvent(slug)` | one event |
-| `useRsvpStatus(slug, start)` / `useRsvp(slug, start)` | RSVP to one date (`start` exactly as `useEvents` returns it, a UTC ISO string) when `event.rsvp.enabled`: `open` or `reason` (`full`, `ended`, `closed`, `cancelled`, `disabled`), `closesAt` (the deadline; `rsvpDeadlineText` words it), live `going`/`left`, `maxSeats`, the questions in `form`; `answerProblems(form.fields, answers)` for inline errors. One RSVP per email and date: `rsvp.duplicate` means that email already has one (the site emailed its link again); say so and keep the form. Needs only the calendar (`features.rsvp`). Keep `manageToken` in `expo-secure-store` to show or cancel the RSVP later (`useManagedBooking`, `useCancelBooking`) |
+| `useRsvpStatus(slug, start)` / `useRsvp(slug, start)` | RSVP to one date (`start` exactly as `useEvents` returns it, a UTC ISO string) when `event.rsvp.enabled`: `open` or `reason` (`full`, `ended`, `closed`, `cancelled`, `disabled`), `closesAt` (the deadline; `rsvpDeadlineText` words it), live `going`/`left`, `maxSeats`, the questions in `form`; `answerProblems(form.fields, answers)` for inline errors. One RSVP per email and date: `rsvp.duplicate` means that email already has one (the site emailed its link again); say so and keep the form. A full date whose event keeps a waitlist (`canJoinWaitlist(status)`) takes a place in line: send the details with `waitlist: true` (seats from `waitlistSeatChoices(status)`); the booking comes back `waitlisted`. Needs only the calendar (`features.rsvp`). Keep `manageToken` in `expo-secure-store` to show or cancel the RSVP later (`useManagedBooking`, `useCancelBooking`) |
 | `useManagedBooking(token)` / `useCancelBooking` / `useRescheduleBooking` / `useRescheduleAvailability` | the booker's own booking (from `book()`'s `manageToken`): `can.cancel`, `can.reschedule`, `can.closed` (change cutoff passed: show "Contact us") |
+| `useConfirmBooking(token)` | an RSVP on a waitlist: `waitlisted` shows "#3 in line · 2 seats" (`waitlistLineText(booking, words, locale)`) and can leave (`useCancelBooking`); `offered` holds a spot until `booking.holdUntil` (`holdText`: "We're holding it until Fri, Oct 24 at 9 PM") and `can.confirm` takes it. `isReleased(error)`: the hold ran out (410) and the spot went to the next person |
 | `useGuest()` / `useMyBookings({ when })` | guest sign-in with an emailed code, then every booking made with that email; check `features.guestSignIn` |
 | `useLinks()` / `useForm(id)` / `useSubmitForm(id)` | the links page; published forms and sending answers; check `features.links` / `features.forms` |
 | `useLive()` | live video: `snapshot`, `status` (`live`/`upcoming`/`offline`), `isLive`, localized `view` text, the owner's `display` choices (`style`, `bar`, `header`, `dock`). Polls every 30 s only in the foreground, rechecks on resume, drops an expired "live" even offline; idle while `features.live` is false. Render `<LiveCard>` / `<LiveTag>` |
@@ -288,6 +289,14 @@ plus automatic ones: new post, new event, "starting soon", event changes,
    `<AcmsProvider>` in `app/_layout.tsx`. Link to `/notifications`.
 3. Taps carry `data.url` / `data.path` and go through the provider's
    `onNavigate`, so route `/events/<slug>` and post paths to your screens there.
+4. Staff test phones: the recipe's Notifications screen ends with a visible
+   "Staff? Link this phone" row (only while notifications are on) that opens
+   `/link-phone`, where staff type the code from Admin → Announcements or
+   Mobile app → Test phones (`useLinkStaffPhone()`); then "Send test to my
+   phone" in the admin reaches their phone. Never hide it behind a long press
+   or gesture (App Review 2.3.1(a), 2.5.19). In App Store Connect's **App
+   Review Notes**, say: "Notifications has a staff-only screen to receive test
+   notifications; it needs a code from the website admin."
 
 Rules: ask for permission from a button after saying why (the recipe does),
 never on first launch. Topic ids and names come from the site
@@ -321,7 +330,8 @@ a pre-ticked choice doesn't count. So:
   completes it in **Settings → Legal**, which also lists the App Privacy and
   Data safety answers. Link to it inside the app: `useSite().data.legal.privacy`
   (and `.terms`). The site stores only the Expo token, platform, language and
-  topics, with no name or email.
+  topics, with no name or email, except a staff member's own test phone, which
+  records who linked it (the notice and the store answers say so).
 
 ## Editor apps (staff sign-in)
 

package/integration.mjs

@@ -765,8 +765,10 @@ export default function acms(options = {}) {
     routes.push(
       ['/api/v1/devices', 'api/v1/devices/index.ts'],
       ['/api/v1/devices/[token]', 'api/v1/devices/[token].ts'],
+      ['/api/v1/devices/[token]/staff-link', 'api/v1/devices/[token]/staff-link.ts'],
       ['/api/v1/push/topics', 'api/v1/push/topics.ts'],
       ['/api/push/admin', 'api/push/admin.ts'],
+      ['/api/push/phones', 'api/push/phones.ts'],
     );
   }
   // Admin → Mobile app: app access switches always; notifications when push is on
@@ -851,6 +853,8 @@ export default function acms(options = {}) {
       // the booker's own booking from an app (token in the Booking-Token header)
       ['/api/v1/bookings/manage', 'api/v1/bookings/manage/index.ts'],
       ['/api/v1/bookings/manage/cancel', 'api/v1/bookings/manage/cancel.ts'],
+      // a spot offered from an RSVP's waitlist, taken up
+      ['/api/v1/bookings/manage/confirm', 'api/v1/bookings/manage/confirm.ts'],
       ['/api/v1/bookings/manage/availability', 'api/v1/bookings/manage/availability.ts'],
       ['/api/v1/bookings/manage/reschedule', 'api/v1/bookings/manage/reschedule.ts'],
       ['/api/v1/bookings/manage/ics', 'api/v1/bookings/manage/ics.ts'],

package/mobile-template/recipes/events/files/components/RsvpPanel.tsx

@@ -1,16 +1,19 @@
-import { Fragment, useEffect, useState, type ReactNode } from 'react';
+import { Fragment, useEffect, useRef, useState, type ReactNode } from 'react';
 import { ActivityIndicator, Platform, Pressable, Switch, Text, TextInput, View, type KeyboardTypeOptions } from 'react-native';
 import * as Crypto from 'expo-crypto';
 import * as SecureStore from 'expo-secure-store';
 import { isAcmsError, type FormField } from '@acms-subir/client';
-import { Button, answerProblemText, answerProblems, countWords, fill, rsvpDeadlineText, seatChoices, useCancelBooking, useGuest, useLocale, useManagedBooking, useRsvp, useRsvpStatus, useSite, useStrings, useTheme } from '@acms-subir/native';
+import { Button, answerProblemText, answerProblems, canJoinWaitlist, countWords, fill, holdText, isReleased, rsvpDeadlineText, seatChoices, useCancelBooking, useConfirmBooking, useGuest, useLocale, useManagedBooking, useRsvp, useRsvpStatus, useSite, useStrings, useTheme, waitlistLineText, waitlistSeatChoices } from '@acms-subir/native';
 
 // RSVP to one date of an event: <RsvpPanel slug={event.slug} start={occurrence.start} />,
 // with `start` exactly as useEvents returns it. Shows going and spots left,
 // seats, contact details and the event's questions, then the person's RSVP
 // with a way to cancel it; or why the date takes no RSVPs. Same rules as the
 // event's web page: open until the event's deadline or the date ends, one RSVP
-// per email and date, and the organiser may approve each RSVP. useRsvp keeps
+// per email and date, and the organiser may approve each RSVP. A full date
+// whose event keeps a waitlist offers "Join the waitlist" with the same form;
+// then it shows their place in line ("#3 in line · 2 seats"), and when a spot
+// opens, until when it's held, with Confirm my spot and Release it. useRsvp keeps
 // one idempotency key per RSVP, so sending again after a timeout can't
 // register anyone twice. Its words come from
 // useStrings() in the app's language; the event's own form title, labels and
@@ -37,9 +40,11 @@ const withOther = (f: FormField, value: string | string[] | undefined, other: st
 };
 // a count in bold inside its words ("{count} going")
 const bold = (template: string, n: string) => template.split('{count}').map((part, i) => (i ? <Fragment key={i}><Text style={{ fontWeight: '700' }}>{n}</Text>{part}</Fragment> : part));
+// the site holds a spot freed from the waitlist this long
+const HOLD_HOURS = '24';
 
-// children: shown under the person's RSVP (not a declined one), e.g. an offer
-// to get notified if the date, time or place changes
+// children: shown under the person's RSVP (confirmed or waiting for approval,
+// not a place in line), e.g. an offer to get notified if the date, time or place changes
 export function RsvpPanel({ slug, start, children }: { slug: string; start: string; children?: ReactNode }) {
   const t = useTheme();
   const words = useStrings();
@@ -55,6 +60,7 @@ export function RsvpPanel({ slug, start, children }: { slug: string; start: stri
   const changes = site?.features.bookingChanges === true;
   const managed = useManagedBooking(changes ? stored : null);
   const cancel = useCancelBooking(stored);
+  const take = useConfirmBooking(stored);
   const [confirming, setConfirming] = useState(false);
   const [notice, setNotice] = useState('');
   const [name, setName] = useState('');
@@ -77,13 +83,17 @@ export function RsvpPanel({ slug, start, children }: { slug: string; start: stri
   }, [site?.features.guestSignIn, guest.email]);
   // cancelled (here, from the email link or by the organiser) or gone: forget the token
   const gone = managed.data?.booking.status === 'cancelled' || (isAcmsError(managed.error) && managed.error.status === 404);
+  // whether it was a place in line or a held spot before then
+  const waited = useRef(false);
+  if (managed.data && managed.data.booking.status !== 'cancelled') waited.current = ['waitlisted', 'offered'].includes(managed.data.booking.status);
   useEffect(() => {
     if (!key || !stored || !gone) return;
     void tokens.remove(key);
     setStored(null);
     setConfirming(false);
     rsvp.reset();
-    if (managed.data?.booking.status === 'cancelled') setNotice(words.rsvpCancelled);
+    take.reset();
+    if (managed.data?.booking.status === 'cancelled') setNotice(waited.current ? words.offWaitlist : words.rsvpCancelled);
   }, [key, stored, gone]);
 
   if (!s) return status.isPending ? <ActivityIndicator color={t.colors.accent} /> : null;
@@ -94,10 +104,12 @@ export function RsvpPanel({ slug, start, children }: { slug: string; start: stri
   const seatsText = (n: number) => countWords(n, words.seat, words.seats, locale);
   // "RSVPs close Fri, Oct 24 at 9 PM", or once past it "They closed on …"
   const deadline = rsvpDeadlineText(s, words, locale);
+  // full, and the event keeps a waitlist: the same form takes a place in line
+  const joining = canJoinWaitlist(s);
   const going = (
     <Text style={t.styles.text.body}>
       {bold(s.going === 1 ? words.personGoing : words.peopleGoing, num(s.going))}
-      {s.left !== null && <> · {bold(s.left === 1 ? words.spotLeft : words.spotsLeft, num(s.left))}</>}
+      {s.left !== null && <> · {joining ? words.noSpotsLeft : bold(s.left === 1 ? words.spotLeft : words.spotsLeft, num(s.left))}</>}
     </Text>
   );
 
@@ -114,39 +126,59 @@ export function RsvpPanel({ slug, start, children }: { slug: string; start: stri
     </View>
   );
   if ((stored && mine) || made) {
-    const state = mine?.booking.status ?? made!.status;
+    // a held spot that ran out (before the site's next sweep, or while they confirmed it) reads as released
+    const ranOut = isReleased(take.error) || (mine?.booking.status === 'offered' && !mine.can.confirm);
+    const state = ranOut ? 'expired' : mine?.booking.status ?? made!.status;
+    const seats = mine?.booking.seats ?? made!.seats;
     const who = mine?.booking.email ?? made!.email;
     const thanks = mine ? mine.confirmation : made!.formResponse?.definition.confirmation || null;
     const canCancel = !!stored && changes && (mine ? mine.can.cancel : false);
+    // declined, or a held spot they didn't confirm in time: nothing left to change
+    const over = state === 'declined' || state === 'expired';
+    const forget = () => { if (key) void tokens.remove(key); setStored(null); rsvp.reset(); take.reset(); };
+    // leaving the line or releasing a held spot asks first, like cancelling
+    const leave = state === 'waitlisted' ? { label: words.leaveWaitlist, ask: words.leaveWaitlistAsk, busy: words.leaving }
+      : state === 'offered' ? { label: words.releaseSpot, ask: words.releaseSpotAsk, busy: words.releasing }
+      : { label: words.cancelRsvp, ask: fill(words.cancelRsvpFor, { seats: seatsText(seats) }), busy: words.cancelling };
+    const heading = state === 'waitlisted' ? words.onWaitlist : state === 'offered' ? words.spotOpened : state === 'expired' ? words.spotReleased
+      : !made ? words.yourRsvp : state === 'confirmed' ? words.confirmed : words.requestSent;
+    const line = state === 'waitlisted' ? waitlistLineText({ position: mine?.booking.position, seats }, words, locale)
+      : state === 'offered' || state === 'expired' ? seatsText(seats)
+      : `${seatsText(seats)} · ${state === 'confirmed' ? words.confirmed : state === 'pending' ? words.awaitingApproval : words.notConfirmed}`;
+    const body = state === 'waitlisted' ? fill(words.waitlistPromise, { hours: HOLD_HOURS })
+      : state === 'offered' ? holdText(mine?.booking.holdUntil, words, locale)
+      : state === 'expired' ? fill(words.spotReleasedNote, { hours: HOLD_HOURS })
+      : state === 'confirmed' ? thanks || fill(words.confirmationOnItsWay, { email: who })
+      : state === 'pending' ? fill(words.emailWhenApproved, { email: who }) : words.rsvpDeclined;
+    const failed = (e: unknown) => (isAcmsError(e) && e.status === 0 ? words.checkConnection : e instanceof Error ? e.message : '');
     return (<>
       <View style={[t.styles.card, { gap: 8 }]}>
-        <Text accessibilityRole="header" style={t.styles.text.heading}>{!made ? words.yourRsvp : state === 'confirmed' ? words.confirmed : words.requestSent}</Text>
-        <Text style={[t.styles.text.label, { color: t.colors.ink }]}>
-          {seatsText(mine?.booking.seats ?? made!.seats)} · {state === 'confirmed' ? words.confirmed : state === 'pending' ? words.awaitingApproval : words.notConfirmed}
-        </Text>
-        <Text style={t.styles.text.body}>
-          {state === 'confirmed' ? thanks || fill(words.confirmationOnItsWay, { email: who })
-            : state === 'pending' ? fill(words.emailWhenApproved, { email: who }) : words.rsvpDeclined}
-        </Text>
-        {state === 'declined' && <Button label={words.rsvpAgain} variant="outline" onPress={() => { if (key) void tokens.remove(key); setStored(null); rsvp.reset(); }} />}
-        {canCancel && state !== 'declined' && (confirming ? (
+        <Text accessibilityRole="header" style={t.styles.text.heading}>{heading}</Text>
+        <Text style={[t.styles.text.label, { color: t.colors.ink }]}>{line}</Text>
+        {!!body && <Text style={t.styles.text.body}>{body}</Text>}
+        {state === 'offered' && !confirming && (
+          <Button label={take.isPending ? words.confirming : words.confirmSpot} disabled={take.isPending} onPress={() => take.mutate()} />
+        )}
+        {over && <Button label={words.rsvpAgain} variant="outline" onPress={forget} />}
+        {canCancel && !over && (confirming ? (
           <View style={{ gap: 8 }}>
-            <Text style={t.styles.text.body}>{fill(words.cancelRsvpFor, { seats: seatsText(mine!.booking.seats) })}</Text>
+            <Text style={t.styles.text.body}>{leave.ask}</Text>
             <View style={{ flexDirection: 'row', flexWrap: 'wrap', gap: 10 }}>
-              <Button label={cancel.isPending ? words.cancelling : words.yesCancel} disabled={cancel.isPending} onPress={() => cancel.mutate()} />
+              <Button label={cancel.isPending ? leave.busy : state === 'waitlisted' || state === 'offered' ? leave.label : words.yesCancel} disabled={cancel.isPending} onPress={() => cancel.mutate()} />
               <Button label={words.keepIt} variant="outline" disabled={cancel.isPending} onPress={() => setConfirming(false)} />
             </View>
           </View>
-        ) : <Button label={words.cancelRsvp} variant="outline" onPress={() => setConfirming(true)} />)}
-        {cancel.error && <Text style={errorText}>{isAcmsError(cancel.error) && cancel.error.status === 0 ? words.checkConnection : cancel.error.message}</Text>}
-        {!canCancel && state !== 'declined' && <Text style={t.styles.text.small}>{words.changeByEmail}</Text>}
+        ) : <Button label={leave.label} variant="outline" disabled={take.isPending} onPress={() => setConfirming(true)} />)}
+        {cancel.error && <Text style={errorText}>{failed(cancel.error)}</Text>}
+        {take.error && !isReleased(take.error) && <Text style={errorText}>{failed(take.error)}</Text>}
+        {!canCancel && !over && <Text style={t.styles.text.small}>{words.changeByEmail}</Text>}
       </View>
-      {state !== 'declined' && children}
+      {(state === 'confirmed' || state === 'pending') && children}
     </>);
   }
 
   if (s.reason === 'disabled') return null;
-  if (!s.open) return (
+  if (!s.open && !joining) return (
     <View style={[t.styles.card, { gap: 6 }]}>
       <Text accessibilityRole="header" style={t.styles.text.heading}>{s.reason === 'full' ? words.full : s.reason === 'cancelled' ? words.dateCancelled : words.rsvpClosed}</Text>
       {s.reason === 'full' ? going : <Text style={t.styles.text.muted}>{s.reason === 'cancelled' ? words.noRsvpNeeded : s.reason === 'closed' ? deadline || words.rsvpClosed : words.dateEnded}</Text>}
@@ -162,12 +194,14 @@ export function RsvpPanel({ slug, start, children }: { slug: string; start: stri
   const emailProblem = !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email.trim()) ? words.emailProblem : '';
   // the form may ask for a phone itself
   const askPhone = !fields.some((f) => f.type === 'phone');
-  const chosen = Math.min(seats, s.maxSeats) || 1;
+  // a place in line may ask for the event's own limit (the status's maxSeats is what's left)
+  const choices = joining ? waitlistSeatChoices(s) : seatChoices(s);
+  const chosen = Math.min(seats, choices.length) || 1;
   const submit = () => {
     setTried(true);
     setNotice('');
     if (nameProblem || emailProblem || Object.keys(problems).length) return;
-    rsvp.mutate({ name, email, phone: askPhone ? phone : '', seats: chosen, answers }, {
+    rsvp.mutate({ name, email, phone: askPhone ? phone : '', seats: chosen, answers, waitlist: joining }, {
       onSuccess: (data) => { if (key) void tokens.set(key, data.manageToken); setStored(data.manageToken); },
     });
   };
@@ -243,20 +277,21 @@ export function RsvpPanel({ slug, start, children }: { slug: string; start: stri
   return (
     <View style={[t.styles.card, { gap: 16 }]}>
       <View style={{ gap: 4 }}>
-        <Text accessibilityRole="header" style={t.styles.text.heading}>{form?.title || words.rsvpTitle}</Text>
+        <Text accessibilityRole="header" style={t.styles.text.heading}>{joining ? words.full : form?.title || words.rsvpTitle}</Text>
         {going}
         {!!deadline && <Text style={t.styles.text.muted}>{deadline}</Text>}
+        {joining && <Text style={t.styles.text.muted}>{words.waitlistNote}</Text>}
         {!!notice && <Text style={t.styles.text.muted}>{notice}</Text>}
         {!!form?.intro && <Text style={t.styles.text.muted}>{form.intro}</Text>}
       </View>
       {text(words.nameField, name, setName, { required: true, auto: 'name', problem: tried ? nameProblem : '' })}
       {text(words.emailField, email, setEmail, { required: true, keyboard: 'email-address', auto: 'email', problem: tried ? emailProblem : '' })}
       {askPhone && text(words.phoneField, phone, setPhone, { keyboard: 'phone-pad', auto: 'tel' })}
-      {s.maxSeats > 1 && (
+      {choices.length > 1 && (
         <View style={{ gap: 6 }}>
           {label(words.seatsField, false)}
           <View accessibilityRole="radiogroup" style={{ flexDirection: 'row', flexWrap: 'wrap', gap: 8 }}>
-            {seatChoices(s).map((n) => (
+            {choices.map((n) => (
               <Pressable key={n} accessibilityRole="radio" accessibilityLabel={seatsText(n)} accessibilityState={{ checked: n === chosen }} onPress={() => setSeats(n)} style={[chip(n === chosen), { minWidth: 48, alignItems: 'center' }]}>
                 <Text style={[t.styles.text.body, n === chosen && { fontWeight: '600' }]}>{num(n)}</Text>
               </Pressable>
@@ -274,7 +309,7 @@ export function RsvpPanel({ slug, start, children }: { slug: string; start: stri
         </View>
       )}
       {tried && (nameProblem || emailProblem || Object.keys(problems).length > 0) && <Text style={errorText}>{words.checkAnswers}</Text>}
-      <Button label={rsvp.isPending ? words.sending : form?.submitLabel || (s.autoConfirm ? words.confirmSeat : words.requestSeat)} disabled={rsvp.isPending} onPress={submit} />
+      <Button label={rsvp.isPending ? words.sending : joining ? words.joinWaitlist : form?.submitLabel || (s.autoConfirm ? words.confirmSeat : words.requestSeat)} disabled={rsvp.isPending} onPress={submit} />
       <Text style={t.styles.text.small}>{words.rsvpPrivacy}</Text>
     </View>
   );

package/mobile-template/recipes/push/files/app/link-phone.tsx

@@ -0,0 +1,43 @@
+import { useState } from 'react';
+import { ScrollView, Text, TextInput, View } from 'react-native';
+import { Stack } from 'expo-router';
+import { Button, fill, linkCodeInput, staffLinkProblemText, useLayout, useLinkStaffPhone, useStrings, useTheme } from '@acms-subir/native';
+
+// Staff only: link this phone with the 6-digit code from the website admin
+// (Announcements or Mobile app → Test phones), so "Send test to my phone"
+// reaches it. Opened from the last row of /notifications while notifications
+// are on; turning them off unlinks it. Words: useStrings() in the app's language.
+export default function LinkPhoneScreen() {
+  const t = useTheme();
+  const { gutter } = useLayout();
+  const words = useStrings();
+  const staff = useLinkStaffPhone();
+  const [code, setCode] = useState('');
+  const input = { borderWidth: 1, borderColor: t.colors.line, borderRadius: Math.min(t.radius, 10), padding: 12, fontSize: 22, letterSpacing: 4, color: t.colors.ink, backgroundColor: t.colors.panel } as const;
+  const link = async () => { if (await staff.link(code)) setCode(''); };
+  return (
+    <ScrollView style={{ backgroundColor: t.colors.bg }} contentContainerStyle={{ padding: gutter, gap: 16, width: '100%', maxWidth: 640, alignSelf: 'center' }} keyboardShouldPersistTaps="handled">
+      <Stack.Screen options={{ title: words.linkPhoneTitle }} />
+      <Text style={t.styles.text.muted}>{words.linkPhoneIntro}</Text>
+
+      {staff.status === 'off' ? (
+        <Text style={t.styles.text.body}>{words.linkNeedsNotifications}</Text>
+      ) : staff.linked ? (
+        <View style={[t.styles.card, { flexDirection: 'row', alignItems: 'center', gap: 12 }]}>
+          <Text style={[t.styles.text.body, { flex: 1 }]}>{fill(words.linkedTo, staff.linked)}</Text>
+          <Button variant="outline" label={words.unlinkPhone} disabled={staff.status !== 'ready'} onPress={() => { staff.unlink(); }} />
+        </View>
+      ) : (
+        <View style={{ gap: 6 }}>
+          <Text style={t.styles.text.label}>{words.linkCode}</Text>
+          <TextInput value={code} onChangeText={(v) => setCode(linkCodeInput(v))} onSubmitEditing={link} keyboardType="number-pad" textContentType="oneTimeCode"
+            autoComplete="one-time-code" maxLength={6} accessibilityLabel={words.linkCode} placeholder="000000" placeholderTextColor={t.colors.muted} style={input} />
+        </View>
+      )}
+      {!!staff.problem && <Text accessibilityRole="alert" style={[t.styles.text.small, { color: t.colors.ink, fontWeight: '600' }]}>{staffLinkProblemText(staff.problem, words)}</Text>}
+      {staff.status !== 'off' && !staff.linked && (
+        <Button label={staff.status === 'linking' ? words.linkingPhone : words.linkPhone} disabled={code.length !== 6 || staff.status !== 'ready'} onPress={link} />
+      )}
+    </ScrollView>
+  );
+}

package/mobile-template/recipes/push/files/app/notifications.tsx

@@ -1,15 +1,19 @@
-import { Linking, ScrollView, Switch, Text, View } from 'react-native';
-import { Stack } from 'expo-router';
-import { Button, useLayout, usePushRegistration, usePushTopics, useTheme } from '@acms-subir/native';
+import { Linking, Pressable, ScrollView, Switch, Text, View } from 'react-native';
+import { Link, Stack } from 'expo-router';
+import { Button, fill, useLayout, useLinkStaffPhone, usePushRegistration, usePushTopics, useStrings, useTheme } from '@acms-subir/native';
 import { STARTING_TOPICS } from '../lib/push';
 
 // Turn notifications on, choose topics, or turn them off. Topics and their
 // names come from the site, so new calendars or collections appear here
-// without an app update.
+// without an app update. While notifications are on, the last row opens
+// /link-phone, where staff link their own phone for test notifications (a
+// visible row, so App Review can find it: describe it in the Review Notes).
 export default function NotificationsScreen() {
   const t = useTheme();
   const { gutter } = useLayout();
+  const words = useStrings();
   const push = usePushRegistration({ topics: STARTING_TOPICS });
+  const staff = useLinkStaffPhone();
   const offered = usePushTopics();
   const toggle = (id: string, on: boolean) => {
     const next = on ? [...push.topics, id] : push.topics.filter((x) => x !== id);
@@ -57,6 +61,12 @@ export default function NotificationsScreen() {
           </View>
           <Text style={t.styles.text.small}>Announcements from the site reach everyone with notifications on.</Text>
           <Button variant="outline" label="Turn off notifications" onPress={() => { push.unregister().catch(() => {}); }} />
+          <Link href="/link-phone" asChild>
+            <Pressable accessibilityRole="button" style={[t.styles.card, { gap: 2, minHeight: 52, justifyContent: 'center' }]}>
+              <Text style={t.styles.text.body}>{words.staffRow}</Text>
+              <Text style={t.styles.text.small}>{staff.linked ? fill(words.linkedTo, staff.linked) : words.staffRowNote}</Text>
+            </Pressable>
+          </Link>
         </>
       )}
     </ScrollView>

package/mobile-template/recipes/push/recipe.json

@@ -7,7 +7,8 @@
     "expo-device"
   ],
   "routes": [
-    "/notifications"
+    "/notifications",
+    "/link-phone"
   ],
   "next": [
     "Turn push on for the site: acms({ mobile: { push: true } }) in astro.config.mjs, then restart or deploy",
@@ -15,6 +16,7 @@
     "Push tokens need an EAS project id: npx eas-cli init (saves extra.eas.projectId in app.json)",
     "Mount <PushSetup /> inside <AcmsProvider> in app/_layout.tsx (re-registers on start, opens tapped notifications)",
     "Link to the screen: <Link href=\"/notifications\">Notifications</Link> (expo-router)",
-    "Send from the site: Admin → Mobile app"
+    "Send from the site: Admin → Mobile app",
+    "Staff test their notifications on their own phone: Notifications → \"Staff? Link this phone\" (/link-phone, shown while notifications are on) takes the code from Admin → Announcements or Mobile app → Test phones. Describe it in App Store Connect's App Review Notes: \"Notifications has a staff-only screen to receive test notifications; it needs a code from the website admin.\""
   ]
 }