search

ember-codemods / ember-angle-brackets-codemod

Codemod to convert curly braces syntax to angle brackets syntax
MIT License
60 stars 32 forks source link

Incorrect handling of block param properties in iterable helpers #495

Open ctaylor-nurx opened 3 years ago

ctaylor-nurx commented 3 years ago

Ex: Input

                  {{#each model.promoRedemption as |promoRedemption|}}
                    <tr>
                      <td>{{promoRedemption.redeemedAt}}</td>
                      <td>{{promoRedemption.request.id}}</td>

Output

                  {{#each model.promoRedemption as |promoRedemption|}}
                    <tr>
                      <td><promoRedemption.redeemedAt /></td>
                      <td><promoRedemption.request.id. /></td>
tylerturdenpants commented 3 years ago

nice one! I'm not sure when I can get to it but hopefully it's not that hard. PR's are welcome.

ctaylor-nurx commented 3 years ago

this issue is that yielded components and regular old data renderings are the same in curly brace notation. The thing to look for is differentiating between iterable helpers and yielded components.

Here's the yielded component example

              {{ember-table as |table|}}
                {{table.head
                  columns=columnNames
                  sorts=sorts
                  onUpdateSorts=(action (mut sorts))
                  sortEmptyLast=true
                  widthConstraint="eq-container"
                }}
{!-- to --}
              <EmberTable as |Table|>
                <Table.head
                  @columns={{columnNames}}
                  @sorts={{sorts}}
                  @onUpdateSorts={{action (mut sorts)}}
                  @sortEmptyLast={{true}}
                  @widthConstraint="eq-container"
                />