import { ChangeDetectionStrategy, ChangeDetectorRef, Component, inject, OnInit, ViewChild } from '@angular/core';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { Route } from '@angular/router';
import { LiveGridColumnType, LiveGridComponent, LiveGridOptions } from 'codefoxlivegrid';
import { CfDialogService, TableComponent, CfDestroyRef, CardHeaderComponent, ButtonDirective } from 'codefoxui';
import { DIALOG_DELETE_CONFIGURATION } from 'src/app/const';
import { UserGroupRow } from 'src/app/interfaces';
import { LocalApiService } from 'src/app/services/local.api.service';
import { UsergroupeditorComponent } from '../usergroupeditor/usergroupeditor.component';

@Component({
	standalone: true,
	selector: 'app-usergroups',
	templateUrl: './usergroups.component.html',
	styleUrls: ['./usergroups.component.scss'],
	changeDetection: ChangeDetectionStrategy.OnPush,
	imports: [
		CardHeaderComponent,
		ButtonDirective,
		LiveGridComponent
	]
})
export class UsergroupsComponent extends CfDestroyRef implements OnInit {

	@ViewChild('table') table: TableComponent | null = null;

	las: LocalApiService = inject(LocalApiService);
	cdr: ChangeDetectorRef = inject(ChangeDetectorRef);

	dialogService: CfDialogService = inject(CfDialogService);

	usersGroupsLiveGridCreateOptions: LiveGridOptions<UserGroupRow> = {
		name: 'usergroups',
		idField: 'userGroupId',
		endPoint: 'usergroups',
		columns: [{
			title: 'Megnevezés',
			field: 'name',
			type: LiveGridColumnType.STRING
		}]
	}

	showEditorDialog(usergroupRow: UserGroupRow | null = null): void {
		this.dialogService.open(UsergroupeditorComponent, {
			data: {
				userGroupId: usergroupRow !== null ? usergroupRow.userGroupId : null
			}
		});
	}

	delete(usergroupRow: UserGroupRow | null): void {
		this.dialogService.confirmAccept(DIALOG_DELETE_CONFIGURATION).then(() => {
			if (usergroupRow !== null) {
				this.las.deleteUserGroup(usergroupRow.userGroupId).pipe(takeUntilDestroyed(this.destroyRef)).subscribe(() => {});
			}
		});
	}

	ngOnInit(): void {
		this.cdr.detectChanges();
	}

	constructor() {
		super();
		this.cdr.detach();
	}

}

export const USERGROUPS_ROUTE: Route = {
	path: 'usergroups',
	component: UsergroupsComponent
}