Merge pull request #212 from europeana/feat/MET-6295-Cache-Country-Ta…

…rget-Data MET-6295 Cache Country Target Data
europeana · Nov 28, 2024 · 6830cd7 · 6830cd7
2 parents 8a4bf5c + 6ec961e
commit 6830cd7
Show file tree

Hide file tree

Showing 4 changed files with 71 additions and 62 deletions.
diff --git a/src/app/_services/api.service.ts b/src/app/_services/api.service.ts
@@ -20,6 +20,7 @@ import { Cache } from '../_helpers';
 @Injectable({ providedIn: 'root' })
 export class APIService {
   private readonly countries = new Cache(() => this.loadCountryData());
+  private readonly targetMetaData = new Cache(() => this.loadTargetMetaData());
 
   suffixGeneral = 'statistics/europeana/general';
   suffixFiltering = 'statistics/filtering';
@@ -134,7 +135,7 @@ export class APIService {
    * returns the result of loadTargetMetaData piped / mapped to reduceTargetMetaData
    **/
   getTargetMetaData(): Observable<IHash<IHashArray<TargetMetaData>>> {
-    return this.loadTargetMetaData().pipe(
+    return this.targetMetaData.get().pipe(
       map((rows: Array<TargetMetaDataRaw>) => {
         return this.reduceTargetMetaData(rows);
       })

diff --git a/src/app/app.component.spec.ts b/src/app/app.component.spec.ts
@@ -161,79 +161,78 @@ describe('AppComponent', () => {
     expect(app.landingComponentRef.landingData).toBeTruthy();
   }));
 
-  it('should handle the outlet load', () => {
+  it('should handle the outlet load', waitForAsync(async () => {
     expect(app.showPageTitle).toBeFalsy();
 
     spyOn(app, 'loadLandingData');
     spyOn(location, 'path').and.callFake(() => {
       return '';
     });
 
-    // load Landing
-    app.onOutletLoaded(new LandingComponent());
+    await TestBed.runInInjectionContext(() => {
+      app.onOutletLoaded(new LandingComponent());
+      expect(app.showPageTitle).toBeTruthy();
+      expect(app.loadLandingData).toHaveBeenCalled();
 
-    expect(app.showPageTitle).toBeTruthy();
+      // load overview component
+      const fakeOverviewComponent = Object.create(OverviewComponent.prototype);
 
-    expect(app.loadLandingData).toHaveBeenCalled();
+      app.onOutletLoaded(fakeOverviewComponent);
+      expect(app.showPageTitle).toBeFalsy();
 
-    // load overview component
-    const fakeOverviewComponent = Object.create(OverviewComponent.prototype);
+      expect(app.loadLandingData).toHaveBeenCalledTimes(2);
 
-    app.onOutletLoaded(fakeOverviewComponent);
-    expect(app.showPageTitle).toBeFalsy();
-
-    expect(app.loadLandingData).toHaveBeenCalledTimes(2);
+      // load landing component
+      app.getCtrlCTZero().setValue(true);
+      expect(app.loadLandingData).toHaveBeenCalledTimes(3);
 
-    // load landing component
-    app.getCtrlCTZero().setValue(true);
-    expect(app.loadLandingData).toHaveBeenCalledTimes(3);
-
-    const cmp = new LandingComponent();
-    app.landingData = {};
-    app.onOutletLoaded(cmp);
-    expect(app.showPageTitle).toBeTruthy();
-    expect(app.loadLandingData).toHaveBeenCalledTimes(4);
-    expect(app.lastSetContentTierZeroValue).toBeTruthy();
-    expect(cmp.landingData).toBeTruthy();
+      const cmp = new LandingComponent();
+      app.landingData = {};
+      app.onOutletLoaded(cmp);
+      expect(app.showPageTitle).toBeTruthy();
+      expect(app.loadLandingData).toHaveBeenCalledTimes(4);
+      expect(app.lastSetContentTierZeroValue).toBeTruthy();
+      expect(cmp.landingData).toBeTruthy();
 
-    app.lastSetContentTierZeroValue = !app.getCtrlCTZero().value;
-    app.onOutletLoaded(new LandingComponent());
-    expect(app.loadLandingData).toHaveBeenCalledTimes(5);
+      app.lastSetContentTierZeroValue = !app.getCtrlCTZero().value;
+      app.onOutletLoaded(new LandingComponent());
+      expect(app.loadLandingData).toHaveBeenCalledTimes(5);
 
-    // load privacy statement component
-    app.onOutletLoaded(new PrivacyStatementComponent());
+      // load privacy statement component
+      app.onOutletLoaded(new PrivacyStatementComponent());
 
-    expect(app.loadLandingData).toHaveBeenCalledTimes(6);
+      expect(app.loadLandingData).toHaveBeenCalledTimes(6);
 
-    // load cookie policy component
-    app.onOutletLoaded(new CookiePolicyComponent());
+      // load cookie policy component
+      app.onOutletLoaded(new CookiePolicyComponent());
 
-    expect(app.loadLandingData).toHaveBeenCalledTimes(7);
+      expect(app.loadLandingData).toHaveBeenCalledTimes(7);
 
-    // load country component
-    const fakeCountryComponent = Object.create(CountryComponent.prototype);
+      // load country component
+      const fakeCountryComponent = Object.create(CountryComponent.prototype);
 
-    spyOn(app, 'setCTZeroInputToLastSetValue');
-    spyOn(fakeCountryComponent, 'refreshCardData');
+      spyOn(app, 'setCTZeroInputToLastSetValue');
+      spyOn(fakeCountryComponent, 'refreshCardData');
 
-    app.onOutletLoaded(fakeCountryComponent);
+      app.onOutletLoaded(fakeCountryComponent);
 
-    expect(app.showPageTitle).toBeTruthy();
-    expect(app.loadLandingData).toHaveBeenCalledTimes(8);
-    expect(app.setCTZeroInputToLastSetValue).toHaveBeenCalledTimes(1);
+      expect(app.showPageTitle).toBeTruthy();
+      expect(app.loadLandingData).toHaveBeenCalledTimes(8);
+      expect(app.setCTZeroInputToLastSetValue).toHaveBeenCalledTimes(1);
 
-    app.lastSetContentTierZeroValue = true;
-    app.onOutletLoaded(fakeCountryComponent);
+      app.lastSetContentTierZeroValue = true;
+      app.onOutletLoaded(fakeCountryComponent);
 
-    expect(app.setCTZeroInputToLastSetValue).toHaveBeenCalledTimes(2);
-    expect(fakeCountryComponent.refreshCardData).not.toHaveBeenCalled();
+      expect(app.setCTZeroInputToLastSetValue).toHaveBeenCalledTimes(2);
+      expect(fakeCountryComponent.refreshCardData).not.toHaveBeenCalled();
 
-    fakeCountryComponent.cardData = {};
-    app.onOutletLoaded(fakeCountryComponent);
+      fakeCountryComponent._country = 'FR';
+      app.onOutletLoaded(fakeCountryComponent);
 
-    expect(app.setCTZeroInputToLastSetValue).toHaveBeenCalledTimes(3);
-    expect(fakeCountryComponent.refreshCardData).toHaveBeenCalledTimes(1);
-  });
+      expect(app.setCTZeroInputToLastSetValue).toHaveBeenCalledTimes(3);
+      expect(fakeCountryComponent.refreshCardData).toHaveBeenCalledTimes(1);
+    });
+  }));
 
   it('should check if maintenance is due', () => {
     app.landingComponentRef = {

diff --git a/src/app/country/country.component.spec.ts b/src/app/country/country.component.spec.ts
@@ -130,6 +130,7 @@ describe('CountryComponent', () => {
 
     component.barChart = barChart;
     component.country = 'France';
+    component.includeCTZero = false;
     tick(1);
     expect(barChart.removeAllSeries).toHaveBeenCalled();
     expect(barChart.ngAfterViewInit).toHaveBeenCalled();
@@ -209,6 +210,7 @@ describe('CountryComponent', () => {
 
   it('should refresh the data when the includeCTZero is set', () => {
     spyOn(component, 'refreshCardData');
+    component.country = undefined;
     component.includeCTZero = true;
 
     expect(component.refreshCardData).not.toHaveBeenCalled();
@@ -217,14 +219,14 @@ describe('CountryComponent', () => {
 
     expect(component.refreshCardData).not.toHaveBeenCalled();
 
-    component.cardData = { provider: [] };
-    component.includeCTZero = true;
-
+    component.country = 'FR';
     expect(component.refreshCardData).toHaveBeenCalled();
 
-    component.includeCTZero = false;
-
+    component.includeCTZero = true;
     expect(component.refreshCardData).toHaveBeenCalledTimes(2);
+
+    component.includeCTZero = false;
+    expect(component.refreshCardData).toHaveBeenCalledTimes(3);
   });
 
   it('should handle the intersectionObserverCallback', () => {

diff --git a/src/app/country/country.component.ts b/src/app/country/country.component.ts
@@ -12,6 +12,7 @@ import {
   UpperCasePipe
 } from '@angular/common';
 import {
+  AfterViewInit,
   ApplicationRef,
   Component,
   ElementRef,
@@ -101,7 +102,10 @@ import { TruncateComponent } from '../truncate';
     StripMarkupPipe
   ]
 })
-export class CountryComponent extends SubscriptionManager {
+export class CountryComponent
+  extends SubscriptionManager
+  implements AfterViewInit
+{
   public externalLinks = externalLinks;
   public DimensionName = DimensionName;
 
@@ -118,15 +122,15 @@ export class CountryComponent extends SubscriptionManager {
   abbreviateNumberPipe = new AbbreviateNumberPipe();
 
   cardData: IHash<Array<NamesValuePercent>>;
-  _includeCTZero = false;
+  _includeCTZero?: boolean;
 
   @Input() set includeCTZero(includeCTZero: boolean) {
     this._includeCTZero = includeCTZero;
-    if (this.cardData) {
+    if (this.country) {
       this.refreshCardData();
     }
   }
-  get includeCTZero(): boolean {
+  get includeCTZero(): boolean | undefined {
     return this._includeCTZero;
   }
 
@@ -154,7 +158,9 @@ export class CountryComponent extends SubscriptionManager {
    **/
   set country(country: string) {
     this._country = country;
-    this.refreshCardData();
+    if (typeof this.includeCTZero === 'boolean') {
+      this.refreshCardData();
+    }
     this.showTargetsData = !!this.targetMetaData[country];
     this.setHeaderData(country);
   }
@@ -163,6 +169,10 @@ export class CountryComponent extends SubscriptionManager {
     return this._country;
   }
 
+  ngAfterViewInit(): void {
+    this.initialiseIntersectionObserver();
+  }
+
   targetMetaData: IHash<IHashArray<TargetMetaData>>;
   countryData: IHash<Array<TargetData>> = {};
   latestCountryData: TargetData;
@@ -226,9 +236,7 @@ export class CountryComponent extends SubscriptionManager {
                 this.router.navigate(['/']);
               }
             }
-
             this.setCountryToParam(country);
-            this.initialiseIntersectionObserver();
           },
           error: (e: Error) => {
             console.log(e);
@@ -332,7 +340,6 @@ export class CountryComponent extends SubscriptionManager {
             this.cardData = {};
           }
           this.cardData[dimensionName] = cardData;
-
           if (fnCallback) {
             fnCallback();
           }