I'm struggling to work out the best way to structure messages whereby one of the dynamic values also needs a translation.
For example if I have the message 'Type in Spanish...' I would like to use this message in every different combination for all the languages my app supports.
Assuming only en/es are supported then I would required a function that could output the following combinations:
Type in Spanish...
Type in English...
Escribir en español...
Escribir en ingles...
With 3 supported languages there would be 9 possible combinations etc...
The only way I can think to do it is by composing messages as follows:
const messages = defineMessages({
language: {
id: 'language',
description: 'The name of the language',
defaultMessage: 'English'
},
typeInLanguage: {
id: 'typeInLanguage',
description: 'instructs the user to type their message in a specific language',
defaultMessage: 'Type in { language }'
}
})
FormattedMessage
{...messages.typeInLanguage}
values={{
language: <FormattedMessage {...messages.language} />
}} />
I've got a feeling that this is not the optimal way. Perhaps there are some languages where the the standalone form of the word 'English' is not the same when used in the context of the phrase 'Type in English...'
I guess that's a hypothetical concern and I don't know enough about languages to know if that is a problem or not.
Is the above approach of composing messages a valid one?
