Dynamic out-of-component translation with t macro in Lingui

Question

I'm trying to translate something like this "User {id} payments" to both English and Hungarian. How can I do it with the t macro with my current setup?

title: (id, i18n) => t(i18n)`userPayments`,

Answer 1

The solution in my case was:

18n._({
    "userPayments",
    message: "User {id} payments",
    values,
});

Where values is: { id: payment.id }.

Answer 2

The t macro does not support variables. You should try using <Trans /> which supports variables and can be helpful in your case.

Here is an example code

// strings.json
"user_id": "User {{id}} payments"

const id = "123"
<Trans i18nKey={"user_id"} values={{id}} />

// output
"User 123 payments"

There are more options here depending on your setup, check https://react.i18next.com/latest/trans-component