`CreateListModal.svelte` is the new entry point for "New list" — opens
on the masthead button click, prefills the input with
`currentCollective.default_list_title` (Fase 18.3.1), shows an inline
autocomplete dropdown via `fetchTitleSuggestions`, and renders a
"Sugerencia: Compra #6" chip when (a) the typed value exactly matches a
catalog-curated prefix case-insensitively and (b) `computeNextNumber`
resolves a value (Fase 18.3.2). Submit is disabled while the trimmed
value is empty or creation is in flight (Fase 18.3.3). On submit, if the
catalog match still holds, the modal auto-suffixes "#N" before
inserting and the lists page shows a transient toast confirming the
final name (Fase 18.3.4).
The prefill effect is gated by a `wasOpen` edge-tracker — a naive
`$effect(() => { if (open) value = default })` re-runs whenever
`$currentCollective` updates (e.g. a realtime UPDATE landing after the
user typed something), which clobbered the typed value and froze the
submit button as disabled. The edge guard limits the prefill to the
false→true transition.
`/lists/+page.svelte`: the masthead "New list" button now opens the
modal instead of calling `createList(collective, '', user)` and goto-ing
to the detail page for inline rename. The legacy flow was nice for
quick creates but couldn't enforce a required title or surface the
catalog. Existing per-list actions are unchanged.
15 new i18n strings (en + es) for the modal, the suggestion chip, the
auto-numbered toast, and the manage-page subsection that ships in the
next commit.
Updated existing e2e specs: `lists.test.ts`'s `createList()` helper +
the C-13 guest path now drive the modal instead of the legacy
placeholder input; `session.test.ts` S-03 uses the modal for the
fresh-list setup. New `tests/e2e/list-title-flow.test.ts` adds LTF-01
(default prefill end-to-end with a Supabase-driven setDefaultListTitle
since the manage UI lands in the next commit) and LTF-03 (empty input
keeps submit disabled, even with whitespace).
Tests: 4 lists + 3 session + 2 new LTF specs all green (9/9).
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Remove the sticky bottom create input from /lists. The masthead now hosts
a primary "New list" button next to the Trash icon, styled identically to
the "New note" button on /notes. Click → createList with an empty name →
goto /lists/[id], where a prominent editable title input (above To buy /
Checked) autosaves on blur / input with a 500 ms debounce.
Changes
apps/web/src/routes/(app)/lists/+page.svelte
- remove `newListName`, `nameInput`, `handleKeydown`
- remove the absolute-positioned sticky bottom block
- handleCreate now creates with name = '' and navigates to the detail
- actions snippet gains the primary New list button; Trash button
demoted to ghost icon
apps/web/src/routes/(app)/lists/[id]/+page.svelte
- new listName / scheduleNameSave / flushNameSave state (mirrors the
/notes editor pattern)
- big editable title <input> at top of content, autosaves on blur
via renameList
- contextual header h1 trimmed to a secondary caption-size preview
on mobile (so the user still sees the list name at the top)
- flushNameSave on component destroy so unsaved renames commit
apps/web/messages/{en,es}.json: lists_new_list = "New list"/"Nueva lista"
Tests
apps/web/tests/e2e/lists.test.ts: createList helper now clicks the
button, fills the title input, blurs, waits for autosave, and goes
back to /lists to present the same "list-is-on-the-overview" state
that C-11 / C-12 expect. C-07 picks up the reload check.
apps/web/tests/e2e/session.test.ts: S-03 mirrors the new flow for its
fresh-list setup.
Verification
just test-e2e → 40 passed, 2 skipped (swipe-delete .skip remains).
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Add a 4-layer test stack covering RLS, triggers, and UI flows for Fases 0–2a,
then restructure every plan file so future fases start with tests and end with
a verification gate.
Test suite
- packages/test-utils: Vitest integration tests signing HS256 JWTs via jose so
each test acts as a specific seed user (createClientAs + createAdminClient)
- supabase/tests: pgTAP for accept_invitation(), item_frequency trigger, and
promote-on-admin-leave; each file self-installs pgtap extension
- apps/web/tests: Playwright E2E with live Keycloak login per test (storageState
caching doesn't rehydrate Supabase's session state reliably)
- just test-all chains the three suites; test-db forwards POSTGRES_PASSWORD
as PGPASSWORD with ON_ERROR_STOP=1 so failures abort the chain
Supabase auth gotcha
- PostgREST queries inside onAuthStateChange deadlock on GoTrue's navigator.locks
auth lock (getAccessToken → getSession → initializePromise waits on the same
lock that's held during event dispatch). Fix is two defenses: a pass-through
lock in $lib/supabase, and a setTimeout(0) defer in root +layout.svelte to
push loadUserCollectives out of the callback's microtask chain. Either alone
is insufficient; both together unblock the Playwright suite.
Env key rotation
- apps/web/.env.development had a stale demo anon key signed with a different
secret than root .env; Vite inlined that into the browser bundle so Kong (which
uses the root .env value) rejected every request with 401. Aligned the two
files and added a memory entry to flag this for the next rotation.
Plan restructure (TDD)
- Every fase now opens with X.0 Tests primero and closes with X.Z Verificación
final. Completed fases (0, 1, 2a) show the pattern retroactively with the
tests that currently cover them; pending fases (2b, 3, 4) list the tests to
write before implementation.
Docs
- CLAUDE.md status line reports 54 + 12 + 15 = 81 green tests, adds gotchas
#11 (auth-lock deadlock) and #12 (no storageState caching)
- README.md adds a TDD methodology section and the test-all command
- .gitignore excludes Playwright's generated reports and auth state
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
