feat(fase-18): /collective/manage — suggested titles subsection (default + catalog)

Adds the admin-side surface for the Fase 18 list-title flow:

  • `default_list_title` input — single line, save-on-blur (matches the
    collective-name input shape from Fase 10.2). Optimistically patches
    `currentCollective` so the next /lists modal prefill sees the value
    without waiting for the realtime UPDATE to round-trip.
  • Curated catalog list — one row per entry with an inline "Remove"
    icon button. An "Add title" button opens a small modal (name input
    + Save) that calls `add_list_title` via the listTitles store.

Members see the whole section read-only — the input is `disabled`, the
"Add title" button is hidden, and a banner explains "Only admins can
curate these titles." Guests don't see the section at all (mirrors the
`canSeeCommonItems` gate from Fase 15).

The default-title `$effect` that mirrors `$currentCollective.default_list_title`
into the input draft is guarded against re-firing while the admin is
mid-edit — only sync when the input isn't focused — so realtime UPDATEs
from another tab don't clobber the unsaved edit.

E2E `tests/e2e/list-title-flow.test.ts` gains:
  • LTF-02 — Ana adds the catalog prefix via the manage UI, sets the
    default via the same UI, then drives the create-modal three times
    and asserts the third list lands as `${prefix} #3`. Exercises the
    full path: manage RPC → realtime/store update → modal auto-suffix
    on submit → numbered list created.
  • LTF-04 — Borja (member) opens manage, sees the section, no add
    button, read-only banner visible, default-title input disabled.

Tests: 4 LTF e2e + 4 existing manage-collective e2e all green (8/8).

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

apps/web/tests/e2e/list-title-flow.test.ts

@@ -92,6 +92,70 @@ test.describe('Shopping list title flow — admin (Ana)', () => {
 		void titleInput;
 	});
 
+	test('LTF-02: catalog entry drives auto-suffix on the third "Compra" creation', async ({
+		page
+	}) => {
+		const prefix = `LTF02-${Date.now()}`;
+
+		// 1) Add the prefix to the catalog via the manage UI (the path under
+		// test). Then add it to default_list_title via the same UI so the
+		// modal prefills it consistently.
+		await page.goto('/collective/manage');
+		await expect(page.getByTestId('list-titles-add-button')).toBeVisible({
+			timeout: 10_000
+		});
+		await page.getByTestId('list-titles-add-button').click();
+		await expect(page.getByTestId('list-titles-add-modal')).toBeVisible({
+			timeout: 5_000
+		});
+		await page.getByTestId('list-titles-add-name').fill(prefix);
+		await page.getByTestId('list-titles-add-save').click();
+		await expect(page.getByTestId('list-titles-add-modal')).not.toBeVisible({
+			timeout: 5_000
+		});
+		await expect(
+			page.getByTestId(`list-title-row-${prefix}`)
+		).toBeVisible({ timeout: 5_000 });
+
+		const defaultInput = page.getByTestId('manage-default-list-title-input');
+		await defaultInput.fill(prefix);
+		await defaultInput.blur();
+		// Wait briefly for the UPDATE round-trip to land.
+		await page.waitForTimeout(700);
+
+		// Helper that drives the modal once: open → submit (prefilled) → wait
+		// for navigation, then bounce back to /lists.
+		async function createOne(): Promise<void> {
+			await page.goto('/lists');
+			await openCreateListModal(page);
+			// The prefill should be the catalog prefix verbatim — the modal
+			// auto-suffixes "#N" on submit when the value matches a catalog
+			// entry exactly without a "#N" already.
+			await expect(page.getByTestId('create-list-modal-name')).toHaveValue(prefix);
+			await page.getByTestId('create-list-modal-submit').click();
+			await expect(page).toHaveURL(/\/lists\/[0-9a-f-]+$/, { timeout: 10_000 });
+		}
+
+		// 1st create → no prior matches → finalName === `${prefix}` (bare;
+		// computeNextNumber returns 1 → but rule 9: still fires auto-suffix
+		// when catalog match holds, so finalName === `${prefix} #1`).
+		await createOne();
+		// 2nd create → prior is `prefix #1` → finalName === `${prefix} #2`.
+		await createOne();
+		// 3rd create → prior set has {#1, #2} → finalName === `${prefix} #3`.
+		await createOne();
+
+		// Visit /lists and confirm the third numbered list exists. We don't
+		// assert the first two by name because the exact #N depends on race
+		// timing of the realtime echoes; what matters is that the catalog
+		// auto-suffix produced unique numbered names and the third one
+		// landed at #3 (no duplicates of bare prefix).
+		await page.goto('/lists');
+		await expect(
+			page.getByRole('heading', { name: new RegExp(`^${prefix} #3$`) })
+		).toBeVisible({ timeout: 10_000 });
+	});
+
 	test('LTF-03: empty input keeps the submit button disabled', async ({ page }) => {
 		// Make sure no default is set so the input opens blank.
 		await setDefaultListTitle(page, '');
@@ -114,3 +178,26 @@ test.describe('Shopping list title flow — admin (Ana)', () => {
 		await expect(submit).toBeEnabled();
 	});
 });
+
+test.describe('Shopping list title flow — member (Borja, read-only)', () => {
+	test.beforeEach(async ({ page }) => {
+		await loginAs(page, USERS.borja);
+	});
+
+	test('LTF-04: member sees the section but the controls are disabled', async ({ page }) => {
+		await page.goto('/collective/manage');
+		await expect(page.getByTestId('list-titles-section')).toBeVisible({
+			timeout: 15_000
+		});
+
+		// No "Add title" button for non-admins.
+		await expect(page.getByTestId('list-titles-add-button')).not.toBeVisible();
+
+		// Read-only banner is visible.
+		await expect(page.getByTestId('list-titles-readonly-banner')).toBeVisible();
+
+		// The default-title input renders but is disabled.
+		await expect(page.getByTestId('manage-default-list-title-input')).toBeDisabled();
+	});
+});
+