<div class="ui-g">
  <div class="ui-g-6 ui-nopad">
    <h3>General</h3>
  </div>

  <!-- info -->
  <div class="ui-g ui-bottom-space-10">
    <div class="ui-g-12 ui-nopad">
      <p-panel [showHeader]="false">
        <div *ngIf="noAuthProbe">
          <div class="ui-g">
            <div class="ui-g-12 ui-md-6 ui-key-value">
              <of-key-value [key]="'API Key'" [value]="noAuthProbe.apiKey"></of-key-value>
            </div>
            <div class="ui-g-12 ui-md-6 ui-key-value">
              <of-key-value [key]="'Created at'" [value]="noAuthProbe.createDate | date: 'dd/MM/yyyy'"></of-key-value>
            </div>
            <div class="ui-g-12 ui-md-6 ui-key-value">
              <ng-container [ngSwitch]="noAuthProbe.connectDate">
                <ng-container *ngSwitchCase="undefined">
                  <of-key-value [key]="'Connection'" [value]="'Not connected.'"></of-key-value>
                </ng-container>
                <ng-container *ngSwitchDefault>
                  <of-key-value [key]="'Connection'" [value]="noAuthProbe.connectAddress"></of-key-value>
                </ng-container>
              </ng-container>
            </div>
            <div class="ui-g-12 ui-md-6 ui-key-value">
              <of-key-value [key]="'Uptime'" [value]="'TODO'"></of-key-value>
            </div>
          </div>
        </div>
      </p-panel>
    </div>
  </div>
</div>