import { Component, OnInit } from "@angular/core";
import {
    FormControl,
    FormGroup,
    ReactiveFormsModule,
    Validators,
} from "@angular/forms";
import { MatFormFieldModule } from "@angular/material/form-field";
import { TranslateModule, TranslateService } from "@ngx-translate/core";
import { MatInputModule } from "@angular/material/input";
import { MatButtonModule } from "@angular/material/button";

import { ServiceComm } from "../../services/service-comm.service";
import { GearService } from "../../services/gear.service";
import { AddAction } from "../../models/add-action.enum";

@Component({
    selector: "app-new-gear",
    templateUrl: "./new-gear.component.html",
    styleUrls: ["./new-gear.component.css"],
    imports: [
        TranslateModule,
        MatFormFieldModule,
        ReactiveFormsModule,
        ReactiveFormsModule,
        MatInputModule,
        MatButtonModule,
    ],
})
export class NewGearComponent implements OnInit {
    public addForm: FormGroup;

    constructor(
        private serviceComm: ServiceComm,
        private serviceApi: GearService,
        private translateService: TranslateService,
    ) {
        this.addForm = new FormGroup(
            {
                name: new FormControl("", Validators.required),
                manufacturer: new FormControl("", Validators.required),
                minSize: new FormControl("", [
                    Validators.required,
                    Validators.min(60),
                    Validators.max(320),
                ]),
                maxSize: new FormControl("", [
                    Validators.required,
                    Validators.min(60),
                    Validators.max(320),
                ]),
                aad: new FormControl("", Validators.required),
                mainCanopy: new FormControl("", [
                    Validators.required,
                    Validators.min(60),
                    Validators.max(320),
                ]),
                reserveCanopy: new FormControl("", [
                    Validators.required,
                    Validators.min(60),
                    Validators.max(320),
                ]),
                equipment: new FormControl("RAS", [
                    Validators.required,
                    Validators.min(60),
                    Validators.max(320),
                ]),
            },
            { updateOn: "blur" },
        );
    }

    ngOnInit() {
        this.serviceComm.forceTranslateTitle.subscribe((data) => {
            if (data === true) {
                this.updateTitle();
            }
        });

        this.updateTitle();
    }

    onSubmit(formData) {
        this.serviceApi
            .addGear(
                formData.name,
                formData.manufacturer,
                +formData.minSize,
                +formData.maxSize,
                formData.aad,
                formData.mainCanopy,
                formData.reserveCanopy,
                formData.equipment,
            )
            .subscribe(() => {
                this.serviceComm.refreshData(AddAction.Gear);
            });
    }

    private updateTitle() {
        this.translateService.get("NewGear_Title").subscribe((data) => {
            this.serviceComm.updatedComponentTitle(data);
        });
    }
}
