import { Component, OnInit } from '@angular/core';
import { ISimpleTab } from '../../../../utils';
import { BsModalRef } from 'ngx-bootstrap/modal';
import { SHARE_MODAL_PROBLEMS_DROPDOWN } from '../../../../mockup';
import { CommonQuery } from '../../../../utils/common.query';
import { GraphQLService } from '../../../../utils/graphql.service';
import { LoaderService } from '../../../generic/loader/loader.service';

@Component({
	selector: 'esp-share-modal',
	templateUrl: './share.modal.component.html',
	styleUrls: ['./share.modal.component.scss'],
})
export class ShareModalComponent implements OnInit {
	config: any;
	selectedTab: ISimpleTab = null;
	message = null;
	users: any[] = [];
	problems: any[] = [];
	subject = '';

	constructor(private modalRef: BsModalRef, private graphql: GraphQLService, private loader: LoaderService) {}

	ngOnInit() {
		this.problems = [...SHARE_MODAL_PROBLEMS_DROPDOWN];
		this.getUsers();
	}

	getUsers() {
		this.loader.startLoader();
		this.graphql.query(CommonQuery.getUsers()).subscribe(response => {
			this.users = response.data['getUsers'].users.map(user => ({
				...user,
				name: user.email,
				value: user.email,
				selected: false,
			}));
			this.loader.stopLoader();
		});
	}

	onCommentUpdates(event) {
		this.message = event;
	}

	onTabSelection(event) {
		this.selectedTab = event;
	}

	onApply() {
		this.config.applyCallback({
			selectedTab: this.selectedTab,
			message: this.message,
			subject: this.subject,
			users: this.users,
			problems: this.selectedTab.name === 'share' ? null : this.problems,
		});
		this.onClose();
	}

	onClose() {
		this.modalRef.hide();
	}
}