<div class="fl-content fl-content-min-height">
  <app-fl-backdrop *ngIf="loadingQuotas" i18n></app-fl-backdrop>
  <form appFormSubmit (ngSubmit)="objectController.actionCallback(primaryAction)"
        [formGroup]="computeQuotasForm" layoutDirection="column" [class.hide]="!quotasAvailable">
    <!--suppress JSUnusedGlobalSymbols -->
    <app-form-errors #formErrors [formGroup]="computeQuotasForm"></app-form-errors>
    <p class="fl-detail fl-margin-bottom-small" i18n>Set the desired quota values. Use -1 for unlimited.</p>
    <p *ngIf="computeQuotasForm.controls.force.value"
       class="fl-detail fl-margin-bottom-small fl-red-color" i18n>
      Forces the update even if the quota has already been used and the reserved quota exceeds the new quota.
    </p>
    <mat-form-field>
      <mat-label i18n>Instances</mat-label>
      <input matInput placeholder="Instances" i18n-placeholder type="number" formControlName="instances"
             required>
      <mat-error>{{fieldErrors['instances']}}</mat-error>
    </mat-form-field>
    <mat-form-field>
      <mat-label i18n>VCPUs</mat-label>
      <input matInput placeholder="VCPUs" i18n-placeholder type="number" formControlName="cores"
             required>
      <mat-error>{{fieldErrors['cores']}}</mat-error>
    </mat-form-field>
    <mat-form-field>
      <mat-label i18n>Key pairs</mat-label>
      <input matInput placeholder="Key pairs" i18n-placeholder type="number" formControlName="key_pairs"
             required>
      <mat-error>{{fieldErrors['key_pairs']}}</mat-error>
    </mat-form-field>
    <mat-form-field>
      <mat-label i18n>Metadata items</mat-label>
      <input matInput placeholder="Metadata items" i18n-placeholder type="number" formControlName="metadata_items"
             required>
      <mat-error>{{fieldErrors['metadata_items']}}</mat-error>
    </mat-form-field>
    <mat-form-field>
      <mat-label i18n>RAM(MB)</mat-label>
      <input matInput placeholder="RAM(MB)" i18n-placeholder type="number" formControlName="ram"
             required>
      <mat-error>{{fieldErrors['ram']}}</mat-error>
    </mat-form-field>
    <mat-form-field>
      <mat-label i18n>Server groups</mat-label>
      <input matInput placeholder="Server groups" i18n-placeholder type="number" formControlName="server_groups"
             required>
      <mat-error>{{fieldErrors['server_groups']}}</mat-error>
    </mat-form-field>
    <mat-form-field>
      <mat-label i18n>Server group members</mat-label>
      <input matInput placeholder="Server group members" i18n-placeholder type="number"
             formControlName="server_group_members" required>
      <mat-error>{{fieldErrors['server_group_members']}}</mat-error>
    </mat-form-field>
    <mat-checkbox color="primary" formControlName="force">Force update</mat-checkbox>
    <mat-checkbox class="fl-margin-bottom" color="primary" formControlName="set_for_all_regions" i18n>Set for all regions
    </mat-checkbox>
  </form>
  <ng-container *ngIf="!quotasAvailable">
    <p class="fl-detail text-center" i18n>Unable to load compute quotas for region {{selectedRegion}}</p>
  </ng-container>
</div>
