import { Component } from '@angular/core';
import { FormControl, FormGroup, Validators } from '@angular/forms';
import { Router } from '@angular/router';
import { ImagesService, Visibility } from '../services/images.service';

@Component({
    selector: 'app-page-upload',
    templateUrl: './page-upload.component.html',
    styleUrls: ['./page-upload.component.scss']
})
export class PageUploadComponent {
    public form = new FormGroup({
        name: new FormControl<string | null>(null, [ Validators.required ]),
        file: new FormControl<File | null>(null, [ Validators.required ]),
        visibility: new FormControl(Visibility.Unlisted, [ Validators.required ]),
    });

    public setFile($event: any) {
        this.form.patchValue({ file: $event.target.files[0] });
    }

    public async submit() {
        await this.images.upload({
            name: this.form.value.name ?? ''
        }, this.form.value.file!);
        this.router.navigateByUrl('/');
    }

    public constructor(
        private images: ImagesService,
        private router: Router
    ) {}
}