fix: do not filter attributes with empy value

Implicit filtering of attributes with empty values from table was removed.
It was added as an filtering option that can be toggled on/off.

Author: bodnara

apps/admin-gui/src/app/shared/components/dialogs/create-attribute-dialog/create-attribute-dialog.component.html

@@ -21,7 +21,6 @@ <h1 class="page-subtitle">{{'DIALOGS.CREATE_ATTRIBUTE.SET_NEW' | translate}}</h1
         [emptyListText]="'SHARED_LIB.PERUN.COMPONENTS.ATTRIBUTES_LIST.EMPTY_ATTRIBUTES'"
         [attributes]="attributes"
         [filterValue]="filterValue"
-        [inDialog]="true"
         [selection]="selected"
         [tableId]="tableId">
       </perun-web-apps-attributes-list>

apps/admin-gui/src/app/shared/components/one-entity-attribute-page/one-entity-attribute-page.component.html

@@ -5,40 +5,44 @@
   color="accent"
   data-cy="add-attributes"
   mat-flat-button>
-  {{'USER_DETAIL.SETTINGS.ATTRIBUTES.CREATE' | translate}}
+  {{'ATTRIBUTE_PAGE.CREATE' | translate}}
 </button>
-
 <button
   (click)="onSave()"
   class="me-2"
   color="accent"
   [disabled]="selection.selected.length === 0"
   mat-flat-button>
-  {{'USER_DETAIL.SETTINGS.ATTRIBUTES.SAVE' | translate}}
+  {{'ATTRIBUTE_PAGE.SAVE' | translate}}
 </button>
-
 <button
   (click)="onDelete()"
   [disabled]="selection.selected.length === 0"
   class="me-2"
   color="warn"
   data-cy="remove-attributes"
   mat-flat-button>
-  {{'USER_DETAIL.SETTINGS.ATTRIBUTES.DELETE' | translate}}
+  {{'ATTRIBUTE_PAGE.DELETE' | translate}}
 </button>
 <perun-web-apps-debounce-filter
   (filter)="applyFilter($event)"
-  [placeholder]="'SHARED_LIB.PERUN.COMPONENTS.ATTRIBUTES_LIST.FILTER'"></perun-web-apps-debounce-filter>
+  [placeholder]="'ATTRIBUTE_PAGE.FILTER'"
+  class="me-2">
+</perun-web-apps-debounce-filter>
+<mat-slide-toggle [(ngModel)]="filterEmpty" labelPosition="before">
+  {{'ATTRIBUTE_PAGE.FILTER_EMPTY' | translate}}
+</mat-slide-toggle>
 
 <ng-template #spinner>
   <perun-web-apps-loading-table></perun-web-apps-loading-table>
 </ng-template>
 <div class="position-relative">
   <perun-web-apps-attributes-list
+    #list
     *perunWebAppsLoader="loading; indicator: spinner"
     [attributes]="attributes"
-    #list
     [filterValue]="filterValue"
+    [filterEmpty]="filterEmpty"
     [selection]="selection"
     [tableId]="tableId">
   </perun-web-apps-attributes-list>

apps/admin-gui/src/app/shared/components/one-entity-attribute-page/one-entity-attribute-page.component.ts

