{{#let item.Services as |items|}}
<div id="services" class="tab-section">
  <div role="tabpanel">
  {{#if (gt items.length 0) }}
    <input type="checkbox" id="toolbar-toggle" />
    <SearchBar
      @placeholder="Search by name/port"
      @value={{search}}
      @onsearch={{action (mut search) value="target.value"}}
    />
  {{/if}}
     <ChangeableSet @dispatcher={{searchable 'nodeservice' items}} @terms={{search}}>
      <BlockSlot @name="set" as |filtered|>
        <Consul::ServiceInstance::List @routeName="dc.services.show" @items={{filtered}} @checks={{checks}}/>
      </BlockSlot>
      <BlockSlot @name="empty">
        <EmptyState>
          <BlockSlot @name="body">
            <p>
              There are no services.
            </p>
          </BlockSlot>
        </EmptyState>
      </BlockSlot>
    </ChangeableSet>
  </div>
</div>
{{/let}}