feat(shopping-list): coche les articles « dans le panier » (#109) #121

Merged

kyuno merged 1 commit from feat/shopping-list-check-items into main

2026-09-08 07:08:49 +02:00

kyuno commented

2026-09-08 06:32:49 +02:00

Owner

Contexte

Closes #109.

La liste de courses était volontairement en lecture seule. L'issue (validée avec l'auteur) revient sur ce choix : elle gagne un état « acheté » par article, utile en magasin (au doigt sur mobile).

Changements

apps/web/src/pages/shopping-list/shopping-list-progress.ts (nouveau) : ShoppingListProgressStore, calqué une-pour-une sur CookingProgressStore — localStorage uniquement, par semaine (clé batchcooking:shoppingListChecked:<weekStart>), aucun état serveur. La liste est recalculée depuis le planning à chaque visite, donc une coche n'est jamais autoritaire et se perd sans dommage quand le planning change (au pire, on recoche).
ShoppingListPage.tsx : chaque ligne devient un CheckboxOption ; <ShoppingListItems key={weekKey}> remonte à chaque changement de semaine (checklist réinitialisée pour cette semaine). Clé d'article = ingredientId-unitId (déjà la key React de la ligne).
shopping-list-page.scss : override scopé (sous .shopping-list__items, pour battre label:has(> input[type="checkbox"]) de global.scss en spécificité) du look « carte sélectionnable » — un article coché est barré et estompé, pas surligné en primary. Cible tactile ≥ 44 px sous le breakpoint phone.
specs/frontend-architecture.md : la note « délibérément en lecture seule » est remplacée.

Tests

shopping-list.feature : nouveau scénario « cocher un article » (coché → barré, persiste au reload, n'affecte pas les autres articles).
shopping-list-page.cy.ts : la cible tactile de la ligne (le label CheckboxOption) fait 16 px de padding + ≥ 44 px de haut sur téléphone.
Local : pnpm lint + pnpm --filter web build OK ; shopping-list.feature 4/4, shopping-list-page.cy.ts 1/1.

🤖 Generated with Claude Code

## Contexte `Closes #109`. La liste de courses était **volontairement en lecture seule**. L'issue (validée avec l'auteur) revient sur ce choix : elle gagne un état « acheté » par article, utile en magasin (au doigt sur mobile). ## Changements - `apps/web/src/pages/shopping-list/shopping-list-progress.ts` (nouveau) : `ShoppingListProgressStore`, calqué **une-pour-une** sur `CookingProgressStore` — `localStorage` uniquement, par semaine (clé `batchcooking:shoppingListChecked:<weekStart>`), **aucun état serveur**. La liste est recalculée depuis le planning à chaque visite, donc une coche n'est jamais autoritaire et se perd sans dommage quand le planning change (au pire, on recoche). - `ShoppingListPage.tsx` : chaque ligne devient un `CheckboxOption` ; `<ShoppingListItems key={weekKey}>` remonte à chaque changement de semaine (checklist réinitialisée pour cette semaine). Clé d'article = `ingredientId-unitId` (déjà la `key` React de la ligne). - `shopping-list-page.scss` : override **scopé** (sous `.shopping-list__items`, pour battre `label:has(> input[type="checkbox"])` de `global.scss` en spécificité) du look « carte sélectionnable » — un article coché est **barré et estompé**, pas surligné en primary. Cible tactile ≥ 44 px sous le breakpoint phone. - `specs/frontend-architecture.md` : la note « délibérément en lecture seule » est remplacée. ## Tests - `shopping-list.feature` : nouveau scénario « cocher un article » (coché → barré, persiste au reload, n'affecte pas les autres articles). - `shopping-list-page.cy.ts` : la cible tactile de la ligne (le label `CheckboxOption`) fait 16 px de padding + ≥ 44 px de haut sur téléphone. - Local : `pnpm lint` + `pnpm --filter web build` OK ; `shopping-list.feature` 4/4, `shopping-list-page.cy.ts` 1/1. 🤖 Generated with [Claude Code](https://claude.com/claude-code)

kyuno added the

Medium

planned

enhancement

labels 2026-09-08 06:32:49 +02:00

kyuno added 1 commit 2026-09-08 06:32:50 +02:00

feat(shopping-list): coche les articles « dans le panier » (#109 )

CI / lint (push) Successful in 2m18s

Details

CI / build (push) Successful in 3m34s

Details

CI / intent-service-test (push) Successful in 6m36s

Details

CI / e2e (push) Successful in 10m22s

Details

CI / test (push) Successful in 33m30s

Details

CI / build-android (push) Has been skipped

Details

592933b1ac

La liste de courses était volontairement en lecture seule. Elle gagne un
état « acheté » par article, utile en magasin (au doigt sur mobile).

- `shopping-list-progress.ts` (nouveau) : `ShoppingListProgressStore`,
  calqué sur `CookingProgressStore` — `localStorage` uniquement, par
  semaine (clé `batchcooking:shoppingListChecked:<weekStart>`), aucun état
  serveur. Une coche n'est jamais autoritaire (la liste est recalculée
  depuis le planning à chaque visite) et se perd sans dommage.
- `ShoppingListPage.tsx` : chaque ligne devient un `CheckboxOption` ;
  `<ShoppingListItems key={weekKey}>` remonte à chaque changement de
  semaine (checklist réinitialisée). Clé d'article = `ingredientId-unitId`
  (déjà la `key` React de la ligne).
- `shopping-list-page.scss` : override scopé du look « carte sélectionnable »
  global — un article coché est barré et estompé, pas surligné en primary.
  Cible tactile ≥ 44 px sous le breakpoint phone.
- `specs/frontend-architecture.md` : la note « délibérément en lecture
  seule » est remplacée.

Tests : `shopping-list.feature` — nouveau scénario « cocher un article »
(coché → barré, persiste au reload, n'affecte pas les autres).
`shopping-list-page.cy.ts` — la cible tactile de la ligne (le label
`CheckboxOption`) fait 16 px de padding + ≥ 44 px de haut sur téléphone.
Local : `pnpm lint` + `pnpm --filter web build` OK, `shopping-list.feature`
4/4, `shopping-list-page.cy.ts` 1/1.

Closes #109

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

kyuno merged commit 22119adf07 into main

2026-09-08 07:08:49 +02:00

kyuno referenced this pull request from a commit

2026-09-08 07:08:50 +02:00

Merge pull request 'feat(shopping-list): coche les articles « dans le panier » (#109)' (#121) from feat/shopping-list-check-items into main