Vue d’ensemble

Dans gt-next 6.3.0, nous nous rapprochons d’une bibliothèque adaptée aussi bien aux développeurs humains qu’aux développeurs IA. Le principe directeur de cette version était de limiter au maximum les changements dans le code existant tout en introduisant les fonctionnalités essentielles nécessaires à l’i18n.

Pour y parvenir, nous introduisons une nouvelle fonction msg() pour traduire des chaînes n’importe où dans votre base de code. Auparavant, les développeurs devaient faire remonter la fonction gt() depuis useGT() ou getGT() dans la pile d’appels pour pouvoir traduire une chaîne. Avec msg(), il vous suffit d’envelopper la chaîne une seule fois, puis de la faire passer par m() au moment du rendu.

Une comparaison

Historiquement, il fallait encapsuler les chaînes en faisant passer la fonction gt() par plusieurs couches :

export const greeting1 = 'Hello, world!'
export const getGreeting2 = (gt: any) => gt('Hello, world!')

import { greeting1, getGreeting2 } from './constants'

export default function Page() {
  const gt = useGT()
  return (
    <div>
      {greeting1}
      {getGreeting2(gt)}
    </div>
  )
}

Désormais, avec msg(), les chaînes peuvent être déclarées directement comme constantes. La seule condition est de les passer par m() (via useMessages() ou getMessages()) au moment de l’affichage.

export const greeting1 = 'Hello, world!'
export const greeting2 = msg('Hello, world!')

import { greeting1, greeting2 } from './constants'

export default function Page() {
  const m = useMessages()
  return (
    <div>
      {greeting1}
      {m(greeting2)}
    </div>
  )
}

Encodage et décodage

Pour prendre en charge l’interpolation, la fonction msg() renvoie un message encodé plutôt qu’une chaîne simple. Le format se présente comme suit :

<interpolated content>:<base64 encoded string>

La partie encodée en base64 contient un objet JSON avec :

• $_hash : Hachage de la chaîne d’origine
• $_source : Paramètres interpolés dans le message
• $id : Identifiant unique personnalisé (s’il est fourni)
• $context : Contexte du message (s’il est spécifié)
• Toute variable incluse dans l’interpolation

Cette conception modifie légèrement la comparaison directe des chaînes, tout en garantissant un impact minimal sur le typage et la structure du code. Pour accéder au contenu interpolé, utilisez decodeMsg().

Pourquoi une chaîne encodée ?

L’alternative à l’utilisation d’une chaîne encodée impliquerait que msg() doive renvoyer un type d’objet personnalisé contenant des métadonnées supplémentaires. Bien que cela fonctionne dans le paradigme d’encodage/décodage, cela pose des problèmes lorsqu’on travaille avec un typage strict.

Nous avons conclu que, dans ce scénario, la meilleure façon de minimiser l’impact de l’i18n était simplement de renvoyer une chaîne contenant les métadonnées.

Exemple

Code d’origine sans i18n :

const name = 'John'
const message = `Hello, ${name}!`

if (message.length > 10) {
  console.log('The message is too long')
} else {
  console.log('The message is just the right length')
}

Avec msg() et decodeMsg() :

import { msg, decodeMsg } from 'gt-next'

const name = 'John'
const message = msg('Hello, {name}!', { name })

if (decodeMsg(message).length > 10) {
  console.log('The message is too long')
} else {
  console.log('The message is just the right length')
}

Autres

Vous pouvez également redéfinir des paramètres dans la fonction gt(), même s’ils ont déjà été interpolés lors de l’appel à msg().

import { msg, useMessages } from 'gt-next'

const message = msg('Hello, {name}!', { name: 'John' })

export default function Page() {
  const m = useMessages()
  return <div>{m(message, { name: 'Jane' })}</div> // Ceci retournera "Hello, Jane!"
}

Résumé

Cette version vise à rendre gt-next plus agréable à utiliser pour les développeurs, tout en réduisant au minimum la surcharge liée à l’i18n. En évitant d’avoir à faire passer la fonction gt() tout au long de la pile d’appels, la nouvelle fonction msg() offre une façon plus claire et plus intuitive de traduire des chaînes, et simplifie grandement le processus d’i18n.