From 13a71bf06a87ca64972bd7f1d8507953991343a7 Mon Sep 17 00:00:00 2001
From: Edi Cziszter <eduard@devplant.ro>
Date: Sun, 9 Jan 2022 19:14:15 +0200
Subject: [PATCH] references dialog close button

---
 .../annotation-references-dialog.component.html        | 10 ++++++----
 .../annotation-references-dialog.component.scss        |  2 +-
 .../annotation-references-dialog.component.ts          |  3 ++-
 .../file-preview-screen.component.html                 | 10 +++++-----
 4 files changed, 14 insertions(+), 11 deletions(-)

diff --git a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotation-references-dialog/annotation-references-dialog.component.html b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotation-references-dialog/annotation-references-dialog.component.html
index fdda1748f..598299dd3 100644
--- a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotation-references-dialog/annotation-references-dialog.component.html
+++ b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotation-references-dialog/annotation-references-dialog.component.html
@@ -1,4 +1,6 @@
-<section class="dialog references-dialog">
-    <div class="dialog-header heading-l">X REFERENCES</div>
-    <iqser-circle-button class="dialog-close" icon="iqser:close" mat-dialog-close></iqser-circle-button>
-</section>
+<div class="content-container">
+    <div class="dialog references-dialog">
+        <div class="dialog-header">X REFERENCES</div>
+        <iqser-circle-button (action)="closeDialog.emit(false)" class="dialog-close" icon="iqser:close"></iqser-circle-button>
+    </div>
+</div>
diff --git a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotation-references-dialog/annotation-references-dialog.component.scss b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotation-references-dialog/annotation-references-dialog.component.scss
index 4b94df396..cc502ada9 100644
--- a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotation-references-dialog/annotation-references-dialog.component.scss
+++ b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotation-references-dialog/annotation-references-dialog.component.scss
@@ -1,4 +1,4 @@
 .references-dialog {
     position: fixed;
-    left: -100px;
+    right: 350px;
 }
diff --git a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotation-references-dialog/annotation-references-dialog.component.ts b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotation-references-dialog/annotation-references-dialog.component.ts
index ea3dcc01f..5cb9a4fdc 100644
--- a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotation-references-dialog/annotation-references-dialog.component.ts
+++ b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotation-references-dialog/annotation-references-dialog.component.ts
@@ -1,4 +1,4 @@
-import { Component, Input, OnDestroy, OnInit } from '@angular/core';
+import { Component, EventEmitter, Input, OnDestroy, OnInit, Output } from '@angular/core';
 import { AnnotationWrapper } from '@models/file/annotation.wrapper';
 
 @Component({
@@ -9,6 +9,7 @@ import { AnnotationWrapper } from '@models/file/annotation.wrapper';
 export class AnnotationReferencesDialogComponent implements OnInit {
     // eslint-disable-next-line @typescript-eslint/no-useless-constructor
     @Input() annotation: AnnotationWrapper;
+    @Output() readonly closeDialog = new EventEmitter<boolean>();
     constructor() {}
 
     ngOnInit(): void {
diff --git a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/file-preview-screen.component.html b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/file-preview-screen.component.html
index 1b5ce036a..a8901693a 100644
--- a/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/file-preview-screen.component.html
+++ b/apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/file-preview-screen.component.html
@@ -124,13 +124,13 @@
                 [file]="file"
                 [viewer]="activeViewer"
             ></redaction-annotation-actions>
-
-            <redaction-annotation-references-dialog
-                *ngIf="seeReferences"
-                [annotation]="annotation"
-            ></redaction-annotation-references-dialog>
         </ng-template>
 
+        <redaction-annotation-references-dialog
+            *ngIf="seeReferences"
+            (closeDialog)="seeReferences = $event"
+        ></redaction-annotation-references-dialog>
+
         <ng-template #annotationFilterTemplate let-filter="filter">
             <redaction-type-filter
                 *ngIf="filter.topLevelFilter"