consul/ui/packages/consul-ui/app/templates/dc/services/show/upstreams.hbs

<EventSource @src={{gatewayServices}} />
<div class="tab-section">
  <div role="tabpanel">
{{#let (hash
  instances=(if instance (split instance ',') undefined)
) as |filters|}}
  {{#let (or sortBy "Status:asc") as |sort|}}
{{#if (gt gatewayServices.length 0)}}
    <input type="checkbox" id="toolbar-toggle" />
    <Consul::Upstream::SearchBar
      @search={{search}}
      @onsearch={{action (mut search) value="target.value"}}

      @sort={{sort}}
      @onsort={{action (mut sortBy) value="target.selected"}}

      @filter={{filters}}
      @onfilter={{hash
        instance=(action (mut instance) value="target.selectedItems")
      }}
      />
{{/if}}
      <p>
        Upstreams are services that may receive traffic from this gateway. Learn more about configuring gateways in our <a href="{{env 'CONSUL_DOCS_URL'}}/connect/ingress-gateway" target="_blank" rel="noopener noreferrer">documentation</a>.
      </p>
{{#let (filter (filter-predicate 'service' filters) gatewayServices) as |filtered|}}
  {{#let (sort-by (comparator 'service' sort) filtered) as |sorted|}}
      <ChangeableSet @dispatcher={{searchable 'service' sorted}} @terms={{search}}>
        <BlockSlot @name="set" as |searched|>
          <Consul::Upstream::List
            @items={{searched}}
            @dc={{dc}}
            @nspace={{nspace}}
          />
        </BlockSlot>
        <BlockSlot @name="empty">
          <EmptyState>
            <BlockSlot @name="body">
              <p>
                There are no upstreams.
              </p>
            </BlockSlot>
          </EmptyState>
        </BlockSlot>
      </ChangeableSet>
  {{/let}}
{{/let}}
  {{/let}}
{{/let}}
  </div>
</div>