From f082feed3feb02387c2eea02f0c839653ad4270c Mon Sep 17 00:00:00 2001
From: Victor Costa <vfcosta@gmail.com>
Date: Tue, 15 Mar 2016 18:43:21 -0300
Subject: [PATCH] Refactor language component

---
 src/app/components/language-selector/language-selector.component.spec.ts | 53 ++++++-----------------------------------------------
 src/app/components/language-selector/language-selector.component.ts      | 41 +++++++----------------------------------
 src/app/components/language-selector/language-selector.html              |  2 +-
 src/app/components/language-selector/language.service.spec.ts            | 61 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/app/components/language-selector/language.service.ts                 | 59 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 src/app/components/notification/notification.component.spec.ts           | 25 ++++++++++++-------------
 src/app/components/notification/notification.component.ts                | 12 ++++++------
 src/spec/mocks.ts                                                        |  7 +++++--
 typings.json                                                             |  1 +
 9 files changed, 158 insertions(+), 103 deletions(-)
 create mode 100644 src/app/components/language-selector/language.service.spec.ts
 create mode 100644 src/app/components/language-selector/language.service.ts

diff --git a/src/app/components/language-selector/language-selector.component.spec.ts b/src/app/components/language-selector/language-selector.component.spec.ts
index f1da99f..3f8e9de 100644
--- a/src/app/components/language-selector/language-selector.component.spec.ts
+++ b/src/app/components/language-selector/language-selector.component.spec.ts
@@ -11,69 +11,28 @@ describe("Components", () => {
 
         beforeEach(angular.mock.module("templates"));
 
+        let languageService: any;
+
         let buildComponent = (): Promise<ComponentFixture> => {
+            languageService = jasmine.createSpyObj("languageService", ["availableLanguages", "currentLanguage"])
             return helpers.quickCreateComponent({
                 template: "<language-selector></language-selector>",
                 directives: [LanguageSelector],
                 providers: [
-                    provide('$translate', {
-                        useValue: helpers.mocks.$translate
-                    }),
-                    provide('tmhDynamicLocale', {
-                        useValue: helpers.mocks.tmhDynamicLocale
-                    }),
-                    provide('amMoment', {
-                        useValue: helpers.mocks.amMoment
-                    }),
-                    provide('angularLoad', {
-                        useValue: helpers.mocks.angularLoad
+                    provide('LanguageService', {
+                        useValue: languageService
                     })
                 ].concat(helpers.provideFilters("translateFilter"))
             });
         }
 
-        it("set available languages when change language", (done) => {
-            let component: LanguageSelector = new LanguageSelector(
-                <any>helpers.mocks.$translate,
-                <any>helpers.mocks.tmhDynamicLocale,
-                <any>helpers.mocks.amMoment,
-                <any>helpers.mocks.angularLoad
-            );
-            component.availableLanguages = null;
-            expect(component.availableLanguages).toBeNull();
-            component.changeLanguage('en');
-            expect(component.availableLanguages).toBeDefined();
-            done();
-        });
-
         it("display language options", (done) => {
             buildComponent().then(fixture => {
+                fixture.debugElement.getLocal("$rootScope").$apply();
                 expect(fixture.debugElement.queryAll('li.language').length).toEqual(2);
                 done();
             });
         });
 
-        it("change the language", (done) => {
-            buildComponent().then(fixture => {
-                let component: LanguageSelector = fixture.debugElement.componentViewChildren[0].componentInstance;
-                let $q = fixture.debugElement.getLocal("$q");
-                let loadScripPromise = $q.defer();
-                loadScripPromise.resolve();
-                component["angularLoad"].loadScript = jasmine.createSpy("loadScript").and.returnValue(loadScripPromise.promise);
-                component["tmhDynamicLocale"].set = jasmine.createSpy("set");
-                component["tmhDynamicLocale"].get = jasmine.createSpy("get").and.returnValue("en");
-                component["$translate"].use = jasmine.createSpy("use");
-
-                component.changeLanguage('pt');
-                fixture.debugElement.getLocal("$rootScope").$digest();
-
-                expect(component["angularLoad"].loadScript).toHaveBeenCalledWith("/bower_components/moment/locale/pt.js");
-                expect(component["angularLoad"].loadScript).toHaveBeenCalledWith("/bower_components/messageformat/locale/pt.js");
-                expect(component["tmhDynamicLocale"].set).toHaveBeenCalledWith("pt");
-                expect(component["$translate"].use).toHaveBeenCalledWith("pt");
-                done();
-            });
-        });
-
     });
 });
