Merge branch 'fix/update-pia-lib-version' into main

src/_mixins.scss

@@ -15,6 +15,30 @@
   }
 }
 
+@mixin compact-dropdown-list-items {
+  :host ::ng-deep {
+    .p-dropdown-items .p-dropdown-item {
+      padding: 0.4rem 1rem;
+    }
+  }
+}
+
+@mixin invisible {
+  :host ::ng-deep {
+    .invisible {
+      visibility: hidden;
+    }
+  }
+}
+
+@mixin danger-action {
+  :host ::ng-deep {
+    .danger-action-text {
+      color: var(--danger-button-bg);
+    }
+  }
+}
+
 @mixin prepare-inputgroup {
   :host ::ng-deep {
     .inputgroup-dropdown-with-link {

src/app/permission/app-detail/app-detail.component.html

@@ -99,7 +99,6 @@
             <p-button
               id="app_detail_permission_table_reload_button"
               styleClass="h-full"
-              [disabled]="!permissionRows"
               [title]="'ACTIONS.SEARCH.RELOAD' | translate"
               (onClick)="onReload()"
               icon="pi pi-refresh"
@@ -327,26 +326,26 @@
           <tr [id]="'app_detail_permission_table_row_' + row">
             <td
               id="app_detail_permission_table_data_permission_key"
-              class="text-left py-1 px-2 white-space-nowrap sm:white-space-normal"
+              class="text-left p-2 white-space-nowrap sm:white-space-normal"
               [title]="rowData.description ? rowData.description : ''"
             >
               <strong>{{ rowData.resource }} </strong>#
               <strong>{{ rowData.action }} </strong>
               <div class="mt-1 text-xs">{{ limitText(rowData.description, 60) }}</div>
             </td>
-            <td id="app_detail_permission_table_data_product_name" class="text-left px-2">
+            <td id="app_detail_permission_table_data_product_name" class="text-left p-2">
               <div *ngIf="currentApp.isApp">{{ rowData.productName }}</div>
               <div *ngIf="!currentApp.isApp">{{ rowData.productDisplayName }}</div>
               <div *ngIf="!currentApp.isApp" class="mt-1 text-xs">{{ rowData.productName }}</div>
             </td>
-            <td id="app_detail_permission_table_data_app_id" class="text-left px-2 border-right-primary">
+            <td id="app_detail_permission_table_data_app_id" class="text-left p-2 border-right-primary">
               <div>{{ rowData.appDisplayName }}</div>
               <div *ngIf="!currentApp.isApp" class="mt-1 text-xs">{{ rowData.appId }}</div>
             </td>
             <!-- ASSIGNMENTS -->
             <td
               *ngFor="let role of columns"
-              class="text-center"
+              class="text-center p-2"
               [id]="'app_detail_permission_table_data_' + role.name + '_' + rowData.key"
             >
               <!-- display only -->

src/app/permission/app-detail/app-detail.component.scss

@@ -2,6 +2,7 @@
 
 @include correct-data-view-control;
 @include table-inline-buttons;
+@include compact-dropdown-list-items;
 
 :host ::ng-deep {
   .p-datatable .p-datatable-header {
@@ -25,10 +26,6 @@
     border-left: 0;
     border-right: 0;
   }
-  .p-dropdown-panel .p-dropdown-items .p-dropdown-item {
-    padding-top: 0.5rem;
-    padding-bottom: 0.5rem;
-  }
   .p-dropdown {
     &.clear-icon-used .p-inputtext {
       padding-right: 2rem;

src/app/permission/app-detail/app-detail.component.ts

@@ -375,7 +375,10 @@ export class AppDetailComponent implements OnInit, OnDestroy {
    * FILTER
    */
   private prepareFilterProducts() {
-    if (this.currentApp.isApp) return
+    if (this.currentApp.isApp) {
+      this.filterProductItems = []
+      return
+    }
     this.filterProductItems = [{ label: '', value: null } as SelectItem]
     if (this.currentApp.workspaceDetails?.products) {
       this.currentApp.workspaceDetails?.products.map((product) => {
@@ -386,10 +389,13 @@ export class AppDetailComponent implements OnInit, OnDestroy {
   }
 
   private prepareFilterApps() {
-    if (this.currentApp.isApp) return
+    if (this.currentApp.isApp) {
+      this.filterAppItems = []
+      return
+    }
     // 1. collect apps registered in workspace
     this.workspaceApps = []
-    if (this.currentApp.workspaceDetails?.products) {
+    if (this.currentApp.workspaceDetails?.products && this.currentApp.workspaceDetails?.products.length > 0) {
       this.currentApp.workspaceDetails?.products.map((product) => {
         if (product.mfe)
           product.mfe.map((a) => {
@@ -401,19 +407,20 @@ export class AppDetailComponent implements OnInit, OnDestroy {
           })
       })
     }
-
     // 2. fill app filter with apps which have permissions
-    this.filterAppItems = [{ label: '', value: null } as SelectItem]
-    this.permissions.map((p) => {
-      // get the app name from workspace apps - needed for label
-      const app = this.workspaceApps.filter((a) => a.productName === p.productName && a.appId === p.appId)
-      if (
-        app.length === 1 &&
-        this.filterAppItems.filter((item) => item.label === app[0].name && item.value === app[0].appId).length === 0
-      ) {
-        this.filterAppItems.push({ label: app[0].name, value: app[0].appId } as SelectItem)
-      }
-    })
+    this.filterAppItems = [{ label: '', value: null } as SelectItem] // empty item
+    if (this.permissions.length > 0 && this.workspaceApps.length > 0)
+      this.permissions.map((p) => {
+        // get the app name from workspace apps - needed for label
+        const app = this.workspaceApps.filter((a) => a.productName === p.productName && a.appId === p.appId)
+        if (app.length > 0)
+          if (
+            app.length === 1 &&
+            this.filterAppItems.filter((item) => item.label === app[0].name && item.value === app[0].appId).length === 0
+          ) {
+            this.filterAppItems.push({ label: app[0].name, value: app[0].appId } as SelectItem)
+          }
+      })
   }
 
   /* 1. Prepare rows of the table: permissions of the <application> as Map
@@ -425,18 +432,24 @@ export class AppDetailComponent implements OnInit, OnDestroy {
       console.warn('No permissions found for the apps - stop processing')
       return
     }
-    // go on
     this.permissionRows = []
     for (const permission of this.permissions) {
+      const products = this.filterProductItems.filter((p) => p.value === permission.productName)
+      const apps = this.filterAppItems.filter((p) => p.value === permission.appId)
       this.permissionRows.push({
         ...permission,
         key: permission.resource + '#' + permission.action,
         productDisplayName: this.currentApp.isApp
           ? permission.productName
-          : this.filterProductItems.filter((p) => p.value === permission.productName)[0].label,
-        appDisplayName: this.currentApp.isApp
-          ? permission.appId
-          : this.filterAppItems.filter((p) => p.value === permission.appId)[0].label,
+          : products.length > 0
+          ? products[0].label
+          : permission.productName,
+        appDisplayName:
+          this.currentApp.isApp || this.filterAppItems.length < 2
+            ? permission.appId
+            : apps.length > 0
+            ? apps[0].label
+            : permission.appId,
         roles: {}
       } as PermissionViewRow)
     }
@@ -448,7 +461,7 @@ export class AppDetailComponent implements OnInit, OnDestroy {
     const appList: string[] = []
     if (this.currentApp.isApp) appList.push(this.currentApp.appId ?? '')
     else if (this.workspaceApps.length === 0) {
-      console.warn('No workspace apps found - stop processing')
+      console.warn('No workspace apps found on workspace - stop loading assignments')
       return
     } else
       this.workspaceApps.map((app) => {
@@ -690,14 +703,19 @@ export class AppDetailComponent implements OnInit, OnDestroy {
   }
 
   private sortPermissionRowByAppIdAsc(a: PermissionViewRow, b: PermissionViewRow): number {
-    return (a.appId ? a.appId.toUpperCase() : '').localeCompare(b.appId ? b.appId.toUpperCase() : '')
+    return (
+      (a.appId ? a.appId.toUpperCase() : '').localeCompare(b.appId ? b.appId.toUpperCase() : '') ||
+      a.key.localeCompare(b.key)
+    )
   }
   private sortPermissionRowByAppIdDesc(a: PermissionViewRow, b: PermissionViewRow): number {
     return (b.appId ? b.appId.toUpperCase() : '').localeCompare(a.appId ? a.appId.toUpperCase() : '')
   }
   private sortPermissionRowByProductAsc(a: PermissionViewRow, b: PermissionViewRow): number {
-    return (a.productName ? a.productName.toUpperCase() : '').localeCompare(
-      b.productName ? b.productName.toUpperCase() : ''
+    return (
+      (a.productName ? a.productName.toUpperCase() : '').localeCompare(
+        b.productName ? b.productName.toUpperCase() : ''
+      ) || a.key.localeCompare(b.key)
     )
   }
   private sortPermissionRowByProductDesc(b: PermissionViewRow, a: PermissionViewRow): number {

src/app/permission/app-search/app-search.component.html

@@ -94,10 +94,10 @@
               (click)="onAppClick($event, app)"
             >
               <div
-                class="h-2rem lg:h-3rem flex flex-column justify-content-between md:gap-1 lg:gap-2 amy-1 md:my-2 text-center"
+                class="h-2rem md:h-3rem lg:h-4rem flex flex-column justify-content-between gap-1 lg:gap-2 lg:py-1 text-center"
               >
-                <div class="font-bold md:text-lg lg:text-xl">{{ limitText(app.appId, 20) }}</div>
-                <div class="text-xs md:text-md lg:text-lg">{{ 'APP.TYPE_'.concat(app.appType) | translate }}</div>
+                <div class="font-bold text-base md:text-lg lg:text-xl">{{ limitText(app.appId, 20) }}</div>
+                <div class="text-xs md:text-base lg:text-md">{{ 'APP.TYPE_'.concat(app.appType) | translate }}</div>
               </div>
             </div>
           </div>

src/app/permission/app-search/app-search.component.scss

@@ -3,3 +3,9 @@
 @include correct-data-view-control;
 @include correct-search-criteria;
 @include search-criteria-select-button;
+
+@media screen and (min-width: 768px) {
+  .md\:h-2-5rem {
+    height: 2.5rem !important;
+  }
+}

src/app/permission/app-search/app-search.component.ts

@@ -20,6 +20,7 @@ import {
 export interface AppSearchCriteria {
   appId: FormControl<string | null>
   appType: FormControl<AppFilterType | null>
+  productName: FormControl<string | null>
 }
 export type App = Application & { isApp: boolean; appType: AppType }
 export type AppType = 'WORKSPACE' | 'APP'
@@ -66,7 +67,8 @@ export class AppSearchComponent implements OnInit, OnDestroy {
     // search criteria
     this.appSearchCriteriaGroup = new FormGroup<AppSearchCriteria>({
       appId: new FormControl<string | null>(null),
-      appType: new FormControl<AppFilterType | null>('WORKSPACE')
+      appType: new FormControl<AppFilterType | null>('WORKSPACE'),
+      productName: new FormControl<string | null>(null)
     })
     this.appSearchCriteriaGroup.controls['appType'].setValue('ALL') // default: all app types
     this.appTypeItems = [
@@ -110,6 +112,7 @@ export class AppSearchComponent implements OnInit, OnDestroy {
       .searchApplications({
         applicationSearchCriteria: {
           appId: this.appSearchCriteriaGroup.controls['appId'].value ?? '',
+          productName: this.appSearchCriteriaGroup.controls['productName'].value ?? '',
           pageSize: 100
         }
       })

src/assets/i18n/de.json

@@ -17,8 +17,8 @@
       "PERMISSION.TOOLTIP": "Eine neue Berechtigung erstellen",
       "ROLE": "Rolle erstellen",
       "ROLE.TOOLTIP": "Eine neue Rolle erstellen",
-      "IDM_ROLES.TOOLTIP": "IDM Rollen erstellen",
-      "WORKSPACE_ROLES.TOOLTIP": "Workspace Rollen erstellen",
+      "IDM_ROLES.TOOLTIP": "IDM Rollen auswählen damit sie hier verwendet werden können",
+      "WORKSPACE_ROLES.TOOLTIP": "Fehlende Workspace Rollen übernehmen damit sie hier verwendet werden können",
       "MESSAGE": {
         "APPLICATION_OK": "Die App wurde erfolgreich erstellt",
         "APPLICATION_NOK": "Ein Fehler ist aufgetreten. Die App wurde nicht erstellt.",