consul/ui-v2/app/components/consul-intention-list/index.hbs

  <DataWriter
    @sink={{concat '/' dc '/' nspace '/intention/'}}
    @type="intention"
    @ondelete={{action ondelete}}
    as |writer|>
    <BlockSlot @name="content">
{{#if (gt items.length 0)}}

      <TabularCollection class="consul-intention-list"
        @items={{items}}
        @rowHeight={{59}}
      as |item index|>
          <BlockSlot @name="header">
              <th class="source">Source</th>
              <th class="intent">&nbsp;</th>
              <th class="destination">Destination</th>
              <th class="permissions">
                Permissions
                <span>
                  <Tooltip>Permissions intercept an Intention's traffic using L7 criteria, such as path prefixes and http headers.</Tooltip>
                </span>
              </th>
              <th class="meta">&nbsp;</th>
          </BlockSlot>
          <BlockSlot @name="row">
              <td class="source" data-test-intention={{item.ID}}>
                <a href={{href-to (or routeName 'dc.intentions.edit') item.ID}} data-test-intention-source={{item.SourceName}}>
                  {{#if (eq item.SourceName '*') }}
                    All Services (*)
                  {{else}}
                    {{item.SourceName}}
                  {{/if}}
                  {{! TODO: slugify }}
                  <em class={{concat 'nspace-' (or item.SourceNS 'default')}}>{{or item.SourceNS 'default'}}</em>
                </a>
              </td>
{{#let (or item.Action "L7 rules") as |intent|}}
              <td class="intent intent-{{slugify intent}}" data-test-intention-action={{intent}}>
                <strong>{{capitalize intent}}</strong>
              </td>
{{/let}}
              <td class="destination" data-test-intention-destination="{{item.DestinationName}}">
                <span>
                  {{#if (eq item.DestinationName '*') }}
                    All Services (*)
                  {{else}}
                    {{item.DestinationName}}
                  {{/if}}
                  {{! TODO: slugify }}
                  <em class={{concat 'nspace-' (or item.DestinationNS 'default')}}>{{or item.DestinationNS 'default'}}</em>
                </span>
              </td>
              <td class="permissions">
                {{#if (gt item.Permissions.length 0)}}
                  <span>{{pluralize item.Permissions.length 'Permission'}}</span>
                {{/if}}
              </td>
              <td class="meta">
              {{#if item.IsManagedByCRD}}
                <ConsulExternalSource @item={{item}} @label="Managed by CRD" />
              {{/if}}
              </td>
          </BlockSlot>
          <BlockSlot @name="actions" as |index change checked|>
            <PopoverMenu @expanded={{if (eq checked index) true false}} @onchange={{action change index}} @keyboardAccess={{false}}>
              <BlockSlot @name="trigger">
                More
              </BlockSlot>
              <BlockSlot @name="menu" as |confirm send keypressClick change|>
              {{#if item.IsEditable}}
                  <li role="none">
                    <a role="menuitem" tabindex="-1" href={{href-to (or routeName 'dc.intentions.edit') item.ID}}>Edit</a>
                  </li>
                  <li role="none" class="dangerous">
                    <label for={{confirm}} role="menuitem" tabindex="-1" onkeypress={{keypressClick}} data-test-delete>Delete</label>
                    <div role="menu">
                      <div class="confirmation-alert warning">
                        <div>
                          <header>
                            Confirm Delete
                          </header>
                          <p>
                            Are you sure you want to delete this intention?
                          </p>
                        </div>
                        <ul>
                          <li class="dangerous">
                            <button tabindex="-1" type="button" class="type-delete" onclick={{queue (action change) (action writer.delete item)}}>Delete</button>
                          </li>
                          <li>
                            <label for={{confirm}}>Cancel</label>
                          </li>
                        </ul>
                      </div>
                    </div>
                  </li>
                {{else}}
                  <li role="none">
                    <a role="menuitem" tabindex="-1" href={{href-to (or routeName 'dc.intentions.edit') item.ID}}>View</a>
                  </li>
                {{/if}}
              </BlockSlot>
            </PopoverMenu>
          </BlockSlot>
      </TabularCollection>

{{else}}
  {{yield}}
{{/if}}
    </BlockSlot>
  </DataWriter>