diff --git a/src/app/home/home.component.html b/src/app/home/home.component.html index f22952d1d..204d4b8cb 100644 --- a/src/app/home/home.component.html +++ b/src/app/home/home.component.html @@ -23,7 +23,7 @@ [playlists]="playlists" (playlistClicked)="getPlaylist($event)" (refreshClicked)="refreshPlaylist($event)" - (removeClicked)="removePlaylist($event)" + (removeClicked)="removeClicked($event)" > diff --git a/src/app/home/home.component.spec.ts b/src/app/home/home.component.spec.ts index af8e1995f..2ca546c05 100644 --- a/src/app/home/home.component.spec.ts +++ b/src/app/home/home.component.spec.ts @@ -1,8 +1,8 @@ import { UploadFile } from 'ngx-uploader'; import { PLAYLIST_PARSE, PLAYLIST_UPDATE } from './../../../ipc-commands'; -import { TranslatePipe } from '@ngx-translate/core'; +import { TranslatePipe, TranslateService } from '@ngx-translate/core'; import { ComponentFixture, TestBed } from '@angular/core/testing'; -import { MockComponent, MockModule, MockPipe } from 'ng-mocks'; +import { MockComponent, MockModule, MockPipe, MockProvider } from 'ng-mocks'; import { HomeComponent, PlaylistMeta } from './home.component'; import { HeaderComponent } from '../shared/components/header/header.component'; import { RecentPlaylistsComponent } from '../home/recent-playlists/recent-playlists.component'; @@ -15,6 +15,7 @@ import { RouterTestingModule } from '@angular/router/testing'; import { MatSnackBar, MatSnackBarModule } from '@angular/material/snack-bar'; import { ElectronService } from '../services/electron.service'; import { Router } from '@angular/router'; +import { DialogService } from '../services/dialog.service'; class MatSnackBarStub { open(): void {} @@ -36,6 +37,7 @@ export class ElectronServiceStub { describe('HomeComponent', () => { let component: HomeComponent; + let dialogService: DialogService; let fixture: ComponentFixture; let electronService: ElectronService; let router: Router; @@ -60,6 +62,8 @@ describe('HomeComponent', () => { providers: [ { provide: MatSnackBar, useClass: MatSnackBarStub }, { provide: ElectronService, useClass: ElectronServiceStub }, + MockProvider(DialogService), + MockProvider(TranslateService), ], }).compileComponents(); }); @@ -68,6 +72,7 @@ describe('HomeComponent', () => { fixture = TestBed.createComponent(HomeComponent); component = fixture.componentInstance; electronService = TestBed.inject(ElectronService); + dialogService = TestBed.inject(DialogService); router = TestBed.inject(Router); TestBed.inject(ElectronService); fixture.detectChanges(); @@ -77,6 +82,13 @@ describe('HomeComponent', () => { expect(component).toBeTruthy(); }); + it('should open the confirmation dialog on remove icon click', () => { + const playlistId = '12345'; + spyOn(dialogService, 'openConfirmDialog'); + component.removeClicked(playlistId); + expect(dialogService.openConfirmDialog).toHaveBeenCalledTimes(1); + }); + it('should send an event to the main process to remove a playlist', () => { const playlistId = '12345'; spyOn(electronService.ipcRenderer, 'send'); diff --git a/src/app/home/home.component.ts b/src/app/home/home.component.ts index 380237d0c..9c3c8e293 100644 --- a/src/app/home/home.component.ts +++ b/src/app/home/home.component.ts @@ -1,3 +1,4 @@ +import { TranslateService } from '@ngx-translate/core'; import { Component, NgZone } from '@angular/core'; import { UploadFile } from 'ngx-uploader'; import { ChannelStore, createChannel } from '../state'; @@ -12,6 +13,7 @@ import { PLAYLIST_UPDATE, PLAYLIST_UPDATE_RESPONSE, } from './../../../ipc-commands'; +import { DialogService } from './../services/dialog.service'; /** Type to describe meta data of a playlist */ export type PlaylistMeta = Pick< @@ -86,10 +88,12 @@ export class HomeComponent { */ constructor( private channelStore: ChannelStore, + private dialogService: DialogService, private electronService: ElectronService, private ngZone: NgZone, private router: Router, - private snackBar: MatSnackBar + private snackBar: MatSnackBar, + private translate: TranslateService ) { // get all playlists this.electronService.ipcRenderer.send('playlists-all'); @@ -177,6 +181,20 @@ export class HomeComponent { this.navigateToPlayer(); } + /** + * Triggers on remove click + * @param playlistId playlist id to remove + */ + removeClicked(playlistId: string): void { + this.dialogService.openConfirmDialog({ + title: this.translate.instant('HOME.PLAYLISTS.REMOVE_DIALOG.TITLE'), + message: this.translate.instant( + 'HOME.PLAYLISTS.REMOVE_DIALOG.MESSAGE' + ), + onConfirm: (): void => this.removePlaylist(playlistId), + }); + } + /** * Removes the provided playlist from the database * @param playlistId playlist id to remove diff --git a/src/app/player/components/epg-list/epg-list.component.spec.ts b/src/app/player/components/epg-list/epg-list.component.spec.ts index a35a43e82..6d70de36d 100644 --- a/src/app/player/components/epg-list/epg-list.component.spec.ts +++ b/src/app/player/components/epg-list/epg-list.component.spec.ts @@ -1,4 +1,4 @@ -import { MockComponent } from 'ng-mocks'; +import { MockComponent, MockProvider } from 'ng-mocks'; /* eslint-disable @typescript-eslint/unbound-method */ import { MatDialog, MatDialogModule } from '@angular/material/dialog'; import { TranslatePipe } from '@ngx-translate/core'; @@ -21,7 +21,6 @@ describe('EpgListComponent', () => { let fixture: ComponentFixture; let electronService: ElectronService; let channelStore: ChannelStore; - let dialog: MatDialog; const MOCKED_PROGRAMS = { channel: { @@ -48,8 +47,7 @@ describe('EpgListComponent', () => { desc: [ { lang: 'en', - value: - "Jordan's Queen Rania has made job creation a priority to help curb the staggering unemployment rates among youths in the Middle East.", + value: "Jordan's Queen Rania has made job creation a priority to help curb the staggering unemployment rates among youths in the Middle East.", }, ], date: ['20080711'], @@ -104,6 +102,7 @@ describe('EpgListComponent', () => { ], providers: [ { provide: ElectronService, useClass: ElectronServiceStub }, + MockProvider(MatDialog), ], }).compileComponents(); }) @@ -113,9 +112,8 @@ describe('EpgListComponent', () => { fixture = TestBed.createComponent(EpgListComponent); component = fixture.componentInstance; electronService = TestBed.inject(ElectronService); - dialog = TestBed.inject(MatDialog); channelStore = TestBed.inject(ChannelStore); - channelStore.setActiveChannel(({ + channelStore.setActiveChannel({ id: '', url: '', name: '', @@ -123,7 +121,7 @@ describe('EpgListComponent', () => { tvg: { rec: '3', }, - } as unknown) as Channel); + } as unknown as Channel); fixture.detectChanges(); }); @@ -141,7 +139,7 @@ describe('EpgListComponent', () => { }); it('should handle an empty epg programs object', () => { - const payload = ({} as unknown) as EpgData; + const payload = {} as unknown as EpgData; component.handleEpgData({ payload }); fixture.detectChanges(); expect(component.timeNow).toBeFalsy();