<form appFormSubmit (ngSubmit)="objectController.actionCallback(primaryAction)"
      *ngIf="object" [formGroup]="rbacForm"
      layoutDirection="column" class="fl-content fl-content-min-height">
  <!--suppress JSUnusedGlobalSymbols -->
  <app-form-errors #formErrors [formGroup]="rbacForm"></app-form-errors>

  <mat-radio-group *ngIf="!object.id" layoutDirection="column" (ngModelChange)="changeDestination($event)"
                   [(ngModel)]="createInClientProject" [ngModelOptions]="{standalone: true}">
    <mat-radio-button [color]="'primary'" [value]="false" i18n>
      Create RBAC policy in admin project
    </mat-radio-button>
    <mat-radio-button [color]="'primary'" [value]="true" class="fl-margin-bottom-medium" i18n>
      Create RBAC policy in client's project
    </mat-radio-button>
  </mat-radio-group>

  <ng-container *ngIf="!object.id && createInClientProject === true">
    <app-client-autocomplete [control]="clientControl" clientsWithEnabledProject></app-client-autocomplete>
  </ng-container>

  <app-autocomplete [control]="rbacForm.controls.target_project"
                    [placeholderUnselected]="projectUnselectedPlaceholder"
                    [placeholderSelected]="projectSelectedPlaceholder"
                    [switchMapHandler]="projectOptionsSwitchMap"></app-autocomplete>

  <mat-form-field>
    <mat-label i18n>Action</mat-label>
    <mat-select formControlName="action" placeholder="Action" i18n-placeholder>
      <mat-option *ngFor="let action of createOptions.action" [value]="action.value">
        {{ action.display }}
      </mat-option>
    </mat-select>
    <mat-error i18n>{{ rbacForm.controls.action.errors | errorFormatter }}</mat-error>
  </mat-form-field>

  <mat-form-field>
    <mat-label i18n>Object type</mat-label>
    <mat-select formControlName="object_type" placeholder="Object type" i18n-placeholder>
      <mat-option *ngFor="let objectType of createOptions.object_type" [value]="objectType.value">
        {{ objectType.display }}
      </mat-option>
    </mat-select>
    <mat-error i18n>{{ rbacForm.controls.object_type.errors | errorFormatter }}</mat-error>
  </mat-form-field>

  <div *ngIf="rbacForm.controls.object_type.value === 'network'">
    <app-autocomplete [control]="rbacForm.controls.object_id"
                      [placeholderUnselected]="networkUnselectedPlaceholder"
                      [displayFn]="networkDisplay"
                      [switchMapHandler]="networkOptionsSwitchMap"
                      [placeholderSelected]="networkSelectedPlaceholder"></app-autocomplete>
  </div>
  <div *ngIf="rbacForm.controls.object_type.value === 'subnetpool'">
    <app-autocomplete [control]="rbacForm.controls.object_id"
                      [displayFn]="subnetPoolDisplay"
                      [switchMapHandler]="subnetPoolOptionsSwitchMap"
                      [placeholderUnselected]="subnetPoolUnselectedPlaceholder"
                      [placeholderSelected]="subnetPoolSelectedPlaceholder"></app-autocomplete>
  </div>
  <div *ngIf="rbacForm.controls.object_type.value === 'security-group'">
    <app-autocomplete [control]="rbacForm.controls.object_id"
                      [placeholderUnselected]="securityGroupUnselectedPlaceholder"
                      [displayFn]="securityGroupDisplay"
                      [switchMapHandler]="securityGroupOptionsSwitchMap"
                      [placeholderSelected]="securityGroupSelectedPlaceholder"></app-autocomplete>
  </div>

</form>
