fix: add prompt on oidc rp, fix idp and login policy in console (#769)

* fix: add prompt on oidc rp

* fix: add prompt on oidc rp

* fix: translation

* fix: translation

* fix: not existing login policy

* fix: login policy

* fix: identity provider detail

* fix: idp update

* fix: idps in login policy

* fix: lint

* fix: scss

* fix: external idps on auth user detail

* fix: idp create mapping fields

* fix: remove idp provider

* fix: angular lint

* fix: login policy view

* fix: translations

console/src/app/modules/idp-create/idp-create.component.html

@@ -47,6 +47,24 @@
                     </mat-chip-list>
                 </mat-form-field>
             </div>
+            <div class="content">
+              <mat-form-field class="formfield" appearance="outline">
+                <mat-label>{{ 'IDP.IDPDISPLAYNAMMAPPING' | translate }}</mat-label>
+                <mat-select formControlName="idpDisplayNameMapping">
+                  <mat-option *ngFor="let field of mappingFields" [value]="field">
+                    {{ 'IDP.MAPPINTFIELD.'+field | translate }}
+                  </mat-option>
+                </mat-select>
+              </mat-form-field>
+              <mat-form-field class="formfield" appearance="outline">
+                <mat-label>{{ 'IDP.USERNAMEMAPPING' | translate }}</mat-label>
+                <mat-select formControlName="usernameMapping">
+                  <mat-option *ngFor="let field of mappingFields" [value]="field">
+                    {{ 'IDP.MAPPINTFIELD.'+field | translate }}
+                  </mat-option>
+                </mat-select>
+              </mat-form-field>
+            </div>
         </ng-container>
 
         <button color="primary" mat-raised-button class="continue-button" [disabled]="formGroup.invalid" type="submit">

console/src/app/modules/idp-create/idp-create.component.ts

@@ -6,12 +6,19 @@ import { MatChipInputEvent } from '@angular/material/chips';
 import { ActivatedRoute, Params, Router } from '@angular/router';
 import { Subscription } from 'rxjs';
 import { take } from 'rxjs/operators';
-import { OidcIdpConfigCreate } from 'src/app/proto/generated/admin_pb';
+import {
+  OidcIdpConfigCreate as AdminOidcIdpConfigCreate,
+  OIDCMappingField as authMappingFields,
+} from 'src/app/proto/generated/admin_pb';
 import { AdminService } from 'src/app/services/admin.service';
 import { ManagementService } from 'src/app/services/mgmt.service';
 import { ToastService } from 'src/app/services/toast.service';
 
 import { PolicyComponentServiceType } from '../policies/policy-component-types.enum';
+import {
+  OidcIdpConfigCreate as MgmtOidcIdpConfigCreate,
+  OIDCMappingField as mgmtMappingFields,
+} from '../../proto/generated/management_pb';
 
 @Component({
     selector: 'app-idp-create',
@@ -22,6 +29,7 @@ export class IdpCreateComponent implements OnInit, OnDestroy {
     public serviceType: PolicyComponentServiceType = PolicyComponentServiceType.MGMT;
     private service!: ManagementService | AdminService;
     public readonly separatorKeysCodes: number[] = [ENTER, COMMA, SPACE];
+    public mappingFields: mgmtMappingFields[] | authMappingFields[] = [];
 
     private subscription?: Subscription;
     public projectId: string = '';
@@ -43,7 +51,9 @@ export class IdpCreateComponent implements OnInit, OnDestroy {
             clientId: new FormControl('', [Validators.required]),
             clientSecret: new FormControl('', [Validators.required]),
             issuer: new FormControl('', [Validators.required]),
-            scopesList: new FormControl([], []),
+            scopesList: new FormControl(['openid', 'profile', 'email'], []),
+            idpDisplayNameMapping: new FormControl(0),
+            usernameMapping: new FormControl(0),
         });
 
         this.route.data.pipe(take(1)).subscribe(data => {
@@ -51,9 +61,15 @@ export class IdpCreateComponent implements OnInit, OnDestroy {
             switch (this.serviceType) {
                 case PolicyComponentServiceType.MGMT:
                     this.service = this.injector.get(ManagementService as Type<ManagementService>);
+                    this.mappingFields = [
+                        mgmtMappingFields.OIDCMAPPINGFIELD_PREFERRED_USERNAME,
+                        mgmtMappingFields.OIDCMAPPINGFIELD_EMAIL];
                     break;
                 case PolicyComponentServiceType.ADMIN:
                     this.service = this.injector.get(AdminService as Type<AdminService>);
+                    this.mappingFields = [
+                      authMappingFields.OIDCMAPPINGFIELD_PREFERRED_USERNAME,
+                      authMappingFields.OIDCMAPPINGFIELD_EMAIL];
                     break;
             }
         });
@@ -72,7 +88,16 @@ export class IdpCreateComponent implements OnInit, OnDestroy {
     }
 
     public addIdp(): void {
-        const req: OidcIdpConfigCreate = new OidcIdpConfigCreate();
+        let req: AdminOidcIdpConfigCreate | MgmtOidcIdpConfigCreate;
+
+        switch (this.serviceType) {
+          case PolicyComponentServiceType.MGMT:
+            req = new MgmtOidcIdpConfigCreate();
+            break;
+          case PolicyComponentServiceType.ADMIN:
+            req = new AdminOidcIdpConfigCreate();
+            break;
+        }
 
         req.setName(this.name?.value);
         req.setClientId(this.clientId?.value);
@@ -80,6 +105,8 @@ export class IdpCreateComponent implements OnInit, OnDestroy {
         req.setIssuer(this.issuer?.value);
         req.setLogoSrc(this.logoSrc?.value);
         req.setScopesList(this.scopesList?.value);
+        req.setIdpDisplayNameMapping(this.idpDisplayNameMapping?.value);
+        req.setUsernameMapping(this.usernameMapping?.value);
 
         this.service.CreateOidcIdp(req).then((idp) => {
             this.router.navigate(['idp', idp.getId()]);
@@ -135,8 +162,16 @@ export class IdpCreateComponent implements OnInit, OnDestroy {
     public get issuer(): AbstractControl | null {
         return this.formGroup.get('issuer');
     }
-
     public get scopesList(): AbstractControl | null {
-        return this.formGroup.get('scopesList');
+      return this.formGroup.get('scopesList');
     }
+
+    public get idpDisplayNameMapping(): AbstractControl | null {
+        return this.formGroup.get('idpDisplayNameMapping');
+    }
+
+    public get usernameMapping(): AbstractControl | null {
+      return this.formGroup.get('usernameMapping');
+    }
+
 }

console/src/app/modules/idp-create/idp-create.module.ts

@@ -11,6 +11,7 @@ import { TranslateModule } from '@ngx-translate/core';
 
 import { IdpCreateRoutingModule } from './idp-create-routing.module';
 import { IdpCreateComponent } from './idp-create.component';
+import {MatSelectModule} from '@angular/material/select';
 
 @NgModule({
     declarations: [IdpCreateComponent],
@@ -22,6 +23,7 @@ import { IdpCreateComponent } from './idp-create.component';
         MatInputModule,
         MatFormFieldModule,
         MatButtonModule,
+        MatSelectModule,
         MatIconModule,
         MatChipsModule,
         MatTooltipModule,