From a338e3b67e9a09b4718922eebb0e607f0d64fe67 Mon Sep 17 00:00:00 2001
From: thomasbeaudry <waveflux@gmail.com>
Date: Tue, 13 Oct 2026 23:59:10 -0400
Subject: [PATCH 1/2] fix(web): scope email template languages to active
 languages and add Spanish defaults

Email template editors (new-user and group assignment) showed all three
languages regardless of which were enabled in the instance settings.
This scoped the language picker and validation to activeLanguages from
the setup state, so disabled languages no longer appear.

Also added the missing Spanish translations to both default email
templates and alphabetized the language options on the settings page.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 .../EmailTemplateEditor.tsx                   |  4 +++
 .../CreateTemplateForm.tsx                    | 15 ++++++--
 .../EditTemplateDialog.tsx                    |  6 ++++
 .../GroupEmailTemplates.tsx                   | 11 +++++-
 .../ViewDefaultTemplateDialog.tsx             | 10 ++++--
 .../__tests__/CreateTemplateForm.test.tsx     |  7 ++--
 .../__tests__/GroupEmailTemplates.test.tsx    |  4 +++
 .../components/MailSettings/MailSettings.tsx  |  5 ++-
 .../MailSettings/NewUserTemplateSection.tsx   | 14 ++++++--
 .../__tests__/MailSettings.test.tsx           |  2 +-
 .../__tests__/NewUserTemplateSection.test.tsx | 29 ++++++++++++---
 .../routes/_app/admin/__tests__/mail.test.tsx |  4 +++
 apps/web/src/routes/_app/admin/mail.tsx       |  8 ++++-
 apps/web/src/routes/_app/admin/settings.tsx   | 36 ++++++++++---------
 .../schemas/src/mail/__tests__/mail.test.ts   |  4 +--
 packages/schemas/src/mail/mail.ts             | 29 +++++++++++++++
 16 files changed, 148 insertions(+), 40 deletions(-)

