feat: observe for/and change langauge from outside

angular.json

@@ -136,5 +136,8 @@
         }
       }
     }
+  },
+  "cli": {
+    "analytics": false
   }
 }

projects/ngx-cookie-consent/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@localia/ngx-cookie-consent",
-    "version": "3.0.0",
+    "version": "3.1.0",
     "description": "Angular module to display a cookie consent banner without other dependencies.",
     "author": "Giacomo Barbalinardo <me@giacomo.dev>",
     "license": "MIT",

projects/ngx-cookie-consent/src/lib/ngx-cookie-consent.component.spec.ts

@@ -5,6 +5,7 @@ import { FormBuilder, FormGroup, FormsModule, ReactiveFormsModule } from '@angul
 import { NgxCookieConsentService } from './services/ngx-cookie-consent/ngx-cookie-consent.service';
 import { NavigationEnd, Router, RouterEvent } from '@angular/router';
 import { Subject } from 'rxjs';
+import { NgxCookieEventbusService } from './services/ngx-cookie-eventbus/ngx-cookie-eventbus.service';
 
 describe('NgxCookieConsentComponent', () => {
     let component: NgxCookieConsentComponent;
@@ -221,6 +222,8 @@ describe('NgxCookieConsentComponent', () => {
         spyOn(consentServiceMock, 'setLanguage').and.returnValue();
 
         component.dropDownOpen = true;
+
+
         component.switchLanguage('en');
 
         expect(consentServiceMock.setLanguage).toHaveBeenCalledWith('en');

projects/ngx-cookie-consent/src/lib/services/ngx-cookie-consent/ngx-cookie-consent.service.spec.ts

@@ -3,6 +3,7 @@ import { TestBed } from '@angular/core/testing';
 import { NgxCookieConsentService } from './ngx-cookie-consent.service';
 import { NgxLanguageService } from '../ngx-language/ngx-language.service';
 import { NgxCookieService } from '../ngx-cookie/ngx-cookie.service';
+import { NgxCookieEventbusService } from '../ngx-cookie-eventbus/ngx-cookie-eventbus.service';
 
 describe('NgxCookieConsentService', () => {
     let service: NgxCookieConsentService;
@@ -76,11 +77,15 @@ describe('NgxCookieConsentService', () => {
     });
 
     it('should set the language', () => {
+        const eventbusService = TestBed.inject(NgxCookieEventbusService);
+        spyOn(eventbusService.languageUpdatedSubject, 'next').and.returnValue();
+
         spyOn(service, 'setConfig').and.returnValue();
 
         service.setLanguage('de');
         expect(service.activeLang).toEqual('de');
         expect(service.setConfig).toHaveBeenCalledWith('defaultLanguage', 'de');
+        expect(eventbusService.languageUpdatedSubject.next).toHaveBeenCalledWith('de');
     });
 
     it('should set a config value', () => {

projects/ngx-cookie-consent/src/lib/services/ngx-cookie-consent/ngx-cookie-consent.service.ts

@@ -3,20 +3,29 @@ import { NgxCookieConsentConfigService } from '../../config/ngx-cookie-consent-c
 import { NgxCookieService } from '../ngx-cookie/ngx-cookie.service';
 import { NgxLanguageService } from '../ngx-language/ngx-language.service';
 import { NgxCookieManagerService } from '../ngx-cookie-manager/ngx-cookie-manager.service';
+import { NgxCookieEventbusService } from '../ngx-cookie-eventbus/ngx-cookie-eventbus.service';
+import { Subscription } from 'rxjs';
 
 @Injectable({
     providedIn: 'root'
 })
 export class NgxCookieConsentService {
+    private langChangedSubscription: Subscription;
     activeLang = 'en';
 
     constructor(
         private cookieManagerService: NgxCookieManagerService,
         private cookieService: NgxCookieService,
         private cookieConsentConfig: NgxCookieConsentConfigService,
-        private languageService: NgxLanguageService
+        private languageService: NgxLanguageService,
+        private cookieEventbusService: NgxCookieEventbusService,
     ) {
         this.activeLang = this.getConfig('defaultLanguage');
+        this.langChangedSubscription = this.cookieEventbusService.languageChanged$.subscribe({
+            next: () => {
+                this.activeLang = this.getConfig('defaultLanguage');
+            }
+        });
     }
 
     getTranslation(key: string, translationLang?: string): string {
@@ -47,6 +56,9 @@ export class NgxCookieConsentService {
     setLanguage(lang: string): void {
         this.activeLang = lang;
         this.setConfig('defaultLanguage', lang);
+        console.log('test');
+        this.cookieEventbusService.languageUpdatedSubject.next(lang);
+        console.log('test2');
     }
 
     setConfig(key: string, value: string): void {

projects/ngx-cookie-consent/src/lib/services/ngx-cookie-eventbus/ngx-cookie-eventbus.service.spec.ts

@@ -0,0 +1,32 @@
+import { TestBed } from '@angular/core/testing';
+
+import { NgxCookieEventbusService } from './ngx-cookie-eventbus.service';
+
+describe('NgxCookieEventbusService', () => {
+    let service: NgxCookieEventbusService;
+
+    beforeEach(() => {
+        TestBed.configureTestingModule({});
+        service = TestBed.inject(NgxCookieEventbusService);
+    });
+
+    it('should be created', () => {
+        expect(service).toBeTruthy();
+    });
+
+    it('should have languageChangedSubject', () => {
+        expect(service.languageChangedSubject).toBeTruthy();
+    });
+
+    it('should have languageChanged$', () => {
+        expect(service.languageChanged$).toBeTruthy();
+    });
+
+    it('should have languageUpdatedSubject', () => {
+        expect(service.languageUpdatedSubject).toBeTruthy();
+    });
+
+    it('should have languageUpdated$', () => {
+        expect(service.languageUpdated$).toBeTruthy();
+    });
+});

projects/ngx-cookie-consent/src/lib/services/ngx-cookie-eventbus/ngx-cookie-eventbus.service.ts

@@ -0,0 +1,22 @@
+import { Injectable } from '@angular/core';
+import { Observable, Subject } from 'rxjs';
+
+@Injectable({
+    providedIn: 'root'
+})
+export class NgxCookieEventbusService {
+    public languageChangedSubject: Subject<boolean>;
+    public languageChanged$: Observable<boolean>;
+
+    public languageUpdatedSubject: Subject<string>;
+    public languageUpdated$: Observable<string>;
+
+
+    constructor() {
+        this.languageChangedSubject = new Subject<boolean>();
+        this.languageChanged$ = this.languageChangedSubject.asObservable();
+
+        this.languageUpdatedSubject = new Subject<string>();
+        this.languageUpdated$ = this.languageUpdatedSubject.asObservable();
+    }
+}

projects/ngx-cookie-consent/src/lib/services/ngx-cookie-manager/ngx-cookie-manager.service.spec.ts

@@ -3,14 +3,41 @@ import { TestBed } from '@angular/core/testing';
 import { NgxCookieManagerService } from './ngx-cookie-manager.service';
 
 describe('NgxCookieManagerService', () => {
-  let service: NgxCookieManagerService;
+    let service: NgxCookieManagerService;
 
-  beforeEach(() => {
-    TestBed.configureTestingModule({});
-    service = TestBed.inject(NgxCookieManagerService);
-  });
+    beforeEach(() => {
+        TestBed.configureTestingModule({});
+        service = TestBed.inject(NgxCookieManagerService);
+    });
 
-  it('should be created', () => {
-    expect(service).toBeTruthy();
-  });
+    it('should be created', () => {
+        expect(service).toBeTruthy();
+    });
+
+    it('should return default language', () => {
+        spyOn((service as any), 'getConfig').and.returnValue('en');
+        expect(service.getDisplayLanguage()).toEqual('en');
+    });
+
+    it('should update default language', () => {
+        spyOn((service as any), 'getConfig').and.returnValue(['en', 'de']);
+        spyOn((service as any), 'setConfig');
+        spyOn(service['cookieEventbusService'].languageChangedSubject, 'next');
+
+        service.updateDisplayLanguage('de');
+
+        expect(service['setConfig']).toHaveBeenCalledWith('defaultLanguage', 'de');
+        expect(service['cookieEventbusService'].languageChangedSubject.next).toHaveBeenCalledWith(true);
+    });
+
+    it('should not update default language', () => {
+        spyOn((service as any), 'getConfig').and.returnValue(['en', 'de']);
+        spyOn((service as any), 'setConfig');
+        spyOn(service['cookieEventbusService'].languageChangedSubject, 'next');
+
+        service.updateDisplayLanguage('fr');
+
+        expect(service['setConfig']).not.toHaveBeenCalled();
+        expect(service['cookieEventbusService'].languageChangedSubject.next).not.toHaveBeenCalled();
+    });
 });

projects/ngx-cookie-consent/src/lib/services/ngx-cookie-manager/ngx-cookie-manager.service.ts

@@ -1,28 +1,52 @@
 import { Injectable } from '@angular/core';
-import { Subject } from 'rxjs';
+import { Observable, Subject } from 'rxjs';
 import { NgxCookieService } from '../ngx-cookie/ngx-cookie.service';
 import { NgxCookieConsentConfigService } from '../../config/ngx-cookie-consent-config.service';
+import { NgxCookieEventbusService } from '../ngx-cookie-eventbus/ngx-cookie-eventbus.service';
 
 @Injectable({
   providedIn: 'root'
 })
 export class NgxCookieManagerService {
     cookieUpdated$ = new Subject<{name: string, state: boolean}>();
+    languageChanged$: Observable<string>;
 
     constructor(
         private cookieService: NgxCookieService,
         private cookieConsentConfig: NgxCookieConsentConfigService,
-    ) { }
+        private cookieEventbusService: NgxCookieEventbusService,
+    ) {
+        this.languageChanged$ = this.cookieEventbusService.languageUpdated$;
+    }
 
     private getConfig(key: string): any {
         return (this.cookieConsentConfig as any)[key];
     }
 
+    private setConfig(key: string, value: string): void {
+        (this.cookieConsentConfig as any)[key] = value;
+    }
+
     private getPrefixedCookieName(name: string): string {
         return this.getConfig('cookiePrefix') + name;
     }
 
     getCookie(cookieName: string): boolean {
         return this.cookieService.get(this.getPrefixedCookieName(cookieName)) === true;
     }
+
+    updateDisplayLanguage(locale: string): void {
+        const availableLanguages = this.getConfig('availableLanguages');
+
+        if (!availableLanguages.includes(locale)) {
+            return;
+        }
+
+        this.setConfig('defaultLanguage', locale);
+        this.cookieEventbusService.languageChangedSubject.next(true);
+    }
+
+    getDisplayLanguage(): string {
+        return this.getConfig('defaultLanguage');
+    }
 }

src/app/pages/home/home.component.html

@@ -3,6 +3,13 @@ <h1>home works!</h1>
 
     <p>This is just a demo-Page, choose the navigation to change the page.</p>
 
+    <p>
+        Current language: {{ currentLanguage }}
+    </p>
+
+    <button (click)="switchLanguage('en')">Switch language: EN</button>
+    <button (click)="switchLanguage('de')">Switch language: DE</button>
+
     <div class="menu">
         <ul>
             <li><a [routerLink]="'/'">Home</a></li>

src/app/pages/home/home.component.ts

@@ -1,15 +1,27 @@
 import { Component, OnInit } from '@angular/core';
+import { NgxCookieManagerService } from 'projects/ngx-cookie-consent/src/public-api';
 
 @Component({
-  selector: 'app-home',
-  templateUrl: './home.component.html',
-  styleUrls: ['./home.component.scss']
+    selector: 'app-home',
+    templateUrl: './home.component.html',
+    styleUrls: ['./home.component.scss']
 })
 export class HomeComponent implements OnInit {
 
-  constructor() { }
+    constructor(
+        private cookieManager: NgxCookieManagerService
+    ) {
+    }
 
-  ngOnInit(): void {
-  }
+    ngOnInit(): void {
+    }
+
+    get currentLanguage(): string {
+        return this.cookieManager.getDisplayLanguage();
+    }
+
+    switchLanguage(lang: string): void {
+        this.cookieManager.updateDisplayLanguage(lang);
+    }
 
 }