Repository navigation
Afficher la carte Mapbox stylée avec les marqueurs de parcours (E-01) #26
Description
Contexte
Epic : #8
Prérequis : #125, thème NativeWind généré depuis tokens.json et composants de base
Maquette : E-01 · validée le 2026-09-22
Ecrans · Direction-Artistique · E-01 · D-001
Comportement attendu
@rnmapbox/mapsintégré (dev build EAS requis), jeton public restreint, style personnalisé.- Centrage initial : position de l'utilisateur si permission « quand l'app est utilisée », sinon Paris centre ; zoom couvrant ~3 km.
- Marqueurs de parcours : vignette photo arrondie avec pointe + étiquette de durée ; état sélectionné agrandi. Rendu performant (
ShapeSource+SymbolLayeravec images, pas un composant React par marqueur). - Bouton de recentrage ; bandeau discret si géolocalisation refusée.
- Chargement des parcours via
/routes/searchavec la bbox courante au premier affichage. - Position jamais envoyée au serveur.
- Mouvement (D-030, Direction-Artistique › Mouvement,
mappings.motion) : M-07, caméramap500 ms (MapboxeaseTo), tooltip en fondu depuis son ancre, tracé et étapes en fondu.
Critères d'acceptation
- Carte affichée sous 3 s en 4G sur un appareil réel, avec les marqueurs du seed
- 50 marqueurs (première page de la recherche, plafond de la carte) sans chute visible de fluidité — ramené de 200 à 50 par D-066 (Documenter dans le wiki les choix de la recherche livrée par #25 #164), à confirmer par Ilan dans Valider les choix de la recherche restés ouverts après D-066 : plafond de 50, score, near, code de validation_error #221
- Permission refusée : carte sur Paris, aucune erreur
- Capture iOS et Android dans la PR
- Étiquette de durée des marqueurs plafonnée à 1,3 (
mappings.accessibility.denseComponents), en un seul endroit, jamais écran par écran. Si c'est un composant React, composant de base dansapps/mobile/src/uiavec<Text isDense>. Si elle est rendue par laSymbolLayer, oùmaxFontSizeMultiplierne s'applique pas, sa taille vient du stylenumber-smultiplié par le facteur de texte système plafonné à 1,3 - Tap sur un parcours Premium sans abonnement conforme à Ecrans › E-04 (maquette « tap-premium ») : carte recadrée sans tracé ni étapes, départ en pastille encre à couronne dorée, tooltip « Parcours Premium » et « N étapes en X h » sans nom d'étape ; « Voir plus » et « Voir le parcours » ouvrent la fiche verrouillée ; lecteur d'écran « {titre}, parcours Premium, N étapes en X heures »
- Pastille Signature bleue (bleu encre #3A4FA8 sur bleu pâle #E4ECFA) et pastille Premium à côté de la note, sur les cards comme dans le résumé
- Couleurs, tailles, icônes et pastilles lues dans tokens.json (
mappings.placeCategories,mappings.filterIcons,mappings.badges), aucune valeur en dur (D-015) - Point d'ambiance lu dans
mappings.moodDotsde tokens.json, par la clé d'ambiance. Le code suittokens.json, pas les maquettes, qui gardent l'ancien vert du point Nature jusqu'au prochain réexport (D-016) - Pastille « Nouveau » à la place de la note tant que le parcours n'a aucun avis, et sceau certifié après le prénom sur la ligne créateur (D-023)
- Icônes d'interface lues par leur nom dans
mappings.uiIconsde tokens.json, aucune icône choisie en dur (D-025) - Durées, courbes et vibrations lues dans
mappings.motionde tokens.json, aucune valeur en dur ; « Réduire les animations » respecté (D-030)
Activity
IlanAMG commentedon Sep 22, 2026
E-01 révisé le 2026-09-22 (D-004) : chips 36 px, chip météo supprimée, météo dans la ligne de position, chip Extérieur, aucune sélection à l'ouverture, ligne créateur dans les cards.
PaulThiberville commentedon Sep 25, 2026
🔨 Démarrage — plan :
issue/26-mapbox-map, empilée sur feat(api): exposer la recherche de parcours et son comptage #138 (issue/25-route-search) ;@rnmapbox/mapsetexpo-location,app.jsonconverti enapp.config.ts(jeton de téléchargement lu dans l'environnement, jamais versionné) ;searchRoutessurGET /v1/routes/search;map-*de tokens.json ; marqueurs rendus parShapeSource+SymbolLayer;easeTo500 ms, tooltip, tracé et étapes en fondu ; cas Premium sans abonnement (pastille couronne, sans tracé ni étapes).Hors périmètre : « Rechercher dans cette zone » et store
discovery(Ajouter « Rechercher dans cette zone » et le cycle de recherche par bbox #27), sheet etRouteCard(Construire la bottom sheet de résultats et les cartes de parcours (E-04) #28).IlanAMG commentedon Sep 25, 2026
D-041 (https://github.com/Inprogress-Agency/widoo-app/wiki/Design-Changelog) : la tooltip passe à une largeur mesurée sur le titre (voir #155, désormais prêt). Le token size['tooltip-w'] est renommé tooltip-min-w dans tokens v16 : les branches issue/26-mapbox-map (PR #142) et issue/28-results-sheet (PR #152) l'utilisent et casseront au rebase après la synchro v16. Soit adapter ces PR, soit traiter le renommage dans #155.
feat(mobile): keep the launch screen until the home is ready, 2 s at …
PaulThiberville commentedon Sep 28, 2026
📋 MANAGER — critère amendé par D-066 (réponse de DESIGN à #164, point 4).
search.cluster_area_km2. La réponse dédiée à la carte (épingles légères) est écartée. Aucun code demandé.PaulThiberville commentedon Sep 29, 2026
📋 MANAGER — suivi du « jeton public restreint » de ce ticket.
Le 2026-09-29, Paul a créé un jeton public dédié
widoo-mobile, limité aux scopesSTYLES:TILES,STYLES:READetFONTS:READ, et l'a posé dans son.env.local. Une recette iOS et Android confirme que la carte se charge sans erreur d'autorisation. Le jeton restreint est donc en place en local.Constat : Mapbox ne propose aucune restriction par bundle id, et ses restrictions d'URL ne s'appliquent pas aux SDK natifs. La règle du wiki (« restreint aux bundle ids ») est à corriger par DESIGN : #265. La pose du jeton dans l'environnement EAS
previewest suivie dans #266. L'ancien jeton par défaut du compte agence n'a pas été tourné (décision dans #265).