From 3b7d962671deb967241e52071a0f8b6d8d0e756e Mon Sep 17 00:00:00 2001
From: Samuel <samuelcambien@gmail.com>
Date: Thu, 23 Dec 2021 11:43:59 +0100
Subject: [PATCH] taskid 85843 Add a tree to browse hierarchical facets on the
 search page - feedback

---
 .../okr-vocabulary-treeview.component.ts              | 11 ++++++-----
 .../okr-search-hierarchy-filter.component.html        |  8 ++++----
 .../okr-search-hierarchy-filter.component.spec.ts     |  2 +-
 3 files changed, 11 insertions(+), 10 deletions(-)

diff --git a/src/themes/okr/app/shared/okr-vocabulary-treeview/okr-vocabulary-treeview.component.ts b/src/themes/okr/app/shared/okr-vocabulary-treeview/okr-vocabulary-treeview.component.ts
index f33f7d89e9..c9ef159f81 100644
--- a/src/themes/okr/app/shared/okr-vocabulary-treeview/okr-vocabulary-treeview.component.ts
+++ b/src/themes/okr/app/shared/okr-vocabulary-treeview/okr-vocabulary-treeview.component.ts
@@ -1,7 +1,8 @@
 import { Component } from '@angular/core';
 import { VocabularyTreeviewComponent } from '../../../../../app/shared/vocabulary-treeview/vocabulary-treeview.component';
-import { filter, startWith } from 'rxjs/operators';
+import { filter, map, startWith } from 'rxjs/operators';
 import { PageInfo } from '../../../../../app/core/shared/page-info.model';
+import { lowerCase } from 'lodash';
 
 /**
  * Component that show a hierarchical vocabulary in a tree view.
@@ -27,10 +28,10 @@ export class OkrVocabularyTreeviewComponent extends VocabularyTreeviewComponent
       })
     );
 
-    const descriptionLabel = 'vocabulary-treeview.tree.description.' + this.vocabularyOptions.name;
-    this.description = this.translate.get(descriptionLabel).pipe(
-      filter((msg) => msg !== descriptionLabel),
-      startWith('')
+    this.translate.get(`search.filters.filter.${this.vocabularyOptions.name}.head`).pipe(
+      map((type) => lowerCase(type)),
+    ).subscribe(
+      (type) => this.description = this.translate.get('okr-vocabulary-treeview.info', { type })
     );
 
     this.loading = this.vocabularyTreeviewService.isLoading();
diff --git a/src/themes/okr/app/shared/search/search-filters/search-filter/okr-search-hierarchy-filter/okr-search-hierarchy-filter.component.html b/src/themes/okr/app/shared/search/search-filters/search-filter/okr-search-hierarchy-filter/okr-search-hierarchy-filter.component.html
index dd50528bb6..731b5045bf 100644
--- a/src/themes/okr/app/shared/search/search-filters/search-filter/okr-search-hierarchy-filter/okr-search-hierarchy-filter.component.html
+++ b/src/themes/okr/app/shared/search/search-filters/search-filter/okr-search-hierarchy-filter/okr-search-hierarchy-filter.component.html
@@ -1,8 +1,8 @@
 <ds-search-hierarchy-filter></ds-search-hierarchy-filter>
 
-<div *ngIf="vocabularyExists$ | async"
+<a *ngIf="vocabularyExists$ | async"
+     href="javascript:void(0);"
      id="show-{{filterConfig.name}}-tree"
-     class="text-lowercase"
      (click)="showVocabularyTree()">
-  {{'search.filters.filter.show-tree' | translate: {name: ('search.filters.filter.' + filterConfig.name + '.head' | translate)} }}
-</div>
+  {{'search.filters.filter.show-tree' | translate: {name: ('search.filters.filter.' + filterConfig.name + '.head' | translate | lowercase )} }}
+</a>
diff --git a/src/themes/okr/app/shared/search/search-filters/search-filter/okr-search-hierarchy-filter/okr-search-hierarchy-filter.component.spec.ts b/src/themes/okr/app/shared/search/search-filters/search-filter/okr-search-hierarchy-filter/okr-search-hierarchy-filter.component.spec.ts
index ce4caa23eb..ac0669cbf9 100644
--- a/src/themes/okr/app/shared/search/search-filters/search-filter/okr-search-hierarchy-filter/okr-search-hierarchy-filter.component.spec.ts
+++ b/src/themes/okr/app/shared/search/search-filters/search-filter/okr-search-hierarchy-filter/okr-search-hierarchy-filter.component.spec.ts
@@ -82,7 +82,7 @@ describe('OkrSearchHierarchyFilterComponent', () => {
   function init() {
     fixture = TestBed.createComponent(OkrSearchHierarchyFilterComponent);
     fixture.detectChanges();
-    showVocabularyTreeLink = fixture.debugElement.query(By.css('div#show-test-search-filter-tree'));
+    showVocabularyTreeLink = fixture.debugElement.query(By.css('a#show-test-search-filter-tree'));
   }
 
   describe('if the vocabulary doesn\'t exist', () => {