On the cell yield the property name and provide a non block cell.

[cah-brian-gantzler]

I wonder if this is possible. If would be nice to yield the property name for the cell in question, then you could maybe use a get helper. We specify the property name on the column (for sorting and filtering).

If every cell is just a get on the property name you would just use <table.body/> but if you needed to customize some, if might be nice to be able to do below. The nice thing here is, if you change the prop name on the column, you dont have to change the cell body as well.

<YetiTable @data={{this.data}} as |table|>

  <table.header as |header|>
    <header.column @prop="firstName">
      First name
    </header.column>
    <header.column @prop="lastName">
      Last name
    </header.column>
    <header.column @prop="points">
      Points
    </header.column>
  </table.header>

  <table.body as |body person|>
    <body.row as |row|>
      <row.cell as |cell|>
        {{get person cell.propertyName}}
      </row.cell>
      <row.cell>
        {{get person cell.propertyName}}
      </row.cell>
      <row.cell>
        {{person.points}} {{#if (gt person.points 10)}}Yea{{/if}}
      </row.cell>
    </body.row>
  </table.body>

  <table.foot as |foot|>
    <foot.row as |row|>
      <row.cell>
        First Name footer
      </row.cell>
      <row.cell>
        Last Name footer
      </row.cell>
      <row.cell>
        Points footer
      </row.cell>
    </foot.row>
  </table.foot>

</YetiTable>

Knowing the prop name means we could also then provide a non block version and do this. Note the body for cell first and last name just say display the property.

<YetiTable @data={{this.data}} as |table|>

  <table.header as |header|>
    <header.column @prop="firstName">
      First name
    </header.column>
    <header.column @prop="lastName">
      Last name
    </header.column>
    <header.column @prop="points">
      Points
    </header.column>
  </table.header>

  <table.body as |body person|>
    <body.row as |row|>
      <row.cell />
      <row.cell />
      <row.cell>
        {{person.points}} {{#if (gt person.points 10)}}Yea{{/if}}
      </row.cell>
    </body.row>
  </table.body>

  <table.foot as |foot|>
    <foot.row as |row|>
      <row.cell>
        First Name footer
      </row.cell>
      <row.cell>
        Last Name footer
      </row.cell>
      <row.cell>
        Points footer
      </row.cell>
    </foot.row>
  </table.foot>

</YetiTable>

Think this is something worth while to look into if it can be done?

[miguelcobain]

This looks like an interesting feature, for sure! I think I would use cell.prop instead of cell.propertyName, just because we use @prop on the columns, e.g <header.column @prop="firstName">.

The blockless version of <table.body /> is rendering the cells with this logic here: https://github.com/miguelcobain/ember-yeti-table/blob/master/addon/components/yeti-table/body.hbs#L19-L25

Perhaps that could plug into this feature to avoid repetition.

[cah-brian-gantzler]

Yes I would try to re-use the logic.

Since this seems acceptable will research how to accomplish this.

I noticed in my code I was reproducing the prop name in the header and the cells and when I had to change something it was in two places. This seemed like a reasonable thing to do.

[cah-brian-gantzler]

Thought I would have had to change some to get the prop name down to the cell. Turns out it was there already and really simple https://github.com/miguelcobain/ember-yeti-table/pull/450

[cah-brian-gantzler]

This was completed in the recent revamp https://github.com/miguelcobain/ember-yeti-table/pull/460