<page-header ng-if="ctrl.state.viewReady" title="'Cluster'" breadcrumbs="['Cluster information']" reload="true"></page-header>

<kubernetes-view-loading view-ready="ctrl.state.viewReady"></kubernetes-view-loading>

<div ng-if="ctrl.state.viewReady">
  <div class="row" ng-if="ctrl.isAdmin">
    <div class="col-sm-12">
      <rd-widget>
        <rd-widget-body>
          <!-- resource-reservation -->
          <form class="form-horizontal" ng-if="ctrl.resourceReservation">
            <kubernetes-resource-reservation
              description="Resource reservation represents the total amount of resource assigned to all the applications inside the cluster."
              cpu-reservation="ctrl.resourceReservation.CPU"
              cpu-limit="ctrl.CPULimit"
              memory-reservation="ctrl.resourceReservation.Memory"
              memory-limit="ctrl.MemoryLimit"
              display-usage="ctrl.hasResourceUsageAccess()"
              cpu-usage="ctrl.resourceUsage.CPU"
              memory-usage="ctrl.resourceUsage.Memory"
            >
            </kubernetes-resource-reservation>
          </form>
          <!-- !resource-reservation -->

          <!-- leader-status -->
          <div ng-if="ctrl.systemEndpoints.length > 0">
            <div class="col-sm-12 form-section-title"> Leader status </div>

            <table class="table">
              <tbody>
                <tr class="text-muted">
                  <td style="border-top: none; width: 25%">Component</td>
                  <td style="border-top: none; width: 25%">Leader node</td>
                </tr>
                <tr ng-repeat="ep in ctrl.systemEndpoints">
                  <td style="width: 25%">
                    {{ ep.Name }}
                  </td>
                  <td style="width: 25%">
                    {{ ep.HolderIdentity }}
                  </td>
                </tr>
              </tbody>
            </table>
          </div>
          <!-- !leader-status -->
        </rd-widget-body>
      </rd-widget>
    </div>
  </div>

  <div class="row">
    <kube-nodes-datatable></kube-nodes-datatable>
  </div>
</div>
