134 lines
6.7 KiB
Markdown
134 lines
6.7 KiB
Markdown
# Prompt — AEP Session 6 (corrections post S5)
|
|
|
|
**À lancer :** prochaine session, Sonnet full auto (Opus pilote standby)
|
|
**Priorité :** Mobile polish + DOM-TOM layout repensé + bug form proposer
|
|
**Créé :** 2026-04-15 (après S5 livrée — 11/11 retours, 8 commits)
|
|
|
|
---
|
|
|
|
## Contexte
|
|
|
|
Site live : https://aep.trans-former.fr/
|
|
Racine projet : `C:\Users\jules\Dropbox\ATIS - IPCJRA\1 PROJETS\TECH - infra VPS, website pro, RAG\nav-carte\`
|
|
VPS SSH : alias `vps-hetzner`, service `nav-carte.service`, working dir `/opt/nav-carte/.output/`.
|
|
Stack : Nuxt 3 + Vue 3 + Tailwind + Leaflet.
|
|
|
|
**État S5 livrée (2026-04-15) :**
|
|
- 11 retours implémentés (onglets header, sheet mobile, report Resend, DOM-TOM row bas, dark mode tuile, bandeau inversé, etc.)
|
|
- 8 commits `aep-s5`
|
|
- Site 200 OK, service active
|
|
|
|
**NE PAS TOUCHER à `.env` VPS ni `.env.production` local** (patchés manuellement).
|
|
|
|
---
|
|
|
|
## Mission
|
|
|
|
9 retours UX post-S5 + 1 bug critique (form proposer invisible).
|
|
|
|
---
|
|
|
|
## Retours Jules — à implémenter
|
|
|
|
### 1. DOM-TOM — repenser le layout (encore)
|
|
**Actuel S5 :** row horizontale pleine largeur en bas de la Métropole (Option A).
|
|
**Cible S6 :** DOM-TOM à droite du site, **empilés verticalement** (superposés). Navigation dans chaque mini-carte OK (acquis S5).
|
|
|
|
En clair : revenir sur un encart à droite de la Métropole, mais les 5 DOM-TOM se **superposent** (une pile verticale dense), pas en grille étalée. Conserver `dragging: true` + `scrollWheelZoom: true`.
|
|
|
|
**Layout suggéré :** Métropole 75-80% largeur à gauche, colonne droite 20-25% avec les 5 DOM-TOM empilés (Guadeloupe, Martinique, Guyane, Réunion, Mayotte) — petites hauteurs ~140-160px chacune.
|
|
|
|
**Bug #1a — Réunion** : la mini-carte Réunion disparaît après un moment de déplacement. À investiguer (event listener cassé ? tile layer perdu ? bounds reset ?).
|
|
|
|
### 2. Onglets header — style "languette de dossier"
|
|
Les 3 onglets (Écosystème / Agences / RAG) sont présents mais trop discrets.
|
|
Ajouter un effet visuel **languette de fiche de dossier** : petit trapèze/rectangle qui ressort au-dessus de la carte, suggère que l'onglet actif "tire" le contenu de la carte vers le haut. Underline + border-top + border-left/right arrondis haut, background blanc pour l'actif, fond gris clair pour les inactifs.
|
|
|
|
### 3. Mobile — onglets invisibles
|
|
Les 3 onglets ne sont pas visibles en version mobile actuellement. Les faire apparaître (scroll horizontal ou drawer compact). Même style languette que desktop, adapté petit écran.
|
|
|
|
### 4. Mobile — bug barre recherche superposée
|
|
La barre de recherche header mobile chevauche les filtres "National / Local". Fix : soit décaler la barre, soit décaler les filtres, soit les combiner proprement dans un bloc unifié.
|
|
|
|
### 5. Mobile — supprimer ou remonter "Leaflet | OpenStreetMap contributors"
|
|
La ligne de crédit Leaflet en bas de la carte interfère avec les fiches qui remontent (sheet swipable). Options :
|
|
- Option A : supprimer sur mobile (`attributionControl: false`)
|
|
- Option B : la déplacer en haut de la carte (`position: 'topright'` — mais conflit possible avec autres UI)
|
|
- **Recommandation agent : Option A** (suppression mobile — la mention légale peut vivre dans `/a-propos`).
|
|
|
|
### 6. Mobile — remonter le chatbot, coeur reste en bas
|
|
Actuellement chatbot et coeur (don) tous deux en bas, ça prend de la place inutile.
|
|
Cible :
|
|
- **Chatbot** : remonter en haut (icône flottante top-right ou intégrée au header)
|
|
- **Coeur (don Liberapay)** : reste en bas à droite à la place du chatbot (garde visibilité du don, important)
|
|
|
|
### 7. Desktop — bandeau bas label initial
|
|
Actuel replié : "AEP transparence IA"
|
|
Cible replié : **"Soutenir le projet"** (plus clair, plus engageant)
|
|
Transparence IA passe en second plan (hover ou dans le bandeau déployé).
|
|
|
|
### 8. Desktop — bandeau fluidité
|
|
Le bandeau déploie/replie pas hyper fluide. Ajouter transition CSS propre : `transition: height 0.25s ease-out, opacity 0.2s ease-out`. Vérifier qu'il n'y a pas de reflow layout (utiliser `transform: translateY` si possible plutôt que `height`).
|
|
|
|
### 9. Formulaire "Proposer une ressource" — nombre de caractères
|
|
Réduire les minimums de caractères requis. Accepter même 0 ou très court (1 ligne suffit). Laisser la description optionnelle ou très permissive.
|
|
|
|
### 10. **BUG CRITIQUE — Bouton envoyer invisible sur /proposer**
|
|
Sur la page formulaire "Proposer une ressource", **le bouton "Envoyer" n'est pas visible** — probablement masqué sous le bandeau IA/footer fixe. Impossible de soumettre une fiche actuellement.
|
|
|
|
Fix :
|
|
- Ajouter un `padding-bottom` suffisant au form pour que le bouton soit au-dessus du bandeau
|
|
- Ou : s'assurer que le bandeau a un `z-index` inférieur au form
|
|
- Tester sur desktop ET mobile
|
|
|
|
### 11. Chatbot — vérifier compteur de tokens
|
|
Jules a fait quelques recherches via chatbot, mais le compteur de tokens n'a apparemment pas bougé. Vérifier que le tracking fonctionne (logs API, compteur frontend, incrémentation backend). Si bug, corriger.
|
|
|
|
---
|
|
|
|
## Règles d'exécution
|
|
|
|
- Sonnet full auto, délègue aux sous-agents task si utile
|
|
- Commits atomiques : `feat(aep-s6): <feature>` / `fix(aep-s6): <bug>`
|
|
- Tests après chaque batch : `npm run build`
|
|
- Deploy final :
|
|
```bash
|
|
tar -czf - .output | ssh vps-hetzner "rm -rf /tmp/nav-output && mkdir /tmp/nav-output && tar -xzf - -C /tmp/nav-output && rm -rf /opt/nav-carte/.output && mv /tmp/nav-output/.output /opt/nav-carte/.output && systemctl restart nav-carte"
|
|
```
|
|
- Vérif : `curl -sI https://aep.trans-former.fr/ | head -3` → 200
|
|
- Mise à jour `JOURNAL-V2.md` section "Session 6 (2026-04-16)"
|
|
|
|
## Critères de fin
|
|
|
|
- [ ] 10 retours implémentés + #11 chatbot compteur vérifié
|
|
- [ ] Bug form proposer (bouton envoyer visible + soumission fonctionnelle) testé
|
|
- [ ] DOM-TOM à droite empilés + bug Réunion fixé
|
|
- [ ] Mobile : onglets visibles, barre recherche fixée, chatbot remonté, leaflet credit géré
|
|
- [ ] Site 200 OK, service active
|
|
- [ ] JOURNAL-V2.md à jour
|
|
|
|
## Modèle recommandé
|
|
|
|
- Sonnet full auto sur tout
|
|
- Opus pilote standby uniquement si bug Réunion #1a nécessite arbitrage debug
|
|
|
|
## Durée estimée
|
|
|
|
1h30-2h
|
|
|
|
---
|
|
|
|
## Autocritique
|
|
|
|
**✓ Solide :**
|
|
- Bugs critiques identifiés (form proposer, Réunion)
|
|
- Layout DOM-TOM reprécisé clairement (pile verticale à droite, pas row bas)
|
|
- Chaque retour a recommandation concrète
|
|
|
|
**⚠ Faiblesses :**
|
|
- #2 style "languette de dossier" : subjectif, agent devra itérer — si rendu pas satisfaisant, screenshot + retour session suivante
|
|
- #8 fluidité bandeau : solution CSS proposée mais dépend de l'archi actuelle de `BandeauBas.vue`
|
|
- #11 compteur tokens chatbot : pas clair si bug frontend ou backend — agent devra investiguer
|
|
|
|
**Autonomie : 8/10** (bug Réunion potentiellement piégeux, sinon clean).
|