feat: Adds no-t-inside-trans-functions rule

[garikkh]

Fixes #90

Adds a new rule to prevent t calls inside other functions like plural, Plural and Trans

[codecov]

Codecov Report

❌ Patch coverage is 98.18182% with 1 line in your changes missing coverage. Please review.
✅ Project coverage is 97.89%. Comparing base (69b9c22) to head (859b3ac).

Files with missing lines	Patch %	Lines
src/rules/no-nested-trans.ts	98.03%	1 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main     #111      +/-   ##
==========================================
+ Coverage   97.86%   97.89%   +0.02%     
==========================================
  Files          11       12       +1     
  Lines         563      618      +55     
  Branches      187      207      +20     
==========================================
+ Hits          551      605      +54     
- Misses         12       13       +1     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[andrii-bodnar]

@garikkh thanks for the contribution, looks nice!

@timofei-iatsenko what do you think?

[timofei-iatsenko]

@garikkh Thanks for the contribution! I have a few change requests:

There are quite a few cases not yet covered — t can appear not only as a TaggedTemplateExpression, but also as a CallExpression in various forms.

Similarly, Trans and Plural are only part of the Lingui API — there are other components that should also be handled.

Covering all possible forms and signatures can be tricky, which is why this plugin provides ready-to-use queries for all Lingui cases in src/helpers.ts.
You can take a look at the src/rules/no-trans-inside-trans.ts rule for reference.

Also, the rule name no-t-inside-trans-function might not fully reflect its purpose, since it’s not limited to Trans. It might be worth considering a more fitting name.

[garikkh]

Also, the rule name no-t-inside-trans-function might not fully reflect its purpose, since it’s not limited to Trans. It might be worth considering a more fitting name.

Agreed, originally the only scope was t in trans, but then extended for other cases.

I'll check the helper queries, and rename the rule. Might take me a few days to get back to this though

[garikkh]

@timofei-iatsenko can you point me to a good definition of what is/isn't allowed?

I think there are these functions:

1. t
2. plural and Plural
3. select and Select
4. selectOrindal and SelectOrdinal
5. msg and defineMessage
6. Trans

which combinations are allowed? you can't have t in t or Trans in Trans. And you can't have t in Plural but you can have Trans in Plural - but should that be allowed?

technically Trans in Plural works, but also I don't see any reason to allow it, just looks messy for no reason.

If none are allowed within each other, that is OK too - that's how the latest version of this lint rule checks it as well.

[garikkh]

bump @timofei-iatsenko

[garikkh]

Bump again @timofei-iatsenko - what can I do to get this PR merged :)

[garikkh]

Bump again - but also, would like to confirm something:

Can react Plural tags have Trans in it? for example, this should be ok:

            <Plural value={count} 
                one={
                    <Trans>
                    I have <br/>
                    1 book
                    </Trans>
                }
                other={
                    <Trans>
                    I have <br/>
                    {tokens} books
                    </Trans>
                }
            />

But the other way around is not good?

            <Trans>
                I have <br/>
                <Plural value={count} one="1 book" other="# books" />
            </Trans>

If so, plugin needs to be fixed.

[andrii-bodnar]

Hi @timofei-iatsenko, could you please check if any action is needed here to proceed? Thanks!

[timofei-iatsenko]

Bump again - but also, would like to confirm something:

Can react Plural tags have Trans in it? for example, this should be ok:

            <Plural value={count} 
                one={
                    <Trans>
                    I have <br/>
                    1 book
                    </Trans>
                }
                other={
                    <Trans>
                    I have <br/>
                    {tokens} books
                    </Trans>
                }
            />

But the other way around is not good?

            <Trans>
                I have <br/>
                <Plural value={count} one="1 book" other="# books" />
            </Trans>

If so, plugin needs to be fixed.

Both of them are fine. The second option is discussed here #110

I think it out of scope of this rule.

I think Components inside other components cases are out of scope of this rule completely.

So basically we can narrow this rule to "no nested core macro in trans". (for simplicity, meaning trans == plural/select/etc)