Merge branch 'refactor-articles-watchers' into 'master'

Refactor articles watchers See merge request !27

Merge branch 'refactor-articles-watchers' into 'master'
Refactor articles watchers See merge request !27
Ábner Oliveira
2 parents 6e1dcd9e af9fc87e
Showing 18 changed files with 218 additions and 195 deletions Show diff stats
src/app/article/article-default-view-component.spec.ts
src/app/article/article-default-view.component.ts
src/app/article/types/blog/blog.component.spec.ts
src/app/layout/blocks/recent-documents/recent-documents-block.component.spec.ts
src/app/layout/blocks/recent-documents/recent-documents-block.component.ts
src/app/layout/blocks/statistics/statistics-block.component.spec.ts
src/app/layout/blocks/statistics/statistics-block.component.ts
src/app/shared/utils/arrays.ts
src/app/shared/utils/hashmap.ts
src/app/shared/utils/index.ts
src/lib/ng-noosfero-api/http/article.service.spec.ts
src/lib/ng-noosfero-api/http/article.service.ts
src/lib/ng-noosfero-api/http/block.service.ts
src/lib/ng-noosfero-api/http/restangular_service.ts
src/lib/util/arrays.ts
src/plugins/comment_paragraph/block/discussion/discussion-block.component.spec.ts
src/plugins/comment_paragraph/block/discussion/discussion-block.component.ts
src/spec/mocks.ts
@@ -68,13 +68,13 @@ describe(&quot;Components&quot;, () =&gt; {
          */
         function doDeleteArticle() {
             // Create a mock for the ArticleService removeArticle method
-            spyOn(helper.component.articleService, 'removeArticle').and.callFake(function(param: noosfero.Article) {
+            spyOn(helper.component.articleService, 'remove').and.callFake(function(param: noosfero.Article) {
                 return {
                     catch: () => {}
                 };
             });
             helper.component.delete();
-            expect(articleService.removeArticle).toHaveBeenCalled();
+            expect(articleService.remove).toHaveBeenCalled();
             // After the component delete method execution, fire the
             // ArticleEvent.removed event
             simulateRemovedEvent();
@@ -84,7 +84,7 @@ describe(&quot;Components&quot;, () =&gt; {
          * Simulate the ArticleService ArticleEvent.removed event
          */
         function simulateRemovedEvent() {
-            helper.component.articleService["notifyArticleRemovedListeners"](article);
+            helper.component.articleService["modelRemovedEventEmitter"].next(article);
         }
     });
@@ -5,7 +5,7 @@ import {MacroDirective} from &quot;./macro/macro.directive&quot;;
 import {ArticleToolbarHotspotComponent} from "../hotspot/article-toolbar-hotspot.component";
 import {ArticleContentHotspotComponent} from "../hotspot/article-content-hotspot.component";
 import {ArticleService} from "./../../lib/ng-noosfero-api/http/article.service";
-
+import {NotificationService} from "./../shared/services/notification.service";
 /**
  * @ngdoc controller
  * @name ArticleDefaultView
@@ -25,7 +25,7 @@ export class ArticleDefaultViewComponent {
     constructor(private $state: ng.ui.IStateService, public articleService: ArticleService) {
         // Subscribe to the Article Removed Event
-        this.articleService.subscribeToArticleRemoved((article: noosfero.Article) => {
+        this.articleService.subscribeToModelRemoved((article: noosfero.Article) => {
             if (this.article.parent) {
                 this.$state.transitionTo('main.profile.page', { page: this.article.parent.path, profile: this.article.profile.identifier });
             } else {
@@ -35,9 +35,7 @@ export class ArticleDefaultViewComponent {
     }
     delete() {
-        this.articleService.removeArticle(this.article).catch((cause: any) => {
-            throw new Error(`Problem removing the article: ${cause}`);
-        });
+        this.articleService.remove(this.article);
     }
 }
-import {
-providers
-} from 'ng-forward/cjs/testing/providers';
-
-import {
-Input,
-Component
-} from 'ng-forward';
-import {
-ArticleBlogComponent
-} from './blog.component';
-
-import {
-createComponentFromClass,
-quickCreateComponent,
-provideEmptyObjects,
-createProviderToValue,
-provideFilters
-} from "../../../../spec/helpers.ts";
+import {providers} from 'ng-forward/cjs/testing/providers';
+
+import {Input, provide, Component} from 'ng-forward';
+import {ArticleBlogComponent} from './blog.component';
+
+import {createComponentFromClass, quickCreateComponent, provideEmptyObjects, createProviderToValue, provideFilters} from "../../../../spec/helpers.ts";
+
+import {ComponentTestHelper, createClass} from './../../../../spec/component-test-helper';
 // this htmlTemplate will be re-used between the container components in this spec file
 const htmlTemplate: string = '<noosfero-blog [article]="ctrl.article" [profile]="ctrl.profile"></noosfero-blog>';
@@ -42,38 +31,30 @@ describe(&quot;Blog Component&quot;, () =&gt; {
         }
     }
+    let article1 = <noosfero.Article>{
+        id: 1,
+        title: 'The article test'
+    };
+
+    let article2 = <noosfero.Article>{
+        id: 1,
+        title: 'The article test'
+    };
+
+    let articles = [ article1, article2 ];
+
     let articleService = {
         getChildren: (article_id: number, filters: {}) => {
             return promiseResultTemplate(null);
-        }
+        },
+        subscribeToArticleRemoved: (fn: Function) => {}
     };
-    @Component({
-        selector: 'test-container-component',
-        template: htmlTemplate,
-        directives: [ArticleBlogComponent],
-        providers: [
-            provideEmptyObjects('Restangular'),
-            createProviderToValue('ArticleService', articleService),
-            provideFilters('truncateFilter')
-        ]
-    })
-    class BlogContainerComponent {
-        article = {
-            type: 'anyArticleType'
-        };
-        profile = {
-            name: 'profile-name'
-        };
-    }
+    let helper: ComponentTestHelper<ArticleBlogComponent>;
-    beforeEach(() => {
+    beforeEach(angular.mock.module("templates"));
-        // the karma preprocessor html2js transform the templates html into js files which put
-        // the templates to the templateCache into the module templates
-        // we need to load the module templates here as the template for the
-        // component Noosfero ArtileView will be load on our tests
-        angular.mock.module("templates");
+    beforeEach((done) => {
         providers((provide: any) => {
             return <any>[
@@ -82,48 +63,26 @@ describe(&quot;Blog Component&quot;, () =&gt; {
                 })
             ];
         });
-    });
-
-    it("renders the blog content", (done: Function) => {
-
-        createComponentFromClass(BlogContainerComponent).then((fixture) => {
-
-            expect(fixture.debugElement.query('div.blog').length).toEqual(1);
-
-            done();
+        let providersHelper = [
+            provide('ArticleService', { useValue: articleService })
+        ];
+        let cls = createClass({
+            template: htmlTemplate,
+            directives: [ArticleBlogComponent],
+            providers: providersHelper,
+            properties: {
+                posts: articles
+            }
         });
+        helper = new ComponentTestHelper<ArticleBlogComponent>(cls, done);
     });
-    it("verify the blog data", (done: Function) => {
-
-        let articles = [{
-            id: 1,
-            title: 'The article test'
-        }];
-
-        let result = { data: articles, headers: (name: string) => { return 1; } };
-
-        // defining a mock result to articleService.getChildren method
-        articleService.getChildren = (article_id: number, filters: {}) => {
-            return promiseResultTemplate(result);
-        };
-
-        createComponentFromClass(BlogContainerComponent).then((fixture) => {
-
-            // gets the children component of BlogContainerComponent
-            let articleBlog: BlogContainerComponent = fixture.debugElement.componentViewChildren[0].componentInstance;
-
-            // check if the component property are the provided by the mocked articleService
-            let post = {
-                id: 1,
-                title: 'The article test'
-            };
-            expect((<any>articleBlog)["posts"][0]).toEqual(jasmine.objectContaining(post));
-            expect((<any>articleBlog)["totalPosts"]).toEqual(1);
-
-            done();
-        });
+    it("renders the blog content", () => {
+        expect(helper.debugElement.query('div.blog').length).toEqual(1);
+    });
+    it("verify the blog data", () => {
+        expect(helper.component["posts"][0]).toEqual(jasmine.objectContaining(article1));
     });
 });
 \ No newline at end of file
@@ -2,6 +2,7 @@ import {TestComponentBuilder} from &#39;ng-forward/cjs/testing/test-component-builde
 import {Provider, Input, provide, Component} from 'ng-forward';
 import {provideFilters} from '../../../../spec/helpers';
 import {RecentDocumentsBlockComponent} from './recent-documents-block.component';
+import * as helpers from "./../../../../spec/helpers";
 const htmlTemplate: string = '<noosfero-recent-documents-block [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-recent-documents-block>';
@@ -11,11 +12,13 @@ describe(&quot;Components&quot;, () =&gt; {
     describe("Recent Documents Block Component", () => {
         let settingsObj = {};
+        let article = <noosfero.Article>{ name: "article1" };
         let mockedBlockService = {
             getApiContent: (block: noosfero.Block): any => {
-                return Promise.resolve({ articles: [{ name: "article1" }], headers: (name: string) => { return name; } });
+                return Promise.resolve({ articles: [article], headers: (name: string) => { return name; } });
             }
         };
+        let articleService: any = helpers.mocks.articleService;
         let profile = { name: 'profile-name' };
         beforeEach(angular.mock.module("templates"));
@@ -28,6 +31,7 @@ describe(&quot;Components&quot;, () =&gt; {
                 new Provider('BlockService', {
                     useValue: mockedBlockService
                 }),
+                new Provider('ArticleService', { useValue: articleService })
             ].concat(provideFilters("truncateFilter", "stripTagsFilter"));
         }
         let componentClass: any = null;
@@ -47,7 +51,7 @@ describe(&quot;Components&quot;, () =&gt; {
         it("get recent documents from the block service", done => {
             tcb.createAsync(getComponent()).then(fixture => {
                 let recentDocumentsBlock: RecentDocumentsBlockComponent = fixture.debugElement.componentViewChildren[0].componentInstance;
-                expect(recentDocumentsBlock.documents).toEqual([{ name: "article1" }]);
+                expect(recentDocumentsBlock.documents).toEqual([article]);
                 done();
             });
         });
@@ -61,5 +65,22 @@ describe(&quot;Components&quot;, () =&gt; {
             });
         });
+        it("verify removed article has been removed from list", done => {
+            tcb.createAsync(getComponent()).then(fixture => {
+                let recentDocumentsBlock: RecentDocumentsBlockComponent = fixture.debugElement.componentViewChildren[0].componentInstance;
+                expect(recentDocumentsBlock.documents.length).toEqual(1);
+                simulateRemovedEvent(recentDocumentsBlock);
+                expect(recentDocumentsBlock.documents.length).toEqual(0);
+                done();
+            });
+        });
+
+        /**
+         * Simulate the ArticleService ArticleEvent.removed event
+         */
+        function simulateRemovedEvent(recentDocumentsBlock: RecentDocumentsBlockComponent) {
+            recentDocumentsBlock.articleService["modelRemovedEventEmitter"].next(article);
+        }
+
     });
 });
 import {Component, Inject, Input} from "ng-forward";
 import {BlockService} from "../../../../lib/ng-noosfero-api/http/block.service";
+import {ArticleService} from "./../../../../lib/ng-noosfero-api/http/article.service";
+import {Arrays} from "./../../../../lib/util/arrays";
 @Component({
     selector: "noosfero-recent-documents-block",
     templateUrl: 'app/layout/blocks/recent-documents/recent-documents-block.html'
 })
-@Inject(BlockService, "$state")
+@Inject(BlockService, "$state", ArticleService)
 export class RecentDocumentsBlockComponent {
     @Input() block: any;
@@ -15,7 +17,7 @@ export class RecentDocumentsBlockComponent {
     documents: any;
     documentsLoaded: boolean = false;
-    constructor(private blockService: BlockService, private $state: any) { }
+    constructor(private blockService: BlockService, private $state: any, public articleService: ArticleService) { }
     ngOnInit() {
         this.profile = this.owner;
@@ -24,6 +26,13 @@ export class RecentDocumentsBlockComponent {
             this.documents = content.articles;
             this.documentsLoaded = true;
         });
+        this.watchArticles();
+    }
+
+    watchArticles() {
+        this.articleService.subscribeToModelRemoved((article: noosfero.Article) => {
+            Arrays.remove(this.documents, article);
+        });
     }
     openDocument(article: any) {
+import {provide} from 'ng-forward';
 import {ComponentTestHelper, createClass} from './../../../../spec/component-test-helper';
 import {StatisticsBlockComponent} from './statistics-block.component';
 import * as helpers from "../../../../spec/helpers";
 const htmlTemplate: string = '<noosfero-statistics-block [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-statistics-block>';
+
 describe("Components", () => {
     describe("Statistics Block Component", () => {
@@ -11,10 +13,15 @@ describe(&quot;Components&quot;, () =&gt; {
         beforeEach(angular.mock.module("templates"));
         beforeEach((done) => {
+            let articleService: any = helpers.mocks.articleService;
+            let blockService: any = jasmine.createSpyObj("blockService", ["getBlock"]);
             let cls = createClass({
                 template: htmlTemplate,
                 directives: [StatisticsBlockComponent],
-                providers: helpers.provideFilters("translateFilter"),
+                providers: [
+                   provide('ArticleService', { useValue: articleService }),
+                   provide('BlockService', { useValue: blockService })
+                ].concat(helpers.provideFilters("translateFilter")),
                 properties: {
                     block: {
                         statistics: [
-import {Input, Inject, Component} from "ng-forward";
-
+import {Input, Inject, Component, provide} from "ng-forward";
+import {ArticleService} from "./../../../../lib/ng-noosfero-api/http/article.service";
+import {BlockService} from "./../../../../lib/ng-noosfero-api/http/block.service";
 @Component({
     selector: "noosfero-statistics-block",
     templateUrl: 'app/layout/blocks/statistics/statistics-block.html'
 })
+@Inject(ArticleService, BlockService)
 export class StatisticsBlockComponent {
     @Input() block: noosfero.StatisticsBlock;
     @Input() owner: any;
+
+    constructor(articleService: ArticleService, blockService: BlockService) {
+        // watches for article being removed
+        // to update comments and tag statistics, which would
+        // changed after removing an article 
+        articleService.subscribeToModelRemoved(() => {
+            blockService.getBlock<noosfero.StatisticsBlock>(this.block.id)
+                .then(blockFromAPI => this.block = blockFromAPI);
+        });
+
+        articleService.subscribeToModelAdded(() => {
+            blockService.getBlock<noosfero.StatisticsBlock>(this.block.id)
+                .then(blockFromAPI => this.block = blockFromAPI);
+        });
+    }
 }
@@ -1,19 +0,0 @@
-export class ArrayUtils {
-
-    /**
-     * Returns if two arrays are equal
-     */
-    static arraysEqual(a: any, b: any): boolean {
-        if (a === b) return true;
-        if (a == null || b == null) return false;
-        if (a.length !== b.length) return false;
-
-        // If you don't care about the order of the elements inside
-        // the array, you should sort both arrays here.
-        for (let i = 0; i < a.length; ++i) {
-            if (a[i] !== b[i]) return false;
-        }
-        return true;
-    }
-
-}
 \ No newline at end of file
@@ -1,36 +0,0 @@
-export class HashMap<K extends EqualsObject, V> {
-    private values: Array<HashItem<K, V>> = new Array();
-
-    get(key: K): V {
-        let found = this.values.find( function(value: HashItem<K, V>) {
-            return value.key.equals(key);
-        });
-        if (found) {
-            return found.value;
-        }
-        return null;
-    }
-
-    put(key: K, value: V): void {
-        this.values.push(new HashItem(key, value));
-    }
-
-    clear() {
-        this.values = new Array();
-    }
-}
-
-export class HashItem<K, V> {
-    key: K;
-    value: V;
-    constructor(key: K, value: V) {
-        this.key = key;
-        this.value = value;
-    }
-}
-
-export abstract class EqualsObject {
-
-    abstract equals(other: any): boolean;
-
-}
 \ No newline at end of file
@@ -1,3 +0,0 @@
-/* Module Index Entry - generated using the script npm run generate-index */
-export * from "./hashmap";
-export * from "./arrays";
@@ -23,7 +23,7 @@ describe(&quot;Services&quot;, () =&gt; {
             it("should remove article", (done) => {
                 let articleId = 1;
                 $httpBackend.expectDELETE(`/api/v1/articles/${articleId}`).respond(200, { success: "true" });
-                articleService.removeArticle(<noosfero.Article>{id: articleId});
+                articleService.remove(<noosfero.Article>{id: articleId});
                 $httpBackend.flush();
                 $httpBackend.verifyNoOutstandingExpectation();
                 done();
@@ -7,8 +7,6 @@ import {NoosferoRootScope} from &quot;./../../../app/shared/models/interfaces&quot;;
 @Inject("Restangular", "$q", "$log", ProfileService)
 export class ArticleService extends RestangularService<noosfero.Article> {
-    private articleRemoved: EventEmitter<noosfero.Article> = new EventEmitter<noosfero.Article>();
-
     constructor(Restangular: restangular.IService, $q: ng.IQService, $log: ng.ILogService, protected profileService: ProfileService) {
         super(Restangular, $q, $log);
     }
@@ -24,30 +22,22 @@ export class ArticleService extends RestangularService&lt;noosfero.Article&gt; {
         };
     }
-    removeArticle(article: noosfero.Article) {
-        let restRequest: ng.IPromise<noosfero.RestResult<noosfero.Article>> = this.remove(article);
-        let deferred = this.$q.defer<noosfero.RestResult<noosfero.Article>>();
-        restRequest.then((result: any) => {
-            this.notifyArticleRemovedListeners(article);
-        }).catch(this.getHandleErrorFunction(deferred));
-        return deferred.promise;
-    }
+    // removeArticle(article: noosfero.Article) {
+    //     // let restRequest: ng.IPromise<noosfero.RestResult<noosfero.Article>> = this.remove(article);
+    //     // let deferred = this.$q.defer<noosfero.RestResult<noosfero.Article>>();
+    //     // restRequest.then((result: any) => {
+    //     //     this.notifyArticleRemovedListeners(article);
+    //     // }).catch(this.getHandleErrorFunction(deferred));
+    //     // return deferred.promise;
+    // }
     /**
      * Notify listeners that this article has been removed
      */
-    private notifyArticleRemovedListeners(article: noosfero.Article) {
-        // let listener = this.events.get(this.removed);
-        // listener.next(article);
-        this.articleRemoved.next(article);
-    }
+    // private notifyArticleRemovedListeners(article: noosfero.Article) {
+    //     this.modelRemovedEventEmitter.next(article);
+    // }
-    /**
-     * subscribes to the ArticleRemoved event emitter
-     */
-    subscribeToArticleRemoved(fn: Function) {
-        this.articleRemoved.subscribe(fn);
-    }
     updateArticle(article: noosfero.Article) {
         let headers = {
@@ -37,4 +37,14 @@ export class BlockService extends RestangularService&lt;noosfero.Block&gt; {
         return apiContentPromise.promise;
     }
+    getBlock<T extends noosfero.Block>(blockId: number): ng.IPromise<T> {
+        let deferred = this.$q.defer<T>();
+        this.get(blockId)
+            .then((result: noosfero.RestResult<T>) => {
+                deferred.resolve(result.data);
+            })
+            .catch(reason => deferred.reject(reason));
+        return deferred.promise;
+    }
+
 }
+import {EventEmitter} from "ng-forward";
 /**
  * @name RestangularService
  * Base class to be extended by classes which will provide access
@@ -13,6 +14,11 @@ export abstract class RestangularService&lt;T extends noosfero.RestModel&gt; {
     private baseResource: restangular.IElement;
     private currentPromise: ng.IDeferred<T>;
+    protected modelFoundEventEmitter: EventEmitter<T> = new EventEmitter<any>();
+    protected modelAddedEventEmitter: EventEmitter<T> = new EventEmitter<any>();
+    protected modelRemovedEventEmitter: EventEmitter<T> = new EventEmitter<any>();
+    protected modelUpdatedEventEmitter: EventEmitter<T> = new EventEmitter<any>();
+
     /**
      * Creates an instance of RestangularService.
      * 
@@ -35,6 +41,22 @@ export abstract class RestangularService&lt;T extends noosfero.RestModel&gt; {
         // });
     }
+    subscribeToModelRemoved(fn: ((model: T) => void)) {
+        this.modelRemovedEventEmitter.subscribe(fn);
+    }
+
+    subscribeToModelAdded(fn: ((model: T) => void)) {
+        this.modelAddedEventEmitter.subscribe(fn);
+    }
+
+    subscribeToModelUpdated(fn: ((model: T) => void)) {
+        this.modelUpdatedEventEmitter.subscribe(fn);
+    }
+
+    subscribeToModelFound(fn: ((model: T) => void)) {
+        this.modelFoundEventEmitter.subscribe(fn);
+    }
+
     public resetCurrent() {
         this.currentPromise = this.$q.defer();
     }
@@ -107,7 +129,7 @@ export abstract class RestangularService&lt;T extends noosfero.RestModel&gt; {
             restRequest = this.restangularService.one(this.getResourcePath(), id).get(queryParams, headers);
         }
-        restRequest.then(this.getHandleSuccessFunction(deferred))
+        restRequest.then(this.getHandleSuccessFunction(deferred, this.modelFoundEventEmitter))
             .catch(this.getHandleErrorFunction(deferred));
@@ -201,7 +223,7 @@ export abstract class RestangularService&lt;T extends noosfero.RestModel&gt; {
         restRequest = restangularObj.remove(queryParams, headers);
         restRequest
-            .then(this.getHandleSuccessFunction(deferred))
+            .then(this.getHandleSuccessFunction(deferred, this.modelRemovedEventEmitter))
             .catch(this.getHandleErrorFunction(deferred));
         return deferred.promise;
@@ -226,7 +248,7 @@ export abstract class RestangularService&lt;T extends noosfero.RestModel&gt; {
         restRequest = restangularObj.put(queryParams, headers);
-        restRequest.then(this.getHandleSuccessFunction(deferred))
+        restRequest.then(this.getHandleSuccessFunction(deferred, this.modelUpdatedEventEmitter))
             .catch(this.getHandleErrorFunction(deferred));
         return deferred.promise;
@@ -255,7 +277,7 @@ export abstract class RestangularService&lt;T extends noosfero.RestModel&gt; {
             restRequest = this.baseResource.post(data, queryParams, headers);
         }
-        restRequest.then(this.getHandleSuccessFunction(deferred))
+        restRequest.then(this.getHandleSuccessFunction(deferred, this.modelAddedEventEmitter))
             .catch(this.getHandleErrorFunction(deferred));
         return deferred.promise;
@@ -289,7 +311,7 @@ export abstract class RestangularService&lt;T extends noosfero.RestModel&gt; {
     }
     /** HANDLERS */
-    protected getHandleSuccessFunction<C>(deferred: ng.IDeferred<noosfero.RestResult<C | T | any>>, responseKey?: string): (response: restangular.IResponse) => void {
+    protected getHandleSuccessFunction<C>(deferred: ng.IDeferred<noosfero.RestResult<C | T | any>>, successEmitter: EventEmitter<T> = null): (response: restangular.IResponse) => void {
         let self = this;
         /**
@@ -301,7 +323,13 @@ export abstract class RestangularService&lt;T extends noosfero.RestModel&gt; {
             if (self.$log) {
                 self.$log.debug("Request successfull executed", response.data, self, response);
             }
-            deferred.resolve(<any>this.extractData(response));
+            let resultModel: noosfero.RestResult<T> = <any>this.extractData(response);
+            // resolve the promise with the model returned from the Noosfero API
+            deferred.resolve(resultModel);
+            // emits the event if a successEmiter was provided in the successEmitter parameter
+            if (successEmitter !== null) {
+                successEmitter.next(resultModel);
+            }
         };
         return successFunction;
     }
@@ -0,0 +1,9 @@
+export class Arrays {
+    static remove<T extends noosfero.RestModel>(elements: T[], element: T) {
+        elements.forEach((value: T, index: number, array: T[]) => {
+            if (value.id === element.id) {
+                array.splice(index, 1);
+            }
+        });
+    }
+}
 \ No newline at end of file
@@ -3,6 +3,7 @@ import {Provider, Input, provide, Component} from &#39;ng-forward&#39;;
 import {provideFilters} from '../../../../spec/helpers';
 import {DiscussionBlockComponent} from './discussion-block.component';
 import {ComponentTestHelper, createClass} from './../../../../spec/component-test-helper';
+import * as helpers from "./../../../../spec/helpers";
 const htmlTemplate: string = '<noosfero-comment-paragraph-plugin-discussion-block [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-comment-paragraph-plugin-discussion-block>';
@@ -13,11 +14,13 @@ describe(&quot;Components&quot;, () =&gt; {
         let helper: ComponentTestHelper<DiscussionBlockComponent>;
         let settingsObj = {};
+        let article = <noosfero.Article>{ name: "article1" };
         let mockedBlockService = {
             getApiContent: (content: any): any => {
-                return Promise.resolve({ articles: [{ name: "article1" }], headers: (name: string) => { return name; } });
+                return Promise.resolve({ articles: [article], headers: (name: string) => { return name; } });
             }
         };
+        let articleService: any = helpers.mocks.articleService;
         let profile = { name: 'profile-name' };
         let state = jasmine.createSpyObj("state", ["go"]);
@@ -27,6 +30,7 @@ describe(&quot;Components&quot;, () =&gt; {
             new Provider('BlockService', {
                 useValue: mockedBlockService
             }),
+            new Provider('ArticleService', { useValue: articleService })
         ].concat(provideFilters("truncateFilter", "stripTagsFilter", "translateFilter", "amDateFormatFilter"));
         beforeEach(angular.mock.module("templates"));
@@ -51,5 +55,17 @@ describe(&quot;Components&quot;, () =&gt; {
             block.openDocument({ path: "path", profile: { identifier: "identifier" } });
             expect(state.go).toHaveBeenCalledWith("main.profile.page", { page: "path", profile: "identifier" });
         });
+
+        it("verify removed article has been removed from list", () => {
+            expect(helper.component.documents.length).toEqual(1);
+            simulateRemovedEvent();
+            expect(helper.component.documents.length).toEqual(0);
+        });
+        /**
+         * Simulate the ArticleService ArticleEvent.removed event
+         */
+        function simulateRemovedEvent() {
+            helper.component.articleService["modelRemovedEventEmitter"].next(article);
+        }
     });
 });
 import {Component, Inject, Input} from "ng-forward";
 import {BlockService} from "../../../../lib/ng-noosfero-api/http/block.service";
+import {ArticleService} from "./../../../../lib/ng-noosfero-api/http/article.service";
+import {Arrays} from "./../../../../lib/util/arrays";
 @Component({
     selector: "noosfero-comment-paragraph-plugin-discussion-block",
     templateUrl: 'plugins/comment_paragraph/block/discussion/discussion-block.html'
 })
-@Inject(BlockService, "$state")
+@Inject(BlockService, "$state", ArticleService)
 export class DiscussionBlockComponent {
     @Input() block: any;
@@ -14,7 +16,7 @@ export class DiscussionBlockComponent {
     profile: noosfero.Profile;
     documents: Array<noosfero.Article>;
-    constructor(private blockService: BlockService, private $state: any) { }
+    constructor(private blockService: BlockService, private $state: any, public articleService: ArticleService) { }
     ngOnInit() {
         this.profile = this.owner;
@@ -22,6 +24,13 @@ export class DiscussionBlockComponent {
             this.documents = content.articles;
             this.block.hide = !this.documents || this.documents.length === 0;
         });
+        this.watchArticles();
+    }
+
+    watchArticles() {
+        this.articleService.subscribeToModelRemoved((article: noosfero.Article) => {
+            Arrays.remove(this.documents, article);
+        });
     }
     openDocument(article: any) {
@@ -77,10 +77,14 @@ export var mocks: any = {
     },
     articleService: {
         articleRemovedFn: null,
-        subscribeToArticleRemoved: (fn: Function) => {
+        articleAddedFn: null,
+        subscribeToModelRemoved: (fn: Function) => {
             mocks.articleService.articleRemovedFn = fn;
         },
-        articleRemoved:
+        subscribeToModelAdded: (fn: Function) => {
+            mocks.articleService.articleAddedFn = fn;
+        },
+        modelRemovedEventEmitter:
             {
                 subscribe: (fn: Function) => {
                     mocks.articleService.articleRemovedFn = fn;
@@ -90,18 +94,22 @@ export var mocks: any = {
                 }
             }
         ,
-        removeArticle: (article: noosfero.Article) => {
+        modelAddedEventEmitter:
+            {
+                subscribe: (fn: Function) => {
+                    mocks.articleService.articleAddedFn = fn;
+                },
+                next: (param: any) => {
+                    mocks.articleService.articleAddedFn(param);
+                }
+            }
+        ,
+        remove: (article: noosfero.Article) => {
             return {
                 catch: (func?: Function) => {
                 }
             };
         },
-        notifyArticleRemovedListeners: (article: noosfero.Article) => {
-            mocks.articleService.articleRemoved.next(article);
-        },
-        subscribe: (eventType: any, fn: Function) => {
-            mocks.articleService.articleRemoved.subscribe(fn);
-        },
         getByProfile: (profileId: number, params?: any) => {
             return {
                 then: (func?: Function) => {
	@@ -68,13 +68,13 @@ describe("Components", () => {		@@ -68,13 +68,13 @@ describe("Components", () => {
68	*/	68	*/
69	function doDeleteArticle() {	69	function doDeleteArticle() {
70	// Create a mock for the ArticleService removeArticle method	70	// Create a mock for the ArticleService removeArticle method
71	- spyOn(helper.component.articleService, 'removeArticle').and.callFake(function(param: noosfero.Article) {	71	+ spyOn(helper.component.articleService, 'remove').and.callFake(function(param: noosfero.Article) {
72	return {	72	return {
73	catch: () => {}	73	catch: () => {}
74	};	74	};
75	});	75	});
76	helper.component.delete();	76	helper.component.delete();
77	- expect(articleService.removeArticle).toHaveBeenCalled();	77	+ expect(articleService.remove).toHaveBeenCalled();
78	// After the component delete method execution, fire the	78	// After the component delete method execution, fire the
79	// ArticleEvent.removed event	79	// ArticleEvent.removed event
80	simulateRemovedEvent();	80	simulateRemovedEvent();
	@@ -84,7 +84,7 @@ describe("Components", () => {		@@ -84,7 +84,7 @@ describe("Components", () => {
84	* Simulate the ArticleService ArticleEvent.removed event	84	* Simulate the ArticleService ArticleEvent.removed event
85	*/	85	*/
86	function simulateRemovedEvent() {	86	function simulateRemovedEvent() {
87	- helper.component.articleService["notifyArticleRemovedListeners"](article);	87	+ helper.component.articleService["modelRemovedEventEmitter"].next(article);
88	}	88	}
89	});	89	});
90		90
1	-import {
2	-providers
3	-} from 'ng-forward/cjs/testing/providers';
4	-
5	-import {
6	-Input,
7	-Component
8	-} from 'ng-forward';
9	-import {
10	-ArticleBlogComponent
11	-} from './blog.component';
12	-
13	-import {
14	-createComponentFromClass,
15	-quickCreateComponent,
16	-provideEmptyObjects,
17	-createProviderToValue,
18	-provideFilters
19	-} from "../../../../spec/helpers.ts";	1	+import {providers} from 'ng-forward/cjs/testing/providers';
		2	+
		3	+import {Input, provide, Component} from 'ng-forward';
		4	+import {ArticleBlogComponent} from './blog.component';
		5	+
		6	+import {createComponentFromClass, quickCreateComponent, provideEmptyObjects, createProviderToValue, provideFilters} from "../../../../spec/helpers.ts";
		7	+
		8	+import {ComponentTestHelper, createClass} from './../../../../spec/component-test-helper';
20		9
21	// this htmlTemplate will be re-used between the container components in this spec file	10	// this htmlTemplate will be re-used between the container components in this spec file
22	const htmlTemplate: string = '<noosfero-blog [article]="ctrl.article" [profile]="ctrl.profile"></noosfero-blog>';	11	const htmlTemplate: string = '<noosfero-blog [article]="ctrl.article" [profile]="ctrl.profile"></noosfero-blog>';
	@@ -42,38 +31,30 @@ describe("Blog Component", () => {		@@ -42,38 +31,30 @@ describe("Blog Component", () => {
42	}	31	}
43	}	32	}
44		33
		34	+ let article1 = <noosfero.Article>{
		35	+ id: 1,
		36	+ title: 'The article test'
		37	+ };
		38	+
		39	+ let article2 = <noosfero.Article>{
		40	+ id: 1,
		41	+ title: 'The article test'
		42	+ };
		43	+
		44	+ let articles = [ article1, article2 ];
		45	+
45	let articleService = {	46	let articleService = {
46	getChildren: (article_id: number, filters: {}) => {	47	getChildren: (article_id: number, filters: {}) => {
47	return promiseResultTemplate(null);	48	return promiseResultTemplate(null);
48	- }	49	+ },
		50	+ subscribeToArticleRemoved: (fn: Function) => {}
49	};	51	};
50		52
51	- @Component({
52	- selector: 'test-container-component',
53	- template: htmlTemplate,
54	- directives: [ArticleBlogComponent],
55	- providers: [
56	- provideEmptyObjects('Restangular'),
57	- createProviderToValue('ArticleService', articleService),
58	- provideFilters('truncateFilter')
59	- ]
60	- })
61	- class BlogContainerComponent {
62	- article = {
63	- type: 'anyArticleType'
64	- };
65	- profile = {
66	- name: 'profile-name'
67	- };
68	- }	53	+ let helper: ComponentTestHelper<ArticleBlogComponent>;
69		54
70	- beforeEach(() => {	55	+ beforeEach(angular.mock.module("templates"));
71		56
72	- // the karma preprocessor html2js transform the templates html into js files which put
73	- // the templates to the templateCache into the module templates
74	- // we need to load the module templates here as the template for the
75	- // component Noosfero ArtileView will be load on our tests
76	- angular.mock.module("templates");	57	+ beforeEach((done) => {
77		58
78	providers((provide: any) => {	59	providers((provide: any) => {
79	return <any>[	60	return <any>[
	@@ -82,48 +63,26 @@ describe("Blog Component", () => {		@@ -82,48 +63,26 @@ describe("Blog Component", () => {
82	})	63	})
83	];	64	];
84	});	65	});
85	- });
86	-
87	- it("renders the blog content", (done: Function) => {
88	-
89	- createComponentFromClass(BlogContainerComponent).then((fixture) => {
90	-
91	- expect(fixture.debugElement.query('div.blog').length).toEqual(1);
92	-
93	- done();	66	+ let providersHelper = [
		67	+ provide('ArticleService', { useValue: articleService })
		68	+ ];
		69	+ let cls = createClass({
		70	+ template: htmlTemplate,
		71	+ directives: [ArticleBlogComponent],
		72	+ providers: providersHelper,
		73	+ properties: {
		74	+ posts: articles
		75	+ }
94	});	76	});
		77	+ helper = new ComponentTestHelper<ArticleBlogComponent>(cls, done);
95	});	78	});
96		79
97	- it("verify the blog data", (done: Function) => {
98	-
99	- let articles = [{
100	- id: 1,
101	- title: 'The article test'
102	- }];
103	-
104	- let result = { data: articles, headers: (name: string) => { return 1; } };
105	-
106	- // defining a mock result to articleService.getChildren method
107	- articleService.getChildren = (article_id: number, filters: {}) => {
108	- return promiseResultTemplate(result);
109	- };
110	-
111	- createComponentFromClass(BlogContainerComponent).then((fixture) => {
112	-
113	- // gets the children component of BlogContainerComponent
114	- let articleBlog: BlogContainerComponent = fixture.debugElement.componentViewChildren[0].componentInstance;
115	-
116	- // check if the component property are the provided by the mocked articleService
117	- let post = {
118	- id: 1,
119	- title: 'The article test'
120	- };
121	- expect((<any>articleBlog)["posts"][0]).toEqual(jasmine.objectContaining(post));
122	- expect((<any>articleBlog)["totalPosts"]).toEqual(1);
123	-
124	- done();
125	- });	80	+ it("renders the blog content", () => {
		81	+ expect(helper.debugElement.query('div.blog').length).toEqual(1);
		82	+ });
126		83
		84	+ it("verify the blog data", () => {
		85	+ expect(helper.component["posts"][0]).toEqual(jasmine.objectContaining(article1));
127	});	86	});
128		87
129	});	88	});
130	\ No newline at end of file	89	\ No newline at end of file
1	-import {Input, Inject, Component} from "ng-forward";
2	-	1	+import {Input, Inject, Component, provide} from "ng-forward";
		2	+import {ArticleService} from "./../../../../lib/ng-noosfero-api/http/article.service";
		3	+import {BlockService} from "./../../../../lib/ng-noosfero-api/http/block.service";
3	@Component({	4	@Component({
4	selector: "noosfero-statistics-block",	5	selector: "noosfero-statistics-block",
5	templateUrl: 'app/layout/blocks/statistics/statistics-block.html'	6	templateUrl: 'app/layout/blocks/statistics/statistics-block.html'
6	})	7	})
7		8
		9	+@Inject(ArticleService, BlockService)
8	export class StatisticsBlockComponent {	10	export class StatisticsBlockComponent {
9	@Input() block: noosfero.StatisticsBlock;	11	@Input() block: noosfero.StatisticsBlock;
10	@Input() owner: any;	12	@Input() owner: any;
		13	+
		14	+ constructor(articleService: ArticleService, blockService: BlockService) {
		15	+ // watches for article being removed
		16	+ // to update comments and tag statistics, which would
		17	+ // changed after removing an article
		18	+ articleService.subscribeToModelRemoved(() => {
		19	+ blockService.getBlock<noosfero.StatisticsBlock>(this.block.id)
		20	+ .then(blockFromAPI => this.block = blockFromAPI);
		21	+ });
		22	+
		23	+ articleService.subscribeToModelAdded(() => {
		24	+ blockService.getBlock<noosfero.StatisticsBlock>(this.block.id)
		25	+ .then(blockFromAPI => this.block = blockFromAPI);
		26	+ });
		27	+ }
11	}	28	}
	@@ -1,19 +0,0 @@		@@ -1,19 +0,0 @@
1	-export class ArrayUtils {
2	-
3	- /**
4	- * Returns if two arrays are equal
5	- */
6	- static arraysEqual(a: any, b: any): boolean {
7	- if (a === b) return true;
8	- if (a == null \|\| b == null) return false;
9	- if (a.length !== b.length) return false;
10	-
11	- // If you don't care about the order of the elements inside
12	- // the array, you should sort both arrays here.
13	- for (let i = 0; i < a.length; ++i) {
14	- if (a[i] !== b[i]) return false;
15	- }
16	- return true;
17	- }
18	-
19	-}
20	\ No newline at end of file	0	\ No newline at end of file
	@@ -1,36 +0,0 @@		@@ -1,36 +0,0 @@
1	-export class HashMap<K extends EqualsObject, V> {
2	- private values: Array<HashItem<K, V>> = new Array();
3	-
4	- get(key: K): V {
5	- let found = this.values.find( function(value: HashItem<K, V>) {
6	- return value.key.equals(key);
7	- });
8	- if (found) {
9	- return found.value;
10	- }
11	- return null;
12	- }
13	-
14	- put(key: K, value: V): void {
15	- this.values.push(new HashItem(key, value));
16	- }
17	-
18	- clear() {
19	- this.values = new Array();
20	- }
21	-}
22	-
23	-export class HashItem<K, V> {
24	- key: K;
25	- value: V;
26	- constructor(key: K, value: V) {
27	- this.key = key;
28	- this.value = value;
29	- }
30	-}
31	-
32	-export abstract class EqualsObject {
33	-
34	- abstract equals(other: any): boolean;
35	-
36	-}
37	\ No newline at end of file	0	\ No newline at end of file
	@@ -1,3 +0,0 @@	@@ -1,3 +0,0 @@
1	-/* Module Index Entry - generated using the script npm run generate-index */
2	-export * from "./hashmap";
3	-export * from "./arrays";
	@@ -23,7 +23,7 @@ describe("Services", () => {		@@ -23,7 +23,7 @@ describe("Services", () => {
23	it("should remove article", (done) => {	23	it("should remove article", (done) => {
24	let articleId = 1;	24	let articleId = 1;
25	$httpBackend.expectDELETE(`/api/v1/articles/${articleId}`).respond(200, { success: "true" });	25	$httpBackend.expectDELETE(`/api/v1/articles/${articleId}`).respond(200, { success: "true" });
26	- articleService.removeArticle(<noosfero.Article>{id: articleId});	26	+ articleService.remove(<noosfero.Article>{id: articleId});
27	$httpBackend.flush();	27	$httpBackend.flush();
28	$httpBackend.verifyNoOutstandingExpectation();	28	$httpBackend.verifyNoOutstandingExpectation();
29	done();	29	done();
	@@ -37,4 +37,14 @@ export class BlockService extends RestangularService<noosfero.Block> {		@@ -37,4 +37,14 @@ export class BlockService extends RestangularService<noosfero.Block> {
37	return apiContentPromise.promise;	37	return apiContentPromise.promise;
38	}	38	}
39		39
		40	+ getBlock<T extends noosfero.Block>(blockId: number): ng.IPromise<T> {
		41	+ let deferred = this.$q.defer<T>();
		42	+ this.get(blockId)
		43	+ .then((result: noosfero.RestResult<T>) => {
		44	+ deferred.resolve(result.data);
		45	+ })
		46	+ .catch(reason => deferred.reject(reason));
		47	+ return deferred.promise;
		48	+ }
		49	+
40	}	50	}
	@@ -0,0 +1,9 @@		@@ -0,0 +1,9 @@
		1	+export class Arrays {
		2	+ static remove<T extends noosfero.RestModel>(elements: T[], element: T) {
		3	+ elements.forEach((value: T, index: number, array: T[]) => {
		4	+ if (value.id === element.id) {
		5	+ array.splice(index, 1);
		6	+ }
		7	+ });
		8	+ }
		9	+}
0	\ No newline at end of file	10	\ No newline at end of file