From 9dcc58d57d677f16a8d43c487798d5fad9240ac2 Mon Sep 17 00:00:00 2001
From: Valentin <valentin@devplant.ro>
Date: Tue, 16 Nov 2021 23:15:56 +0200
Subject: [PATCH] WIP on updating helpmode keys and links

---
 src/assets/styles/common-help-mode.scss       |  8 ++++
 src/lib/help-mode/help-mode.directive.ts      | 21 +++++++---
 .../page-header/page-header.component.html    | 38 ++++++++++---------
 3 files changed, 44 insertions(+), 23 deletions(-)

diff --git a/src/assets/styles/common-help-mode.scss b/src/assets/styles/common-help-mode.scss
index 146e7ad..0feb0bc 100644
--- a/src/assets/styles/common-help-mode.scss
+++ b/src/assets/styles/common-help-mode.scss
@@ -30,6 +30,14 @@
     padding-left: 4px;
 }
 
+.help-mode-on-mouse-over-edit-dossier-owner {
+    padding-left: 5px;
+}
+
+.help-mode-on-mouse-over-edit-dossier-member {
+    margin-left: 3px;
+}
+
 .help-mode-on-mouse-over-open-usermenu {
     padding-top: 1px;
     margin-left: 5px;
diff --git a/src/lib/help-mode/help-mode.directive.ts b/src/lib/help-mode/help-mode.directive.ts
index f213d51..064674d 100644
--- a/src/lib/help-mode/help-mode.directive.ts
+++ b/src/lib/help-mode/help-mode.directive.ts
@@ -1,5 +1,6 @@
 import { Directive, ElementRef, HostListener, Input, OnInit, Renderer2 } from '@angular/core';
 import { HelpModeService } from './help-mode.service';
+import { Router } from '@angular/router';
 
 @Directive({
     selector: '[iqserHelpMode]',
@@ -7,12 +8,16 @@ import { HelpModeService } from './help-mode.service';
 })
 export class HelpModeDirective implements OnInit {
     @Input('iqserHelpMode') elementName!: string;
+    private _path: string;
 
     constructor(
         private readonly _elementRef: ElementRef,
         private readonly _renderer: Renderer2,
         private readonly _helpModeService: HelpModeService,
-    ) {}
+        private readonly _router: Router,
+    ) {
+        this._path = this._router.url.split('/').pop() as string;
+    }
 
     ngOnInit(): void {
         this._createHelperElement();
@@ -21,11 +26,17 @@ export class HelpModeDirective implements OnInit {
     private _createHelperElement() {
         const element = this._elementRef.nativeElement as HTMLElement;
 
-        const helperElement = this._renderer.createElement('div') as HTMLElement;
-        this._renderer.addClass(helperElement, 'help-mode-on-mouse-over');
-        this._renderer.addClass(helperElement, `help-mode-on-mouse-over-${this.elementName}`);
+        if (!this._isDisabledElement()) {
+            const helperElement = this._renderer.createElement('div') as HTMLElement;
+            this._renderer.addClass(helperElement, 'help-mode-on-mouse-over');
+            this._renderer.addClass(helperElement, `help-mode-on-mouse-over-${this.elementName}`);
 
-        this._helpModeService.addElement(this.elementName, element, helperElement);
+            this._helpModeService.addElement(this.elementName, element, helperElement);
+        }
+    }
+
+    private _isDisabledElement() {
+        return this._path === 'dossiers' && this.elementName === 'filter-for-status';
     }
 
     @HostListener('click') onClick(): void {
diff --git a/src/lib/listing/page-header/page-header.component.html b/src/lib/listing/page-header/page-header.component.html
index 6d950cd..b2aba3f 100644
--- a/src/lib/listing/page-header/page-header.component.html
+++ b/src/lib/listing/page-header/page-header.component.html
@@ -29,27 +29,29 @@
             ></iqser-icon-button>
         </ng-container>
 
-        <ng-container *ngFor="let config of actionConfigs; trackBy: trackByLabel">
+        <div class="actions" iqserHelpMode="edit-dossier">
+            <ng-container *ngFor="let config of actionConfigs; trackBy: trackByLabel">
+                <iqser-circle-button
+                    (action)="config.action($event)"
+                    *ngIf="!config.hide"
+                    [icon]="config.icon"
+                    [tooltip]="config.label"
+                    tooltipPosition="below"
+                ></iqser-circle-button>
+            </ng-container>
+
+            <!-- Extra custom actions here -->
+            <ng-content></ng-content>
+
             <iqser-circle-button
-                (action)="config.action($event)"
-                *ngIf="!config.hide"
-                [icon]="config.icon"
-                [tooltip]="config.label"
+                (action)="closeAction.emit()"
+                *ngIf="showCloseButton"
+                [class.ml-6]="actionConfigs"
+                [tooltip]="'common.close' | translate"
+                icon="iqser:close"
                 tooltipPosition="below"
             ></iqser-circle-button>
-        </ng-container>
-
-        <!-- Extra custom actions here -->
-        <ng-content></ng-content>
-
-        <iqser-circle-button
-            (action)="closeAction.emit()"
-            *ngIf="showCloseButton"
-            [class.ml-6]="actionConfigs"
-            [tooltip]="'common.close' | translate"
-            icon="iqser:close"
-            tooltipPosition="below"
-        ></iqser-circle-button>
+        </div>
     </div>
 </div>