<app-common-dialog [dialogContent]="dialogContent" [dialogRef]="dialogRef">
  <ng-template #dialogContent>
    <form appFormSubmit (ngSubmit)="createOrUpdate()" [formGroup]="restoreBackupForm">
      <app-form-errors #formErrors [formGroup]="restoreBackupForm"></app-form-errors>
      <mat-checkbox formControlName="newVolume" color="primary" (change)="changedNewVolume()" i18n>
        Restore to a new volume
      </mat-checkbox>
      <mat-form-field *ngIf="restoreBackupForm.controls.newVolume.value" class="full-width">
        <mat-label i18n>New volume name</mat-label>
        <input matInput placeholder="New volume name" i18n-placeholder type="text" formControlName="name" required>
        <mat-error i18n>{{backendErrors['name'] | fieldRequired }}</mat-error>
      </mat-form-field>
      <app-autocomplete *ngIf="!restoreBackupForm.controls.newVolume.value"
                        [control]="restoreBackupForm.controls.volume"
                        [placeholderSelected]="volumeSelectedPlaceholder"
                        [placeholderUnselected]="volumeUnselectedPlaceholder"
                        [switchMapHandler]="volumesSwitchMapHandler"
                        [displayFn]="volumeDisplay"></app-autocomplete>

    </form>
  </ng-template>
</app-common-dialog>
