import { Component, Input, OnInit } from '@angular/core'

import { UntypedFormGroup, UntypedFormControl, FormControl } from '@angular/forms'
import { MatSnackBar } from '@angular/material/snack-bar'

import { FullInfo, InfoDataService, ModelAction, FormFieldInput } from '../info-data.service'
import { ActionsService, Action, ActionResult } from '../../_services/actions.service'

@Component({
    selector: 'gisaf-action-form',
    templateUrl: './action-form.component.html',
    styleUrls: ['./action-form.component.css']
})
export class ActionFormComponent implements OnInit {
    @Input() action: ModelAction
    @Input() source: FullInfo
    formGroup: UntypedFormGroup

    constructor(
        private actionsService: ActionsService,
        private snackBar: MatSnackBar,
    ) {}

    ngOnInit() {
        this.formGroup = new UntypedFormGroup({})
        this.action.formFields.forEach(
            field => {
                // TODO: pick appropriate control for different types
                if (field.type == 'date') {
                    this.formGroup.addControl(
                        field.name,
                        new FormControl(new Date())
                    )
                }
                else if (field.type == 'time') {
                    this.formGroup.addControl(
                        field.name,
                        new FormControl(new Date().toLocaleTimeString(
                                        [], {hour: '2-digit', minute:'2-digit'}))
                    )
                }
                else if (field.type == 'number') {
                    this.formGroup.addControl(
                        field.name,
                        new FormControl(0)
                    )
                }
                else if (field.type == 'checkbox') {
                    this.formGroup.addControl(
                        field.name,
                        new FormControl(false)
                    )
                }
                else {
                    this.formGroup.addControl(
                        field.name,
                        new FormControl('')
                    )
                }
            }
        )
    }

    execute() {
        this.actionsService.execute(
            [this.source.modelInfo.store],
            [[this.source.featureInfo.id.toString()]],
            [this.action.name],
            [],  // params
            Object.entries(this.formGroup.value).map(
                ([key, value]) => {
                    let formField = this.action.formFields.filter(
                        ff => ff.name == key)[0]
                    let val: string
                    if (formField.type == 'date') {
                        val = (<Date>value).toISOString()
                    }
                    else {
                        val = `${value}`
                    }
                    return new FormFieldInput(key, val)
                }
            )
        ).subscribe(
            results => {
                // Update the tags in the info source
                let messages: string[] = []
                if (results.message) {
                    messages.push(results.message)
                }
                results.actionResults[0].actionResults?.forEach(
                    element => messages.push(element.message)
                )
                this.snackBar.open(messages.join(', '), 'Close', {duration: 3000})
            }
        )
    }
}
