  <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}} as |item index|>
          <BlockSlot @name="header">
              <th>Source</th>
              <th>&nbsp;</th>
              <th>Destination</th>
              <th>Precedence</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>
              <td class="intent-{{item.Action}}" data-test-intention-action="{{item.Action}}">
                  <strong>{{item.Action}}</strong>
              </td>
              <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="precedence">
                  {{item.Precedence}}
              </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|>
                  <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>
              </BlockSlot>
            </PopoverMenu>
          </BlockSlot>
      </TabularCollection>

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