<Table
  data-test-resources-table
  @withMargin={{@withMargin}}
>
  <caption>{{yield to="caption"}}</caption>

  <colgroup>
    <col class="w-2/5">
    <col>
    <col>
    <col>
  </colgroup>

  <thead>
    <tr>
      <th>{{t "page.resources.table.headings.name"}}</th>
      <th>{{t "page.resources.table.headings.type"}}</th>
      <th>{{t "page.resources.table.headings.age"}}</th>
      <th>{{t "page.resources.table.headings.status"}}</th>
    </tr>
  </thead>

  <tbody>
    {{#each @resources key="id" as |resource|}}
      <tr>
        <th scope="row">
          <LinkTo
            title={{resource.name}}
            @route={{@route}}
            @models={{append (or @models (array)) resource.id}}
          >
            {{resource.name}}
          </LinkTo>
        </th>
        <td class="resource-icon"><FlightIcon @name={{icon-for-component resource.platform}} /> {{resource.type}}</td>
        <td>{{date-format-distance-to-now resource.createdTime.seconds}}</td>
        <td><ResourceHealthIndicator @resource={{resource}} /></td>
      </tr>
    {{/each}}
  </tbody>
</Table>
