argos/dmp-frontend/src/app/ui/admin/description-types/listing/description-types.component.ts

import { DataSource } from '@angular/cdk/table';
import { HttpErrorResponse } from '@angular/common/http';
import { Component, EventEmitter, OnInit, ViewChild } from '@angular/core';
import { MatDialog } from '@angular/material/dialog';
import { MatPaginator } from '@angular/material/paginator';
import { MatSort } from '@angular/material/sort';
import { Router } from '@angular/router';
import { DescriptionTemplateType } from '@app/core/model/description-template-type/description-template-type';
import { DescriptionTemplateTypeLookup } from '@app/core/query/description-template/description-template-type.lookup';
import { DescriptionTemplateTypeService } from '@app/core/services/description-template-type/description-template-type.service';
import { SnackBarNotificationLevel, UiNotificationService } from '@app/core/services/notification/ui-notification-service';
import { BaseComponent } from '@common/base/base.component';
import { ConfirmationDialogComponent } from '@common/modules/confirmation-dialog/confirmation-dialog.component';
import { TranslateService } from '@ngx-translate/core';
import { Observable, merge } from 'rxjs';
import { map, startWith, switchMap, takeUntil } from 'rxjs/operators';
import { nameof } from 'ts-simple-nameof';

@Component({
	selector: 'app-description-types',
	templateUrl: './description-types.component.html',
	styleUrls: ['./description-types.component.scss']
})
export class DescriptionTypesComponent extends BaseComponent implements OnInit {

	@ViewChild(MatPaginator, { static: true }) _paginator: MatPaginator;
	@ViewChild(MatSort, { static: true }) _sort: MatSort;

	dataSource: DescriptionTypesDataSource | null;
	displayedColumns: String[] = ['label', 'status', 'delete'];

	statuses = [
		{ value: '0', viewValue: 'DESCRIPTION-TYPES-LISTING.STATUS.DRAFT' },
		{ value: '1', viewValue: 'DESCRIPTION-TYPES-LISTING.STATUS.FINALIZED' }
	];

	constructor(
		private descriptionTemplateTypeService: DescriptionTemplateTypeService,
		private dialog: MatDialog,
		private language: TranslateService,
		private uiNotificationService: UiNotificationService,
		private router: Router
	) {
		super();
	}

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

	refresh() {
		this.dataSource = new DescriptionTypesDataSource(this.descriptionTemplateTypeService, this._paginator, this._sort);
	}

	rowClick(rowId: String) {
		this.router.navigate(['description-types/' + rowId]);
	}

	parseStatus(value: number): string {
		const stringVal = value.toString()
		try {
			return this.statuses.find(status => status.value === stringVal).viewValue;
		} catch {
			return stringVal;
		}
	}

	deleteTemplate(id: string) {
		if (id) {
			const dialogRef = this.dialog.open(ConfirmationDialogComponent, {
				restoreFocus: false,
				data: {
					message: this.language.instant('GENERAL.CONFIRMATION-DIALOG.DELETE-ITEM'),
					confirmButton: this.language.instant('GENERAL.CONFIRMATION-DIALOG.ACTIONS.CONFIRM'),
					cancelButton: this.language.instant('GENERAL.CONFIRMATION-DIALOG.ACTIONS.CANCEL'),
					isDeleteConfirmation: true
				}
			});

			dialogRef.afterClosed().pipe(takeUntil(this._destroyed)).subscribe(result => {
				if (result) {
					this.descriptionTemplateTypeService.delete(id)
						.pipe(takeUntil(this._destroyed))
						.subscribe(
							complete => {
								this.uiNotificationService.snackBarNotification(this.language.instant('GENERAL.SNACK-BAR.SUCCESSFUL-DATASET-PROFILE-DELETE'), SnackBarNotificationLevel.Success);
								this.refresh();
							},
							error => {
								this.onCallbackError(error);
								if (error.error.statusCode == 674) {
									this.uiNotificationService.snackBarNotification(this.language.instant('GENERAL.SNACK-BAR.UNSUCCESSFUL-DATASET-PROFILE-DELETE'), SnackBarNotificationLevel.Error);
								} else {
									this.uiNotificationService.snackBarNotification(this.language.instant(error.message), SnackBarNotificationLevel.Error);
								}
							}
						);
				}
			});

		}
	}

	onCallbackError(errorResponse: HttpErrorResponse) {
		this.uiNotificationService.snackBarNotification(errorResponse.message, SnackBarNotificationLevel.Warning);
	}

	getStatusClass(status: number): string {

		if (status == 1) {
			return 'status-chip-finalized'
		}

		return 'status-chip-draft';
	}

}

export class DescriptionTypesDataSource extends DataSource<DescriptionTemplateType> {

	data: DescriptionTemplateType[] = [];
	loadData: EventEmitter<boolean> = new EventEmitter<boolean>();

	constructor(
		private _service: DescriptionTemplateTypeService,
		private _paginator: MatPaginator,
		private _sort: MatSort
	) {
		super();
	}

	connect(): Observable<DescriptionTemplateType[]> {
		const dataChanges = [
			this._paginator.page,
			this._sort.sortChange
		];

		return merge(...dataChanges).pipe(
			startWith(<string>null),
			switchMap(() => {
				let lookup: DescriptionTemplateTypeLookup = new DescriptionTemplateTypeLookup();
				lookup.page = {
					offset: this._paginator.pageIndex * this._paginator.pageSize,
					size: this._paginator.pageSize
				},
					lookup.project = {
						fields: [
							nameof<DescriptionTemplateType>(x => x.id),
							nameof<DescriptionTemplateType>(x => x.name),
							nameof<DescriptionTemplateType>(x => x.status)
						]
					};
				lookup.order = {
					items: ['name']
				};
				return this._service.query(lookup)
			}),
			map(result => {
				return result;
			}),
			map(result => {
				if (!result) { return []; }

				this.data = result.items;
				this._paginator.length = result.count;
				return result.items;
			}));
	}

	disconnect() {
		// No-op
	}
}