import { Component, ElementRef, EventEmitter, Input, Output, ViewChild } from '@angular/core';

@Component({
    selector: 'iqser-upload-file',
    templateUrl: './upload-file.component.html',
    styleUrls: ['./upload-file.component.scss'],
})
export class UploadFileComponent {
    @ViewChild('attachFileInput', { static: true }) attachFileInput!: ElementRef;

    @Input() file!: File | null;
    @Input() readonly = false;
    @Input() accept = 'application/pdf';
    @Output() readonly fileChanged = new EventEmitter<File | null>();

    triggerAttachFile() {
        this.attachFileInput.nativeElement.click();
    }

    attachFile(event: any) {
        const files = event?.target?.files;
        this.file = files[0];

        // input field needs to be set as empty in case the same file will be selected second time
        event.target.value = '';

        if (!this.file) {
            console.error('No file to import!');
            return;
        }
        this.fileChanged.emit(this.file);
    }

    removeFile() {
        this.file = null;
        this.fileChanged.emit(null);
    }
}