amireh / canvas_react_i18n Goto Github PK

if you have an <input> or something standalone inside your string, we should infer a placeholder for it. otherwise i18nliner's html-safety hammer will escape it, which is not desirable

example spec

although if your <Text> contains block elements, you probably do want a <div>

one though would be we could make it configurable/overridable? e.g. <Text tag="span">...

Because we call inferKey before we extract the wrappers, the key is being inferred from the intermediate string containing markup, not the final string. This is not a huge deal, but it could result in more strings being sent off to translators than necessary. For example, given:

var foo = <Text>hello <b>{user}</b></Text>;
var bar = <Text>hello <em>{user}</em></Text>;

you get the following keys/strings:

hello_b_user_b_97d65af2: "hello *%{user}*"
hello_em_user_em_885c56ce: "hello *%{user}*"

Ideally they should use the same key, since they are the same string, i.e.

hello_user_34eefdb3: "hello *%{user}*"

Note: the fix for this might be similar in nature to the one for #4, i.e. we might need to change the order we transform and possibly transform wrappers/placeholders concurrently (as is done in i18nliners's erb and i18nliner-handlebars)

I18n.t() calls expect variables for interpolation to be wrapped by %{} and JSX expects anything between {} to be evaluated in the running context.

A workaround for JSX is to wrap the item inside another pair of {}, e.g:

{'%{my_variable}'}

To make this work, the transformer has to look for such tokens and remove the wrapping {} on compilation (because at this stage we're no longer dealing with raw JSX, but compiled JS instead.)

it'd be nice to de-dup identical wrappers like we do in i18nliner(.rb) and i18nliner-handlebars (an example spec here). that should keep the asterisks from getting out of control in the translation.

currently if you do <Text>Hello <b><em>world</em></b></Text> you get two wrappers with no whitespace between them, rather than a single wrapper. depending on what else you have going on in the string, i18nliner may apply it incorrectly. for example, <b><em>foo</em></b> <i>bar</i> will result in <i>foo</i> <i>bar</i>, since the intermediate string simply has two pairs of ***

example spec we should try to support

if there is no markup/wrappers, we should just transform the <Text> into the bare I18n.t call and allow react to escape it. this way you can avoid superfluous markup everywhere

note that we should not pass in a wrappers object in that case, because i18nliner will always assume the result should be safe if the wrappers object is present, even if empty. i.e. it will html-escape the defaultString and interpolated values