Merged in metrics_text_2023_02_x_DSC_1522 (pull request DSpace#1301)

Metrics text 2023 02 x DSC-1522

Approved-by: Giuseppe Digilio

Author: FrancescoMolinaro

src/app/shared/cookies/browser-klaro.service.ts

@@ -359,6 +359,8 @@ export class BrowserKlaroService extends KlaroService {
       const manager = getManager(this.klaroConfig);
       const consentsSubject$ = this.consentsUpdates$;
       let lastCookiesConsents = this.lastCookiesConsents;
+
+      consentsSubject$.next(manager.consents);
       manager.watch({
         update(_, eventName, consents) {
 

src/app/shared/object-list/search-result-list-element/item-search-result/item-types/item/item-search-result-list-element.component.html

@@ -13,6 +13,10 @@
   <div [ngClass]="showThumbnails ? 'col-9 col-xl-10' : 'col-12'">
     <div class="d-flex justify-content-between">
       <div class="flex-fill">
+        <small class="d-flex text-muted" *ngIf="!(hasLoadedThirdPartyMetrics$ | async) && showMetrics">
+          {{ "third-party-metrics-blocked" | translate }}&nbsp;
+          <div role="button" class="btn-link" (click)="showSettings()">{{ "third-party-metrics-cookies.consent-settings" | translate }}</div>
+        </small>
         <div class="d-flex">
           <ds-themed-badges *ngIf="showLabel" [object]="dso" [context]="context" [showAccessStatus]="true"></ds-themed-badges>
         </div>

src/app/shared/object-list/search-result-list-element/item-search-result/item-types/item/item-search-result-list-element.component.spec.ts

@@ -11,6 +11,7 @@ import { DSONameService } from '../../../../../../core/breadcrumbs/dso-name.serv
 import { DSONameServiceMock, UNDEFINED_NAME } from '../../../../../mocks/dso-name.service.mock';
 import { VarDirective } from '../../../../../utils/var.directive';
 import { APP_CONFIG } from '../../../../../../../config/app-config.interface';
+import { TranslateModule } from '@ngx-translate/core';
 
 let publicationListElementComponent: ItemSearchResultListElementComponent;
 let fixture: ComponentFixture<ItemSearchResultListElementComponent>;
@@ -188,13 +189,13 @@ const enviromentNoThumbs = {
 describe('ItemSearchResultListElementComponent', () => {
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
+      imports: [TranslateModule.forRoot()],
       declarations: [ItemSearchResultListElementComponent, TruncatePipe, VarDirective],
       providers: [
         { provide: TruncatableService, useValue: {} },
         { provide: DSONameService, useClass: DSONameServiceMock },
         { provide: APP_CONFIG, useValue: environmentUseThumbs }
       ],
-
       schemas: [NO_ERRORS_SCHEMA]
     }).overrideComponent(ItemSearchResultListElementComponent, {
       set: { changeDetection: ChangeDetectionStrategy.Default }
@@ -371,6 +372,7 @@ describe('ItemSearchResultListElementComponent', () => {
 
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
+      imports: [TranslateModule.forRoot()],
       declarations: [ItemSearchResultListElementComponent, TruncatePipe],
       providers: [
         {provide: TruncatableService, useValue: {}},

src/app/shared/object-list/search-result-list-element/item-search-result/item-types/item/item-search-result-list-element.component.ts

@@ -1,4 +1,4 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { AfterViewInit, Component, Inject, Input, OnInit, Optional } from '@angular/core';
 import {
   listableObjectComponent
 } from '../../../../../object-collection/shared/listable-object/listable-object.decorator';
@@ -9,6 +9,13 @@ import { Item } from '../../../../../../core/shared/item.model';
 import { getItemPageRoute } from '../../../../../../item-page/item-page-routing-paths';
 import { Context } from '../../../../../../core/shared/context.model';
 import { environment } from '../../../../../../../environments/environment';
+import { KlaroService } from '../../../../../cookies/klaro.service';
+import { combineLatest, Observable } from 'rxjs';
+import { TruncatableService } from '../../../../../truncatable/truncatable.service';
+import { DSONameService } from '../../../../../../core/breadcrumbs/dso-name.service';
+import { APP_CONFIG, AppConfig } from '../../../../../../../config/app-config.interface';
+import { getFirstSucceededRemoteListPayload } from '../../../../../../core/shared/operators';
+import { map } from 'rxjs/operators';
 
 @listableObjectComponent('PublicationSearchResult', ViewMode.ListElement)
 @listableObjectComponent(ItemSearchResult, ViewMode.ListElement)
@@ -21,7 +28,7 @@ import { environment } from '../../../../../../../environments/environment';
 /**
  * The component for displaying a list element for an item search result of the type Publication
  */
-export class ItemSearchResultListElementComponent extends SearchResultListElementComponent<ItemSearchResult, Item> implements OnInit {
+export class ItemSearchResultListElementComponent extends SearchResultListElementComponent<ItemSearchResult, Item> implements OnInit, AfterViewInit {
 
   /**
    * Whether to show the metrics badges
@@ -35,10 +42,55 @@ export class ItemSearchResultListElementComponent extends SearchResultListElemen
 
   authorMetadata = environment.searchResult.authorMetadata;
 
+  hasLoadedThirdPartyMetrics$: Observable<boolean>;
+
+  private thirdPartyMetrics = environment.info.metricsConsents.filter(metric => metric.enabled).map(metric => metric.key);
+
+
+  constructor(
+    protected truncatableService: TruncatableService,
+    public dsoNameService: DSONameService,
+    @Inject(APP_CONFIG) protected appConfig?: AppConfig,
+    @Optional() private klaroService?: KlaroService,
+  ) {
+    super(truncatableService, dsoNameService);
+  }
+
   ngOnInit(): void {
     super.ngOnInit();
     this.showThumbnails = this.showThumbnails ?? this.appConfig.browseBy.showThumbnails;
     this.itemPageRoute = getItemPageRoute(this.dso);
   }
 
+  /**
+   * Check if item has Third-party metrics blocked by consents
+   */
+  ngAfterViewInit() {
+    if (this.showMetrics && this.klaroService) {
+      this.klaroService.watchConsentUpdates();
+
+      this.hasLoadedThirdPartyMetrics$ = combineLatest([
+        this.klaroService.consentsUpdates$,
+        this.dso.metrics?.pipe(
+          getFirstSucceededRemoteListPayload(),
+          map(metrics => {
+            return metrics.filter(metric => this.thirdPartyMetrics.includes(metric.metricType));
+          })
+        )
+      ]).pipe(
+        map(([consents, metrics]) => {
+          return metrics.reduce((previous, current) => {
+            return consents[current.metricType] && previous;
+          }, true);
+        })
+      );
+    }
+  }
+
+  /**
+   * Prompt user for consents settings
+   */
+  showSettings() {
+    this.klaroService.showSettings();
+  }
 }

src/assets/i18n/en.json5

@@ -7308,4 +7308,6 @@
   "third-party-metrics-cookies.message": "{{ metricType }} badge is blocked by your ",
 
   "third-party-metrics-cookies.consent-settings": "consent settings",
+
+  "third-party-metrics-blocked": "Some of the metrics are blocked by your",
 }