diff --git a/src/app/dashboard/components/reorganize-lines-dialog.component.spec.ts b/src/app/dashboard/components/reorganize-lines-dialog.component.spec.ts new file mode 100644 index 000000000..044e05363 --- /dev/null +++ b/src/app/dashboard/components/reorganize-lines-dialog.component.spec.ts @@ -0,0 +1,124 @@ +import { TaskStatus } from '@aneoconsultingfr/armonik.api.angular'; +import { CdkDragDrop } from '@angular/cdk/drag-drop'; +import { TestBed } from '@angular/core/testing'; +import { MAT_DIALOG_DATA, MatDialog, MatDialogRef } from '@angular/material/dialog'; +import { Observable, of } from 'rxjs'; +import { EditNameLineResult } from '@app/types/dialog'; +import { IconsService } from '@services/icons.service'; +import { ReorganizeLinesDialogComponent } from './reorganize-lines-dialog.component'; +import { Line } from '../types'; + +describe('ReorganizeLinesDialogComponent', () => { + let component: ReorganizeLinesDialogComponent; + + const defaultLines: Line[] = [ + { + name: 'line1', + interval: 10, + hideGroupsHeader: false, + filters: [], + taskStatusesGroups: [ + { name: 'Success', color: 'green', statuses: [TaskStatus.TASK_STATUS_COMPLETED, TaskStatus.TASK_STATUS_PROCESSED]}, + { name: 'Running', color: 'yellow', statuses: [TaskStatus.TASK_STATUS_CREATING, TaskStatus.TASK_STATUS_PROCESSING]}, + { name: 'Error', color: 'red', statuses: [TaskStatus.TASK_STATUS_CANCELLED, TaskStatus.TASK_STATUS_TIMEOUT]} + ], + }, + { + name: 'line2', + interval: 20, + hideGroupsHeader: true, + filters: [], + taskStatusesGroups: [ + { name: 'Success', color: 'green', statuses: [TaskStatus.TASK_STATUS_COMPLETED, TaskStatus.TASK_STATUS_PROCESSED]}, + { name: 'Running', color: 'yellow', statuses: [TaskStatus.TASK_STATUS_CREATING, TaskStatus.TASK_STATUS_PROCESSING]}, + { name: 'Unspecified', color: 'grey', statuses: [TaskStatus.TASK_STATUS_UNSPECIFIED, TaskStatus.TASK_STATUS_RETRIED]} + ], + } + ]; + + let dialogRef$: Observable; + const mockMatDialog = { + open: jest.fn(() => { + return { + afterClosed() { + return dialogRef$; + } + }; + }) + }; + + const mockMatDialogRef = { + close: jest.fn() + }; + + beforeEach(() => { + component = TestBed.configureTestingModule({ + providers: [ + ReorganizeLinesDialogComponent, + IconsService, + { provide: MatDialogRef, useValue: mockMatDialogRef }, + { provide: MAT_DIALOG_DATA, useValue: { + lines: structuredClone(defaultLines) + }}, + { provide: MatDialog, useValue: mockMatDialog } + ] + }).inject(ReorganizeLinesDialogComponent); + component.ngOnInit(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); + + it('should init', () => { + expect(component.lines).toEqual(defaultLines); + }); + + it('should get required icons', () => { + expect(component.getIcon('drag')).toEqual('drag_indicator'); + expect(component.getIcon('edit')).toEqual('edit'); + expect(component.getIcon('delete')).toEqual('delete'); + }); + + it('should close', () => { + component.onNoClick(); + expect(mockMatDialogRef.close).toHaveBeenCalled(); + }); + + it('should change array on drop', () => { + const event = { + previousIndex: 0, + currentIndex: 1, + } as unknown as CdkDragDrop; + component.onDrop(event); + expect(component.lines).toEqual(structuredClone(defaultLines).reverse()); + }); + + it('should delete a line', () => { + component.onDeleteLine(component.lines[0]); + expect(component.lines).toEqual( + [{ + name: 'line2', + interval: 20, + hideGroupsHeader: true, + filters: [], + taskStatusesGroups: [ + { name: 'Success', color: 'green', statuses: [TaskStatus.TASK_STATUS_COMPLETED, TaskStatus.TASK_STATUS_PROCESSED]}, + { name: 'Running', color: 'yellow', statuses: [TaskStatus.TASK_STATUS_CREATING, TaskStatus.TASK_STATUS_PROCESSING]}, + { name: 'Unspecified', color: 'grey', statuses: [TaskStatus.TASK_STATUS_UNSPECIFIED, TaskStatus.TASK_STATUS_RETRIED]} + ], + }] + ); + }); + + it('should edit a name line', () => { + const newName = {name: 'newLineName'}; + dialogRef$ = of(newName); + component.onEditNameLine(component.lines[1], 1); + expect(component.lines[1].name).toEqual('newLineName'); + }); + + it('should track by line', () => { + expect(component.trackByLine(0, component.lines[0])).toEqual('line10'); + }); +}); \ No newline at end of file diff --git a/src/app/dashboard/components/reorganize-lines-dialog.component.ts b/src/app/dashboard/components/reorganize-lines-dialog.component.ts index b2c7fef2a..b11cb5f06 100644 --- a/src/app/dashboard/components/reorganize-lines-dialog.component.ts +++ b/src/app/dashboard/components/reorganize-lines-dialog.component.ts @@ -19,7 +19,7 @@ import { Line } from '../types';

Drag and drop lines to update the order

-
+
@@ -126,11 +126,11 @@ export class ReorganizeLinesDialogComponent implements OnInit { this.#dialogRef.close(); } - drop(event: CdkDragDrop) { + onDrop(event: CdkDragDrop) { moveItemInArray(this.lines, event.previousIndex, event.currentIndex); } - onDeleteLine( line: Line) { + onDeleteLine(line: Line) { const index = this.lines.indexOf(line); if (index > -1) { this.lines.splice(index, 1); @@ -145,17 +145,18 @@ export class ReorganizeLinesDialogComponent implements OnInit { }); dialogRef.afterClosed().subscribe((result) => { - if (!result) return; - const selectedLine = this.lines[index]; - const changeSelectedNameLine = (line: Line, newName: string): void => { - if(line.name === newName) { - line.name = result.name; - } - }; - this.lines.map(line => changeSelectedNameLine(line, selectedLine.name)); + if (result) { + const selectedLine = this.lines[index]; + const changeSelectedNameLine = (line: Line, oldName: string): void => { + if(line.name === oldName) { + line.name = result.name; + } + }; + this.lines.map(line => changeSelectedNameLine(line, selectedLine.name)); + } }); - } + trackByLine(index: number, line: Line): string { return line.name + index; }