From a16cc833fdb5504bf2fa2ad831e6d5ae4d72caec Mon Sep 17 00:00:00 2001
From: ChiaraDipi <dipi.chiara@gmail.com>
Date: Tue, 13 Oct 2020 16:22:00 +0200
Subject: [PATCH] Add entity highlight after navigation to occurrence

---
 .../named-entity-ref/named-entity-ref.component.html |  1 +
 .../named-entity-ref/named-entity-ref.component.scss |  4 ++++
 .../named-entity-ref/named-entity-ref.component.ts   |  2 ++
 .../named-entity-occurrence.component.ts             |  2 ++
 .../named-entity/named-entity.component.html         |  2 +-
 src/app/services/evt-status.service.ts               | 12 +++++++++---
 6 files changed, 19 insertions(+), 4 deletions(-)

diff --git a/src/app/components/named-entity-ref/named-entity-ref.component.html b/src/app/components/named-entity-ref/named-entity-ref.component.html
index 2b8bce1c9..e98c6124e 100644
--- a/src/app/components/named-entity-ref/named-entity-ref.component.html
+++ b/src/app/components/named-entity-ref/named-entity-ref.component.html
@@ -1,5 +1,6 @@
 <span class="namedEntityRef {{ data.entityType }}" (click)="toggleEntityData($event)" [ngClass]="{
         opened: opened,
+        entityHighlight: (evtStatusService.currentNamedEntityId$ | async) === data.entityId && !opened,
         noDetails: (availableEntities$ | async) === false
     }" [evtHighlight]="highlightData" [evtHtmlAttributes]="data?.attributes">
     <evt-content-viewer *ngFor="let element of data.content" [content]="element" [editionLevel]="editionLevel" [itemsToHighlight]="itemsToHighlight" [textFlow]="textFlow"></evt-content-viewer>
diff --git a/src/app/components/named-entity-ref/named-entity-ref.component.scss b/src/app/components/named-entity-ref/named-entity-ref.component.scss
index 4b6ba7dbb..523d45bb0 100644
--- a/src/app/components/named-entity-ref/named-entity-ref.component.scss
+++ b/src/app/components/named-entity-ref/named-entity-ref.component.scss
@@ -47,4 +47,8 @@
 }
 .not-found-msg {
   font-size: .9rem;
+}
+
+.entityHighlight {
+  background: #ffffcc !important;
 }
\ No newline at end of file
diff --git a/src/app/components/named-entity-ref/named-entity-ref.component.ts b/src/app/components/named-entity-ref/named-entity-ref.component.ts
index 0a3059a36..8ec77535e 100644
--- a/src/app/components/named-entity-ref/named-entity-ref.component.ts
+++ b/src/app/components/named-entity-ref/named-entity-ref.component.ts
@@ -5,6 +5,7 @@ import { NamedEntityRef } from '../../models/evt-models';
 import { register } from '../../services/component-register.service';
 import { EntitiesSelectService } from '../../services/entities-select.service';
 import { EVTModelService } from '../../services/evt-model.service';
+import { EVTStatusService } from '../../services/evt-status.service';
 import { EditionlevelSusceptible, Highlightable, TextFlowSusceptible } from '../components-mixins';
 
 export interface NamedEntityRefComponent extends EditionlevelSusceptible, Highlightable, TextFlowSusceptible { }
