119602: Port disabling of cookie popup from main

Author: AAwouters

.github/workflows/build.yml

@@ -29,6 +29,8 @@ jobs:
       DSPACE_CACHE_SERVERSIDE_ANONYMOUSCACHE_MAX: 0
       # Tell Cypress to run e2e tests using the same UI URL
       CYPRESS_BASE_URL: http://127.0.0.1:4000
+      # Disable the cookie consent banner in e2e tests to avoid errors because of elements hidden by it
+      DSPACE_INFO_ENABLECOOKIECONSENTPOPUP: false
       # When Chrome version is specified, we pin to a specific version of Chrome
       # Comment this out to use the latest release
       #CHROME_VERSION: "90.0.4430.212-1"

src/app/footer/footer.component.html

@@ -63,8 +63,8 @@ <h5 class="text-uppercase">Footer Content</h5>
            href="https://www.lyrasis.org/" role="link" tabindex="0">{{ 'footer.link.lyrasis' | translate}}</a>
       </p>
       <ul class="footer-info list-unstyled d-flex justify-content-center mb-0">
-        <li>
-          <button class="btn btn-link text-white" type="button" (click)="showCookieSettings()" role="button" tabindex="0">
+        <li *ngIf="showCookieSettings">
+          <button class="btn btn-link text-white" type="button" (click)="openCookieSettings()" role="button" tabindex="0">
             {{ 'footer.link.cookies' | translate}}
           </button>
         </li>

src/app/footer/footer.component.spec.ts

@@ -17,6 +17,8 @@ import { TranslateLoaderMock } from '../shared/mocks/translate-loader.mock';
 import { storeModuleConfig } from '../app.reducer';
 import { AuthorizationDataService } from '../core/data/feature-authorization/authorization-data.service';
 import { AuthorizationDataServiceStub } from '../shared/testing/authorization-service.stub';
+import { APP_CONFIG } from '../../config/app-config.interface';
+import { environment } from '../../environments/environment.test';
 
 let comp: FooterComponent;
 let fixture: ComponentFixture<FooterComponent>;
@@ -38,6 +40,7 @@ describe('Footer component', () => {
       providers: [
         FooterComponent,
         { provide: AuthorizationDataService, useClass: AuthorizationDataServiceStub },
+        { provide: APP_CONFIG, useValue: environment },
       ],
       schemas: [CUSTOM_ELEMENTS_SCHEMA]
     });

src/app/footer/footer.component.ts

@@ -1,35 +1,42 @@
-import { Component, Optional } from '@angular/core';
+import { Component, Optional, Inject, OnInit } from '@angular/core';
 import { hasValue } from '../shared/empty.util';
 import { KlaroService } from '../shared/cookies/klaro.service';
 import { environment } from '../../environments/environment';
 import { Observable } from 'rxjs';
 import { AuthorizationDataService } from '../core/data/feature-authorization/authorization-data.service';
 import { FeatureID } from '../core/data/feature-authorization/feature-id';
+import { AppConfig, APP_CONFIG } from '../../config/app-config.interface';
 
 @Component({
   selector: 'ds-footer',
   styleUrls: ['footer.component.scss'],
   templateUrl: 'footer.component.html'
 })
-export class FooterComponent {
+export class FooterComponent implements OnInit {
   dateObj: number = Date.now();
 
   /**
    * A boolean representing if to show or not the top footer container
    */
   showTopFooter = false;
+  showCookieSettings = false;
   showPrivacyPolicy = environment.info.enablePrivacyStatement;
   showEndUserAgreement = environment.info.enableEndUserAgreement;
   showSendFeedback$: Observable<boolean>;
 
   constructor(
     @Optional() private cookies: KlaroService,
     private authorizationService: AuthorizationDataService,
+    @Inject(APP_CONFIG) protected appConfig: AppConfig,
   ) {
     this.showSendFeedback$ = this.authorizationService.isAuthorized(FeatureID.CanSendFeedback);
   }
 
-  showCookieSettings() {
+  ngOnInit() {
+    this.showCookieSettings = this.appConfig.info.enableCookieConsentPopup;
+  }
+
+  openCookieSettings() {
     if (hasValue(this.cookies)) {
       this.cookies.showSettings();
     }

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

@@ -145,7 +145,12 @@ export class BrowserKlaroService extends KlaroService {
          */
         this.translateConfiguration();
 
-        this.klaroConfig.services = this.filterConfigServices(servicesToHide);
+        if (!environment.info?.enableCookieConsentPopup) {
+          this.klaroConfig.services = [];
+        } else {
+          this.klaroConfig.services = this.filterConfigServices(servicesToHide);
+        }
+
         this.lazyKlaro.then(({ setup }) => setup(this.klaroConfig));
       });
   }

src/config/default-app-config.ts

@@ -412,7 +412,8 @@ 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,
+    enableCookieConsentPopup: true,
   };
 
   // Whether to enable Markdown (https://commonmark.org/) and MathJax (https://www.mathjax.org/)

src/config/info-config.interface.ts

@@ -3,4 +3,5 @@ import { Config } from './config.interface';
 export interface InfoConfig extends Config {
   enableEndUserAgreement: boolean;
   enablePrivacyStatement: boolean;
+  enableCookieConsentPopup: boolean;
 }

src/environments/environment.test.ts

@@ -321,6 +321,7 @@ export const environment: BuildConfig = {
   info: {
     enableEndUserAgreement: true,
     enablePrivacyStatement: true,
+    enableCookieConsentPopup: true,
   },
   markdown: {
     enabled: false,