ChurchAngular/src/app/games/massive-darkness2/md2-hero-profile-maintenance/md2-hero-profile-maintenance.component.ts

import { Component, OnInit, ViewChild } from '@angular/core';
import { GridComponent, GridDataResult } from '@progress/kendo-angular-grid';
import { State, process } from '@progress/kendo-data-query';
import { first } from 'rxjs/operators';
import { MD2HeroProfile, HeroClass, MD2Icon } from '../massive-darkness2.model';
import { MD2HeroProfileService } from '../service/massive-darkness2.service';
import { MD2HeroProfileEditorComponent } from './md2-hero-profile-editor/md2-hero-profile-editor.component';
import { DialogService } from '@progress/kendo-angular-dialog';
import { MsgBoxService } from '../../../services/msg-box.service';

@Component({
    selector: 'ngx-md2-hero-profile-maintenance',
    templateUrl: './md2-hero-profile-maintenance.component.html',
    styleUrls: ['./md2-hero-profile-maintenance.component.scss']
})
export class MD2HeroProfileMaintenanceComponent implements OnInit {
    @ViewChild('grid') grid: GridComponent;
    MD2Icon = MD2Icon;
    public gridData: GridDataResult = { data: [], total: 0 };
    private allData: MD2HeroProfile[] = [];
    private lastSelectedHeroClass: HeroClass;
    public gridState: State = {
        skip: 0,
        take: 10,
        sort: [{
            field: 'title',
            dir: 'asc'
        }],
        filter: {
            logic: 'and',
            filters: []
        },
        group: [{
            field: 'heroClass',
            dir: 'asc'
        }]
    };
    public isLoading: boolean = false;

    constructor(
        private heroProfileService: MD2HeroProfileService,
        private dialogService: DialogService,
        private msgBoxService: MsgBoxService
    ) {
    }

    ngOnInit(): void {
        this.loadData();
    }

    public loadData(): void {
        this.isLoading = true;
        this.heroProfileService.getAll().pipe(first()).subscribe(result => {
            this.allData = result;
            this.processGridData();
            this.isLoading = false;
        });
    }

    public processGridData(): void {
        // Normalize filter state to handle null/undefined/empty filters
        let normalizedFilter: { logic: 'and' | 'or'; filters: any[] } = { logic: 'and', filters: [] };
        if (this.gridState.filter) {
            const filters = this.gridState.filter.filters || [];
            if (filters.length > 0) {
                normalizedFilter = this.gridState.filter;
            }
        }

        const normalizedState: State = {
            ...this.gridState,
            filter: normalizedFilter
        };

        this.gridData = process(this.allData, normalizedState);
    }

    public addHandler(): void {
        const editorData = { heroClass: this.lastSelectedHeroClass || HeroClass.Berserker } as MD2HeroProfile;
        const dialogRef = this.dialogService.open({
            title: 'Add New Hero Profile',
            content: MD2HeroProfileEditorComponent,
            width: '90vw',
            height: 600
        });

        const editor = dialogRef.content.instance;
        editor.isAdding = true;
        editor.data = editorData;

        // Force model re-initialization after data is set
        setTimeout(() => {
            editor.initializeModel();
        }, 0);

        dialogRef.result.subscribe((result: MD2HeroProfile) => {
            if (result) {
                this.lastSelectedHeroClass = result.heroClass;
                this.loadData();
            }
        });
    }

    public editHandler({ dataItem }: { dataItem: MD2HeroProfile }): void {
        const dialogRef = this.dialogService.open({
            title: 'Edit Hero Profile',
            content: MD2HeroProfileEditorComponent,
            width: '90vw',
            height: 600
        });

        const editor = dialogRef.content.instance;
        editor.isAdding = false;
        editor.data = JSON.parse(JSON.stringify(dataItem));

        // Force model re-initialization after data is set
        setTimeout(() => {
            editor.initializeModel();
        }, 0);

        dialogRef.result.subscribe(result => {
            if (result) {
                this.loadData();
            }
        });
    }

    public removeHandler({ dataItem }: { dataItem: MD2HeroProfile }): void {
        this.msgBoxService.showConfirmDeleteBox().pipe(first()).subscribe(answer => {
            if (answer === true) {
                this.isLoading = true;
                this.heroProfileService.delete(dataItem.id).pipe(first()).subscribe(result => {
                    this.loadData();
                });
            }
        });
    }

    public getHeroClassName(heroClass: HeroClass): string {
        return HeroClass[heroClass] || '';
    }
}