diff --git a/src/app/components/language-selector/language-selector.component.ts b/src/app/components/language-selector/language-selector.component.ts
index 87c6060..892ee33 100644
--- a/src/app/components/language-selector/language-selector.component.ts
+++ b/src/app/components/language-selector/language-selector.component.ts
@@ -1,51 +1,24 @@
 import {Component, Inject} from "ng-forward";
+import {LanguageService} from "./language.service";
 
 @Component({
     selector: "language-selector",
     templateUrl: "app/components/language-selector/language-selector.html"
 })
-@Inject("$translate", "tmhDynamicLocale", "amMoment", "angularLoad")
+@Inject(LanguageService)
 export class LanguageSelector {
 
-    availableLanguages: any;
-
-    constructor(private $translate: angular.translate.ITranslateService,
-        private tmhDynamicLocale: any,
-        private amMoment: any,
-        private angularLoad: any) {
-
-        this.configAvailableLanguages();
-        this.changeLanguage(tmhDynamicLocale.get() || $translate.use());
-    }
+    constructor(private languageService: LanguageService) { }
 
     currentLanguage() {
-        return this.$translate.use();
+        return this.languageService.currentLanguage();
     }
 
     changeLanguage(language: string) {
-        this.changeMomentLocale(language);
-        this.tmhDynamicLocale.set(language);
-        this.angularLoad.loadScript(`/bower_components/messageformat/locale/${language}.js`).then(() => {
-            return this.$translate.use(language);
-        }).then(() => {
-            this.configAvailableLanguages();
-        });
-    }
-
-    private configAvailableLanguages() {
-        this.availableLanguages = {
-            "en": this.$translate.instant("language.en"),
-            "pt": this.$translate.instant("language.pt")
-        };
+        this.languageService.changeLanguage(language);
     }
 
-    private changeMomentLocale(language: string) {
-        let localePromise = Promise.resolve();
-        if (language != "en") {
-            localePromise = this.angularLoad.loadScript(`/bower_components/moment/locale/${language}.js`);
-        }
-        localePromise.then(() => {
-            this.amMoment.changeLocale(language);
-        });
+    availableLanguages() {
+        return this.languageService.availableLanguages;
     }
 }
diff --git a/src/app/components/language-selector/language-selector.html b/src/app/components/language-selector/language-selector.html
index 4f7b6f6..9499df5 100644
--- a/src/app/components/language-selector/language-selector.html
+++ b/src/app/components/language-selector/language-selector.html
@@ -3,7 +3,7 @@
     <span>{{"language.selector" | translate}}</span> <b class="caret"></b>
   </a>
   <ul class="dropdown-menu" dropdown-menu>
-    <li ng-repeat="(language, description) in ctrl.availableLanguages"
+    <li ng-repeat="(language, description) in ctrl.availableLanguages()"
       class="language language-{{language}}" ng-class="{'active': language==ctrl.currentLanguage()}">
       <a href="#" ng-click="ctrl.changeLanguage(language)">
         {{description}}
diff --git a/src/app/components/language-selector/language.service.spec.ts b/src/app/components/language-selector/language.service.spec.ts
new file mode 100644
index 0000000..471c5fb
--- /dev/null
+++ b/src/app/components/language-selector/language.service.spec.ts
@@ -0,0 +1,61 @@
+import {ComponentFixture} from 'ng-forward/cjs/testing/test-component-builder';
+import {provide} from 'ng-forward';
+
+import {LanguageService} from './language.service';
+
+import * as helpers from "../../../spec/helpers";
+
+describe("Services", () => {
+
+    describe("Language Service", () => {
+
+        let $rootScope: ng.IScope;
+        let $q: ng.IQService;
+
+        beforeEach(inject((_$rootScope_: ng.IRootScopeService, _$q_: ng.IQService) => {
+            $rootScope = _$rootScope_;
+            $q = _$q_;
+        }));
+
+        it("set available languages when change language", (done) => {
+            let component: LanguageService = new LanguageService(
+                <any>helpers.mocks.$translate,
+                <any>helpers.mocks.tmhDynamicLocale,
+                <any>helpers.mocks.amMoment,
+                <any>helpers.mocks.angularLoad,
+                helpers.mocks.scopeWithEvents
+            );
+            component.availableLanguages = null;
+            expect(component.availableLanguages).toBeNull();
+            component.changeLanguage('en');
+            expect(component.availableLanguages).toBeDefined();
+            done();
+        });
+
+        it("change the language", (done) => {
+            let component: LanguageService = new LanguageService(
+                <any>helpers.mocks.$translate,
+                <any>helpers.mocks.tmhDynamicLocale,
+                <any>helpers.mocks.amMoment,
+                <any>helpers.mocks.angularLoad,
+                helpers.mocks.scopeWithEvents
+            );
+            let loadScripPromise = $q.defer();
+            loadScripPromise.resolve();
+            component["angularLoad"].loadScript = jasmine.createSpy("loadScript").and.returnValue(loadScripPromise.promise);
+            component["tmhDynamicLocale"].set = jasmine.createSpy("set");
+            component["tmhDynamicLocale"].get = jasmine.createSpy("get").and.returnValue("en");
+            component["$translate"].use = jasmine.createSpy("use");
+
+            component.changeLanguage('pt');
+            $rootScope.$digest();
+
+            expect(component["angularLoad"].loadScript).toHaveBeenCalledWith("/bower_components/moment/locale/pt.js");
+            expect(component["angularLoad"].loadScript).toHaveBeenCalledWith("/bower_components/messageformat/locale/pt.js");
+            expect(component["tmhDynamicLocale"].set).toHaveBeenCalledWith("pt");
+            expect(component["$translate"].use).toHaveBeenCalledWith("pt");
+            done();
+        });
+
+    });
+});
diff --git a/src/app/components/language-selector/language.service.ts b/src/app/components/language-selector/language.service.ts
new file mode 100644
index 0000000..f93c17d
--- /dev/null
+++ b/src/app/components/language-selector/language.service.ts
@@ -0,0 +1,59 @@
+import {Injectable, Inject} from "ng-forward";
+
+@Injectable()
+@Inject("$translate", "tmhDynamicLocale", "amMoment", "angularLoad", "$rootScope")
+export class LanguageService {
+
+    availableLanguages: any;
+
+    constructor(private $translate: angular.translate.ITranslateService,
+        private tmhDynamicLocale: angular.dynamicLocale.tmhDynamicLocaleService,
+        private amMoment: any,
+        private angularLoad: any,
+        private $rootScope: any) {
+
+        this.configAvailableLanguages();
+        this.$rootScope.$on("$localeChangeSuccess", () => {
+            this.changeLanguage(tmhDynamicLocale.get() || $translate.use());
+        });
+    }
+
+    currentLanguage() {
+        return this.$translate.use();
+    }
+
+    changeLanguage(language: string) {
+        if (!language) {
+            console.log("WARN: language undefined");
+            return;
+        }
+        this.changeMomentLocale(language);
+        this.tmhDynamicLocale.set(language);
+        this.angularLoad.loadScript(`/bower_components/messageformat/locale/${language}.js`).then(() => {
+            return this.$translate.use(language);
+        }).then(() => {
+            this.configAvailableLanguages();
+        });
+    }
+
+    translate(text: string) {
+        return this.$translate.instant(text);
+    }
+
+    private configAvailableLanguages() {
+        this.availableLanguages = {
+            "en": this.$translate.instant("language.en"),
+            "pt": this.$translate.instant("language.pt")
+        };
+    }
+
+    private changeMomentLocale(language: string) {
+        let localePromise = Promise.resolve();
+        if (language != "en") {
+            localePromise = this.angularLoad.loadScript(`/bower_components/moment/locale/${language}.js`);
+        }
+        localePromise.then(() => {
+            this.amMoment.changeLocale(language);
+        });
+    }
+}
diff --git a/src/app/components/notification/notification.component.spec.ts b/src/app/components/notification/notification.component.spec.ts
index 4cd18cd..18149c9 100644
--- a/src/app/components/notification/notification.component.spec.ts
+++ b/src/app/components/notification/notification.component.spec.ts
@@ -13,12 +13,12 @@ describe("Components", () => {
 
         beforeEach(angular.mock.module("templates"));
 
-        it("use the default message when call notification component without a specific message", done => {
+        it("use the default message when call notification component without a message", done => {
             let sweetAlert = jasmine.createSpyObj("sweetAlert", ["swal"]);
             sweetAlert.swal = jasmine.createSpy("swal");
 
-            let component: Notification = new Notification(<any>helpers.mocks.$log, <any>sweetAlert, <any>helpers.mocks.$translate);
-            component.httpError(500, {});
+            let component: Notification = new Notification(<any>helpers.mocks.$log, <any>sweetAlert, <any>helpers.mocks.languageService);
+            component.error();
             expect(sweetAlert.swal).toHaveBeenCalledWith(jasmine.objectContaining({
                 text: Notification.DEFAULT_ERROR_MESSAGE,
                 type: "error"
@@ -26,27 +26,26 @@ describe("Components", () => {
             done();
         });
 
-        it("use the default message when call notification component without error data", done => {
+        it("display a success message when call notification success", done => {
             let sweetAlert = jasmine.createSpyObj("sweetAlert", ["swal"]);
             sweetAlert.swal = jasmine.createSpy("swal");
 
-            let component: Notification = new Notification(<any>helpers.mocks.$log, <any>sweetAlert, <any>helpers.mocks.$translate);
-            component.httpError(500, null);
+            let component: Notification = new Notification(<any>helpers.mocks.$log, <any>sweetAlert, <any>helpers.mocks.languageService);
+            component.success("title", "message", 1000);
             expect(sweetAlert.swal).toHaveBeenCalledWith(jasmine.objectContaining({
-                text: Notification.DEFAULT_ERROR_MESSAGE,
-                type: "error"
+                type: "success"
             }));
             done();
         });
 
-        it("display a success message when call notification success", done => {
+        it("display a message relative to the http error code", done => {
             let sweetAlert = jasmine.createSpyObj("sweetAlert", ["swal"]);
             sweetAlert.swal = jasmine.createSpy("swal");
 
-            let component: Notification = new Notification(<any>helpers.mocks.$log, <any>sweetAlert, <any>helpers.mocks.$translate);
-            component.success("title", "message", 1000);
+            let component: Notification = new Notification(<any>helpers.mocks.$log, <any>sweetAlert, <any>helpers.mocks.languageService);
+            component.httpError(500, {});
             expect(sweetAlert.swal).toHaveBeenCalledWith(jasmine.objectContaining({
-                type: "success"
+                text: "notification.http_error.500.message"
             }));
             done();
         });
@@ -55,7 +54,7 @@ describe("Components", () => {
             let sweetAlert = jasmine.createSpyObj("sweetAlert", ["swal"]);
             sweetAlert.swal = jasmine.createSpy("swal");
 
-            let component: Notification = new Notification(<any>helpers.mocks.$log, <any>sweetAlert, <any>helpers.mocks.$translate);
+            let component: Notification = new Notification(<any>helpers.mocks.$log, <any>sweetAlert, <any>helpers.mocks.languageService);
             component.success("title", "message");
             expect(sweetAlert.swal).toHaveBeenCalledWith(jasmine.objectContaining({
                 type: "success",
diff --git a/src/app/components/notification/notification.component.ts b/src/app/components/notification/notification.component.ts
index 725d3c6..3118394 100644
--- a/src/app/components/notification/notification.component.ts
+++ b/src/app/components/notification/notification.component.ts
@@ -1,13 +1,14 @@
 import {Injectable, Inject} from "ng-forward";
+import {LanguageService} from "../language-selector/language.service";
 
 @Injectable()
-@Inject("$log", "SweetAlert", "$translate")
+@Inject("$log", "SweetAlert", LanguageService)
 export class Notification {
 
     constructor(
         private $log: ng.ILogService,
         private SweetAlert: any,
-        private $translate: angular.translate.ITranslateService
+        private languageService: LanguageService
     ) { }
 
     public static DEFAULT_ERROR_TITLE = "notification.error.default.title";
@@ -15,16 +16,15 @@ export class Notification {
     public static DEFAULT_SUCCESS_TIMER = 1000;
 
     error(message: string = Notification.DEFAULT_ERROR_MESSAGE, title: string = Notification.DEFAULT_ERROR_TITLE) {
-        this.$log.debug("Notification error:", title, message);
+        this.$log.debug("Notification error:", title, message, this.languageService.currentLanguage());
         this.SweetAlert.swal({
-            title: this.$translate.instant(title),
-            text: this.$translate.instant(message),
+            title: this.languageService.translate(title),
+            text: this.languageService.translate(message),
             type: "error"
         });
     }
 
     httpError(status: number, data: any): boolean {
-        let message = (data || {}).message || Notification.DEFAULT_ERROR_MESSAGE;
         this.error(`notification.http_error.${status}.message`);
         return true; // return true to indicate that the error was already handled
     }
diff --git a/src/spec/mocks.ts b/src/spec/mocks.ts
index efbbe50..d8c732f 100644
--- a/src/spec/mocks.ts
+++ b/src/spec/mocks.ts
@@ -6,13 +6,11 @@ class ScopeWithEvents {
     }
 
     public $on(eventName: string, func: Function) {
-        console.log(this.listeners);
         if ((<any>this.listeners)[eventName]) {
             (<any>this.listeners)[eventName].push(func);
         } else {
             (<any>this.listeners)[eventName] = [func];
         }
-        console.log(this.listeners);
     }
 
     public $emit(message: string, arg?: any) {
@@ -97,5 +95,10 @@ export var mocks = {
     },
     $log: {
         debug: () => { }
+    },
+    languageService: {
+        currentLanguage: () => { },
+        changeLanguage: (lang: string) => { },
+        translate: (text: string) => { return text }
     }
 };
diff --git a/typings.json b/typings.json
index 2cd6ffe..068b692 100644
--- a/typings.json
+++ b/typings.json
@@ -4,6 +4,7 @@
   "devDependencies": {},
   "ambientDependencies": {
     "angular": "github:DefinitelyTyped/DefinitelyTyped/angularjs/angular.d.ts#1c4a34873c9e70cce86edd0e61c559e43dfa5f75",
+    "angular-dynamic-locale": "github:DefinitelyTyped/DefinitelyTyped/angular-dynamic-locale/angular-dynamic-locale.d.ts#42ab06c354ccbadeafa60df1efc76b81a22809b1",
     "angular-mocks": "github:DefinitelyTyped/DefinitelyTyped/angularjs/angular-mocks.d.ts",
     "angular-translate": "github:DefinitelyTyped/DefinitelyTyped/angular-translate/angular-translate.d.ts#19850bf86c876e0c2544842114878ece4664941a",
     "angular-ui-router": "github:DefinitelyTyped/DefinitelyTyped/angular-ui-router/angular-ui-router.d.ts#655f8c1bf3c71b0e1ba415b36309604f79326ac8",
--
libgit2 0.21.2