Reacti18next app language switcher problem with dynamic data from API

18 views Asked by At

is it possible to translate data coming from an API using react-i18n? Normally, it's straightforward to do this, for example:

<h2>{t("upcomingWorkouts.costam")}</h2>

And then in a JSON file, appropriately for a language like Polish json

pl/global.json

"upcomingWorkouts": {
  "costam": "translated text"
}

But my question arises now when the data isn't static, and I'm fetching it from an API. I won't always know what each thing is called. How can I translate something like this?

For example:

{currentExercises.map((exercise: ExerciseData, index: number) => (
  <Exercise
    key={index}
    name={t(exercise.name)}
  />
))}

Is it possible at all to translate dynamic data from an API using react-i18n, because I can't hard code this data as static data because now it's coming from API. If there's some way to even have option to hard code it because I can see what values this exercise.name will have and it won't change tell me please.

So I tried to hard code it with values from exercise.name for example if exercise in api is called pull up I set it in json to

"exercises": {
"pull up": "pulling up"
}

but it not work that way

0

There are 0 answers