<div class="pod-header">
  <div class="resource-actions">
    <button type="button" class="btn-circle-menu"></button>
  </div>

  <div class="pod-state {{stateBackground}}"><span>{{model.displayState}}</span></div>
  <div class="pod-icon"><i class="icon icon-lg {{model.stateIcon}} {{iconColor}}"></i></div>
  <div class="pod-name">
    {{#link-to "service" model.environmentId model.id}}{{model.displayName}}{{/link-to}}
    {{#if model.showTransitioningMessage}}
      <div class="pod-message {{if model.isError 'text-danger' 'text-muted'}}">
        {{model.transitioningMessage}}
      </div>
    {{/if}}
  </div>
</div>

{{#if (or model.consumedServicesWithNames.length model.hostname model.externalIpAddresses.length)}}
  <div class="pod-info clearfix">
    <div class="pod-info-line">
      {{#each model.consumedServicesWithNames as |map|}}
        <div class="pod-info-item">
          {{#link-to "service" map.service.environmentId map.service.id}}
            <i class="{{map.service.activeIcon}}"></i>
            {{#unless (and map.service (eq map.service.environmentId model.environmentId))~}}
              {{map.service.displayEnvironment}}/
            {{~/unless~}}
            {{~#if (eq map.name map.service.displayName)~}}
              {{~map.name~}}
            {{~else~}}
              {{~map.service.displayName}}{{#if map.name}} <span class="text-muted">(as {{map.name}})</span>{{/if}}
            {{~/if~}}
          {{/link-to}}
        </div>
      {{/each}}
    </div>
    {{#if model.hostname}}
      <div class="pod-info-line">
        <div class="pod-info-item"><i class="icon icon-link"></i> {{model.hostname}}</div>
      </div>
    {{/if}}
    {{#if model.externalIpAddresses.length}}
      {{#each model.externalIpAddresses as |ip|}}
        <div class="pod-info-line">
          <div class="pod-info-item"><i class="icon icon-link"></i> {{ip}}</div>
        </div>
      {{/each}}
    {{/if}}
  </div>
{{/if}}

{{#if hasContainers}}
  <div class="clearfix {{if (eq mode "dot") 'r-p5'}}">
    {{#if (eq mode "dot")}}
      {{#each arrangedInstances as |item|}}
        {{container-dot model=item}}
      {{else}}
        {{partial "service/no-containers"}}
      {{/each}}
    {{else}}
      {{#if (eq mode "grouped")}}
        {{#each groupedInstances as |group|}}
          {{#each group.instances as |item|}}
            {{container-subpod model=item.main stripProject=true children=item.children groupHasChildren=hasChildren}}
          {{/each}}
        {{else}}
          {{partial "service/no-containers"}}
        {{/each}}
        {{#if model.showScaleUp}}
          {{add-subpod action=(action "scaleUp" target=model) label="Scale Up" groupHasChildren=hasChildren}}
        {{/if}}
      {{else}}
        {{#each arrangedInstances as |item|}}
          {{container-subpod model=item stripProject=true}}
        {{else}}
          {{partial "service/no-containers"}}
        {{/each}}
        {{#if model.showScaleUp}}
          {{add-subpod action=(action "scaleUp" target=model) label="Scale Up"}}
        {{/if}}
      {{/if}}
    {{/if}}
  </div>
{{else}}
  {{#if isInactive}}
    <div class="text-center text-muted" style="margin: 20px 0">
      Inactive.
      <a class="hand" {{action "activate" target=model}}>Start</a>
    </div>
  {{/if}}
{{/if}}
