<form class="d-flex user-role-editor" [formGroup]="formGroup" (ngSubmit)="formSubmit()">
	<mat-form-field class="roles-width-80">
		<mat-select formControlName="appRoles" multiple required>
			<mat-option *ngFor="let role of getPrincipalAppRoleValues()" [value]="role">{{getPrincipalAppRoleWithLanguage(role)}}</mat-option>
		</mat-select>
		<mat-error *ngIf="getFormControl('appRoles').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
	</mat-form-field>

	<button *ngIf="!this.nowEditing" mat-icon-button color="primary" type="button" (click)="editItem()">
		<mat-icon class="mat-24">edit</mat-icon>
	</button>
	<button *ngIf="this.nowEditing" mat-icon-button color="primary" type="submit">
		<mat-icon class="mat-24">save</mat-icon>
	</button>
</form>
