import {Component, EventEmitter, Input, Output} from '@angular/core';
import {FormControl, FormGroup, ReactiveFormsModule, Validators} from '@angular/forms';
import {InputTextareaModule} from 'primeng/inputtextarea';
import {Button} from 'primeng/button';
import {CommentService} from '../../services/comment.service';
import {Author} from '../../models/author';
import {Subscription} from 'rxjs';
import {Comment} from '../../models/comment';
import {MessageService} from 'primeng/api';
import {NgStyle} from '@angular/common';
import {AuthService} from '../../auth.service';

@Component({
  selector: 'app-comment-form',
  standalone: true,
  imports: [
    ReactiveFormsModule,
    InputTextareaModule,
    Button,
    NgStyle
  ],
  templateUrl: './comment-form.component.html',
  styleUrl: './comment-form.component.css'
})
export class CommentFormComponent {
  commentForm = new FormGroup({
    content: new FormControl<string>('', [Validators.required, Validators.maxLength(512)]),
  });
  @Input({required: true}) postId: bigint = BigInt(1);
  @Output() commentToEmit = new EventEmitter<Comment>();
  subs: Subscription[] = [];

  constructor(private commentService: CommentService,
              private messageService: MessageService,
              private authService: AuthService,) {
  }

  onSubmit() {
    let token: string = this.authService.getAuthenticatedAuthorToken();
    let author: Author = this.authService.getAuthenticatedAuthor();
    if (this.commentForm.valid && author && token && this.commentForm.value.content) {
      // get l'image de profile après avoir créé le commentaire
      this.subs.push(this.commentService.create(this.commentForm.value.content, this.postId, author.id, token).subscribe({
        next: (comment: Comment) => {
          comment.authorId = author.id;
          comment.authorName = author.name;
          comment.profilePicture = author.profilePicture;
          comment.authorRole = author.role;
          this.commentForm.value.content = "";
          this.commentToEmit.emit(comment);
          this.successMessage("Succès", "Commentaire créé avec succès");
        },
        error: (error) => {
          this.failureMessage("Erreur d'envois", error.error.message);
        }
      }))
    }
  }

  successMessage(summary: string, detail: string): void {
    this.messageService.add({
      severity: 'success',
      summary,
      detail,
      life: 3000,
      closable: false
    });
  }

  failureMessage(summary: string, detail: string): void {
    this.messageService.add({
      severity: 'error',
      summary,
      detail,
      life: 3000,
      closable: false
    });
  }
}