From de8aa9a920ad2a1a543019ca7f666911b959f2e0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Adina=20=C8=9Aeudan?= <adina@devplant.ro>
Date: Fri, 8 Apr 2022 22:02:35 +0300
Subject: [PATCH] RED-3721: Hide highlight header action buttons when
 multiselect active

---
 .../highlights-separator.component.html                     | 6 +++---
 .../highlights-separator/highlights-separator.component.ts  | 3 +++
 2 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/apps/red-ui/src/app/modules/file-preview/components/highlights-separator/highlights-separator.component.html b/apps/red-ui/src/app/modules/file-preview/components/highlights-separator/highlights-separator.component.html
index 835c7eb11..b65301916 100644
--- a/apps/red-ui/src/app/modules/file-preview/components/highlights-separator/highlights-separator.component.html
+++ b/apps/red-ui/src/app/modules/file-preview/components/highlights-separator/highlights-separator.component.html
@@ -3,7 +3,7 @@
     <span [translateParams]="highlightGroup" [translate]="'highlights'" class="all-caps-label"></span>
 </div>
 
-<div *ngIf="isWritable$ | async">
+<div *ngIf="(isWritable$ | async) && (multiSelectInactive$ | async)">
     <iqser-circle-button
         (action)="convertHighlights(highlightGroup)"
         [size]="28"
@@ -11,8 +11,8 @@
         [type]="circleButtonTypes.dark"
         class="mr-2"
         icon="red:convert"
-        tooltipPosition="above"
         iqserHelpMode="convert_highlights"
+        tooltipPosition="above"
     ></iqser-circle-button>
 
     <iqser-circle-button
@@ -21,7 +21,7 @@
         [tooltip]="'file-preview.highlights.remove' | translate"
         [type]="circleButtonTypes.dark"
         icon="iqser:trash"
-        tooltipPosition="above"
         iqserHelpMode="remove_highlights"
+        tooltipPosition="above"
     ></iqser-circle-button>
 </div>
diff --git a/apps/red-ui/src/app/modules/file-preview/components/highlights-separator/highlights-separator.component.ts b/apps/red-ui/src/app/modules/file-preview/components/highlights-separator/highlights-separator.component.ts
index f9dffcb20..cd0f1bc3b 100644
--- a/apps/red-ui/src/app/modules/file-preview/components/highlights-separator/highlights-separator.component.ts
+++ b/apps/red-ui/src/app/modules/file-preview/components/highlights-separator/highlights-separator.component.ts
@@ -5,6 +5,7 @@ import { FilePreviewStateService } from '../../services/file-preview-state.servi
 import { AnnotationWrapper } from '@models/file/annotation.wrapper';
 import { FilePreviewDialogService } from '../../services/file-preview-dialog.service';
 import { FileDataService } from '../../services/file-data.service';
+import { MultiSelectService } from '../../services/multi-select.service';
 
 @Component({
     selector: 'redaction-highlights-separator [highlightGroup] [annotation]',
@@ -19,11 +20,13 @@ export class HighlightsSeparatorComponent {
 
     readonly circleButtonTypes = CircleButtonTypes;
     readonly isWritable$ = this._state.isWritable$;
+    readonly multiSelectInactive$ = this._multiSelectService.inactive$;
 
     constructor(
         private readonly _dialogService: FilePreviewDialogService,
         private readonly _state: FilePreviewStateService,
         private readonly _fileDataService: FileDataService,
+        private readonly _multiSelectService: MultiSelectService,
     ) {}
 
     convertHighlights(highlightGroup: TextHighlightsGroup): void {