TSK-1786: Changed notification for empty classification filtering

Now display a message inline, instead of a popup notification

web/.prettierignore

@@ -11,3 +11,4 @@ coverage/**
 out-tsc/**
 **/*.html
 target/**
+.angular/cache/

web/src/app/administration/components/tree/tree.component.html

@@ -1,16 +1,30 @@
-<tree-root #tree [nodes]="treeNodes" [options]="options" (activate)="onActivate($event)" (deactivate)="onDeactivate($event)"
-           (moveNode)="onMoveNode($event)" (treeDrop)="onDrop($event)">
-    <ng-template #treeNodeTemplate let-node let-index="index">
-      <span class="tree__svg-icon">
-          <svg-icon
-            *ngIf="node.data.category"
-            [src]="getCategoryIcon(node.data.category).left"
-            matTooltip="{{getCategoryIcon(node.data.category).right}}">
-          </svg-icon>
-      </span>
-      <span>
-          <strong>{{ node.data.key }}</strong>
-      </span>
-      <span> - {{ node.data.name }}</span>
-    </ng-template>
+<div *ngIf="emptyTreeNodes">
+  <h3 class="grey" style="text-align: center">There are no classifications</h3>
+  <p class="grey" style="text-align: center">No Classifications match used filter "{{filter}}"
+    in category {{category}}</p>
+</div>
+<tree-root
+  #tree
+  (activate)="onActivate($event)"
+  (deactivate)="onDeactivate($event)"
+  (moveNode)="onMoveNode($event)"
+  (treeDrop)="onDrop($event)"
+  [hidden]="emptyTreeNodes"
+  [nodes]="treeNodes"
+  [options]="options"
+>
+  <ng-template #treeNodeTemplate let-index="index" let-node>
+    <span class="tree__svg-icon">
+      <svg-icon
+        *ngIf="node.data.category"
+        [src]="getCategoryIcon(node.data.category).left"
+        matTooltip="{{ getCategoryIcon(node.data.category).right }}"
+      >
+      </svg-icon>
+    </span>
+    <span>
+      <strong>{{ node.data.key }}</strong>
+    </span>
+    <span> - {{ node.data.name }}</span>
+  </ng-template>
 </tree-root>

web/src/app/administration/components/tree/tree.component.ts

@@ -41,6 +41,10 @@ export class TaskanaTreeComponent implements OnInit, AfterViewChecked, OnDestroy
   treeNodes: TreeNodeModel[];
   categoryIcons: ClassificationCategoryImages;
 
+  emptyTreeNodes = false;
+  filter: string;
+  category: string;
+
   @Input() selectNodeId: string;
   @Input() filterText: string;
   @Input() filterIcon = '';
@@ -188,6 +192,17 @@ export class TaskanaTreeComponent implements OnInit, AfterViewChecked, OnDestroy
     this.destroy$.complete();
   }
 
+  private checkNameAndKey(node: any, text: string): boolean {
+    return (
+      node.data.name.toUpperCase().includes(text.toUpperCase()) ||
+      node.data.key.toUpperCase().includes(text.toUpperCase())
+    );
+  }
+
+  private checkIcon(node: any, iconText: string): boolean {
+    return node.data.category.toUpperCase() === iconText.toUpperCase() || iconText === '';
+  }
+
   private selectNode(nodeId: string) {
     if (nodeId) {
       const selectedNode = this.getNode(nodeId);
@@ -209,26 +224,10 @@ export class TaskanaTreeComponent implements OnInit, AfterViewChecked, OnDestroy
   }
 
   private filterNodes(filterText, category) {
-    this.tree.treeModel.filterNodes(
-      (node) => TaskanaTreeComponent.checkNameAndKey(node, filterText) && TaskanaTreeComponent.checkIcon(node, category)
-    );
-    if (!this.tree.treeModel.getVisibleRoots().length) {
-      this.notificationsService.showInformation('CLASSIFICATION_FILTER_EMPTY_RESULT', {
-        filter: filterText,
-        category: category || 'ALL'
-      });
-    }
-  }
-
-  private static checkNameAndKey(node: any, text: string): boolean {
-    return (
-      node.data.name.toUpperCase().includes(text.toUpperCase()) ||
-      node.data.key.toUpperCase().includes(text.toUpperCase())
-    );
-  }
-
-  private static checkIcon(node: any, iconText: string): boolean {
-    return node.data.category.toUpperCase() === iconText.toUpperCase() || iconText === '';
+    this.tree.treeModel.filterNodes((node) => this.checkNameAndKey(node, filterText) && this.checkIcon(node, category));
+    this.filter = filterText;
+    this.category = category || 'ALL';
+    this.emptyTreeNodes = !this.tree.treeModel.getVisibleRoots().length;
   }
 
   private manageTreeState() {

web/src/app/shared/services/obtain-message/message-by-error-code.ts

@@ -99,8 +99,7 @@ export const messageByErrorCode = {
   },
 
   [messageTypes.INFORMATION]: {
-    EMPTY_WORKBASKET: 'Selected Workbasket is empty',
-    CLASSIFICATION_FILTER_EMPTY_RESULT: 'No Classification match for used filter {filter} in category {category}'
+    EMPTY_WORKBASKET: 'Selected Workbasket is empty'
   },
 
   [messageTypes.WARNING]: {