mirror of
https://github.com/MaksTinyWorkshop/_Assistant_Lead_Tech
synced 2026-04-06 13:31:43 +02:00
MAJ
This commit is contained in:
@@ -29,7 +29,107 @@ Ce fichier ne doit donc **jamais devenir une documentation permanente**.
|
||||
|
||||
---
|
||||
|
||||
_Aucune entrée pour le moment._
|
||||
2026-03-25 — app-alexandrie
|
||||
|
||||
FILE_UPDATE_PROPOSAL
|
||||
Fichier cible : knowledge/frontend/risques/react-native.md
|
||||
|
||||
Pourquoi :
|
||||
Bug récurrent détecté lors du theming : les imports non utilisés (`fontWeight`) ne génèrent pas d'erreur TypeScript dans React Native, car le type `fontWeight` est une string — ils passent silencieusement au lint et dans les tests. À signaler comme zone à surveiller lors de toute migration de tokens.
|
||||
|
||||
Proposition :
|
||||
|
||||
## Imports morts de tokens dans les composants UI (React Native)
|
||||
|
||||
Lors d'une migration de design system, les imports de tokens abandonnés (ex: `fontWeight` après passage aux fontes nommées par variante) ne génèrent pas d'erreur TypeScript car le type est compatible avec les usages implicites. Vérifier systématiquement les imports non utilisés avec `eslint @typescript-eslint/no-unused-vars` ou `no-unused-imports` activé dans la config ESLint mobile.
|
||||
|
||||
---
|
||||
|
||||
2026-03-25 — app-alexandrie
|
||||
|
||||
FILE_UPDATE_PROPOSAL
|
||||
Fichier cible : knowledge/frontend/risques/expo-router.md
|
||||
|
||||
Pourquoi :
|
||||
Anti-pattern découvert lors de la review theming-1 : labels et routes des tabs inversés sans erreur visible à la compilation. Le tab "Communauté" routait vers `explore.tsx` (boilerplate) au lieu de `community.tsx`. Aucun test ne couvrait ce mapping.
|
||||
|
||||
Proposition :
|
||||
|
||||
## Vérifier le mapping name/label des Tabs Expo Router
|
||||
|
||||
Dans Expo Router, `<Tabs.Screen name="x">` correspond au fichier `app/(tabs)/x.tsx`. Les labels (`title`) sont indépendants du routage — un label "Communauté" sur `name="explore"` affichera `explore.tsx` sans aucune erreur. Lors d'un refacto de navigation (ajout/renommage de tabs), valider visuellement que chaque label correspond bien à l'écran attendu. Ajouter un test de smoke ou de snapshot de la nav si possible.
|
||||
|
||||
---
|
||||
|
||||
2026-03-25 — app-alexandrie
|
||||
|
||||
FILE_UPDATE_PROPOSAL
|
||||
Fichier cible : knowledge/frontend/risques/react-native.md
|
||||
|
||||
Pourquoi :
|
||||
Input focus ring (border au focus) non implémenté malgré la tâche marquée [x]. React Native ne propose pas de `:focus` CSS — il faut gérer `onFocus`/`onBlur` manuellement avec un state local. Ce pattern est souvent oublié ou marqué done à tort.
|
||||
|
||||
Proposition :
|
||||
|
||||
## Focus ring sur TextInput React Native
|
||||
|
||||
React Native n'a pas de pseudo-classe `:focus`. Pour implémenter un focus ring sur un `TextInput`, il faut :
|
||||
1. `const [focused, setFocused] = useState(false)`
|
||||
2. `onFocus={() => setFocused(true)}` / `onBlur={() => setFocused(false)}` sur le `TextInput`
|
||||
3. Appliquer un style conditionnel sur le container : `[styles.container, focused && styles.containerFocused]`
|
||||
|
||||
Ne jamais marquer cette tâche [x] sans avoir vérifié la présence du state `focused` et des handlers.
|
||||
|
||||
---
|
||||
|
||||
2026-03-25 — app-alexandrie
|
||||
|
||||
FILE_UPDATE_PROPOSAL
|
||||
Fichier cible : knowledge/frontend/risques/react-native.md
|
||||
|
||||
Pourquoi :
|
||||
Dette repérée sur login.tsx : écran en anglais alors que tout le reste du flux auth est en français. Aucune erreur de build ou de lint — passe complètement inaperçu jusqu'au test manuel.
|
||||
|
||||
Proposition :
|
||||
|
||||
## Cohérence de langue dans les écrans auth (React Native / Expo Router)
|
||||
|
||||
Les textes UI en dur ne sont pas vérifiés par TypeScript ni par les tests unitaires. Une dette de localisation (anglais vs français) peut s'accumuler silencieusement écran par écran. Points de vigilance :
|
||||
- Vérifier chaque nouvel écran auth lors de la code review : titres, labels de boutons, messages d'erreur, placeholders
|
||||
- Les tests de snapshot Storybook ou les reviews visuelles sont le seul filet pour ce type de dette
|
||||
- Prioriser la correction avant la mise en prod (expérience utilisateur incohérente)
|
||||
|
||||
---
|
||||
|
||||
2026-03-25 — app-alexandrie
|
||||
|
||||
FILE_UPDATE_PROPOSAL
|
||||
Fichier cible : knowledge/frontend/risques/expo-router.md
|
||||
|
||||
Pourquoi :
|
||||
Anti-pattern découvert en review 5.1b : `router.push('/(auth)/forgot-password')` depuis un tab `(tabs)/` — navigation cross-groupe avec préfixe de groupe explicite. Peut échouer selon la version d'Expo Router. Le reste du projet utilise `/forgot-password` sans préfixe de groupe.
|
||||
|
||||
Proposition :
|
||||
|
||||
## Navigation cross-groupe Expo Router — ne jamais préfixer avec le groupe dans router.push
|
||||
|
||||
Depuis un écran dans `(tabs)/`, utiliser `router.push('/(auth)/forgot-password')` peut échouer silencieusement ou lever une erreur selon la version d'Expo Router, car la résolution des groupes de routes se fait par contexte de navigation. Toujours utiliser le chemin sans groupe explicite : `router.push('/forgot-password' as never)`. Les groupes `(auth)`, `(tabs)` etc. sont des conventions d'organisation de fichiers, pas des segments de route réels.
|
||||
|
||||
---
|
||||
|
||||
2026-03-25 — app-alexandrie
|
||||
|
||||
FILE_UPDATE_PROPOSAL
|
||||
Fichier cible : knowledge/frontend/risques/react-native.md
|
||||
|
||||
Pourquoi :
|
||||
Pattern `contentInset` iOS-only trouvé dans deux écrans (settings.tsx, profile.tsx déjà existant) — aucune erreur au build, invisible sur iOS, cassé sur Android (contenu sous la tab bar).
|
||||
|
||||
Proposition :
|
||||
|
||||
## `contentInset` est iOS-only sur ScrollView React Native
|
||||
|
||||
`ScrollView.contentInset` n'est pas supporté sur Android. Pour gérer le padding bottom autour d'une bottom tab bar, utiliser `contentContainerStyle={{ paddingBottom: insets.bottom }}` à la place. Pattern à auditer systématiquement lors de la review de tout nouvel écran avec ScrollView + bottom navigation.
|
||||
|
||||
---
|
||||
|
||||
|
||||
Reference in New Issue
Block a user