relatedNodes

import { Component, OnInit, Input, OnDestroy } from '@angular/core';
import { Angular2Apollo, ApolloQueryObservable } from 'angular2-apollo';
import { StoreService } from 'ng2-storeservice';
import { allPosts, projectPosts, tagPosts } from './postboard.model';
import { Subject } from 'rxjs/Subject';
import { every } from 'lodash';

@Component({
  selector: 'co-postboard',
  templateUrl: './postboard.component.html',
  styleUrls: ['./postboard.component.scss']
})
export class PostboardComponent implements OnInit, OnDestroy {
  @Input()
  public projectId: string = null;
  public posts: any = [];
  public postsObs: ApolloQueryObservable<any>;
  public loading: Boolean = false;
  public selectedTagsObs: any;
  public selectedTags = [];
  public subs: { [s: string]: any; } = {};
  public tagPostsObs: ApolloQueryObservable<any>;
  public tagPostFilter: Subject<any> = new Subject<any>();
  public allPostsFilter: Subject<any> = new Subject<any>();

  constructor(
    private store: StoreService,
    private apollo: Angular2Apollo
  ) { }

  ngOnInit() {
    setTimeout(()=> {
      this.allPostsFilter.next({});
    })

    if (!this.projectId) {
      this.postsObs = this.apollo.watchQuery({
        query: allPosts,
        forceFetch: true,
        returnPartialData: true,
        variables: {
          filter: this.allPostsFilter
        }
      });
    } else {
      this.postsObs = this.apollo.watchQuery({
        query: projectPosts,
        variables: {
          id: this.projectId,
          filter: this.allPostsFilter
        },
        forceFetch: true,
        returnPartialData: true,
      });
    }

    this.subs['posts'] = this.postsObs.subscribe(({data, loading}) => {
      this.loading = loading;
      if (data.allPosts) {
        this.posts = data.allPosts;
      } else if (data.Project) {
        if (data.Project.posts) {
          this.posts = data.Project.posts;
        }
      }
    });

    this.tagPostsObs = this.apollo.watchQuery({
      query: tagPosts,
      variables: {
        filter: this.tagPostFilter
      },
      forceFetch: true,
      returnPartialData: true,
    });

    this.selectedTagsObs = this.store.retrieve('tag');
    this.subs['selectedTags'] = this.selectedTagsObs.subscribe(o => {
      this.loading = true;
      const tags = o.get('selectedFilterTags');
      if (!tags.length) {
        this.selectedTags = [];
        this.tagPostFilter.next({})
      } else {
        this.selectedTags = [];
        tags.forEach(tag => {this.selectedTags.push(tag.id)})
        this.tagPostFilter.next({id_in: this.selectedTags})
      }
    });

    this.subs['tagsPosts'] = this.tagPostsObs.subscribe(({data, loading}) => {
      let postIds = [];
      if (!loading && data.allTags && data.allTags.length && this.selectedTags.length) {
        data.allTags.forEach(tag => {
          tag.posts.forEach(post => {
            let tagIds = [];
            let results = [];
            post.tags.forEach(tag => {
              tagIds.push(tag.id);
            });
            this.selectedTags.forEach(id => {
              if (tagIds.indexOf(id) > -1) {
                results.push({present: true});
              } else {
                results.push({present: false});
              }
            });
            if (every(results, ['present', true])) {
              postIds.push(post.id);
            }
          });
        });
        if (postIds.length) {
          this.allPostsFilter.next({id_in: postIds});
        } else {
          this.allPostsFilter.next({id: 'dufindermigaldrig'});
        }
      } else if (!loading) {
        this.allPostsFilter.next({});
      }
    });
  }

  ngOnDestroy() {
    Object.keys(this.subs).forEach(s => {
      this.subs[s].unsubscribe();
    });
  }

}