matsen-tool-fe/matsen-tool/src/app/contacts/contacts-detail/contacts-detail.component.ts

import {AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild} from '@angular/core';
import {CommentJsonld, ContactJsonld, ContactService, PostJsonld, PostService} from "@app/core/api/v1";
import {Subscription} from "rxjs";
import {ActivatedRoute} from "@angular/router";
import {MatPaginator, MatPaginatorIntl, PageEvent} from "@angular/material/paginator";
import {MatTableDataSource} from "@angular/material/table";
import {NewPostingComponent} from "@app/postings/new-posting/new-posting.component";
import {NgbModal, NgbModalOptions} from "@ng-bootstrap/ng-bootstrap";
import {NewContactComponent} from "@app/contacts/new-contact/new-contact.component";
import {ModalStatus} from "@app/_helpers/modal.states";
import {User} from "@app/_models";
import {AccountService} from "@app/_services";
import {NewCommentComponent} from "@app/postings/new-comment/new-comment.component";
import {ApiConverter} from "@app/_helpers/api.converter";

@Component({
    selector: 'app-contacts-detail',
    templateUrl: './contacts-detail.component.html',
    styleUrl: './contacts-detail.component.scss'
})
export class ContactsDetailComponent implements OnInit, AfterViewInit {
    @ViewChild(MatPaginator) postsPaginator: MatPaginator;

    protected user: User | null;

    protected id: string;
    protected contact: ContactJsonld;
    protected contactSub: Subscription;

    protected postsSub: Subscription;
    protected posts: Array<PostJsonld>;
    protected postsDataSource;
    protected postsLength: number;
    protected postsPageEvent: PageEvent;
    protected postsPageSize: number;
    protected postsPageIndex: number;
    protected commentsVisibility: Map<string, boolean>;

    protected modalOptions: NgbModalOptions = {
        centered: true
    };

    constructor(
        private contactService: ContactService,
        private accountService: AccountService,
        private route: ActivatedRoute,
        private postService: PostService,
        private modalService: NgbModal
    ) {
        this.user = this.accountService.userValue;

        this.id = "";
        this.contact = {} as ContactJsonld;
        this.contactSub = new Subscription();

        this.postsSub = new Subscription();
        this.posts = [];
        this.postsPaginator = new MatPaginator(new MatPaginatorIntl(), ChangeDetectorRef.prototype);
        this.postsDataSource = new MatTableDataSource<PostJsonld>(this.posts);
        this.postsLength = 0;
        this.postsPageEvent = new PageEvent();
        this.postsPageSize = 10;
        this.postsPageIndex = 0;
        this.commentsVisibility = new Map<string, boolean>();
    }

    ngOnInit() {
        this.route.params.subscribe(params => {
            this.id = params['id'];
        });
        this.getContactData();
        this.getPostsData();
    }

    ngAfterViewInit() {
        this.postsDataSource.paginator = this.postsPaginator;
    }

    getContactData() {
        // switch over this.dataType (customers, etc.)
        this.contactSub = this.contactService.contactsIdGet(
            this.id
        ).subscribe(
            data => {
                this.contact = data;
            }
        );
    }

    getPostsData() {
        this.postsSub = this.postService.postsGetCollection(
            this.postsPageIndex + 1,
            this.postsPageSize,
            this.contact.partner + '',
            [],
            this.id,
            undefined,
            undefined,
            undefined,
            undefined,
            false
        ).subscribe(
            data => {
                this.posts = data["hydra:member"];
                this.postsLength = Number(data["hydra:totalItems"]);
                this.posts.forEach(posts => {
                    if (posts.id) {
                        this.commentsVisibility.set(posts.id, false);
                    }
                });
            }
        );
    }

    postsHandlePageEvent(e: PageEvent) {
        this.postsPageEvent = e;
        this.postsLength = e.length;
        this.postsPageIndex = e.pageIndex.valueOf();
        this.postsPageSize = e.pageSize.valueOf();
        this.getPostsData();
    }

    openModalNewPosting() {
        const modalRefPosting = this.modalService.open(NewPostingComponent, this.modalOptions);
        let posting: PostJsonld = {} as PostJsonld;
        posting.contact = this.contact.id ?? null;
        posting.partner = this.contact.partner ?? null;
        modalRefPosting.componentInstance.posting = posting;
        modalRefPosting.componentInstance.submit.subscribe((modalStatus: ModalStatus) => {
            if (modalStatus === ModalStatus.Submitted) {
                modalRefPosting.dismiss();
                this.getPostsData();
            }
        });
    }

    openModalNewComment(post: PostJsonld) {
        const modalRefComment = this.modalService.open(NewCommentComponent, this.modalOptions);
        let comment: CommentJsonld = {} as CommentJsonld;
        comment.post = post.id ?? null;
        modalRefComment.componentInstance.comment = comment;
        modalRefComment.componentInstance.submit.subscribe((modalStatus: ModalStatus) => {
            if (modalStatus === ModalStatus.Submitted) {
                modalRefComment.dismiss();
                this.getPostsData();
            }
        });
    }

    openModalEditPosting(post: PostJsonld) {
        const modalRefPostingEdit = this.modalService.open(NewPostingComponent, this.modalOptions);
        modalRefPostingEdit.componentInstance.posting = post;
        modalRefPostingEdit.componentInstance.submit.subscribe((modalStatus: ModalStatus) => {
            if (modalStatus === ModalStatus.Submitted) {
                modalRefPostingEdit.dismiss();
                this.getPostsData();
            }
        });
    }

    openModalEditComment(comment: CommentJsonld) {
        const modalRefComment = this.modalService.open(NewCommentComponent, this.modalOptions);
        modalRefComment.componentInstance.comment = comment;
        modalRefComment.componentInstance.submit.subscribe((modalStatus: ModalStatus) => {
            if (modalStatus === ModalStatus.Submitted) {
                modalRefComment.dismiss();
                this.getPostsData();
            }
        });
    }

    openModalEditContact() {
        const modalRefContact = this.modalService.open(NewContactComponent, this.modalOptions);
        modalRefContact.componentInstance.contact = this.contact;
        if (this.contact.birthday !== undefined) {
            modalRefContact.componentInstance.birthdayValue = ApiConverter.convertDate(this.contact.birthday);
        }
        modalRefContact.componentInstance.submit.subscribe((modalStatus: ModalStatus) => {
            if (modalStatus === ModalStatus.Submitted) {
                modalRefContact.dismiss();
                this.getContactData();
            }
        });
    }

    showComments(post: PostJsonld) {
        if (post.id) {
            const currentVisibility = this.commentsVisibility.get(post.id);
            this.commentsVisibility.set(post.id, !currentVisibility);
        }
    }
}