Custom ESLint rules for usage in FeedbackFruits ember repositories
Sometimes you have translations that appear correct, but do have whitespaces around the variable for formatting reasons. It's unpredictable whether those whitespaces will end up correctly on the page or not, so it's recommended to remove them.
Example of incorrect code:
show-comments-or-reviews: '{ showComments, select,
true { { count, plural, =1 {Show comment} other {Show comments} }}
other { { count, plural, =1 {Show review} other {Show reviews}} }}'
show-comments: { count, plural, =1 { Show comment } other { Show comments }}Example of correct code:
show-comments-or-reviews: '{ showComments, select,
true {{ count, plural, =1 {Show comment} other {Show comments}}}
other {{ count, plural, =1 {Show review} other {Show reviews}}}}'
show-comments: { count, plural, =1 {Show comment} other {Show comments}}This rule can fix the violations for you. Do keep in mind that removing the trailing whitespaces does not always give the result that you want. Therefore, this rule only provides suggestions to fix the translations, so that a lint --fix won't change the translation automatically.
For example, fixing this translation:
title: Read{reflect, select, true { and reflect} other {}}will become:
title: Read{reflect, select, true {and reflect} other {}}which results in wrong translations. Instead, it's better to break this down on sentence level:
title: '{reflect, select, true {Read and reflect} other {Read}}', or even better, split them up into separate translations:
title-reflect: Read and reflect
title: ReadNote that translations defined with | or > can be fixed, but change the formatting.
It's recommended to use the suggested fix if you can't find the trailing whitespace yourself.
To avoid this entirely, it's usually even better to think of simplifying / splitting up the translation, as a | or > is often an indication that the translation is too complex.