import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { RouterExtensions } from '@nativescript/angular';
import { confirm } from '@nativescript/core/ui/dialogs';
import { Select, Store } from '@ngxs/store';
import { FeedbackType } from 'nativescript-feedback';
import { Observable } from 'rxjs';
import { withLatestFrom } from 'rxjs/operators';
import { transitionOptions } from '~/constants/shared.constants';
import { feedbackMessage } from '~/pages/material/utils/feedback-messages';
import { AdvertisingCategoryDetailResponse } from '../../entities/output/advertisingCategoryDetailResponse';
import {
    DeleteAdvertisingCategory,
    LoadAdvertisingCategoryDetail
} from '../../state-mgmt/advertising-category.actions';
import { AdvertisingCategoryState } from '../../state-mgmt/advertising-category.state';

@Component({
    selector: 'AdvertisingCategoryDetail',
    moduleId: module.id,
    templateUrl: './advertising-category-detail.component.html',
    styleUrls: ['./_advertising-category-detail.component.scss']
})

export class AdvertisingCategoryDetailComponent implements OnInit {
    @Select(AdvertisingCategoryState.getAdvertisingCategoryDetail) advertisingCategoryDetail$: Observable<AdvertisingCategoryDetailResponse>;
    @Select(AdvertisingCategoryState.isLoading) isLoading$: Observable<boolean>;

    id: number;
    advertisingCategoryDetail: AdvertisingCategoryDetailResponse;

    canEdit: boolean = false;

    constructor(
        private store: Store,
        private routerExtensions: RouterExtensions,
        private route: ActivatedRoute
     ) {}

    ngOnInit(): void {
        this.id = +this.route.snapshot.params['id'];
        this.canEdit = this.route.snapshot.params['permission'];
    }

    onLoad() {
        this.store.dispatch(new LoadAdvertisingCategoryDetail(this.id))
            .pipe(withLatestFrom(this.advertisingCategoryDetail$))
            .subscribe(([_, output]) => {
                this.advertisingCategoryDetail = output;
            }, err => {
                console.log(err);
                feedbackMessage(FeedbackType.Error, 'Načítání dat', `Při načítání dat došlo k chybě. Zkontrolujte prosím vaše internetové připojení.`);
                this.routerExtensions.back();
            });
    }

    onUpdateTap() {
        this.routerExtensions.navigate(['advertising/advertisingCategoryUpdate', this.id], {transition: transitionOptions});
    }

    onDeleteTap() {
        const options = {
            title: 'Smazání náborové kategorie',
            message: 'Opravdu chcete tuto náborovou kategorii smazat? Náborová kategorie bude smazána permanentně.',
            okButtonText: 'Ano',
            cancelButtonText: 'Ne'
        };
        confirm(options).then((result: boolean) => {
            if (result) {
                this.store.dispatch(new DeleteAdvertisingCategory(this.id))
                    .subscribe(() => {
                        feedbackMessage(FeedbackType.Success, 'Smazání náborové kategorie', `Náborová kategorie byla úspěšně smazána.`);
                        this.routerExtensions.back();
                }, err => {
                    console.log(err);
                    feedbackMessage(FeedbackType.Error, 'Smazání náborové kategorie', `Při mazání náborové kategorie došlo k chybě. Zkontrolujte prosím vaše internetové připojení.`);
                });
            }
        });
    }

    onBackButton(): void {
        this.routerExtensions.back();
    }

    get updateIcon() {
        return String.fromCharCode(0xf044);
    }

    get trashIcon() {
        return String.fromCharCode(0xf2ed);
    }
}