@@ -41,6 +42,7 @@ export class NamedEntityRefComponent {
   public opened = false;
 
   constructor(
+    public evtStatusService: EVTStatusService,
     private evtModelService: EVTModelService,
     private entitiesSelectService: EntitiesSelectService,
   ) {
diff --git a/src/app/components/named-entity/named-entity-occurrence/named-entity-occurrence.component.ts b/src/app/components/named-entity/named-entity-occurrence/named-entity-occurrence.component.ts
index f059c5f19..c2fe2b6fe 100644
--- a/src/app/components/named-entity/named-entity-occurrence/named-entity-occurrence.component.ts
+++ b/src/app/components/named-entity/named-entity-occurrence/named-entity-occurrence.component.ts
@@ -12,6 +12,7 @@ import { EVTStatusService } from '../../../services/evt-status.service';
 })
 export class NamedEntityOccurrenceComponent {
   @Input() occurrence: NamedEntityOccurrence;
+  @Input() entityId: string;
 
   constructor(
     private evtModelService: EVTModelService,
@@ -24,6 +25,7 @@ export class NamedEntityOccurrenceComponent {
       const page = pages.find(p => p.id === this.occurrence.pageId);
       this.evtStatusService.updateDocument$.next(ref.docId);
       this.evtStatusService.updatePage$.next(page);
+      this.evtStatusService.currentNamedEntityId$.next(this.entityId);
     });
   }
 }
diff --git a/src/app/components/named-entity/named-entity.component.html b/src/app/components/named-entity/named-entity.component.html
index e56114567..b7ca9b0ff 100644
--- a/src/app/components/named-entity/named-entity.component.html
+++ b/src/app/components/named-entity/named-entity.component.html
@@ -32,7 +32,7 @@
                 <ng-template ngbNavContent>
                     <div class="ne-detail-content ui-font" *ngIf="occurrences$ | async as occurrences">
                         <span *ngIf="occurrences.length === 0">{{'noOccurrences' | translate}}</span>
-                        <evt-named-entity-occurrence *ngFor="let occurrence of occurrences" [occurrence]="occurrence"></evt-named-entity-occurrence>
+                        <evt-named-entity-occurrence *ngFor="let occurrence of occurrences" [occurrence]="occurrence" [entityId]="data.id"></evt-named-entity-occurrence>
                     </div>
                 </ng-template>
             </li>
diff --git a/src/app/services/evt-status.service.ts b/src/app/services/evt-status.service.ts
index 26d2bad54..52892c2a7 100644
--- a/src/app/services/evt-status.service.ts
+++ b/src/app/services/evt-status.service.ts
@@ -1,7 +1,7 @@
 import { Injectable } from '@angular/core';
 import { ActivatedRoute, NavigationStart, Router } from '@angular/router';
-import { BehaviorSubject, combineLatest, merge, Observable, Subject } from 'rxjs';
-import { distinctUntilChanged, filter, first, map, shareReplay } from 'rxjs/operators';
+import { BehaviorSubject, combineLatest, merge, Observable, Subject, timer } from 'rxjs';
+import { distinctUntilChanged, filter, first, map, shareReplay, switchMap } from 'rxjs/operators';
 
 import { AppConfig, EditionLevelType } from '../app.config';
 import { Page, ViewMode } from '../models/evt-models';
@@ -56,7 +56,7 @@ export class EVTStatusService {
             this.updatePage$.pipe(map(p => p.id)),
         ),
         this.evtModelService.pages$.pipe(
-            filter((pages)=> !!pages && pages.length > 0),
+            filter((pages) => !!pages && pages.length > 0),
         ),
     ]).pipe(
         map(([id, pages]) => !id ? pages[0] : pages.find((p) => p.id === id) || pages[0]),
@@ -121,6 +121,8 @@ export class EVTStatusService {
         map(currentStatus => this.getUrlFromStatus(currentStatus)),
     );
 
+    public currentNamedEntityId$: BehaviorSubject<string> = new BehaviorSubject(undefined);
+
     constructor(
         private evtModelService: EVTModelService,
         private router: Router,
@@ -148,6 +150,10 @@ export class EVTStatusService {
                 }
             }
         });
+        this.currentNamedEntityId$.pipe(
+            filter(id => !!id),
+            switchMap(id => timer(5000).pipe(map(() => id))),
+        ).subscribe(() => this.currentNamedEntityId$.next(undefined));
     }
 
     getUrlFromStatus(status: AppStatus) {