open-consul/ui/packages/consul-ui/app/components/topology-metrics/card.hbs

<a class="card"
  href={{if
   (and (env 'CONSUL_NSPACES_ENABLED') (not-eq @item.Namespace @service.Namespace))
    (href-to "nspace.dc.services.show.index" (concat '~' @item.Namespace) @item.Datacenter @item.Name)
    (href-to "dc.services.show.index" @item.Name)
  }}
  data-permission={{service/intention-permissions @item}}
  id="{{@item.Namespace}}{{@item.Name}}"
>
  <p>
    {{@item.Name}}
  </p>
  <div class="details">
  {{#if (and (env 'CONSUL_NSPACES_ENABLED') (not-eq @item.Namespace @service.Namespace))}}
    <dl class="nspace">
      <dt>
        <Tooltip>
            Namespace
        </Tooltip>
      </dt>
      <dd>
        {{@item.Namespace}}
      </dd>
    </dl>
  {{/if}}
{{#if (eq @item.Datacenter @dc)}}
  {{#let (service/health-percentage @item) as |percentage|}}
    {{#if (not-eq percentage.passing 0)}}
      <span class="passing">{{percentage.passing}}%</span>
    {{/if}}
    {{#if (not-eq percentage.warning 0)}}
      <span class="warning">{{percentage.warning}}%</span>
    {{/if}}
    {{#if (not-eq percentage.critical 0)}}
      <span class="critical">{{percentage.critical}}%</span>
    {{/if}}
  {{/let}}
{{else}}
    <dl class="health">
      <dt>
        <Tooltip>
            We are unable to determine the health status of services in remote datacenters.
        </Tooltip>
      </dt>
      <dd>
        Health
      </dd>
    </dl>
{{/if}}
  </div>
  {{#if (and @hasMetricsProvider (not-eq @service.Kind 'ingress-gateway'))}}
    {{#if (eq @type 'upstream')}}
      <TopologyMetrics::Stats
        @nspace={{or @item.Namespace 'default'}}
        @dc={{@item.Datacenter}}
        @endpoint='upstream-summary-for-service'
        @service={{@service.Service}}
        @item={{@item.Name}}
        @noMetricsReason={{@noMetricsReason}}
      />
    {{else}}
      <TopologyMetrics::Stats
        @nspace={{or @item.Namespace 'default'}}
        @dc={{@item.Datacenter}}
        @endpoint='downstream-summary-for-service'
        @service={{@service.Service}}
        @item={{@item.Name}}
        @noMetricsReason={{@noMetricsReason}}
      />
    {{/if}}
  {{/if}}
</a>