DSC-1413 refactor

Author: FrancescoMolinaro

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

@@ -106,8 +106,8 @@ export class BrowserKlaroService extends KlaroService {
       this.klaroConfig.translations.zz.consentNotice.description = 'cookies.consent.content-notice.description.no-privacy';
     }
 
-    if (hasValue(environment.metricsConsents)) {
-      environment.metricsConsents.forEach((metric) => {
+    if (hasValue(environment.info.metricsConsents)) {
+      environment.info.metricsConsents.forEach((metric) => {
         if (metric.enabled) {
           this.klaroConfig.services.push(
             {
@@ -357,7 +357,7 @@ export class BrowserKlaroService extends KlaroService {
     return 'klaro-' + identifier;
   }
 
-  watchConsentUpdates() {
+  watchConsentUpdates(): void {
     this.lazyKlaro.then(({getManager}) => {
       const manager = getManager(this.klaroConfig);
       const consentsSubject$ = this.consentsUpdates$;

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

@@ -1,6 +1,7 @@
 import { Injectable } from '@angular/core';
 
-import { Observable } from 'rxjs';
+import { BehaviorSubject, Observable } from 'rxjs';
+import { CookieConsents } from './browser-klaro.service';
 
 /**
  * Abstract class representing a service for handling Klaro consent preferences and UI
@@ -10,15 +11,25 @@ export abstract class KlaroService {
   /**
    * Initializes the service
    */
-  abstract initialize();
+  abstract initialize(): void;
 
   /**
    * Shows a dialog with the current consent preferences
    */
-  abstract showSettings();
+  abstract showSettings(): void;
 
   /**
    * Return saved preferences stored in the klaro cookie
    */
   abstract getSavedPreferences(): Observable<any>;
+
+  /**
+   * Watch for changes in consents
+   */
+  abstract watchConsentUpdates(): void;
+
+  /**
+   * Subject to emit updates in the consents
+   */
+  abstract consentsUpdates$:  BehaviorSubject<CookieConsents>;
 }

src/app/shared/metric/metric-loader/metric-loader.component.ts

@@ -14,9 +14,9 @@ import { Metric } from '../../../core/shared/metric.model';
 import { BaseMetricComponent } from './base-metric.component';
 import { MetricLoaderService } from './metric-loader.service';
 import { hasValue } from '../../empty.util';
-import { BrowserKlaroService, CookieConsents } from '../../cookies/browser-klaro.service';
+import { CookieConsents } from '../../cookies/browser-klaro.service';
 import { KlaroService } from '../../cookies/klaro.service';
-import {  startWith } from 'rxjs/operators';
+import { startWith } from 'rxjs/operators';
 
 @Component({
   // eslint-disable-next-line @angular-eslint/component-selector
@@ -50,22 +50,19 @@ export class MetricLoaderComponent implements OnInit, OnDestroy {
 
   private thirdPartyMetrics = ['plumX', 'altmetric', 'dimensions'];
 
-  private browserKlaroService: BrowserKlaroService;
-
   private hasLoadedScript: boolean;
 
   constructor(
     private componentFactoryResolver: ComponentFactoryResolver,
     private metricLoaderService: MetricLoaderService,
     private klaroService: KlaroService,
   ) {
-    this.browserKlaroService = (this.klaroService as BrowserKlaroService);
-    this.browserKlaroService.watchConsentUpdates();
-    this.consentUpdates$ = this.browserKlaroService.consentsUpdates$;
+    this.klaroService.watchConsentUpdates();
+    this.consentUpdates$ = this.klaroService.consentsUpdates$;
   }
 
   ngOnInit() {
-    this.cookiesSubscription = this.browserKlaroService.getSavedPreferences().subscribe((consents) => {
+    this.cookiesSubscription = this.klaroService.getSavedPreferences().subscribe((consents) => {
       this.loadComponent(this.metric, this.getCanLoadScript(consents));
     });
   }
@@ -96,6 +93,8 @@ export class MetricLoaderComponent implements OnInit, OnDestroy {
   instantiateComponent(component: any, metric: Metric, canLoadScript: boolean, forceRendering?: boolean) {
     const factory = this.componentFactoryResolver.resolveComponentFactory(component);
     this.componentType = component;
+    this.container.clear();
+
     const ref = this.container.createComponent(factory);
     const componentInstance = ref.instance as BaseMetricComponent;
     componentInstance.metric = metric;
@@ -133,14 +132,18 @@ export class MetricLoaderComponent implements OnInit, OnDestroy {
    * @private
    */
   private reloadComponentOnConsentsChange(componentInstance: BaseMetricComponent, canLoadScript: boolean): void {
+    if (hasValue(this.settingsSubscription)) {
+      return;
+    }
+
     this.settingsSubscription = combineLatest([
       this.consentUpdates$,
       componentInstance.requestSettingsConsent.pipe(startWith(undefined))
     ]).subscribe(([consents, request]) => {
       canLoadScript = this.getCanLoadScript(consents);
 
       if (request && !canLoadScript) {
-        this.browserKlaroService.showSettings();
+        this.klaroService.showSettings();
       }
 
       if (canLoadScript && !this.hasLoadedScript) {

src/app/shared/metric/metrics.module.ts

@@ -19,7 +19,6 @@ import { MetricBadgesComponent } from '../object-list/metric-badges/metric-badge
 import { MetricDonutsComponent } from '../object-list/metric-donuts/metric-donuts.component';
 import { FormsModule } from '@angular/forms';
 import { DirectivesModule } from '../../directives/directives.module';
-import { BrowserKlaroService } from '../cookies/browser-klaro.service';
 
 const PIPES = [
   MetricStyleConfigPipe,
@@ -45,11 +44,6 @@ const COMPONENTS = [
   MetricLoaderComponent,
   MetricDefaultComponent
 ];
-
-const PROVIDERS = [
-  BrowserKlaroService
-];
-
 @NgModule({
   declarations: [
     ...PIPES,
@@ -62,9 +56,6 @@ const PROVIDERS = [
       useDefaultLang: true
     }),
   ],
-  providers: [
-    ...PROVIDERS
-  ],
   exports: [
     ...COMPONENTS,
   ]

src/config/app-config.interface.ts

@@ -31,7 +31,6 @@ import { FollowAuthorityMetadata } from './search-follow-metadata.interface';
 import { AdvancedAttachmentRenderingConfig } from './advanced-attachment-rendering.config';
 import { AttachmentRenderingConfig } from './attachment-rendering.config';
 import { SearchResultConfig } from './search-result-config.interface';
-import { ThirdPartyMetric } from './third-party-metric-config';
 
 interface AppConfig extends Config {
   ui: UIServerConfig;
@@ -69,7 +68,6 @@ interface AppConfig extends Config {
   attachmentRendering: AttachmentRenderingConfig;
   advancedAttachmentRendering: AdvancedAttachmentRenderingConfig;
   searchResult: SearchResultConfig;
-  metricsConsents: ThirdPartyMetric[];
 }
 
 /**

src/config/default-app-config.ts

@@ -34,7 +34,6 @@ import {
 } from './advanced-attachment-rendering.config';
 import { AttachmentRenderingConfig } from './attachment-rendering.config';
 import { SearchResultConfig } from './search-result-config.interface';
-import { ThirdPartyMetric } from './third-party-metric-config';
 
 export class DefaultAppConfig implements AppConfig {
   production = false;
@@ -481,7 +480,22 @@ export class DefaultAppConfig implements AppConfig {
   // - All mentions of the privacy policy being removed from the UI (e.g. in the footer)
   info: InfoConfig = {
     enableEndUserAgreement: true,
-    enablePrivacyStatement: true
+    enablePrivacyStatement: true,
+    //Configuration for third-party metrics in Klaro
+    metricsConsents: [
+      {
+        key: 'plumX',
+        enabled: true
+      },
+      {
+        key: 'altmetric',
+        enabled: true
+      },
+      {
+        key: 'dimensions',
+        enabled: true
+      },
+    ]
   };
 
   // Whether to enable Markdown (https://commonmark.org/) and MathJax (https://www.mathjax.org/)
@@ -736,20 +750,4 @@ export class DefaultAppConfig implements AppConfig {
     additionalMetadataFields: [],
     authorMetadata: ['dc.contributor.author', 'dc.creator', 'dc.contributor.*'],
   };
-
-  //Configuration for third-party metrics in Klaro
-  metricsConsents: ThirdPartyMetric[] = [
-    {
-      key: 'plumX',
-      enabled: true
-    },
-    {
-      key: 'altmetric',
-      enabled: true
-    },
-    {
-      key: 'dimensions',
-      enabled: true
-    },
-  ];
 }

src/config/info-config.interface.ts

@@ -1,6 +1,8 @@
 import { Config } from './config.interface';
+import { ThirdPartyMetric } from './third-party-metric-config';
 
 export interface InfoConfig extends Config {
   enableEndUserAgreement: boolean;
   enablePrivacyStatement: boolean;
+  metricsConsents: ThirdPartyMetric[];
 }

src/environments/environment.test.ts

@@ -323,6 +323,21 @@ export const environment: BuildConfig = {
   info: {
     enableEndUserAgreement: true,
     enablePrivacyStatement: true,
+    //Configuration for third-party metrics in Klaro
+    metricsConsents: [
+      {
+        key: 'plumX',
+        enabled: true
+      },
+      {
+        key: 'altmetric',
+        enabled: true
+      },
+      {
+        key: 'dimensions',
+        enabled: true
+      },
+    ]
   },
   markdown: {
     enabled: false,
@@ -553,20 +568,4 @@ export const environment: BuildConfig = {
     ],
     authorMetadata: ['dc.contributor.author', 'dc.contributor.editor', 'dc.contributor.contributor', 'dc.creator'],
   },
-
-  //Configuration for third-party metrics in Klaro
-  metricsConsents: [
-    {
-      key: 'plumX',
-      enabled: true
-    },
-    {
-      key: 'altmetric',
-      enabled: true
-    },
-    {
-      key: 'dimensions',
-      enabled: true
-    },
-  ],
 };