added references button and dialog

apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotation-actions/annotation-actions.component.html

@@ -88,7 +88,15 @@
         ></iqser-circle-button>
 
         <iqser-circle-button
-            (action)="annotationActionsService.forceAnnotation($event, annotations, file, annotationsChanged, false)"
+            (action)="openAnnotationReferencesDialog()"
+            [tooltipPosition]="tooltipPosition"
+            [tooltip]="'annotation-actions.see-references.label' | translate"
+            [type]="buttonType"
+            icon="red:reference"
+        ></iqser-circle-button>
+
+        <iqser-circle-button
+            (action)="annotationActionsService.forceRedaction($event, annotations, file, annotationsChanged)"
             *ngIf="annotationPermissions.canForceRedaction"
             [tooltipPosition]="tooltipPosition"
             [tooltip]="'annotation-actions.force-redaction.label' | translate"

apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotation-actions/annotation-actions.component.ts

@@ -16,6 +16,7 @@ import {
 } from '../../dialogs/accept-recommendation-dialog/accept-recommendation-dialog.component';
 import { filter } from 'rxjs/operators';
 import { ManualAnnotationService } from '../../../../services/manual-annotation.service';
+import { DossiersDialogService } from '../../../../services/dossiers-dialog.service';
 
 export const AnnotationButtonTypes = {
     dark: 'dark',
@@ -46,6 +47,7 @@ export class AnnotationActionsComponent implements OnChanges {
         private readonly _dossiersService: DossiersService,
         private readonly _userService: UserService,
         private readonly _dialog: MatDialog,
+        private readonly _dialogService: DossiersDialogService,
     ) {}
 
     private _annotations: AnnotationWrapper[];
@@ -153,4 +155,9 @@ export class AnnotationActionsComponent implements OnChanges {
             this.annotations,
         );
     }
+
+    openAnnotationReferencesDialog(): void {
+        const data = {};
+        this._dialogService.openDialog('seeAnnotationReferences', null, data, async () => {});
+    }
 }

apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotation-references-dialog/annotation-references-dialog.component.html

@@ -0,0 +1,4 @@
+<section class="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>

apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotation-references-dialog/annotation-references-dialog.component.ts

@@ -0,0 +1,20 @@
+import { Component } from '@angular/core';
+import { BaseDialogComponent } from '../../../../../../../../../../libs/common-ui/src';
+
+@Component({
+    selector: 'redaction-annotation-references-dialog',
+    templateUrl: './annotation-references-dialog.component.html',
+    styleUrls: ['./annotation-references-dialog.component.scss'],
+})
+export class AnnotationReferencesDialogComponent extends BaseDialogComponent {
+    // eslint-disable-next-line @typescript-eslint/no-useless-constructor
+    constructor() {
+        super();
+    }
+
+    changed: boolean;
+    disabled: boolean;
+    valid: boolean;
+
+    save(): void {}
+}

apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/file-preview.module.ts

@@ -19,6 +19,7 @@ import { TypeAnnotationIconComponent } from './components/type-annotation-icon/t
 import { OverlayModule } from '@angular/cdk/overlay';
 import { ViewSwitchComponent } from './components/view-switch/view-switch.component';
 import { UserManagementComponent } from './components/user-management/user-management.component';
+import { AnnotationReferencesDialogComponent } from './components/annotation-references-dialog/annotation-references-dialog.component';
 import { AcceptRecommendationDialogComponent } from './dialogs/accept-recommendation-dialog/accept-recommendation-dialog.component';
 
 const routes: Routes = [
@@ -46,6 +47,7 @@ const routes: Routes = [
         ViewSwitchComponent,
         UserManagementComponent,
         AcceptRecommendationDialogComponent,
+        AnnotationReferencesDialogComponent,
     ],
     imports: [
         RouterModule.forChild(routes),

apps/red-ui/src/app/modules/dossier/services/dossiers-dialog.service.ts

@@ -11,6 +11,7 @@ import { ChangeLegalBasisDialogComponent } from '../dialogs/change-legal-basis-d
 import { RecategorizeImageDialogComponent } from '../dialogs/recategorize-image-dialog/recategorize-image-dialog.component';
 import { ConfirmationDialogComponent, DialogConfig, DialogService, largeDialogConfig } from '@iqser/common-ui';
 import { ResizeAnnotationDialogComponent } from '../dialogs/resize-annotation-dialog/resize-annotation-dialog.component';
+import { AnnotationReferencesDialogComponent } from '../screens/file-preview-screen/components/annotation-references-dialog/annotation-references-dialog.component';
 
 type DialogType =
     | 'confirm'
@@ -22,8 +23,9 @@ type DialogType =
     | 'changeLegalBasis'
     | 'removeAnnotations'
     | 'resizeAnnotation'
-    | 'forceAnnotation'
-    | 'manualAnnotation';
+    | 'forceRedaction'
+    | 'manualAnnotation'
+    | 'seeAnnotationReferences';
 
 @Injectable()
 export class DossiersDialogService extends DialogService<DialogType> {
@@ -67,6 +69,9 @@ export class DossiersDialogService extends DialogService<DialogType> {
             component: ManualAnnotationDialogComponent,
             dialogConfig: { autoFocus: true },
         },
+        seeAnnotationReferences: {
+            component: AnnotationReferencesDialogComponent,
+        },
     };
 
     constructor(protected readonly _dialog: MatDialog) {

apps/red-ui/src/app/modules/icons/icons.module.ts

@@ -51,6 +51,7 @@ export class IconsModule {
             'reanalyse',
             'reason',
             'redaction-changes',
+            'reference',
             'remove-from-dict',
             'report',
             'resize',

apps/red-ui/src/assets/i18n/en.json

@@ -157,6 +157,9 @@
     "force-redaction": {
       "label": "Force Redaction"
     },
+    "see-references": {
+      "label": "See References"
+    },
     "hide": "Hide",
     "message": {
       "dictionary": {

apps/red-ui/src/assets/icons/general/reference.svg

@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="14px" height="14px" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>status</title>
+    <g id="Styleguide" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Styleguide-Actions" transform="translate(-979.000000, -588.000000)" fill="#283241" fill-rule="nonzero">
+            <g id="reference" transform="translate(969.000000, 578.000000)">
+                <g id="status" transform="translate(10.000000, 10.000000)">
+                    <polygon id="Path" points="14 6.3 8.68 6.3 12.46 2.52 11.48 1.54 7.7 5.32 7.7 0 6.3 0 6.3 5.32 2.52 1.54 1.54 2.52 5.32 6.3 0 6.3 0 7.7 5.32 7.7 1.54 11.48 2.52 12.46 6.3 8.68 6.3 14 7.7 14 7.7 8.68 11.48 12.46 12.46 11.48 8.68 7.7 14 7.7"></polygon>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>

libs/common-ui

@@ -1 +1 @@
-Subproject commit b65ad23aaa3ed5ece6242c2b3b569322d275e93e
+Subproject commit 6c79b02a50f268a6b663e8e46d88f3c0d333a608