member_webapp/@overflow/infra/component/infra-map.component.html

<div class="ui-g">
  <h1>Map</h1>
  <div class="ui-g-12 ui-g-nopad">
    <div class="ui-g">
      <div class="ui-g-12 ui-md-5 ui-g-nopad ui-bottom-space-10">
        <button pButton type="button" class="ui-button-large ui-button-width-fit" icon="ui-icon-play-arrow" label="Discovery" (click)="discovery.emit()"></button>
      </div>
      <div class="ui-g-12 ui-md-7 ui-g-nopad">
        <div style="float: right;">
          <button pButton type="button" class="ui-button-secondary ui-button-width-fit" label="Expand all" style="margin-top: 16px;"
            (click)="expandAll()"></button>
          <button pButton type="button" class="ui-button-secondary ui-button-width-fit" label="Collapse all" style="margin-top: 16px;"
            (click)="collapseAll()"></button>
        </div>
        <div style="float: right; margin: 30px 15px 0 0;">
          <i class="fa ui-icon-stop ui-status-icon ui-status-success"></i>Up
          <i class="fa ui-icon-stop ui-status-icon ui-status-fatal"></i>Down
          <i class="fa ui-icon-stop ui-status-icon ui-status-warn"></i>Warn
          <i class="fa ui-icon-stop ui-status-icon ui-status-error"></i>Error
        </div>
      </div>
    </div>

    <of-block-progressbar [target]="content" [pending]="pending$ | async"></of-block-progressbar>
    <p-panel #content [showHeader]="false" class="block-panel">
      <p-tabView (onChange)="onProbeChange($event)" [activeIndex]="probeTabIdx" class="ui-tab-bgcolor">
        <p-tabPanel [header]="item.label" *ngFor="let item of tabs; let i = index" [selected]="i == 0" cache="true">
          <ng-template pTemplate="content">
            <div>
              <of-infra-tree [probeHost]="selectedProbeHost"></of-infra-tree>
            </div>
          </ng-template>
        </p-tabPanel>
      </p-tabView>
    </p-panel>
  </div>