@@ -1,44 +1,53 @@
# Mini-spec · Bulles / file d’ attention (#173)
# Mini-spec · Bulles / file d’ attention (#173)
* Front · octobre 2026 — pour alignement backend (garant de la spec API) . *
* Front · octobre 2026 — alignement product / API. *
---
---
## 1. Contexte / objectif
## 1. Contexte / objectif
Les bulles (cartes) sont la **file d’ attention ** du quotidien parent / AM : décisions et infos proches (congés, arrêt maladie, absences, plus tard soins / admin ).
Les bulles (cartes) sont la **file d’ attention ** du quotidien parent / AM : décisions et infos proches (congés, arrêt maladie AM , absences, soins / bobos enfant… ).
**Différence fondamentale avec le blog : **
les cartes de ce fil sont des **événements d’ agenda ** (période, placement, historique métier loggé).
Le **blog ** = récit / mémoire narrative du jour (photos, texte) — pas une ligne d’ agenda.
Les cartes restent une **mémoire courte ** de file (`purge_at` sur la bulle) ; la **source de vérité agenda ** reste le back métier.
Table agenda : * * `evenements_agenda` ** (ex-`absences_garde` , [#205 ](https://git.ptits-pas.fr/jmartin/petitspas/issues/205 ) fait) — conteneur ouvert (absences, congés, soins, école, mairie, sorties…). Les bulles notifient ; l’ agenda historise.
Voir aussi `31_MINI-SPEC-QUOTIDIEN-PARENT-AM.md` .
Cette note formalise :
Cette note formalise :
1. ** Ce qui est déjà en place côté front** (branche `feature/173-feed-bulles-parent` ).
1. Ce qui est en place côté front ( #173 ).
2. La **palette sémantique ** retenue (couleur = famille ).
2. Le contrat API (sans couleur ).
3. Les **évolutions API ** souhaitées pour que le back pousse les bonnes `couleur` / types .
3. La **palette UI ** (front only, dérivée du `type_code` ) .
4. Les **idées de bulles futures ** (non branchées) .
4. La nouvelle famille **soins / bobo enfant ** (rose) — AM → parents .
5. Idées futures.
Les cartes restent une **mémoire courte ** (`purge_at` ) ; la source de vérité absences / congés reste `absences_garde` (voir `31_MINI-SPEC-QUOTIDIEN-PARENT-AM.md` ).
---
---
## 2. Contrat API actuel (rappel)
## 2. Contrat API
Endpoint principal : `GET /api/v1/cards` (filtre couple / placement).
Endpoint principal : `GET /api/v1/cards` (filtre couple / placement).
Champs utiles côté UI :
| Champ | Rôle UI |
| Champ | Rôle UI |
|-------|---------|
|-------|---------|
| `type_code` | Layout + libellé sémantique + icône |
| `type_code` | Layout + libellé + **couleur / icône (mapping front) ** |
| `couleur` | Teinte du fond pastel (`assets/cards/card_*_h.png` ) |
| `titre` | Fallback si `type_code` inconnu |
| `titre` | Fallback si `type_code` inconnu |
| `statut` | `ouverte` · `refusee` · `traitee` |
| `statut` | `ouverte` · `refusee` · `traitee` |
| `response_mode` | `none` · `ack` · `accept_refuse` |
| `response_mode` | `none` · `ack` · `accept_refuse` |
| `is_creator` | Masque les boutons réponse pour le créateur |
| `is_creator` | Masque les boutons réponse pour le créateur |
| `payload.date_debut` / `date_fin` | Période affichée |
| `payload.date_debut` / `date_fin` | Période (agenda) |
| `payload.motif` | Non affiché sur la maquette congés actuelle |
| `payload.motif` | Texte libre / détail |
| `last_refuse_comment` | Affiché s i `refusee` |
| `last_refuse_comment` | S i `refusee` |
| `id_absence` | Lien métier absence / congé |
| `id_absence` | Lien métier agenda (si applicable) |
| `purge_at` | Péremption file |
| `purge_at` | Péremption de la bulle dans la file |
**Règle front actuelle : ** le destinataire peut répondre si `!is_creator && statut == ouverte && response_mode != none` .
**Pas de champ `couleur` dans l’ API. **
La teinte pastel est **100 % front ** : table de mapping `type_code` → asset (`card_*_h.png` ). Le back ne gère pas la charte graphique.
**Règle front : ** le destinataire peut répondre si `!is_creator && statut == ouverte && response_mode != none` .
---
---
@@ -47,113 +56,129 @@ Champs utiles côté UI :
### 3.1 Feed
### 3.1 Feed
- Widget partagé `CartesFeed` (parent + AM).
- Widget partagé `CartesFeed` (parent + AM).
- Fond carte via widget `Carte` (bandeau / 9-slice horizontal).
- Fond via widget `Carte` (9-slice horizontal) selon mapping local .
- Dégradés haut / bas sur la liste scrollable .
- Actions via **modales ** accepter / refuser / ack .
- Plus de libellés « À traiter / Traité » : actions via **modales ** accepter / refuser / ack.
- Libellés UI :
- Libellés UI sémantiques (indépendants du `titre` API brut) :
- `conge_am` → « Demande de congés »
- `conge_am` → « Demande de congés »
- `arret_maladie_am` → « Arrêt maladie »
- `arret_maladie_am` → « Arrêt maladie »
- `absence_enfant` (+ `_modif` ) → « Notification d’ absence »
- `absence_enfant` (+ `_modif` ) → « Notification d’ absence »
### 3.2 Carte **congés** (`conge_am`) — maquette validée
### 3.2 Carte **congés** (`conge_am`)
| Élément | Comportement |
| Élément | Comportement |
|---------|----------------|
|---------|----------------|
| Fond | **Aqua ** forcé côté front (même si l’ API envoie encore `lavender` ) |
| Fond | **Aqua ** (mapping front ) |
| Encre | Pétrole désaturé `#315F63` (titre) ; date un peu plus claire `#4A7276` ; lien `#2B5868 ` |
| Encre | Pétrole `#315F63` / dates `#4A7276 ` |
| Icône | Valise `assets/images/valise.png` |
| Icône | Valise |
| Période | Une ligne type « Du 04 au 06 novembre 2026 » + petite icône calendrier |
| Période | « Du … au … » + calendrier |
| Actions | Pilules peintes ✓ vert / ✕ corail ( `btn_coche_pilule` / `btn_croix_pilule` ) si `accept_refuse` |
| Actions | Pilules ✓ / ✕ si `accept_refuse` |
| Lien | « Ouvrir dans l’ agenda ↗ » (stub UI pour l’ instant) |
| Lien | « Ouvrir dans l’ agenda ↗ » |
| Opacité | Carte a tténuée si `traitee` (sauf règle arrêt maladie ci-dessous) |
| Opacité | A tténuée si `traitee` (sauf règle arrêt ci-dessous) |
### 3.3 Arrêt maladie (`arret_maladie_am`)
### 3.3 Arrêt maladie AM (`arret_maladie_am`)
- Reste **visible / opaque ** tant que la période n’ est pas finie ( `date_fin` jour inclus), même si `statut == traitee` .
- Reste **visible / opaque ** tant que `date_fin` ( jour inclus) n’ est pas passée , même si `traitee` .
- Icône thermomètre (asset dédié). Fond encore piloté par `couleur` API (cible produit : **bleu ** — voir §4 ).
- Fond **bleu ** (mapping front ).
### 3.4 Assets couleurs horizontales
### 3.4 Assets
Teintes dispo dans `frontend/assets/cards/` (V + H), dont * * `aqua` ** ajouté pour les congés.
Teintes UI : `red` · `pink` · `peach` · `lime` · `lavender` · `green` · `blue` · `aqua` .
Clé = **choix front ** , pas une valeur API.
Clés API reconnues côté front : `red` · `pink` · `peach` · `lime` · `lavender` · `green` · `blue` · * * `aqua` **. Défaut UI si inconnu : `peach` .
---
---
## 4. Palette sémantique (alignement demandé )
## 4. Palette UI (front only — dérivée du `type_code` )
| Couleur API ( `couleur` ) | Famille | Types / exemples |
| Couleur UI | Famille | Types |
|------------------------- |---------|------------------ |
|------------|---------|--------|
| * * `aqua` ** | Congés | `conge_am` |
| * * `aqua` ** | Congés AM | `conge_am` |
| * * `blue` ** | Arrêt maladie | `arret_maladie_am` |
| * * `blue` ** | Arrêt maladie AM | `arret_maladie_am` |
| * * `pink ` ** | Soins du quotidien | médicament, température, bobo, crème… (futur) |
| * * `peach ` ** | Absence enfant / info pratique | `absence_enfant` , `absence_enfant_modif` |
| * * `peach ` ** | Absence / info pratique | `absence_enfant` , `absence_enfant_modif` |
| * * `pink ` ** | Soins / bobo / problème **enfant ** (AM → parents) | `soin_enfant` * (nouveau — voir §5) * |
| * * `lavender` ** | Administratif / autre | infos admin, divers (à utiliser avec parcimonie) |
| * * `lavender` ** | Admin / divers | futurs types admin |
**Principes **
**Principes **
- La **c ouleur** = famille (lisible sans lire tout le text e).
- C ouleur = famille visuelle (lisible sans tout lir e).
- L’ **i cône** précise l’ action (surtout sur fond rose : thermomètre, flacon, pansement, croix de soi n…).
- I cône précise l’ événement (surtout sur rose : thermomètre, pansement, flaco n…).
- Rose = doux / rassurant, **pas ** une alerte médicale forte.
- Rose = doux / rassurant, **pas ** une alerte médicale forte.
- Éviter le lavande pour les congés (trop « admin », dissonant avec valise / aqua ).
- Congés ≠ lavande (trop « admin » ).
### Demande backend (prioritaire)
1. Seeds / création de cartes : `conge_am` → `couleur: "aqua"` (le front force déjà ; l’ API devrait être source de vérité).
2. `arret_maladie_am` → `couleur: "blue"` .
3. `absence_enfant*` → `couleur: "peach"` .
4. Documenter les valeurs autorisées de `couleur` (enum / check) pour inclure `aqua` .
5. Ne plus mapper les congés sur `lavender` .
---
---
## 5. Idées de bulles futures (hors scope #173 )
## 5. Nouvelle bulle rose — soins / bobo enfant (AM → parents )
Non implémentées ; pour anticipation contrat types + couleurs.
### Intention produit
| Famille | Couleur | Exemples de `type_code` (propositions) | `response_mode` typique | Icônes (ex.) |
La nounou signale un **événement concernant l’ enfant ** (maladie légère, bobo, crème, température, souci du jour…) **vers les parents ** .
|---------|---------|----------------------------------------|-------------------------|--------------|
| Soins | `pink` | `soin_temperature` , `soin_medicament` , `soin_bobo` , `soin_creme` | `ack` (parent) | thermomètre, flacon, pansement, tube |
| Sortie / autorisation | `peach` ou `lavender` | `sortie_a_valider` | `accept_refuse` | à définir |
| Admin | `lavender` | `info_admin` , `document_a_fournir` | `ack` / `none` | classeur, tampon |
| Congé / maladie (évol.) | `aqua` / `blue` | modif période, annulation | selon métier | valise / thermomètre |
**Variante soins : ** un seul fond rose ; l’ icône change selon l’évén ement — la famille « santé/soin » reste immédiate.
Pourquoi **pas seul ement la messagerie ** ?
- C’ est **loggé ** dans la file d’ attention.
- C’ est un **événement d’ agenda ** (période / jour, placement, historique).
- Les parents peuvent **acquitter ** (`ack` ) sans noyer le chat.
### Proposition V1 (à brancher ultérieurement)
| | |
|--|--|
| `type_code` | `soin_enfant` (nom exact à figer) |
| Émetteur | AM |
| Destinataires | parents du couple / placement |
| `response_mode` | `ack` |
| Couleur UI | `pink` |
| Back métier | ligne agenda liée (même esprit que `absences_garde` : période + placement + motif) ; la bulle = collecte / notification |
| Payload | `date_debut` / `date_fin` (+ motif / sous-type optionnel : temperature, bobo, medicament…) |
**Hors scope immédiat #173 ** : implémentation complète ; cette section fige l’ intention pour le contrat types + UI.
---
---
## 6. Comportements métier à ne pas casser
## 6. Idées futures (hors scope)
- Créateur : pas de boutons réponse ; éventuel libellé « En attente de réponse ».
| Famille | Couleur UI | Exemples | `response_mode` |
- Refus : afficher `last_refuse_comment` si présent.
|---------|------------|----------|-----------------|
| Soins (détail) | `pink` | `soin_temperature` , `soin_medicament` , `soin_bobo` — ou sous-types dans payload | `ack` |
| Sortie | `peach` / `lavender` | `sortie_a_valider` | `accept_refuse` |
| Admin | `lavender` | `info_admin` , `document_a_fournir` | `ack` / `none` |
Variante soins : un seul fond rose ; l’ icône / sous-type change.
---
## 7. Comportements métier à ne pas casser
- Créateur : pas de boutons réponse ; éventuel « En attente de réponse ».
- Refus : afficher `last_refuse_comment` .
- Congé : `accept_refuse` côté destinataire.
- Congé : `accept_refuse` côté destinataire.
- Absence enfant : souvent info / ack ( pas de veto AM en V1 — voir mini-spec quotidien) .
- Absence enfant : info / ack — pas de veto AM en V1.
- Péremption : respecter `purge_at` / retention ; pas un historique long .
- File courte : `purge_at` ; l’ **agenda** conserve l’ historique métier .
---
---
## 7 . Fichiers front de référence
## 8 . Fichiers front de référence
- `frontend/lib/models/carte_bulle.dart` — mapping type → libellé / icône / fond
- `frontend/lib/models/carte_bulle.dart` — mapping type → libellé / icône / fond
- `frontend/lib/widgets/quotidien/cartes_feed.dart` — layout feed + carte congés
- `frontend/lib/widgets/quotidien/cartes_feed.dart`
- `frontend/lib/models/card_assets.dart` — enum teintes dont `aqua`
- `frontend/lib/models/card_assets.dart`
- Assets : `frontend/assets/cards/card_aqua(_h).png` , `frontend/assets/images/valise.png` , `frontend/assets/images/cartes/ btn_*_pilule.png`
- Assets : `frontend/assets/cards/` , `valise.png` , ` btn_*_pilule.png`
---
---
## 8 . Non-régression / recettes suggérées (back + front)
## 9 . Recettes
- [ ] Carte `conge_am` créée avec `couleur=aqua` (et lisible si encore lavande côté vieux seeds grâce au forçage front ).
- [ ] API cartes **sans ** champ `couleur` (ni feed ni `/types` ).
- [ ] Accept / refuse congé → statut + commentaire refus .
- [ ] Front mappe `conge_am` → aqua, `arret_maladie_am` → blue, `absence_*` → peach .
- [ ] Arrêt maladie traité mais période en cours → reste visible côté destinataire .
- [ ] Accept / refuse congé OK .
- [ ] Filtre couple / placement : une seule file pour le couple actif .
- [ ] Arrêt traité + période en cours → reste visible .
- [ ] Aucune régression sur `absence_enfant` (création parent → bulle AM) .
- [ ] Filtre couple / placement .
- [ ] (Plus tard) `soin_enfant` rose AM → parents + ligne agenda.
---
---
## 9 . Références
## 10 . Références
- Ticket front : * * #173 **
- Ticket front : * * #173 **
- Contrat cartes / réponses : * * #194 ** (si applicable)
- Module cartes : * * #194 **
- Quotidien parent– AM : `docs/31_MINI-SPEC-QUOTIDIEN-PARENT-AM.md`
- Quotidien : `docs/31_MINI-SPEC-QUOTIDIEN-PARENT-AM.md`
- Décision projet : `docs/24_DECISIONS-PROJET.md` §32
- Maquette congés : `ressources/bulle_congés.jpg`
- Maquette congés : `ressources/bulle_congés.jpg`