Utiliser les dictionnaires

Que sont les dictionnaires ?

Les dictionnaires sont des fichiers de traduction clé-valeur traditionnels. Ils sont utiles pour :

• Des chaînes partagées entre de nombreux composants (libellés de boutons, messages d’erreur)
• Du contenu géré en dehors de votre base de code
• La migration depuis des configurations i18n existantes

Configuration

{
  "dictionaries": {
    "include": ["src/dictionaries/*.json"],
    "format": "key-value"
  }
}

Créer un dictionnaire

src/dictionaries/common.json

{
  "save": "Save",
  "cancel": "Cancel",
  "delete": "Delete",
  "loading": "Loading..."
}

useDictionary(filenameKey) recherche un fichier de dictionnaire et renvoie un Record<string, string>. La clé de nom de fichier est le chemin du dictionnaire sans l’extension .json :

• src/dictionaries/common.json → common
• src/dictionaries/pages/home.json → pages/home

Utilisation dans les composants

import { useDictionary } from 'tyndale-react';

export function ActionButtons() {
  const labels = useDictionary('common');

  return (
    <div>
      <button>{labels.save ?? 'Save'}</button>
      <button>{labels.cancel ?? 'Cancel'}</button>
    </div>
  );
}

Si aucune entrée ne correspond à la clé de nom de fichier, useDictionary(filenameKey) renvoie un objet vide.