@acms-subir/core 0.3.37 → 0.3.39

package/src/components/MobileApp.tsx

@@ -1,6 +1,6 @@
 import { useEffect, useId, useMemo, useRef, useState } from 'react';
 import type { AdminPushState } from '../lib/push/api';
-import type { PushAuto, PushNotification } from '../lib/push/types';
+import type { ChangeRule, PushAuto, PushNotification } from '../lib/push/types';
 import '../styles/mobile-app.css';
 
 // Admin → Mobile app: send a notification to the site's own app, choose the
@@ -10,6 +10,8 @@ import '../styles/mobile-app.css';
 const ENDPOINT = '/api/push/admin';
 const CUSTOM = '__custom';
 const SOON_MINUTES = [10, 15, 30, 60, 120, 1440];
+// MAX_CHANGE_RULES (lib/push/types, which brings zod)
+const MAX_RULES = 10;
 
 async function api<T>(body?: Record<string, unknown>): Promise<T> {
   const res = await fetch(ENDPOINT, {
@@ -262,10 +264,14 @@ function Automatic({ state, setState }: { state: AdminPushState; setState: (s: A
     } catch (e) { setMsg({ err: errText(e) }); } finally { setBusy(false); }
   };
   const topicName = (id: string) => state.topics.find((t) => t.id === id)?.label ?? id;
-  const calendarChoices = (key: 'newEvent' | 'startingSoon' | 'eventChanges') => {
-    const list = auto[key].calendars;
+  const uid = useId();
+  const addRule = useRef<HTMLButtonElement>(null);
+  const rules = auto.eventChanges;
+  const setRule = (i: number, patch: Partial<ChangeRule>) => setAuto({ ...auto, eventChanges: rules.map((r, j) => (j === i ? { ...r, ...patch } : r)) });
+  // focus moves to "Add a rule" (enabled again once the tenth rule goes)
+  const removeRule = (i: number) => { setAuto({ ...auto, eventChanges: rules.filter((_, j) => j !== i) }); requestAnimationFrame(() => addRule.current?.focus()); };
+  const calendarChoices = (list: string[], set: (calendars: string[]) => void) => {
     const all = list.includes('*');
-    const set = (calendars: string[]) => setAuto({ ...auto, [key]: { ...auto[key], calendars } });
     return (
       <div className="ma-choices">
         <label className="ma-check"><input type="checkbox" checked={all} onChange={() => set(all ? [] : ['*'])} /><span>All public calendars</span></label>
@@ -296,11 +302,11 @@ function Automatic({ state, setState }: { state: AdminPushState; setState: (s: A
           <>
             <div className="ma-rule">
               <div className="ma-rule-head"><b>New event published</b><small>Name, date and place, opens the event.</small></div>
-              {calendarChoices('newEvent')}
+              {calendarChoices(auto.newEvent.calendars, (calendars) => setAuto({ ...auto, newEvent: { calendars } }))}
             </div>
             <div className="ma-rule">
               <div className="ma-rule-head"><b>Starting soon</b><small>A reminder before each event time, once per date.</small></div>
-              {calendarChoices('startingSoon')}
+              {calendarChoices(auto.startingSoon.calendars, (calendars) => setAuto({ ...auto, startingSoon: { ...auto.startingSoon, calendars } }))}
               <label className="field ma-lead">
                 <span>Send</span>
                 <select value={auto.startingSoon.minutes} onChange={(e) => setAuto({ ...auto, startingSoon: { ...auto.startingSoon, minutes: Number(e.target.value) } })}>
@@ -310,24 +316,39 @@ function Automatic({ state, setState }: { state: AdminPushState; setState: (s: A
             </div>
             <div className="ma-rule">
               <div className="ma-rule-head"><b>When an event changes</b><small>New date, time or place, or a cancellation, opens the event. Sent 10 minutes after the last edit (1 minute when it starts within 3 hours), so a quick fix doesn’t notify twice.</small></div>
-              {calendarChoices('eventChanges')}
-              <div className="ma-fields">
-                <div className="field ma-lead">
-                  <span>Only events tagged</span>
-                  <TagChips tags={auto.eventChanges.tags} suggestions={state.tags}
-                    onChange={(tags) => setAuto({ ...auto, eventChanges: { ...auto.eventChanges, tags } })} />
+              {rules.length ? (
+                <div className="ma-subrules">
+                  {/* rules have no ids; inputs are controlled, so a position is enough */}
+                  {rules.map((r, i) => (
+                    <div key={i} className="ma-subrule" role="group" aria-labelledby={`${uid}-rule-${i}`}>
+                      <div className="ma-subrule-head">
+                        <b id={`${uid}-rule-${i}`}>Rule {i + 1}</b>
+                        <button type="button" className="btn ghost sm" aria-label={`Remove rule ${i + 1}`} onClick={() => removeRule(i)}>Remove</button>
+                      </div>
+                      {calendarChoices(r.calendars, (calendars) => setRule(i, { calendars }))}
+                      <div className="ma-fields">
+                        <div className="field ma-lead">
+                          <span>Only events tagged</span>
+                          <TagChips tags={r.tags} suggestions={state.tags} onChange={(tags) => setRule(i, { tags })} />
+                        </div>
+                        <label className="field ma-lead">
+                          <span>Send to</span>
+                          <select value={r.topics.join(',')} onChange={(e) => setRule(i, { topics: e.target.value ? e.target.value.split(',') : [] })}>
+                            <option value="">The event’s topics (Events, its calendar)</option>
+                            {/* several topics can only come from the API: keep them choosable */}
+                            {r.topics.length > 1 && <option value={r.topics.join(',')}>{r.topics.map(topicName).join(', ')}</option>}
+                            {state.topics.map((t) => <option key={t.id} value={t.id}>{t.label}</option>)}
+                          </select>
+                        </label>
+                      </div>
+                      {!r.calendars.length && <p className="hint">Choose a calendar, or this rule is removed when you save.</p>}
+                    </div>
+                  ))}
                 </div>
-                <label className="field ma-lead">
-                  <span>Send to</span>
-                  <select value={auto.eventChanges.topics.join(',')}
-                    onChange={(e) => setAuto({ ...auto, eventChanges: { ...auto.eventChanges, topics: e.target.value ? e.target.value.split(',') : [] } })}>
-                    <option value="">The event’s topics (Events, its calendar)</option>
-                    {/* several topics can only come from the API: keep them choosable */}
-                    {auto.eventChanges.topics.length > 1 && <option value={auto.eventChanges.topics.join(',')}>{auto.eventChanges.topics.map(topicName).join(', ')}</option>}
-                    {state.topics.map((t) => <option key={t.id} value={t.id}>{t.label}</option>)}
-                  </select>
-                </label>
-              </div>
+              ) : <p className="hint">Off. Add a rule to choose which events notify and who hears.</p>}
+              {rules.length > 1 && <p className="hint">An event that fits several rules gets one notice, sent to all of their topics.</p>}
+              <button type="button" ref={addRule} className="btn sm ma-add" disabled={rules.length >= MAX_RULES}
+                onClick={() => setAuto({ ...auto, eventChanges: [...rules, { calendars: [], tags: [], topics: [] }] })}>Add a rule</button>
             </div>
           </>
         )}

package/src/components/editor/EventPanel.tsx

@@ -20,7 +20,8 @@ export interface EventMeta {
   cta: EventCta;
   calendarIds: string[];
   fields: Record<string, string>;
-  rsvp: { enabled: boolean; capacity: number; autoConfirm: boolean; maxSeats: number; form?: FormDefinition };
+  // closesAt: wall time like start; closeBefore: minutes before each date (0 = until it ends)
+  rsvp: { enabled: boolean; capacity: number; autoConfirm: boolean; maxSeats: number; closesAt?: string | null; closeBefore?: number; form?: FormDefinition };
   roomHold: RoomHoldValue;
 }
 

package/src/components/editor/PostEditor.tsx

@@ -169,7 +169,7 @@ const NO_MAPS: MapsStatus = { enabled: false, provider: '', label: '', search: f
 const NO_EVENT: EventMeta = {
   start: '', end: '', allDay: false, timezone: '', rrule: '', exdates: [], cancelled: false,
   location: NO_LOCATION, cta: { label: '', href: '', style: 'primary' }, calendarIds: [], fields: {},
-  rsvp: { enabled: false, capacity: 0, autoConfirm: true, maxSeats: 4 },
+  rsvp: { enabled: false, capacity: 0, autoConfirm: true, maxSeats: 4, closesAt: null, closeBefore: 0 },
   roomHold: NO_HOLD,
 };
 

package/src/components/editor/event/RegistrationCard.tsx

@@ -4,7 +4,8 @@ import type { EventCta } from '../../../lib/schema';
 import type { EventMeta } from '../EventPanel';
 import { Section } from './Section';
 import { RegistrationFormEditor } from './RegistrationFormEditor';
-import { ctaHrefValid, normalizeCtaHref, registrationMode, registrationPatch, type RegistrationMode } from './registration';
+import { closeBeforeAmount, closeBeforeMinutes, closeBeforeUnit, ctaHrefValid, deadlineAfterEnd, normalizeCtaHref, registrationMode, registrationPatch, type CloseUnit, type RegistrationMode } from './registration';
+import { datePart, timePart } from './dates';
 
 const MODES: { id: RegistrationMode; label: string; sub: string }[] = [
   { id: 'none', label: 'None', sub: 'Just the details' },
@@ -73,6 +74,7 @@ export function RegistrationCard({ meta, onChange, eventId, title = '' }: { even
               <input type="checkbox" role="switch" className="pe-switch" checked={meta.rsvp.autoConfirm} onChange={(e) => onChange({ rsvp: { ...meta.rsvp, autoConfirm: e.target.checked } })} />
             </label>
           </div>
+          <Deadline meta={meta} onChange={onChange} />
           <div className="pe-evr-form">
             <div className="pe-evr-form-t">
               <b>{form.title || 'Registration form'}</b>
@@ -90,6 +92,54 @@ export function RegistrationCard({ meta, onChange, eventId, title = '' }: { even
   );
 }
 
+// When RSVPs close: a date and time for a one-time event, "[N] hours/days
+// before each date" for a repeating one. A setting the other kind left behind
+// (the event changed kind) is shown with a way to remove it, never hidden.
+function Deadline({ meta, onChange }: { meta: EventMeta; onChange: (patch: Partial<EventMeta>) => void }) {
+  const closesAt = meta.rsvp.closesAt ?? null;
+  const before = meta.rsvp.closeBefore ?? 0;
+  const [unit, setUnit] = useState<CloseUnit>(() => closeBeforeUnit(before));
+  const set = (patch: Partial<EventMeta['rsvp']>) => onChange({ rsvp: { ...meta.rsvp, ...patch } });
+  const amount = closeBeforeAmount(before, unit);
+  const ahead = `${amount} ${amount === 1 ? unit.slice(0, -1) : unit}`;
+  const at = (wall: string) => `${new Date(`${datePart(wall)}T12:00:00Z`).toLocaleDateString(undefined, { weekday: 'short', month: 'short', day: 'numeric', timeZone: 'UTC' })}, ${timePart(wall)}`;
+  const remove = (patch: Partial<EventMeta['rsvp']>) => <button type="button" className="pe-evw-link" onClick={() => set(patch)}>Remove</button>;
+
+  if (meta.rrule) return (
+    <div className="pe-field pe-evr-close" role="group" aria-labelledby="ev-rsvp-close">
+      <span id="ev-rsvp-close">Close RSVPs</span>
+      <div className="pe-evr-when">
+        <input type="number" min={0} max={unit === 'days' ? 60 : 1440} placeholder="0" aria-label={`${unit} before each date`} value={before ? amount : ''}
+          onChange={(e) => set({ closeBefore: closeBeforeMinutes(Number(e.target.value), unit) })} />
+        <select aria-label="Unit" value={unit} onChange={(e) => { const next = e.target.value as CloseUnit; setUnit(next); if (before) set({ closeBefore: closeBeforeMinutes(amount, next) }); }}>
+          <option value="hours">{amount === 1 ? 'hour' : 'hours'}</option>
+          <option value="days">{amount === 1 ? 'day' : 'days'}</option>
+        </select>
+        <span>before each date</span>
+      </div>
+      <small className="pe-evs-hint">{before ? `Each date stops taking RSVPs ${ahead} before it starts.` : 'Leave empty to take RSVPs until each date ends.'}</small>
+      {closesAt && <small className="pe-evs-hint">Every date also closes {at(closesAt)}. {remove({ closesAt: null })}</small>}
+    </div>
+  );
+  const late = closesAt ? deadlineAfterEnd(closesAt, meta) : false;
+  return (
+    <div className="pe-field pe-evr-close" role="group" aria-labelledby="ev-rsvp-close">
+      <span id="ev-rsvp-close">RSVPs close</span>
+      <div className="pe-evr-when">
+        <input type="date" aria-label="RSVPs close on" max={datePart(meta.end || meta.start) || undefined} value={closesAt ? datePart(closesAt) : ''}
+          onChange={(e) => set({ closesAt: e.target.value ? `${e.target.value}T${(closesAt && timePart(closesAt)) || timePart(meta.start) || '12:00'}` : null })} />
+        <input type="time" aria-label="RSVPs close at" step={300} disabled={!closesAt} value={closesAt ? timePart(closesAt) : ''}
+          onChange={(e) => { if (closesAt && e.target.value) set({ closesAt: `${datePart(closesAt)}T${e.target.value}` }); }} />
+        {closesAt && remove({ closesAt: null })}
+      </div>
+      <small className={`pe-evs-hint ${late ? 'is-error' : ''}`}>
+        {!closesAt ? 'Leave empty to take RSVPs until the event ends.' : late ? 'That’s after the event ends, so RSVPs stay open until it ends.' : 'In the event’s time zone. Then the page says RSVPs are closed.'}
+      </small>
+      {!closesAt && before > 0 && <small className="pe-evs-hint">It closes {ahead} before it starts. {remove({ closeBefore: 0 })}</small>}
+    </div>
+  );
+}
+
 // The link only reaches the event (and autosave) once it's valid, so a
 // half-typed link never blocks saving the rest. Blur fills in https://,
 // mailto: or tel: for bare domains, emails and phone numbers.

package/src/components/editor/event/registration.ts

@@ -1,4 +1,5 @@
 import type { EventCta } from '../../../lib/schema';
+import { toMin } from './dates';
 
 // The Registration card is one choice over two stored fields: `cta` (a link
 // button) and `rsvp` (the "Save my seat" form, which replaces the button on
@@ -8,7 +9,7 @@ export type RegistrationMode = 'none' | 'link' | 'rsvp';
 
 interface RegistrationData {
   cta: EventCta;
-  rsvp: { enabled: boolean; capacity: number; autoConfirm: boolean; maxSeats: number };
+  rsvp: { enabled: boolean; capacity: number; autoConfirm: boolean; maxSeats: number; closesAt?: string | null; closeBefore?: number };
 }
 
 export function registrationMode({ cta, rsvp }: RegistrationData): RegistrationMode {
@@ -37,3 +38,19 @@ export function normalizeCtaHref(raw: string): string {
   if (/^([\w-]+\.)+[a-z]{2,}(:\d+)?([/?#]\S*)?$/i.test(v)) return `https://${v}`;
   return v;
 }
+
+// RSVP deadline. One-time events pick when RSVPs close (closesAt); repeating
+// ones close each date "[N] [hours|days] before" it starts (closeBefore, in
+// minutes, at most 60 days). The server checks both again on save.
+export type CloseUnit = 'hours' | 'days';
+export const closeBeforeUnit = (minutes: number): CloseUnit => (minutes > 0 && minutes % 1440 === 0 ? 'days' : 'hours');
+export const closeBeforeAmount = (minutes: number, unit: CloseUnit) => minutes / (unit === 'days' ? 1440 : 60);
+export const closeBeforeMinutes = (amount: number, unit: CloseUnit) =>
+  Math.min(60 * 1440, Math.max(0, Math.round((Number.isFinite(amount) ? amount : 0) * (unit === 'days' ? 1440 : 60))));
+
+// a deadline at or after the end changes nothing: RSVPs close then anyway
+export function deadlineAfterEnd(closesAt: string, when: { start: string; end: string; allDay: boolean }): boolean {
+  const end = when.end || when.start;
+  if (!closesAt || !end) return false;
+  return toMin(closesAt) >= (when.allDay ? toMin(end.slice(0, 10)) + 1440 : toMin(end));
+}

package/src/lib/booking/emails.ts

@@ -1,20 +1,43 @@
 // Booking emails: plain, readable HTML (inline styles, no images) plus a
 // text part. Confirmed bookings carry an .ics so one tap adds them to the
-// booker's calendar.
+// booker's calendar. Guest emails speak the language the booking was made
+// in (Booking.locale, words in email/booking-words.ts) and link to its pages
+// in it; staff emails speak the site's main language.
 import type { Booking, BookingLink, Resource, Settings } from '../schema';
-import { siteLocale } from '../dates';
+import { siteLang, siteLocale } from '../dates';
 import { escapeText, foldLine } from '../calendar/ics-write';
+import { eventStrings } from '../calendar/event-words';
+import { manageUrl } from '../calendar/config';
+import { I18N, localePath } from '../i18n';
+import { isExtraLocale } from '../translations';
+import { fill } from '../live/words';
+import { bookingStrings, mailCopy, type BookingStrings } from '../email/booking-words';
 import type { Mail } from '../email';
 
 const esc = (s: string) => s.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;');
 
+/**
+ * The language a booking speaks: its own (an extra site locale it was made
+ * in, while the site still has it), else the main language. `settings`
+ * carries it for dates, keeping the site's region when it's the same language.
+ */
+export function bookingLanguage(b: Pick<Booking, 'locale'>, settings: Settings): { locale: string; lang: string; settings: Settings } {
+  const locale = isExtraLocale(b.locale) ? b.locale : '';
+  const lang = locale || (I18N.enabled && I18N.defaultLocale) || siteLang(settings);
+  return { locale, lang, settings: locale && locale.split('-')[0] !== siteLang(settings) ? { ...settings, locale } : settings };
+}
+
+/** the booking's own page, in its language: /es/book/manage/<token> */
+export const bookingManagePath = (b: Pick<Booking, 'locale' | 'manageToken'>) =>
+  localePath(manageUrl(b.manageToken), isExtraLocale(b.locale) ? b.locale : '');
+
 export function whenText(b: Pick<Booking, 'start' | 'end'>, tz: string, settings: Settings, allDayish = false): string {
   const locale = siteLocale(settings);
   const f = (o: Intl.DateTimeFormatOptions) => new Intl.DateTimeFormat(locale, { ...o, timeZone: tz });
   if (allDayish) {
     const last = b.end - 1;
     const d = f({ weekday: 'short', month: 'short', day: 'numeric' });
-    return d.format(b.start) === d.format(last) ? `${f({ weekday: 'long', month: 'long', day: 'numeric' }).format(b.start)} · all day` : `${d.format(b.start)} – ${d.format(last)}`;
+    return d.format(b.start) === d.format(last) ? `${f({ weekday: 'long', month: 'long', day: 'numeric' }).format(b.start)} · ${eventStrings(locale).allDay.toLowerCase()}` : `${d.format(b.start)} – ${d.format(last)}`;
   }
   const zone = f({ hour: 'numeric', timeZoneName: 'short' }).formatToParts(b.start).find((p) => p.type === 'timeZoneName')?.value ?? '';
   return `${f({ weekday: 'long', month: 'long', day: 'numeric' }).format(b.start)} · ${f({ hour: 'numeric', minute: '2-digit' }).format(b.start)} – ${f({ hour: 'numeric', minute: '2-digit' }).format(b.end)} ${zone}`.trim();
@@ -22,14 +45,15 @@ export function whenText(b: Pick<Booking, 'start' | 'end'>, tz: string, settings
 
 const utc = (ms: number) => new Date(ms).toISOString().replace(/[-:]/g, '').replace(/\.\d{3}/, '');
 
-export function bookingIcs(b: Booking, title: string, location: string, url: string, host: string, method: 'REQUEST' | 'CANCEL' = 'REQUEST', options: { organizer?: string; allDay?: boolean } = {}): string {
+// lang: the description's language ("Manage: <url>")
+export function bookingIcs(b: Booking, title: string, location: string, url: string, host: string, method: 'REQUEST' | 'CANCEL' = 'REQUEST', options: { organizer?: string; allDay?: boolean; lang?: string } = {}): string {
   const day = (ms: number) => new Intl.DateTimeFormat('en-CA', { timeZone: b.timezone || 'UTC', year: 'numeric', month: '2-digit', day: '2-digit' }).format(ms).replaceAll('-', '');
   const actualMethod = method === 'CANCEL' ? 'CANCEL' : options.organizer ? 'REQUEST' : 'PUBLISH';
   const lines = [
     'BEGIN:VCALENDAR', 'VERSION:2.0', 'PRODID:-//acms-subir//Bookings//EN', `METHOD:${actualMethod}`,
     'BEGIN:VEVENT', `UID:booking-${b.id}@acms.invalid`, `DTSTAMP:${utc(Date.now())}`, ...(options.allDay ? [`DTSTART;VALUE=DATE:${day(b.start)}`, `DTEND;VALUE=DATE:${day(b.end)}`] : [`DTSTART:${utc(b.start)}`, `DTEND:${utc(b.end)}`]),
     ...(options.organizer ? [`ORGANIZER:mailto:${options.organizer}`, `ATTENDEE;RSVP=FALSE:mailto:${b.email}`] : []),
-    `SUMMARY:${escapeText(title)}`, ...(location ? [`LOCATION:${escapeText(location)}`] : []), `DESCRIPTION:${escapeText(`Manage: ${url}`)}`,
+    `SUMMARY:${escapeText(title)}`, ...(location ? [`LOCATION:${escapeText(location)}`] : []), `DESCRIPTION:${escapeText(fill(bookingStrings(options.lang).icsManage, { url }))}`,
     `URL:${url}`, `STATUS:${method === 'CANCEL' ? 'CANCELLED' : 'CONFIRMED'}`, `SEQUENCE:${b.notificationVersion ?? 0}`,
     'END:VEVENT', 'END:VCALENDAR',
   ];
@@ -49,67 +73,60 @@ interface Ctx {
   message?: string;
   organizer?: string;
   allDay?: boolean;
+  /** the words' language: the booking's for guest emails, the main one for staff */
+  lang?: string;
 }
 
-function layout(heading: string, intro: string, c: Ctx, button?: { href: string; label: string }): { html: string; text: string } {
-  const rows: [string, string][] = [['What', c.title], ['When', c.when], ...(c.location ? [['Where', c.location] as [string, string]] : [])];
-  if (c.booking.seats > 1) rows.push(['Seats', String(c.booking.seats)]);
-  const html = `<!doctype html><html><body style="margin:0;background:#f6f5f2;font-family:-apple-system,Segoe UI,Inter,Arial,sans-serif;color:#1e1f24">
+function layout(heading: string, intro: string, c: Ctx, w: BookingStrings, button?: { href: string; label: string }): { html: string; text: string } {
+  const rows: [string, string][] = [[w.what, c.title], [w.when, c.when], ...(c.location ? [[w.where, c.location] as [string, string]] : [])];
+  if (c.booking.seats > 1) rows.push([w.seats, String(c.booking.seats)]);
+  const reference = fill(w.reference, { ref: c.booking.id.slice(0, 8).toUpperCase() });
+  const html = `<!doctype html><html lang="${esc(c.lang || 'en')}"><body style="margin:0;background:#f6f5f2;font-family:-apple-system,Segoe UI,Inter,Arial,sans-serif;color:#1e1f24">
 <div style="max-width:520px;margin:0 auto;padding:28px 20px">
 <p style="font-size:13px;color:#6b6e78;margin:0 0 18px">${esc(c.siteTitle)}</p>
 <h1 style="font-size:22px;margin:0 0 8px">${esc(heading)}</h1>
 <p style="font-size:15px;line-height:1.55;margin:0 0 18px;color:#3d3f47">${esc(intro)}</p>
 <table style="width:100%;border-collapse:collapse;background:#fff;border:1px solid #e5e3de;border-radius:10px">${rows
-    .map(([k, v]) => `<tr><td style="padding:10px 14px;font-size:13px;color:#6b6e78;width:70px;border-bottom:1px solid #eeece8">${k}</td><td style="padding:10px 14px;font-size:14px;border-bottom:1px solid #eeece8">${esc(v)}</td></tr>`)
+    .map(([k, v]) => `<tr><td style="padding:10px 14px;font-size:13px;color:#6b6e78;width:70px;border-bottom:1px solid #eeece8">${esc(k)}</td><td style="padding:10px 14px;font-size:14px;border-bottom:1px solid #eeece8">${esc(v)}</td></tr>`)
     .join('')}</table>
 ${c.message ? `<p style="font-size:14px;line-height:1.55;margin:18px 0 0">${esc(c.message)}</p>` : ''}
 ${button ? `<p style="margin:22px 0 0"><a href="${esc(button.href)}" style="display:inline-block;background:#1e1f24;color:#fff;text-decoration:none;font-weight:600;font-size:14px;padding:10px 16px;border-radius:8px">${esc(button.label)}</a></p>` : ''}
-<p style="font-size:12px;color:#8e919a;margin:26px 0 0">Reference ${esc(c.booking.id.slice(0, 8).toUpperCase())}</p>
+<p style="font-size:12px;color:#8e919a;margin:26px 0 0">${esc(reference)}</p>
 </div></body></html>`;
-  const text = [heading, '', intro, '', ...rows.map(([k, v]) => `${k}: ${v}`), ...(c.message ? ['', c.message] : []), ...(button ? ['', `${button.label}: ${button.href}`] : []), '', `Reference ${c.booking.id.slice(0, 8).toUpperCase()}`].join('\n');
+  const text = [heading, '', intro, '', ...rows.map(([k, v]) => `${k}: ${v}`), ...(c.message ? ['', c.message] : []), ...(button ? ['', `${button.label}: ${button.href}`] : []), '', reference].join('\n');
   return { html, text };
 }
 
-export type BookingEmail = 'received' | 'confirmed' | 'declined' | 'cancelled' | 'rescheduled' | 'updated' | 'reminder' | 'staff-new';
+// link: the booking's own link again, after someone tried to make it twice
+export type BookingEmail = 'received' | 'confirmed' | 'declined' | 'cancelled' | 'rescheduled' | 'updated' | 'reminder' | 'link' | 'staff-new';
 
 export function bookingEmail(kind: BookingEmail, c: Ctx): Mail {
-  const manage = { href: c.manageUrl, label: 'View or change your booking' };
-  const ics = (method: 'REQUEST' | 'CANCEL' = 'REQUEST') => [{ filename: 'booking.ics', type: `text/calendar; charset=utf-8; method=${method === 'CANCEL' ? 'CANCEL' : c.organizer ? 'REQUEST' : 'PUBLISH'}`, content: bookingIcs(c.booking, c.title, c.location, c.manageUrl, c.host, method, { organizer: c.organizer, allDay: c.allDay }) }];
+  const w = bookingStrings(c.lang);
+  const rsvp = c.booking.kind === 'rsvp';
+  const manage = { href: c.manageUrl, label: rsvp ? w.rsvp.manage : w.manage };
+  const ics = (method: 'REQUEST' | 'CANCEL' = 'REQUEST') => [{ filename: 'booking.ics', type: `text/calendar; charset=utf-8; method=${method === 'CANCEL' ? 'CANCEL' : c.organizer ? 'REQUEST' : 'PUBLISH'}`, content: bookingIcs(c.booking, c.title, c.location, c.manageUrl, c.host, method, { organizer: c.organizer, allDay: c.allDay, lang: c.lang }) }];
+  // null: no button (nothing left to change)
+  const guest = (k: Exclude<BookingEmail, 'staff-new'>, extra: Partial<Ctx> = {}, button: { href: string; label: string } | null = manage) => {
+    const copy = mailCopy(w, k, rsvp);
+    const vars = { name: c.booking.name || c.booking.email, title: c.title, when: c.when };
+    return { to: c.booking.email, subject: fill(copy.subject, vars), ...layout(copy.heading, fill(copy.intro, vars), { ...c, ...extra }, w, button ?? undefined) };
+  };
   switch (kind) {
-    case 'received': {
-      const m = layout('Request received', `Thanks, ${c.booking.name || 'there'}. We'll confirm by email soon.`, c, manage);
-      return { to: c.booking.email, subject: `Request received: ${c.title}`, ...m };
-    }
-    case 'confirmed': {
-      const m = layout('You’re booked', `It’s confirmed. Import the attached file to add it to your calendar.`, { ...c, message: c.message || c.link?.confirmMessage || '' }, manage);
-      return { to: c.booking.email, subject: `Confirmed: ${c.title} — ${c.when}`, ...m, attachments: ics() };
-    }
-    case 'declined': {
-      const m = layout('We couldn’t confirm your request', 'Sorry — this time isn’t available. You’re welcome to pick another.', c);
-      return { to: c.booking.email, subject: `Not available: ${c.title}`, ...m };
-    }
-    case 'cancelled': {
-      const m = layout('Booking cancelled', 'This booking has been cancelled.', c);
-      return { to: c.booking.email, subject: `Cancelled: ${c.title}`, ...m, attachments: ics('CANCEL') };
-    }
-    case 'updated': {
-      const m = layout('Booking details updated', 'Please review the latest details. Use the attached calendar file to update your calendar.', c, manage);
-      return { to: c.booking.email, subject: `Updated: ${c.title}`, ...m, attachments: ics() };
-    }
-    case 'rescheduled': {
-      const m = layout('Booking moved', 'Your booking has a new time. Import the attached calendar file to update your calendar.', c, manage);
-      return { to: c.booking.email, subject: `New time: ${c.title} — ${c.when}`, ...m, attachments: ics() };
-    }
-    case 'reminder': {
-      const m = layout('Coming up soon', 'A quick reminder about your booking.', c, manage);
-      return { to: c.booking.email, subject: `Reminder: ${c.title} — ${c.when}`, ...m };
-    }
+    case 'received': return guest('received');
+    case 'confirmed': return { ...guest('confirmed', { message: c.message || c.link?.confirmMessage || '' }), attachments: ics() };
+    case 'declined': return guest('declined', {}, null);
+    case 'cancelled': return { ...guest('cancelled', {}, null), attachments: ics('CANCEL') };
+    case 'updated': return { ...guest('updated'), attachments: ics() };
+    case 'rescheduled': return { ...guest('rescheduled'), attachments: ics() };
+    case 'reminder': return guest('reminder');
+    case 'link': return guest('link');
     case 'staff-new': {
       const pending = c.booking.status === 'pending';
       const who = [c.booking.name, c.booking.email, c.booking.phone].filter(Boolean).join(' · ');
       const answers = Object.entries(c.booking.answers).map(([k, v]) => `${k}: ${v}`).join('\n');
-      const m = layout(pending ? 'New request to approve' : 'New booking', `${who}${answers ? `\n${answers}` : ''}`, c, { href: c.manageUrl, label: pending ? 'Review in the admin' : 'Open in the admin' });
-      return { to: [], subject: `${pending ? 'Approve' : 'New booking'}: ${c.title} — ${c.when}`, ...m, replyTo: c.booking.email || undefined };
+      const vars = { title: c.title, when: c.when };
+      const m = layout(pending ? w.staff.pending : w.staff.booked, `${who}${answers ? `\n${answers}` : ''}`, c, w, { href: c.manageUrl, label: pending ? w.staff.review : w.staff.open });
+      return { to: [], subject: fill(pending ? w.staff.pendingSubject : w.staff.bookedSubject, vars), ...m, replyTo: c.booking.email || undefined };
     }
   }
 }

package/src/lib/booking/service.ts

@@ -9,9 +9,12 @@ import { loadFeed, expandVEvents } from '../calendar/ics';
 import { emitWebhook } from '../webhooks';
 import { parseFrom } from '../email/config';
 import { kickEmail } from '../email/service';
-import { manageUrl as manageUrlFor, eventUrl } from '../calendar/config';
-import { eventTimeZone, locationLine, occurrenceKey } from '../calendar/events';
-import { bookingEmail, whenText, type BookingEmail } from './emails';
+import { eventUrl } from '../calendar/config';
+import { eventTimeZone, locationLine, occurrenceKey, rsvpDeadline } from '../calendar/events';
+import { normalizePageLocale } from '../i18n';
+import { localizeDoc } from '../translations';
+import { bookingStrings } from '../email/booking-words';
+import { bookingEmail, bookingLanguage, bookingManagePath, whenText, type BookingEmail } from './emails';
 import { holdOf, isBookable, resourceZone, spanEnd, type AvailabilityContext, type Interval } from './availability';
 import { decideStatus, linkApproval } from './approval';
 import { eventHolds } from './holds';
@@ -25,7 +28,8 @@ export interface FlowOptions {
 }
 
 export class BookingError extends Error {
-  constructor(public status: number, message: string) { super(message); }
+  // code: why, when the status alone doesn't say (apps get it as the error code)
+  constructor(public status: number, message: string, public code?: 'duplicate') { super(message); }
 }
 
 const token = () => {
@@ -76,9 +80,12 @@ export async function availabilityContext(
 
 // ---- notifications ---------------------------------------------------------
 
-async function describe(repo: ContentRepository, b: Booking, settings: Settings) {
+// locale: an extra language to word it in (the event's translated title and
+// place, dates in it); settings then carry that language
+async function describe(repo: ContentRepository, b: Booking, settings: Settings, locale = '') {
   if (b.kind === 'rsvp') {
-    const ev = b.eventId ? await repo.getEvent(b.eventId) : null;
+    const raw = b.eventId ? await repo.getEvent(b.eventId) : null;
+    const ev = raw && locale ? localizeDoc(raw, locale) : raw;
     const tz = ev ? eventTimeZone(ev, settings) : settings.timezone || 'UTC';
     return {
       resource: null, link: null, event: ev,
@@ -107,18 +114,22 @@ export function bookingJson(b: Booking, extra: { title?: string; resourceSlug?:
   };
 }
 
-export async function bookingMail(repo: ContentRepository, b: Booking, kind: BookingEmail, origin: string, from = '', snapshot?: { message?: string; eventTitle?: string; eventLocation?: string; eventAllDay?: number }) {
-  const settings = await repo.getSettings();
-  const d = await describe(repo,b,settings);
+// snapshot.locale: the language to use instead of the booking's (a link sent again)
+export async function bookingMail(repo: ContentRepository, b: Booking, kind: BookingEmail, origin: string, from = '', snapshot?: { message?: string; eventTitle?: string; eventLocation?: string; eventAllDay?: number; locale?: string }) {
+  const site = await repo.getSettings();
+  // the guest hears in the language they booked in; staff in the main one
+  const language = bookingLanguage(kind === 'staff-new' ? { locale: '' } : typeof snapshot?.locale === 'string' ? { locale: snapshot.locale } : b, site);
+  const settings = language.settings;
+  const d = await describe(repo,b,settings,language.locale);
   if (b.kind === 'rsvp' && !d.event && snapshot?.eventTitle) {
     d.title = snapshot.eventTitle;
     try { d.location = locationLine(JSON.parse(snapshot.eventLocation || '{}')); } catch { d.location = ''; }
     d.when = whenText(b,b.timezone || settings.timezone || 'UTC',settings,!!snapshot.eventAllDay);
   }
   return bookingEmail(kind, { booking:b,resource:d.resource,link:d.link,title:d.title,location:d.location,when:d.when,
-    manageUrl:kind === 'staff-new' ? `${origin}/admin/calendar/bookings?b=${b.id}` : origin + manageUrlFor(b.manageToken),
+    manageUrl:kind === 'staff-new' ? `${origin}/admin/calendar/bookings?b=${b.id}` : origin + bookingManagePath({ manageToken: b.manageToken, locale: language.locale }),
     siteTitle:settings.siteTitle,host:new URL(origin).host,organizer:parseFrom(from)?.email,message:snapshot?.message,
-    allDay:d.link?.mode==='day'||!!d.event?.allDay||(!d.event&&!!snapshot?.eventAllDay) });
+    allDay:d.link?.mode==='day'||!!d.event?.allDay||(!d.event&&!!snapshot?.eventAllDay), lang:language.lang });
 }
 async function notify(repo: ContentRepository, _b: Booking, _kinds: BookingEmail[], opts: FlowOptions, _message?: string) {
   // Repository mutations already committed their outbox jobs atomically.
@@ -142,6 +153,8 @@ export interface BookerInput {
   phone?: string;
   answers?: Record<string, string>;
   formVersion?: string;
+  /** the language they booked in (the page's or the app's); left out = the main language */
+  locale?: string;
 }
 
 export function validateBooker(link: Pick<BookingLink, 'questions' | 'askPhone'> | null, input: BookerInput): { name: string; email: string; phone: string; answers: Record<string, string> } {
@@ -236,7 +249,7 @@ export async function createResourceBooking(
     kind: 'booking', resourceId: resource.id, linkId: link.id, eventId: '', status,
     start: args.start, end: args.end, ...holdOf(link, args.start, args.end),
     timezone: resourceZone(resource, settings.timezone), ...booker, seats: 1, notes: '',
-    manageToken: token(), source: args.source ?? 'web',
+    manageToken: token(), source: args.source ?? 'web', locale: normalizePageLocale(args.booker.locale ?? ''),
   }, { idempotency: opts.idempotency });
   if (!b) throw new BookingError(409, 'That time was just taken. Please pick another.');
   await notify(repo, b, [status === 'confirmed' ? 'confirmed' : 'received', 'staff-new'], opts);
@@ -264,29 +277,54 @@ export async function createRsvp(
   opts: FlowOptions
 ): Promise<Booking> {
   const e = args.event;
+  const now = opts.now ?? Date.now();
   if (!e.rsvp.enabled) throw new BookingError(400, 'This event doesn’t take RSVPs.');
   if (e.cancelled) throw new BookingError(410, 'This event is cancelled.');
-  if (args.end <= (opts.now ?? Date.now())) throw new BookingError(410, 'This event has already happened.');
-  if (e.cancelledDates?.length && e.cancelledDates.includes(occurrenceKey(e, args.start, await repo.getSettings()))) {
+  if (args.end <= now) throw new BookingError(410, 'This event has already happened.');
+  const settings = await repo.getSettings();
+  if (e.cancelledDates?.length && e.cancelledDates.includes(occurrenceKey(e, args.start, settings))) {
     throw new BookingError(410, 'This date is cancelled.');
   }
+  const deadline = rsvpDeadline({ event: e, start: args.start, end: args.end }, settings);
+  if (deadline !== null && deadline <= now) throw new BookingError(410, 'RSVPs for this date are closed.');
   const seats = Math.max(1, Math.min(e.rsvp.maxSeats || 1, Math.floor(args.seats) || 1));
   const booker = validateBooker(null, args.booker);
-  await checkEmailCap(repo, booker.email, args.source, await repo.getSettings(), opts.now);
+  await checkEmailCap(repo, booker.email, args.source, settings, opts.now);
   const formResponse = e.rsvp.form ? await collectResponse(e.rsvp.form, args.booker.answers ?? {}, args.booker.formVersion) : undefined;
   if (formResponse) booker.answers = displayAnswers(formResponse);
+  // one RSVP per address and date on public channels; staff may add more
+  const once = args.source !== 'admin';
   const b = await repo.createBooking({
     kind: 'rsvp', resourceId: '', linkId: '', eventId: e.id, status: e.rsvp.autoConfirm ? 'confirmed' : 'pending',
     start: args.start, end: args.end, holdStart: args.start, holdEnd: args.end, timezone: e.timezone, ...booker, seats,
-    formResponse, notes: '', manageToken: token(), source: args.source ?? 'web',
-  }, { capacity: e.rsvp.capacity, idempotency: opts.idempotency });
-  if (!b) throw new BookingError(409, e.rsvp.capacity ? 'Sorry — that’s more seats than are left.' : 'Couldn’t save your RSVP.');
+    formResponse, notes: '', manageToken: token(), source: args.source ?? 'web', locale: normalizePageLocale(args.booker.locale ?? ''),
+  }, { capacity: e.rsvp.capacity, oncePerEmail: once, idempotency: opts.idempotency });
+  if (!b) {
+    // a retry of a request that just committed: the caller replays that one
+    const retry = opts.idempotency ? await repo.getBookingRequest(opts.idempotency.keyHash) : null;
+    const mine = once && !retry ? (await repo.listBookings({ eventId: e.id, email: booker.email, from: args.start - 1, to: args.start + 1, statuses: ['pending', 'confirmed'], kinds: ['rsvp'] })).find((x) => x.start === args.start) : undefined;
+    if (mine) {
+      await resendManageLink(repo, mine, args.booker.locale === undefined ? mine.locale : normalizePageLocale(args.booker.locale), opts);
+      // anyone can type an address: say only that it has one
+      throw new BookingError(409, 'You already have an RSVP for this date. We sent you an email with a link to change it.', 'duplicate');
+    }
+    throw new BookingError(409, e.rsvp.capacity ? 'Sorry — that’s more seats than are left.' : 'Couldn’t save your RSVP.');
+  }
   await notify(repo, b, [b.status === 'confirmed' ? 'confirmed' : 'received'], opts);
   await hook(repo, 'booking.created', b, opts);
   if (b.status === 'confirmed') await hook(repo, 'booking.confirmed', b, opts);
   return b;
 }
 
+// The address gets its RSVP's own link again, in the language it just used,
+// at most once per 10 minutes per RSVP so the form can't flood an inbox.
+async function resendManageLink(repo: ContentRepository, b: Booking, locale: string, opts: FlowOptions) {
+  if (!await repo.email.rateLimit(`rsvp-link:${b.id}`, 1, 10 * 60_000)) return;
+  await repo.email.enqueue({dedupe:`${b.id}:${b.notificationVersion}:link:${Date.now()}`,kind:'booking',recipient:b.email,
+    payload:JSON.stringify({bookingId:b.id,version:b.notificationVersion,kind:'link',locale}),configVersion:(await repo.email.config())?.version||0,expiresAt:b.end});
+  await kickEmail(repo,opts.locals,opts.waitUntil);
+}
+
 const TRANSITIONS: Record<BookingStatus, BookingStatus[]> = {
   pending: ['confirmed', 'declined', 'cancelled'],
   confirmed: ['cancelled'],
@@ -377,7 +415,7 @@ export async function decideOverdue(repo: ContentRepository, opts: FlowOptions):
     if (!rules.deadlineHours || b.createdAt + rules.deadlineHours * 3_600_000 > now) continue;
     try {
       await setBookingStatus(repo, b, rules.deadlineAction === 'decline' ? 'declined' : 'confirmed', opts,
-        rules.deadlineAction === 'decline' ? 'We weren’t able to confirm this booking in time. Please pick another time.' : undefined);
+        rules.deadlineAction === 'decline' ? bookingStrings(bookingLanguage(b, settings).lang).lateDecline : undefined);
       decided++;
     } catch { /* changed meanwhile — next sweep sees the new state */ }
   }

package/src/lib/calendar/cards.ts

@@ -3,7 +3,8 @@
 // .pc-ev-card* classes are the styling API, like .pc-cal-* for the grid.
 import type { ContentRepository } from '../repo/types';
 import { tagFilter, type CalEvent, type Settings } from '../schema';
-import { siteLocale } from '../dates';
+import { siteLang, siteLocale } from '../dates';
+import { eventStrings } from './event-words';
 import { eventImage } from './images';
 import { eventUrl } from './config';
 import { eventIsPublic, featuredOccurrence, formatOccurrence, locationLine, type Occurrence } from './events';
@@ -37,7 +38,8 @@ export function eventCardHtml(
   const f = formatOccurrence(o, tz, siteLocale(settings));
   const href = opts.href ?? eventUrl(e.slug);
   const h = opts.heading ?? 'h3';
-  // "Sat, Oct 3 · 11:00 AM", "Sat, Oct 3 · All day", "Sat, Oct 24 – Sun, Oct 25"
+  // "Sat, Oct 3 · 11:00 AM", "Sat, Oct 3 · All day", "Sat, Oct 24 – Sun, Oct 25";
+  // the Cancelled flag speaks the dates' language
   const when = f.range;
   const image = eventImage(e, settings);
   const media = opts.showImage
@@ -53,7 +55,7 @@ export function eventCardHtml(
       : '';
   return (
     `<article class="pc-ev-card${cancelled ? ' is-cancelled' : ''}">${media}<div class="pc-ev-card-body">` +
-    `<div class="pc-ev-card-when">${cancelled ? '<span class="pc-ev-flag">Cancelled</span> ' : ''}${esc(when)}</div>` +
+    `<div class="pc-ev-card-when">${cancelled ? `<span class="pc-ev-flag">${esc(eventStrings(siteLang(settings)).cancelled)}</span> ` : ''}${esc(when)}</div>` +
     `<${h} class="pc-ev-card-title"><a href="${esc(href)}">${esc(e.title || 'Untitled event')}</a></${h}>` +
     (e.excerpt ? `<p class="pc-ev-card-excerpt">${esc(e.excerpt)}</p>` : '') +
     (loc ? `<div class="pc-ev-card-loc">${esc(loc)}</div>` : '') +