diff --git a/apps/web/src/components/EmailTemplateEditor/EmailTemplateEditor.tsx b/apps/web/src/components/EmailTemplateEditor/EmailTemplateEditor.tsx
index 9b4731505..e342b4645 100644
--- a/apps/web/src/components/EmailTemplateEditor/EmailTemplateEditor.tsx
+++ b/apps/web/src/components/EmailTemplateEditor/EmailTemplateEditor.tsx
@@ -11,6 +11,8 @@ export type EmailTemplateEditorProps = {
   error?: string;
   /** Namespaces the control ids and test ids, so two editors can coexist on one page. */
   idPrefix: string;
+  /** The languages to offer in the language picker; defaults to all supported languages. */
+  languages?: readonly Language[];
   /** Omit to show the template read-only. */
   onChange?: (template: MailTemplate) => void;
   template: MailTemplate;
@@ -22,6 +24,7 @@ export type EmailTemplateEditorProps = {
 export const EmailTemplateEditor = ({
   error,
   idPrefix,
+  languages,
   onChange,
   template,
   variables = []
@@ -56,6 +59,7 @@ export const EmailTemplateEditor = ({
         <LanguageSelect
           data-testid={`${idPrefix}-language`}
           id={`${idPrefix}-language`}
+          options={languages}
           value={language}
           onChange={setLanguage}
         />
diff --git a/apps/web/src/components/GroupEmailTemplates/CreateTemplateForm.tsx b/apps/web/src/components/GroupEmailTemplates/CreateTemplateForm.tsx
index f5d49cd72..e49ff33fa 100644
--- a/apps/web/src/components/GroupEmailTemplates/CreateTemplateForm.tsx
+++ b/apps/web/src/components/GroupEmailTemplates/CreateTemplateForm.tsx
@@ -2,15 +2,17 @@ import React from 'react';
 
 import { Button, Dialog, Heading, Input, Label } from '@douglasneuroinformatics/libui/components';
 import { useNotificationsStore, useTranslation } from '@douglasneuroinformatics/libui/hooks';
+import type { Language } from '@opendatacapture/schemas/core';
 import type { MailTemplate } from '@opendatacapture/schemas/mail';
 
 import { EmailTemplateEditor } from '@/components/EmailTemplateEditor';
 import { ASSIGNMENT_TEMPLATE_VARS } from '@/utils/email-template';
-import { LANGUAGE_LABELS, LANGUAGES } from '@/utils/language';
+import { LANGUAGE_LABELS } from '@/utils/language';
 
 const emptyTemplate = (): MailTemplate => ({ body: {}, subject: {} });
 
 export type CreateTemplateFormProps = {
+  activeLanguages: readonly Language[];
   isPending: boolean;
   /** Resolves true once the template is saved; the form clears only then. */
   onCreate: (name: string, template: MailTemplate) => Promise<boolean>;
@@ -18,7 +20,13 @@ export type CreateTemplateFormProps = {
   validateName: (name: string) => string | undefined;
 };
 
-export const CreateTemplateForm = ({ isPending, onCreate, validateContent, validateName }: CreateTemplateFormProps) => {
+export const CreateTemplateForm = ({
+  activeLanguages,
+  isPending,
+  onCreate,
+  validateContent,
+  validateName
+}: CreateTemplateFormProps) => {
   const { t } = useTranslation();
   const addNotification = useNotificationsStore((store) => store.addNotification);
   const formRef = React.useRef<HTMLFormElement>(null);
@@ -27,7 +35,7 @@ export const CreateTemplateForm = ({ isPending, onCreate, validateContent, valid
   const [isConfirmingMissingTranslations, setIsConfirmingMissingTranslations] = React.useState(false);
 
   const contentError = validateContent(draft);
-  const missingLanguages = LANGUAGES.filter((code) => !draft.body[code]?.trim());
+  const missingLanguages = activeLanguages.filter((code) => !draft.body[code]?.trim());
 
   const create = async () => {
     if (!(await onCreate(name.trim(), draft))) {
@@ -76,6 +84,7 @@ export const CreateTemplateForm = ({ isPending, onCreate, validateContent, valid
         <EmailTemplateEditor
           error={contentError}
           idPrefix="template-create"
+          languages={activeLanguages}
           template={draft}
           variables={ASSIGNMENT_TEMPLATE_VARS}
           onChange={setDraft}
diff --git a/apps/web/src/components/GroupEmailTemplates/EditTemplateDialog.tsx b/apps/web/src/components/GroupEmailTemplates/EditTemplateDialog.tsx
index 25956d4ee..2e169f98b 100644
--- a/apps/web/src/components/GroupEmailTemplates/EditTemplateDialog.tsx
+++ b/apps/web/src/components/GroupEmailTemplates/EditTemplateDialog.tsx
@@ -2,6 +2,7 @@ import React from 'react';
 
 import { Button, Dialog, Input, Label } from '@douglasneuroinformatics/libui/components';
 import { useNotificationsStore, useTranslation } from '@douglasneuroinformatics/libui/hooks';
+import type { Language } from '@opendatacapture/schemas/core';
 import type { GroupEmailTemplate } from '@opendatacapture/schemas/group';
 import type { MailTemplate } from '@opendatacapture/schemas/mail';
 
@@ -9,6 +10,7 @@ import { EmailTemplateEditor } from '@/components/EmailTemplateEditor';
 import { ASSIGNMENT_TEMPLATE_VARS } from '@/utils/email-template';
 
 type EditTemplateFormProps = {
+  activeLanguages: readonly Language[];
   isPending: boolean;
   onCancel: () => void;
   onSave: (template: GroupEmailTemplate) => void;
@@ -18,6 +20,7 @@ type EditTemplateFormProps = {
 };
 
 const EditTemplateForm = ({
+  activeLanguages,
   isPending,
   onCancel,
   onSave,
@@ -62,6 +65,7 @@ const EditTemplateForm = ({
       <EmailTemplateEditor
         error={contentError}
         idPrefix="template-edit"
+        languages={activeLanguages}
         template={draft}
         variables={ASSIGNMENT_TEMPLATE_VARS}
         onChange={setDraft}
@@ -84,6 +88,7 @@ const EditTemplateForm = ({
 };
 
 export type EditTemplateDialogProps = {
+  activeLanguages: readonly Language[];
   isPending: boolean;
   onOpenChange: (open: boolean) => void;
   onSave: (template: GroupEmailTemplate) => void;
@@ -104,6 +109,7 @@ export const EditTemplateDialog = ({ template, ...props }: EditTemplateDialogPro
         {/* Mounted only while open, so the draft resets between templates. */}
         {template && (
           <EditTemplateForm
+            activeLanguages={props.activeLanguages}
             isPending={props.isPending}
             template={template}
             validateContent={props.validateContent}
diff --git a/apps/web/src/components/GroupEmailTemplates/GroupEmailTemplates.tsx b/apps/web/src/components/GroupEmailTemplates/GroupEmailTemplates.tsx
index b5d911281..1568f4bba 100644
--- a/apps/web/src/components/GroupEmailTemplates/GroupEmailTemplates.tsx
+++ b/apps/web/src/components/GroupEmailTemplates/GroupEmailTemplates.tsx
@@ -9,6 +9,7 @@ import { isAxiosError } from 'axios';
 import { EyeIcon, PencilIcon, Trash2Icon } from 'lucide-react';
 
 import { groupQueryOptions, useGroupQuery } from '@/hooks/useGroupQuery';
+import { useSetupStateQuery } from '@/hooks/useSetupStateQuery';
 import { useUpdateGroupMutation } from '@/hooks/useUpdateGroupMutation';
 import { useAppStore } from '@/store';
 import { ASSIGNMENT_TEMPLATE_VARS, checkTemplateIssue } from '@/utils/email-template';
@@ -31,6 +32,8 @@ const EmptyState = ({ children }: EmptyStateProps) => (
 export const GroupEmailTemplates = () => {
   const { t } = useTranslation();
   const addNotification = useNotificationsStore((store) => store.addNotification);
+  const { data: setupState } = useSetupStateQuery();
+  const activeLanguages = setupState.activeLanguages;
   const currentGroup = useAppStore((store) => store.currentGroup);
   const groupId = currentGroup?.id;
   const queryClient = useQueryClient();
@@ -280,15 +283,21 @@ export const GroupEmailTemplates = () => {
       </div>
 
       <CreateTemplateForm
+        activeLanguages={activeLanguages}
         isPending={updateGroupMutation.isPending}
         validateContent={validateContent}
         validateName={(name) => validateName(name)}
         onCreate={handleCreate}
       />
 
-      <ViewDefaultTemplateDialog open={isViewingDefault} onOpenChange={setIsViewingDefault} />
+      <ViewDefaultTemplateDialog
+        activeLanguages={activeLanguages}
+        open={isViewingDefault}
+        onOpenChange={setIsViewingDefault}
+      />
 
       <EditTemplateDialog
+        activeLanguages={activeLanguages}
         isPending={updateGroupMutation.isPending}
         template={editing}
         validateContent={validateContent}
diff --git a/apps/web/src/components/GroupEmailTemplates/ViewDefaultTemplateDialog.tsx b/apps/web/src/components/GroupEmailTemplates/ViewDefaultTemplateDialog.tsx
index 0343048eb..f175684f7 100644
--- a/apps/web/src/components/GroupEmailTemplates/ViewDefaultTemplateDialog.tsx
+++ b/apps/web/src/components/GroupEmailTemplates/ViewDefaultTemplateDialog.tsx
@@ -1,16 +1,18 @@
 import { Button, Dialog } from '@douglasneuroinformatics/libui/components';
 import { useTranslation } from '@douglasneuroinformatics/libui/hooks';
+import type { Language } from '@opendatacapture/schemas/core';
 import { DEFAULT_ASSIGNMENT_EMAIL_TEMPLATE } from '@opendatacapture/schemas/mail';
 
 import { EmailTemplateEditor } from '@/components/EmailTemplateEditor';
 
 export type ViewDefaultTemplateDialogProps = {
+  activeLanguages: readonly Language[];
   onOpenChange: (open: boolean) => void;
   open: boolean;
 };
 
 /** Read-only view of the message sent when no custom template is active. */
-export const ViewDefaultTemplateDialog = ({ onOpenChange, open }: ViewDefaultTemplateDialogProps) => {
+export const ViewDefaultTemplateDialog = ({ activeLanguages, onOpenChange, open }: ViewDefaultTemplateDialogProps) => {
   const { t } = useTranslation();
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
@@ -31,7 +33,11 @@ export const ViewDefaultTemplateDialog = ({ onOpenChange, open }: ViewDefaultTem
             })}
           </Dialog.Description>
         </Dialog.Header>
-        <EmailTemplateEditor idPrefix="template-builtin" template={DEFAULT_ASSIGNMENT_EMAIL_TEMPLATE} />
+        <EmailTemplateEditor
+          idPrefix="template-builtin"
+          languages={activeLanguages}
+          template={DEFAULT_ASSIGNMENT_EMAIL_TEMPLATE}
+        />
         <Dialog.Footer>
           <Button type="button" variant="outline" onClick={() => onOpenChange(false)}>
             {t('core.close')}
diff --git a/apps/web/src/components/GroupEmailTemplates/__tests__/CreateTemplateForm.test.tsx b/apps/web/src/components/GroupEmailTemplates/__tests__/CreateTemplateForm.test.tsx
index a66cb5c3e..9fb4d9daf 100644
--- a/apps/web/src/components/GroupEmailTemplates/__tests__/CreateTemplateForm.test.tsx
+++ b/apps/web/src/components/GroupEmailTemplates/__tests__/CreateTemplateForm.test.tsx
@@ -23,6 +23,7 @@ const renderForm = ({
 }: RenderOptions = {}) => {
   render(
     <CreateTemplateForm
+      activeLanguages={['en', 'fr']}
       isPending={isPending}
       validateContent={validateContent}
       validateName={validateName}
@@ -92,7 +93,7 @@ describe('CreateTemplateForm', () => {
     const { onCreate } = renderForm();
     fillEnglishOnly('Reminder');
     fireEvent.click(submitButton());
-    expect(screen.getByText('Warning: This template is missing translations for: Spanish, French.')).toBeTruthy();
+    expect(screen.getByText('Warning: This template is missing translations for: French.')).toBeTruthy();
     expect(onCreate).not.toHaveBeenCalled();
   });
 
@@ -116,11 +117,9 @@ describe('CreateTemplateForm', () => {
     expect(onCreate).not.toHaveBeenCalled();
   });
 
-  it('should create without a warning when every language is translated', () => {
+  it('should create without a warning when every active language is translated', () => {
     const { onCreate } = renderForm();
     fillEnglishOnly('Reminder');
-    switchLanguage('Spanish');
-    fillContent('Por favor', 'Abra {{url}} antes de {{expiresAt}}');
     switchLanguage('French');
     fillContent('Veuillez', 'Ouvrez {{url}} avant {{expiresAt}}');
     fireEvent.click(submitButton());
diff --git a/apps/web/src/components/GroupEmailTemplates/__tests__/GroupEmailTemplates.test.tsx b/apps/web/src/components/GroupEmailTemplates/__tests__/GroupEmailTemplates.test.tsx
index f91a75355..0948927f2 100644
--- a/apps/web/src/components/GroupEmailTemplates/__tests__/GroupEmailTemplates.test.tsx
+++ b/apps/web/src/components/GroupEmailTemplates/__tests__/GroupEmailTemplates.test.tsx
@@ -27,6 +27,10 @@ vi.mock('@/store', () => ({
   useAppStore: vi.fn((selector: (state: typeof store) => unknown) => selector(store))
 }));
 
+vi.mock('@/hooks/useSetupStateQuery', () => ({
+  useSetupStateQuery: () => ({ data: { activeLanguages: ['en', 'fr'] } })
+}));
+
 const reminder: GroupEmailTemplate = {
   body: { en: 'Open {{url}} before {{expiresAt}}' },
   id: 'tpl-a',
diff --git a/apps/web/src/components/MailSettings/MailSettings.tsx b/apps/web/src/components/MailSettings/MailSettings.tsx
index 6a0ba9382..c8d180158 100644
--- a/apps/web/src/components/MailSettings/MailSettings.tsx
+++ b/apps/web/src/components/MailSettings/MailSettings.tsx
@@ -3,6 +3,7 @@ import React from 'react';
 import { Checkbox, Heading } from '@douglasneuroinformatics/libui/components';
 import { useNotificationsStore, useTranslation } from '@douglasneuroinformatics/libui/hooks';
 import { $UpdateMailConfigData, isSameMailServer } from '@opendatacapture/schemas/mail';
+import type { Language } from '@opendatacapture/schemas/core';
 import type { MailConfigDto, MailTemplate, UpdateMailConfigData } from '@opendatacapture/schemas/mail';
 import { z } from 'zod/v4';
 
@@ -32,11 +33,12 @@ const initialValues = (config: MailConfigDto | null): MailConfigFormValues => ({
 });
 
 export type MailSettingsProps = {
+  activeLanguages: readonly Language[];
   config: MailConfigDto | null;
   newUserEmailTemplate: MailTemplate;
 };
 
-export const MailSettings = ({ config, newUserEmailTemplate }: MailSettingsProps) => {
+export const MailSettings = ({ activeLanguages, config, newUserEmailTemplate }: MailSettingsProps) => {
   const { t } = useTranslation();
   const addNotification = useNotificationsStore((store) => store.addNotification);
   const updateMutation = useUpdateMailSettingsMutation();
@@ -202,6 +204,7 @@ export const MailSettings = ({ config, newUserEmailTemplate }: MailSettingsProps
           <TestMailSection buildConfig={buildConfig} onInvalid={setErrors} />
 
           <NewUserTemplateSection
+            activeLanguages={activeLanguages}
             isSaving={updateMutation.isPending}
             template={newUserEmailTemplate}
             onSave={(next) => void save({ newUserEmailTemplate: next })}
diff --git a/apps/web/src/components/MailSettings/NewUserTemplateSection.tsx b/apps/web/src/components/MailSettings/NewUserTemplateSection.tsx
index 644aa4c36..86d5dfb01 100644
--- a/apps/web/src/components/MailSettings/NewUserTemplateSection.tsx
+++ b/apps/web/src/components/MailSettings/NewUserTemplateSection.tsx
@@ -2,6 +2,7 @@ import React from 'react';
 
 import { Button, Heading } from '@douglasneuroinformatics/libui/components';
 import { useTranslation } from '@douglasneuroinformatics/libui/hooks';
+import type { Language } from '@opendatacapture/schemas/core';
 import { DEFAULT_NEW_USER_EMAIL_TEMPLATE } from '@opendatacapture/schemas/mail';
 import type { MailTemplate } from '@opendatacapture/schemas/mail';
 import { Loader2Icon } from 'lucide-react';
@@ -9,7 +10,7 @@ import { Loader2Icon } from 'lucide-react';
 import { EmailTemplateEditor } from '@/components/EmailTemplateEditor';
 import { SectionCard } from '@/components/SectionCard';
 import { checkTemplateIssue, NEW_USER_TEMPLATE_VARS, REQUIRED_NEW_USER_TEMPLATE_VARS } from '@/utils/email-template';
-import { LANGUAGES, omitBlankLanguages } from '@/utils/language';
+import { omitBlankLanguages } from '@/utils/language';
 
 const defaultTemplate = (): MailTemplate => ({
   body: { ...DEFAULT_NEW_USER_EMAIL_TEMPLATE.body },
@@ -17,13 +18,19 @@ const defaultTemplate = (): MailTemplate => ({
 });
 
 export type NewUserTemplateSectionProps = {
+  activeLanguages: readonly Language[];
   isSaving: boolean;
   onSave: (template: MailTemplate) => void;
   template: MailTemplate;
 };
 
 /** Authors the welcome message sent when a user with an email address is created. */
-export const NewUserTemplateSection = ({ isSaving, onSave, template: saved }: NewUserTemplateSectionProps) => {
+export const NewUserTemplateSection = ({
+  activeLanguages,
+  isSaving,
+  onSave,
+  template: saved
+}: NewUserTemplateSectionProps) => {
   const { t } = useTranslation();
   const [template, setTemplate] = React.useState<MailTemplate>(() => ({
     body: { ...DEFAULT_NEW_USER_EMAIL_TEMPLATE.body, ...saved.body },
@@ -32,7 +39,7 @@ export const NewUserTemplateSection = ({ isSaving, onSave, template: saved }: Ne
 
   // Unlike a group template, this one is sent in whichever language the admin picks at creation
   // time, so every language has to be filled in rather than only the ones started.
-  const issue = checkTemplateIssue(template.subject, template.body, REQUIRED_NEW_USER_TEMPLATE_VARS, LANGUAGES);
+  const issue = checkTemplateIssue(template.subject, template.body, REQUIRED_NEW_USER_TEMPLATE_VARS, activeLanguages);
   const error =
     issue === 'incomplete'
       ? t({
@@ -79,6 +86,7 @@ export const NewUserTemplateSection = ({ isSaving, onSave, template: saved }: Ne
       <EmailTemplateEditor
         error={error}
         idPrefix="new-user-template"
+        languages={activeLanguages}
         template={template}
         variables={NEW_USER_TEMPLATE_VARS}
         onChange={setTemplate}
diff --git a/apps/web/src/components/MailSettings/__tests__/MailSettings.test.tsx b/apps/web/src/components/MailSettings/__tests__/MailSettings.test.tsx
index b4f712f77..20ba0cf72 100644
--- a/apps/web/src/components/MailSettings/__tests__/MailSettings.test.tsx
+++ b/apps/web/src/components/MailSettings/__tests__/MailSettings.test.tsx
@@ -35,7 +35,7 @@ const renderSettings = (config: MailConfigDto | null) => {
   const queryClient = new QueryClient({ defaultOptions: { mutations: { retry: false } } });
   render(
     <QueryClientProvider client={queryClient}>
-      <MailSettings config={config} newUserEmailTemplate={template} />
+      <MailSettings activeLanguages={['en', 'fr']} config={config} newUserEmailTemplate={template} />
     </QueryClientProvider>
   );
 };
diff --git a/apps/web/src/components/MailSettings/__tests__/NewUserTemplateSection.test.tsx b/apps/web/src/components/MailSettings/__tests__/NewUserTemplateSection.test.tsx
index b5417c7b9..7c34c18a1 100644
--- a/apps/web/src/components/MailSettings/__tests__/NewUserTemplateSection.test.tsx
+++ b/apps/web/src/components/MailSettings/__tests__/NewUserTemplateSection.test.tsx
@@ -13,9 +13,19 @@ const spanishOnly: MailTemplate = {
   subject: { es: 'Su cuenta' }
 };
 
-const renderSection = (template: MailTemplate = spanishOnly, isSaving = false) => {
+const ALL_LANGUAGES = ['en', 'es', 'fr'] as const;
+
+const renderSection = (
+  template: MailTemplate = spanishOnly,
+  {
+    activeLanguages = ALL_LANGUAGES,
+    isSaving = false
+  }: { activeLanguages?: readonly ('en' | 'es' | 'fr')[]; isSaving?: boolean } = {}
+) => {
   const onSave = vi.fn();
-  render(<NewUserTemplateSection isSaving={isSaving} template={template} onSave={onSave} />);
+  render(
+    <NewUserTemplateSection activeLanguages={activeLanguages} isSaving={isSaving} template={template} onSave={onSave} />
+  );
   return { onSave };
 };
 
@@ -44,8 +54,8 @@ describe('NewUserTemplateSection', () => {
     expect(subjectInput().value).toBe('Welcome aboard');
   });
 
-  it('should require every language, since the admin may send the message in any of them', () => {
-    renderSection({ body: {}, subject: {} });
+  it('should require every active language, since the admin may send the message in any of them', () => {
+    renderSection({ body: { en: 'Hello {{username}}', es: '' }, subject: { en: 'Welcome', es: '' } });
     expect(errorText()).toBe('Fill in the subject and body for each language.');
     expect(saveButton().hasAttribute('disabled')).toBe(true);
   });
@@ -79,7 +89,7 @@ describe('NewUserTemplateSection', () => {
   });
 
   it('should disable saving and show a spinner while a save is in flight', () => {
-    renderSection(spanishOnly, true);
+    renderSection(spanishOnly, { isSaving: true });
     expect(saveButton().hasAttribute('disabled')).toBe(true);
     expect(saveButton().querySelector('svg')).not.toBeNull();
   });
@@ -88,4 +98,13 @@ describe('NewUserTemplateSection', () => {
     renderSection();
     expect(saveButton().querySelector('svg')).toBeNull();
   });
+
+  it('should not require inactive languages, so a template missing Spanish is valid when only English and French are enabled', () => {
+    renderSection(
+      { body: { en: 'Hello, your user is {{username}}' }, subject: { en: 'Your account' } },
+      { activeLanguages: ['en'] }
+    );
+    expect(errorText()).toBeUndefined();
+    expect(saveButton().hasAttribute('disabled')).toBe(false);
+  });
 });
diff --git a/apps/web/src/routes/_app/admin/__tests__/mail.test.tsx b/apps/web/src/routes/_app/admin/__tests__/mail.test.tsx
index 1a32b411c..8238ad167 100644
--- a/apps/web/src/routes/_app/admin/__tests__/mail.test.tsx
+++ b/apps/web/src/routes/_app/admin/__tests__/mail.test.tsx
@@ -34,6 +34,9 @@ vi.mock('@/hooks/useMailSettingsQuery', () => ({
   mailSettingsQueryOptions: mocks.mailSettingsQueryOptions,
   useMailSettingsQuery: () => ({ data: SETTINGS })
 }));
+vi.mock('@/hooks/useSetupStateQuery', () => ({
+  useSetupStateQuery: () => ({ data: { activeLanguages: ['en', 'fr'] } })
+}));
 
 const runLoader = (queryClient: QueryClient) => {
   const { loader } = Route.options;
@@ -71,6 +74,7 @@ describe('admin mail route', () => {
     renderPage();
     expect(screen.getByTestId('mail-settings-page').contains(screen.getByTestId('mail-settings-form'))).toBe(true);
     expect(mocks.MailSettings.mock.lastCall?.[0]).toEqual({
+      activeLanguages: ['en', 'fr'],
       config: SETTINGS.config,
       newUserEmailTemplate: SETTINGS.newUserEmailTemplate
     });
diff --git a/apps/web/src/routes/_app/admin/mail.tsx b/apps/web/src/routes/_app/admin/mail.tsx
index 58b86ce6d..5d99264d6 100644
--- a/apps/web/src/routes/_app/admin/mail.tsx
+++ b/apps/web/src/routes/_app/admin/mail.tsx
@@ -5,10 +5,12 @@ import { createFileRoute } from '@tanstack/react-router';
 import { MailSettings } from '@/components/MailSettings';
 import { PageHeader } from '@/components/PageHeader';
 import { mailSettingsQueryOptions, useMailSettingsQuery } from '@/hooks/useMailSettingsQuery';
+import { useSetupStateQuery } from '@/hooks/useSetupStateQuery';
 
 const RouteComponent = () => {
   const { t } = useTranslation();
   const { data: settings } = useMailSettingsQuery();
+  const { data: setupState } = useSetupStateQuery();
 
   return (
     <div className="w-full">
@@ -18,7 +20,11 @@ const RouteComponent = () => {
         </Heading>
       </PageHeader>
       <div className="mx-auto flex w-full max-w-3xl flex-col gap-6" data-testid="mail-settings-page">
-        <MailSettings config={settings.config} newUserEmailTemplate={settings.newUserEmailTemplate} />
+        <MailSettings
+          activeLanguages={setupState.activeLanguages}
+          config={settings.config}
+          newUserEmailTemplate={settings.newUserEmailTemplate}
+        />
       </div>
     </div>
   );
diff --git a/apps/web/src/routes/_app/admin/settings.tsx b/apps/web/src/routes/_app/admin/settings.tsx
index 65c9ea53b..7d759994e 100644
--- a/apps/web/src/routes/_app/admin/settings.tsx
+++ b/apps/web/src/routes/_app/admin/settings.tsx
@@ -290,23 +290,25 @@ const RouteComponent = () => {
                 </p>
               </div>
               <div className="flex flex-col gap-3">
-                {LANGUAGES.map((language) => {
-                  const isActive = activeLanguages.includes(language);
-                  return (
-                    <div className="flex items-center gap-2.5" key={language}>
-                      <Checkbox
-                        checked={isActive}
-                        data-testid={`active-language-${language}`}
-                        disabled={isActive && activeLanguages.length === 1}
-                        id={`active-language-${language}`}
-                        onCheckedChange={() => toggleLanguage(language)}
-                      />
-                      <label className="text-sm font-medium" htmlFor={`active-language-${language}`}>
-                        {t(LANGUAGE_LABELS[language])}
-                      </label>
-                    </div>
-                  );
-                })}
+                {[...LANGUAGES]
+                  .sort((a, b) => t(LANGUAGE_LABELS[a]).localeCompare(t(LANGUAGE_LABELS[b])))
+                  .map((language) => {
+                    const isActive = activeLanguages.includes(language);
+                    return (
+                      <div className="flex items-center gap-2.5" key={language}>
+                        <Checkbox
+                          checked={isActive}
+                          data-testid={`active-language-${language}`}
+                          disabled={isActive && activeLanguages.length === 1}
+                          id={`active-language-${language}`}
+                          onCheckedChange={() => toggleLanguage(language)}
+                        />
+                        <label className="text-sm font-medium" htmlFor={`active-language-${language}`}>
+                          {t(LANGUAGE_LABELS[language])}
+                        </label>
+                      </div>
+                    );
+                  })}
               </div>
             </SettingSection>
             <Separator />
diff --git a/packages/schemas/src/mail/__tests__/mail.test.ts b/packages/schemas/src/mail/__tests__/mail.test.ts
index dfb7935a4..24a434885 100644
--- a/packages/schemas/src/mail/__tests__/mail.test.ts
+++ b/packages/schemas/src/mail/__tests__/mail.test.ts
@@ -113,13 +113,13 @@ describe('isSameMailServer', () => {
 });
 
 describe('default templates', () => {
-  it.each(['en', 'fr'] as const)('should carry the required placeholders in %s', (language) => {
+  it.each(['en', 'es', 'fr'] as const)('should carry the required placeholders in %s', (language) => {
     expect(DEFAULT_NEW_USER_EMAIL_TEMPLATE.body[language]).toContain('{{username}}');
     expect(DEFAULT_ASSIGNMENT_EMAIL_TEMPLATE.body[language]).toContain('{{url}}');
     expect(DEFAULT_ASSIGNMENT_EMAIL_TEMPLATE.body[language]).toContain('{{expiresAt}}');
   });
 
-  it.each(['en', 'fr'] as const)('should have a non-empty subject and body in %s', (language) => {
+  it.each(['en', 'es', 'fr'] as const)('should have a non-empty subject and body in %s', (language) => {
     expect(DEFAULT_NEW_USER_EMAIL_TEMPLATE.subject[language].trim()).toBeTruthy();
     expect(DEFAULT_ASSIGNMENT_EMAIL_TEMPLATE.subject[language].trim()).toBeTruthy();
   });
diff --git a/packages/schemas/src/mail/mail.ts b/packages/schemas/src/mail/mail.ts
index af9b79f7a..ff1823274 100644
--- a/packages/schemas/src/mail/mail.ts
+++ b/packages/schemas/src/mail/mail.ts
@@ -174,6 +174,21 @@ const DEFAULT_NEW_USER_EMAIL_TEMPLATE = {
       'New to Open Data Capture? This guide will help you get started:',
       'https://opendatacapture.org/en/docs/guides/how-to-get-started-with-odc/'
     ].join('\n'),
+    es: [
+      'Hola {{firstName}},',
+      '',
+      'Se ha creado una cuenta para usted en Open Data Capture.',
+      '',
+      'Nombre de usuario: {{username}}',
+      'Grupo(s): {{group}}',
+      '',
+      'Puede iniciar sesión aquí: {{url}}',
+      '',
+      'Su administrador le proporcionará su contraseña por separado. Por seguridad, cámbiela después de iniciar sesión por primera vez.',
+      '',
+      '¿Nuevo en Open Data Capture? Esta guía le ayudará a comenzar:',
+      'https://opendatacapture.org/en/docs/guides/how-to-get-started-with-odc/'
+    ].join('\n'),
     fr: [
       'Bonjour {{firstName}},',
       '',
@@ -192,6 +207,7 @@ const DEFAULT_NEW_USER_EMAIL_TEMPLATE = {
   },
   subject: {
     en: 'Your Open Data Capture account',
+    es: 'Su cuenta de Open Data Capture',
     fr: 'Votre compte Open Data Capture'
   }
 } as const satisfies z.infer<typeof $MailTemplate>;
@@ -211,6 +227,18 @@ const DEFAULT_ASSIGNMENT_EMAIL_TEMPLATE = {
       '',
       'Thank you.'
     ].join('\n'),
+    es: [
+      'Hola,',
+      '',
+      'Se le ha asignado un cuestionario para completar en Open Data Capture.',
+      '',
+      'Por favor, complételo utilizando el enlace seguro a continuación:',
+      '{{url}}',
+      '',
+      'Este enlace expira el {{expiresAt}}.',
+      '',
+      'Gracias.'
+    ].join('\n'),
     fr: [
       'Bonjour,',
       '',
@@ -226,6 +254,7 @@ const DEFAULT_ASSIGNMENT_EMAIL_TEMPLATE = {
   },
   subject: {
     en: 'Your Open Data Capture assignment',
+    es: 'Su evaluación de Open Data Capture',
     fr: 'Votre évaluation Open Data Capture'
   }
 } as const satisfies z.infer<typeof $MailTemplate>;

From a1c3c0ec2f6dae31fd4c086dec134e1b6686c6fa Mon Sep 17 00:00:00 2001
From: thomasbeaudry <waveflux@gmail.com>
Date: Fri, 16 Oct 2026 23:54:19 -0400
Subject: [PATCH 2/2] test(web): pass the active languages the template dialogs
 now require
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

`activeLanguages` became a required prop on EditTemplateDialog and
ViewDefaultTemplateDialog, but their own tests were not updated, so
`@opendatacapture/web#lint` stopped at tsc with five TS2741s.

Both fixtures leave Spanish out, which lets a new case assert the picker offers
only the languages the instance has enabled — the behaviour this branch adds.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
---
 .../__tests__/EditTemplateDialog.test.tsx     |  7 +++++++
 .../ViewDefaultTemplateDialog.test.tsx        | 19 +++++++++++++++----
 .../components/MailSettings/MailSettings.tsx  |  2 +-
 3 files changed, 23 insertions(+), 5 deletions(-)

diff --git a/apps/web/src/components/GroupEmailTemplates/__tests__/EditTemplateDialog.test.tsx b/apps/web/src/components/GroupEmailTemplates/__tests__/EditTemplateDialog.test.tsx
index 957207219..ef88affac 100644
--- a/apps/web/src/components/GroupEmailTemplates/__tests__/EditTemplateDialog.test.tsx
+++ b/apps/web/src/components/GroupEmailTemplates/__tests__/EditTemplateDialog.test.tsx
@@ -1,5 +1,6 @@
 import { useNotificationsStore } from '@douglasneuroinformatics/libui/hooks';
 import { i18n } from '@douglasneuroinformatics/libui/i18n';
+import type { Language } from '@opendatacapture/schemas/core';
 import type { GroupEmailTemplate } from '@opendatacapture/schemas/group';
 import type { MailTemplate } from '@opendatacapture/schemas/mail';
 import { cleanup, fireEvent, render, screen } from '@testing-library/react';
@@ -16,7 +17,11 @@ const template: GroupEmailTemplate = {
   subject: { en: 'Please complete' }
 };
 
+/** Spanish deliberately left out, so a test can tell a scoped picker from an unscoped one. */
+const ACTIVE_LANGUAGES: readonly Language[] = ['en', 'fr'];
+
 type RenderOptions = {
+  activeLanguages?: readonly Language[];
   isPending?: boolean;
   validateContent?: (template: MailTemplate) => string | undefined;
   validateName?: (name: string) => string | undefined;
@@ -24,6 +29,7 @@ type RenderOptions = {
 };
 
 const renderDialog = ({
+  activeLanguages = ACTIVE_LANGUAGES,
   isPending = false,
   validateContent = () => undefined,
   validateName = () => undefined,
@@ -33,6 +39,7 @@ const renderDialog = ({
   const onSave = vi.fn();
   render(
     <EditTemplateDialog
+      activeLanguages={activeLanguages}
       isPending={isPending}
       template={value}
       validateContent={validateContent}
diff --git a/apps/web/src/components/GroupEmailTemplates/__tests__/ViewDefaultTemplateDialog.test.tsx b/apps/web/src/components/GroupEmailTemplates/__tests__/ViewDefaultTemplateDialog.test.tsx
index 0f1a75fe5..f5dee33d4 100644
--- a/apps/web/src/components/GroupEmailTemplates/__tests__/ViewDefaultTemplateDialog.test.tsx
+++ b/apps/web/src/components/GroupEmailTemplates/__tests__/ViewDefaultTemplateDialog.test.tsx
@@ -1,4 +1,5 @@
 import { i18n } from '@douglasneuroinformatics/libui/i18n';
+import type { Language } from '@opendatacapture/schemas/core';
 import { DEFAULT_ASSIGNMENT_EMAIL_TEMPLATE } from '@opendatacapture/schemas/mail';
 import { cleanup, fireEvent, render, screen } from '@testing-library/react';
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
@@ -7,6 +8,9 @@ import { ViewDefaultTemplateDialog } from '../ViewDefaultTemplateDialog';
 
 import '@/services/i18n';
 
+/** Spanish deliberately left out, so a test can tell a scoped picker from an unscoped one. */
+const ACTIVE_LANGUAGES: readonly Language[] = ['en', 'fr'];
+
 describe('ViewDefaultTemplateDialog', () => {
   beforeEach(() => {
     i18n.changeLanguage('en');
@@ -15,12 +19,12 @@ describe('ViewDefaultTemplateDialog', () => {
   afterEach(cleanup);
 
   it('should render nothing while closed', () => {
-    render(<ViewDefaultTemplateDialog open={false} onOpenChange={vi.fn()} />);
+    render(<ViewDefaultTemplateDialog activeLanguages={ACTIVE_LANGUAGES} open={false} onOpenChange={vi.fn()} />);
     expect(screen.queryByText('Built-in default template')).toBeNull();
   });
 
   it('should show the built-in subject and body when open', () => {
-    render(<ViewDefaultTemplateDialog open onOpenChange={vi.fn()} />);
+    render(<ViewDefaultTemplateDialog open activeLanguages={ACTIVE_LANGUAGES} onOpenChange={vi.fn()} />);
     expect(screen.getByTestId<HTMLInputElement>('template-builtin-subject').value).toBe(
       DEFAULT_ASSIGNMENT_EMAIL_TEMPLATE.subject.en
     );
@@ -30,15 +34,22 @@ describe('ViewDefaultTemplateDialog', () => {
   });
 
   it('should make the built-in subject and body read-only, since the default template cannot be edited', () => {
-    render(<ViewDefaultTemplateDialog open onOpenChange={vi.fn()} />);
+    render(<ViewDefaultTemplateDialog open activeLanguages={ACTIVE_LANGUAGES} onOpenChange={vi.fn()} />);
     expect(screen.getByTestId<HTMLInputElement>('template-builtin-subject').readOnly).toBe(true);
     expect(screen.getByTestId<HTMLTextAreaElement>('template-builtin-body').readOnly).toBe(true);
   });
 
   it('should request closing when the close button is clicked', () => {
     const onOpenChange = vi.fn();
-    render(<ViewDefaultTemplateDialog open onOpenChange={onOpenChange} />);
+    render(<ViewDefaultTemplateDialog open activeLanguages={ACTIVE_LANGUAGES} onOpenChange={onOpenChange} />);
     fireEvent.click(screen.getByRole('button', { name: 'Close' }));
     expect(onOpenChange).toHaveBeenCalledWith(false);
   });
+
+  // Offering a language the instance has disabled invites authoring copy nothing will ever send.
+  it('should offer only the languages the instance has enabled', () => {
+    render(<ViewDefaultTemplateDialog open activeLanguages={ACTIVE_LANGUAGES} onOpenChange={vi.fn()} />);
+    fireEvent.keyDown(screen.getByTestId('template-builtin-language'), { key: 'Enter' });
+    expect(screen.getAllByRole('option').map((option) => option.textContent)).toStrictEqual(['English', 'French']);
+  });
 });
diff --git a/apps/web/src/components/MailSettings/MailSettings.tsx b/apps/web/src/components/MailSettings/MailSettings.tsx
index c8d180158..051afc5a0 100644
--- a/apps/web/src/components/MailSettings/MailSettings.tsx
+++ b/apps/web/src/components/MailSettings/MailSettings.tsx
@@ -2,8 +2,8 @@ import React from 'react';
 
 import { Checkbox, Heading } from '@douglasneuroinformatics/libui/components';
 import { useNotificationsStore, useTranslation } from '@douglasneuroinformatics/libui/hooks';
-import { $UpdateMailConfigData, isSameMailServer } from '@opendatacapture/schemas/mail';
 import type { Language } from '@opendatacapture/schemas/core';
+import { $UpdateMailConfigData, isSameMailServer } from '@opendatacapture/schemas/mail';
 import type { MailConfigDto, MailTemplate, UpdateMailConfigData } from '@opendatacapture/schemas/mail';
 import { z } from 'zod/v4';