@@ -15,15 +15,13 @@ import { TABLE_ATTRIBUTES_SETTINGS } from '@perun-web-apps/config/table-config';
   styleUrls: ['./one-entity-attribute-page.component.css'],
 })
 export class OneEntityAttributePageComponent implements OnInit {
-  @Input()
-  entity: string;
-  @Input()
-  entityId: number;
-  @ViewChild('list')
-  list: AttributesListComponent;
+  @Input() entity: string;
+  @Input() entityId: number;
+  @ViewChild('list') list: AttributesListComponent;
   attributes: Attribute[] = [];
   selection = new SelectionModel<Attribute>(true, []);
   filterValue = '';
+  filterEmpty = true;
   tableId = TABLE_ATTRIBUTES_SETTINGS;
   loading = false;
 

apps/admin-gui/src/app/shared/components/two-entity-attribute-page/two-entity-attribute-page.component.html

@@ -49,7 +49,7 @@
       class="me-2 action-button"
       color="accent"
       mat-flat-button>
-      {{'MEMBER_DETAIL.SETTINGS.ATTRIBUTES.CREATE' | translate}}
+      {{'ATTRIBUTE_PAGE.CREATE' | translate}}
     </button>
 
     <button
@@ -58,7 +58,7 @@
       color="accent"
       [disabled]="selection.selected.length === 0"
       mat-flat-button>
-      {{'MEMBER_DETAIL.SETTINGS.ATTRIBUTES.SAVE' | translate}}
+      {{'ATTRIBUTE_PAGE.SAVE' | translate}}
     </button>
 
     <button
@@ -67,11 +67,16 @@
       [disabled]="selection.selected.length === 0"
       class="me-2"
       mat-flat-button>
-      {{'MEMBER_DETAIL.SETTINGS.ATTRIBUTES.DELETE' | translate}}
+      {{'ATTRIBUTE_PAGE.DELETE' | translate}}
     </button>
     <perun-web-apps-debounce-filter
       (filter)="applyFilter($event)"
-      [placeholder]="'SHARED_LIB.PERUN.COMPONENTS.ATTRIBUTES_LIST.FILTER'"></perun-web-apps-debounce-filter>
+      [placeholder]="'ATTRIBUTE_PAGE.FILTER'"
+      class="me-2">
+    </perun-web-apps-debounce-filter>
+    <mat-slide-toggle [(ngModel)]="filterEmpty" labelPosition="before">
+      {{'ATTRIBUTE_PAGE.FILTER_EMPTY' | translate}}
+    </mat-slide-toggle>
     <ng-template #spinner>
       <perun-web-apps-loading-table></perun-web-apps-loading-table>
     </ng-template>
@@ -81,6 +86,7 @@
         *perunWebAppsLoader="innerLoading; indicator: spinner"
         [attributes]="attributes"
         [filterValue]="filterValue"
+        [filterEmpty]="filterEmpty"
         [selection]="selection">
       </perun-web-apps-attributes-list>
     </div>

apps/admin-gui/src/app/shared/components/two-entity-attribute-page/two-entity-attribute-page.component.ts

@@ -28,14 +28,10 @@ import { GroupWithStatus, ResourceWithStatus } from '@perun-web-apps/perun/model
   styleUrls: ['./two-entity-attribute-page.component.scss'],
 })
 export class TwoEntityAttributePageComponent implements OnInit {
-  @ViewChild('list')
-  list: AttributesListComponent;
-  @Input()
-  firstEntityId: number;
-  @Input()
-  firstEntity: string;
-  @Input()
-  secondEntity: string;
+  @ViewChild('list') list: AttributesListComponent;
+  @Input() firstEntityId: number;
+  @Input() firstEntity: string;
+  @Input() secondEntity: string;
   entityValues: Resource[] | Facility[] | Group[] | RichMember[] | User[] = [];
   attributes: Attribute[] = [];
   selection = new SelectionModel<Attribute>(true, []);
@@ -44,6 +40,7 @@ export class TwoEntityAttributePageComponent implements OnInit {
   loading = false;
   innerLoading = false;
   filterValue = '';
+  filterEmpty = true;
   noEntityMessage: string;
 
   constructor(

apps/admin-gui/src/assets/i18n/en.json

@@ -2696,6 +2696,13 @@
       "FILTER": "Filter by name, id or description"
     }
   },
+  "ATTRIBUTE_PAGE": {
+    "CREATE": "Create",
+    "SAVE": "Save",
+    "DELETE": "Delete",
+    "FILTER": "Filter attributes by Id, name, value or description",
+    "FILTER_EMPTY": "Filter empty attributes"
+  },
   "SHARED": {
     "COMPONENTS": {
       "RESOURCES_TAGS_LIST": {

libs/perun/components/src/lib/attributes-list/attributes-list.component.ts

@@ -35,8 +35,8 @@ export class AttributesListComponent implements OnChanges, AfterViewInit {
   @Input() attributes: Attribute[] = [];
   @Input() selection = new SelectionModel<Attribute>(true, []);
   @Input() displayedColumns: string[] = ['select', 'id', 'displayName', 'value', 'description'];
-  @Input() inDialog = false;
   @Input() filterValue = '';
+  @Input() filterEmpty = false;
   @Input() tableId: string;
   @Input() readonly = false;
   @Input() hiddenColumns: string[] = [];
@@ -82,15 +82,17 @@ export class AttributesListComponent implements OnChanges, AfterViewInit {
       this.displayedColumns = this.displayedColumns.filter((column) => column !== 'id');
     }
 
-    const attributesWithoutEmptyObjects = this.attributes.filter((attribute) => {
-      if (typeof attribute.value === 'object') {
-        return Object.keys((attribute.value ?? '') as object).length > 0;
-      }
-      return true;
-    });
-
-    const filteredAttributes = filterCoreAttributes(attributesWithoutEmptyObjects);
+    let filteredAttributes = this.attributes;
+    if (this.filterEmpty) {
+      filteredAttributes = filteredAttributes.filter((attribute) => {
+        if (typeof attribute.value === 'object') {
+          return Object.keys((attribute.value ?? '') as object).length > 0;
+        }
+        return true;
+      });
+    }
 
+    filteredAttributes = filterCoreAttributes(filteredAttributes);
     this.dataSource = new MatTableDataSource<Attribute>(filteredAttributes);
     this.setDataSource();
   }