<div layout="row" ng-if="group.kind != 'grouping'">
  <div>
    <!-- Default box display -->
      <div layout="row" class="group-item" ng-repeat="(groupType, data) in group | groupBy: 'metadata.labels.type'">
        <!-- left image -->
        <div class="icon-area">
          <div class="group-icon" style="background-color: {{getGroupColor(groupType)}}"></div>
        </div>
        <!-- right area -->
        <div class="group-main-area" layout="column">
          <!-- type -->
          <div class="subtype">
            {{groupType | ucfirst}}s
          </div>
          <!-- links -->
          <div layout="row" layout-wrap>
            <div layout="row" ng-repeat="item in data">
              <!-- title -->
              <div ng-switch on='item.metadata.labels["type"]'>
                <div class="group-name">
                  <a ng-switch-when='pod' ng-href="#/dashboard/pods/{{ item.metadata.name }}">{{ item.metadata.name }}</a>
                  <a ng-switch-when='service' ng-href="#/dashboard/services/{{ item.metadata.name }}">{{ item.metadata.name }}</a>
                  <a ng-switch-when='replicationController' ng-href="#/dashboard/replicationcontrollers/{{ item.metadata.name }}">{{ item.metadata.name }}</a>
                  <div ng-switch-default>{{item.metadata.name}}</div>
                </div>
              </div>

              <div class="selectFilter">
                <md-select ng-model="selectedFilter" ng-change="changeFilterBy(selectedFilter)">
                  <md-optgroup label="FILTER">
                    <md-option ng-value="'{{key | uriComponentEncode}}={{value | uriComponentEncode}}'" ng-repeat="(key, value) in item.metadata.labels">{{key}}: {{value}}</md-option>
                    </md-option-group>
                  </md-optgroup>
                </md-select>
              </div>


              <!-- This is the official button design, but requires a custom dialog. Fix up after the demo. -->
              <!-- <md-button ng-click="" class="filter-button" style="padding:0">
                <md-icon md-svg-src="components/dashboard/img/icons/ic_arrow_drop_down_18px.svg" class="filter-icon" aria-label="" alt="Filter"></md-icon>
              </md-button> -->
            </div>
          </div>
        </div>
      </div>
  </div>
</div>
