Mechanism for adding default contexts

[marksteele]

So when dealing with things like gendered translations, the recommended approach is to leverage translation contexts.

It might look something like this (using lioness)

{ person.gender === "male" ? (
            <T
            message="Dear {{ name }}, there is one potato left"
            messagePlural="Dear {{ name }}, there are {{ count }} potatoes left"
            count={numPotatoes}
            name={person.name}
            context="male"
          />  
          )
            :
          (
            <T
            message="Dear {{ name }}, there is one potato left"
            messagePlural="Dear {{ name }}, there are {{ count }} potatoes left"
            count={numPotatoes}
            name={person.name}
            context="female"
            />  
          )        
      }

There is an obvious glaring problem with this approach, being that the component is duplicated simply because we want to be able to extract both contexts.

It would be great if we could pass in an array of contexts via config to apply to all extracted translation strings (overrideContext?)

The above code would then be:

            <T
            message="Dear {{ name }}, there is one potato left"
            messagePlural="Dear {{ name }}, there are {{ count }} potatoes left"
            count={numPotatoes}
            name={person.name}
            context={person.gender}
          />  
      }
// In the parser config: {...otherOptions, overrideContext: ['male', 'female'] }
// Would spit out two entries for that translation key, one for each context.

[alexanderwallin]

As commented in your PR:

The problem with this is that a static code analyser like react-gettext-parser won't be able to resolve a gender variable or its possible values when doing the extraction. It has to be pure strings (like you did in the test you wrote).

One alternative would be to allow for a custom prop to flag that it's a gendered translation. Something like:

<T
  message="Hello"
  context={person.gender}
  gendered
/>

with a config stating the gender prop name and what genders you have (similar to you overrideContext config)

...
genderProp: 'gender',
genderContexts: ['male', 'female'],
...

[alexanderwallin]

Or maybe just a contexts prop with comma-separated contexts that get split into several translations?

[marksteele]

that would also work I suppose