Problème d'hydratation à cause des traductions sans param
publié le , mis à jourMon choix expliqué dans !1734 semble casser l'hydratation next. Pourtant l'info de la langue devrai être dans le header donc dispo côté serveur...
laem
cf le TODO dans OsmLinksx
laem
AAAAAAh c'est un bug, conflit entre le compilateur react et le macro lingui qui utilise SWC.
laem
caution
If you're using React Compiler, make sure that @lingui/babel-plugin-lingui-macro comes before the React Compiler plugin in the Babel plugins list. This ensures macros are expanded correctly before the compiler processes the code.
laem
Aucune solution n'est satisfaisante pour l'instant donc. Désactiver le compiler react, c'est ralentir l'expérience voir carrément la planter.
Traduire ce composant en le segmentant c'est nul, on n'utilise pas Lingui pour ne pas pouvoir englober un bloc comme on l'a fait pour la date de mod du lieu.
Reste l'option de passer à Lingui babel macros. Peut-être que ça marchera et même pas trop lentement vu la faible masse de macros qu'on utilise, même si la base de code est large ?
etienneJr
Je n'ai pas bien suivi : pourquoi ce bug bloque la traduction seulement à cet élément là ?
@laem wrote in https://codeberg.org/cartes/web/issues/1795#issuecomment-11850576:
Traduire ce composant en le segmentant c'est nul,
Certes. Mais si ça ne pose pb que là et jamais ailleurs, on peut ptêt faire une exception ?
n4n5
J'ai essayé de repro sur cette branche https://codeberg.org/cartes/web/src/branch/test-reproduce-1795
Mais aucun bug nextjs en vue ? Il y a une technique pour repro?
@etienneJr wrote in https://codeberg.org/cartes/web/issues/1795#issuecomment-11866548:
Traduire ce composant en le segmentant c'est nul,
Le problème de segmenter le text d'une traduction c'est que ça pose problème avec un langue ou l'ordre des mots n'est pas le même ^^
laem
Je n'ai pas bien suivi : pourquoi ce bug bloque la traduction seulement à cet élément là ?
C'est un des rares endroits où on englobe des balises HTML dans une balise <Trans
<Trans>Mon <a>lien</a> et autre chose <strong>de super</strong></Trans>
React Compiler passe avant, ça casse.
laem
Le problème de segmenter le text d'une traduction c'est que ça pose problème avec un langue ou l'ordre des mots n'est pas le même ^^
Oui exactement, en plus d'être un peu plus relou à entretenir.
Mais aucun bug nextjs en vue ? Il y a une technique pour repro?
Je ne l'avais pas en local, c'est apparu en prod :/
Faut activer reactcompiler: true dans le next.config.js pour avoir le bug.
laem
Merde, je l'ai laissé désactivé en prod !