Accept boolean variables in `Localized` component
I came across this while working on the i18n of Firefox Profiler. I tried to pass a boolean variable in the Localized's vars attribute like this:
<Localized
id="CallNodeContextMenu--transform-focus-function"
attrs={{ title : true }}
vars={{ isInverted : true }}
>
<AReactComponent title="...">
...
</AReactComponent>
</Localized>
And this is the ftl string I'm using:
CallNodeContextMenu--transform-focus-function =
{ $isInverted ->
[true] Focus on function (inverted)
*[other] Focus on function
}
.title =
Focusing on a function will remove any sample that does not include that
function. In addition, it re-roots the call tree so that the function
is the only root of the tree. This can combine multiple function call sites
across a profile into one call node.
But this didn't work and I got this warning on my console:
TypeError: Variable type not supported: $isInverted, boolean
I can possibly split them into two different strings and pass these Ids depending on this boolean value, but then, this will mean that I need to duplicate the very long title attribute string. This doesn't seem ideal to me.
I walked around this issue by converting the boolean to number and passing that instead :)
When I checked the code, it looks like there are only 3 types allowed currently. Strings, numbers, and Date objects: https://github.com/projectfluent/fluent.js/blob/a1ac29df2eba6b2e2652fddad96bc454c612acdf/fluent-bundle/src/resolver.ts#L181-L197 I'm not sure if this can be solved with only fluent.js changes, but it would be great to also have the boolean value supported here.
I also wanted to check if this is supported inside Firefox. It's not very common but I can see some occurrences at least.