import { Component, Input, OnInit, EventEmitter, Output } from '@angular/core';
import { AccountService } from 'src/app/shared/server-services/account.service';
import { ChatData } from '../chat-layout.component';


@Component({
  selector: 'app-chat-message',
  templateUrl: './chat-message.component.html',
  styleUrls: ['./chat-message.component.scss']
})
export class ChatMessageComponent implements OnInit {

  @Input() data: ChatData;
  @Output('edit') editEvent:EventEmitter<string> = new EventEmitter<string>(); 
  @Output('delete') deleteEvent:EventEmitter<void> = new EventEmitter<void>(); 
  @Output('editOpened') editOpenedEvent: EventEmitter<ChatMessageComponent> = new EventEmitter<ChatMessageComponent>();
  @Output('addReaction') addReactionEvent:EventEmitter<string> = new EventEmitter<string>(); 

  editMode = false;

  public modifyPermission = false;

  constructor(private accountService: AccountService
  ) {
    // calculate if the message is editable
    this.accountService.getMe().then((account)=>{
      this.modifyPermission = this.data.account.id == account.id;
    });

  }

  ngOnInit(): void{
  }


  public onDelete(){
    this.deleteEvent.emit();
  }

  public editModeOn(){
    this.editMode = true;
    this.editOpenedEvent.emit(this);
  }

  public onEditSubmit(ev){
    this.data.message = ev;
    this.editMode = false;
    this.editEvent.emit(ev);
  }

  public onEditClose(ev?){
    this.editMode = false;
  }

}
