refactor: minor code improvements

src/app/app.component.ts

@@ -8,6 +8,7 @@ import {
     EPG_ERROR,
     EPG_FETCH,
     EPG_FETCH_DONE,
+    OPEN_FILE,
     SHOW_WHATS_NEW,
     VIEW_ADD_PLAYLIST,
     VIEW_SETTINGS,
@@ -68,9 +69,10 @@ export class AppComponent {
         private snackBar: MatSnackBar,
         private whatsNewService: WhatsNewService
     ) {
-        /* if (
-            (this.electronService.remote.process.platform === 'linux' ||
-                this.electronService.remote.process.platform === 'win32') &&
+        if (
+            ((this.electronService.isElectron &&
+                this.electronService?.remote?.process.platform === 'linux') ||
+                this.electronService?.remote?.process.platform === 'win32') &&
             this.electronService.remote.process.argv.length > 2
         ) {
             const filePath = this.electronService.remote.process.argv.find(
@@ -80,12 +82,12 @@ export class AppComponent {
             if (filePath) {
                 const filePathsArray = filePath.split('/');
                 const fileName = filePathsArray[filePathsArray.length - 1];
-                this.electronService.sendIpcEvent('open-file', {
+                this.electronService.sendIpcEvent(OPEN_FILE, {
                     filePath,
                     fileName,
                 });
             }
-        } */
+        }
     }
 
     /**
@@ -103,11 +105,13 @@ export class AppComponent {
      * Initializes all necessary listeners for the events from the renderer process
      */
     setRendererListeners(): void {
-        this.commandsList.forEach((command) =>
-            this.electronService.listenOn(command.id, () =>
-                this.ngZone.run(() => command.callback())
-            )
-        );
+        if (this.electronService.isElectron) {
+            this.commandsList.forEach((command) =>
+                this.electronService.listenOn(command.id, () =>
+                    this.ngZone.run(() => command.callback())
+                )
+            );
+        }
     }
 
     /**

src/app/home/home.component.spec.ts

@@ -1,6 +1,9 @@
 import { UploadFile } from 'ngx-uploader';
 import {
+    PLAYLIST_GET_BY_ID,
     PLAYLIST_PARSE,
+    PLAYLIST_PARSE_BY_URL,
+    PLAYLIST_REMOVE_BY_ID,
     PLAYLIST_UPDATE,
 } from './../../../shared/ipc-commands';
 import { TranslatePipe, TranslateService } from '@ngx-translate/core';
@@ -20,11 +23,19 @@ import { Router } from '@angular/router';
 import { DialogService } from '../services/dialog.service';
 import { ElectronServiceStub } from '../services/electron.service.stub';
 import { DataService } from '../services/data.service';
+import { NgxIndexedDBModule, NgxIndexedDBService } from 'ngx-indexed-db';
+import { of } from 'rxjs';
 
 class MatSnackBarStub {
     open(): void {}
 }
 
+class NgxIndexedDBServiceStub {
+    getAll() {
+        return of([] as any);
+    }
+}
+
 describe('HomeComponent', () => {
     let component: HomeComponent;
     let dialogService: DialogService;
@@ -48,12 +59,17 @@ describe('HomeComponent', () => {
                 MockModule(MatProgressBarModule),
                 MockModule(MatSnackBarModule),
                 MockModule(RouterTestingModule),
+                MockModule(NgxIndexedDBModule),
             ],
             providers: [
                 { provide: MatSnackBar, useClass: MatSnackBarStub },
                 { provide: DataService, useClass: ElectronServiceStub },
                 MockProvider(DialogService),
                 MockProvider(TranslateService),
+                {
+                    provide: NgxIndexedDBService,
+                    useClass: NgxIndexedDBServiceStub,
+                },
             ],
         }).compileComponents();
     });
@@ -64,6 +80,7 @@ describe('HomeComponent', () => {
         electronService = TestBed.inject(DataService);
         dialogService = TestBed.inject(DialogService);
         router = TestBed.inject(Router);
+        TestBed.inject(NgxIndexedDBService);
         fixture.detectChanges();
     });
 
@@ -73,17 +90,17 @@ describe('HomeComponent', () => {
 
     it('should open the confirmation dialog on remove icon click', () => {
         const playlistId = '12345';
-        spyOn(dialogService, 'openConfirmDialog');
+        jest.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, 'sendIpcEvent');
+        jest.spyOn(electronService, 'sendIpcEvent');
         component.removePlaylist(playlistId);
         expect(electronService.sendIpcEvent).toHaveBeenCalledWith(
-            'playlist-remove-by-id',
+            PLAYLIST_REMOVE_BY_ID,
             { id: playlistId }
         );
     });
@@ -93,7 +110,7 @@ describe('HomeComponent', () => {
             _id: 'iptv1',
             filePath: '/home/user/lists/iptv.m3u',
         } as PlaylistMeta;
-        spyOn(electronService, 'sendIpcEvent');
+        jest.spyOn(electronService, 'sendIpcEvent');
         component.refreshPlaylist(playlistMeta);
         expect(electronService.sendIpcEvent).toHaveBeenCalledWith(
             PLAYLIST_UPDATE,
@@ -103,10 +120,10 @@ describe('HomeComponent', () => {
 
     it('should send an event to the main process to get a playlist', () => {
         const playlistId = '6789';
-        spyOn(electronService, 'sendIpcEvent');
+        jest.spyOn(electronService, 'sendIpcEvent');
         component.getPlaylist(playlistId);
         expect(electronService.sendIpcEvent).toHaveBeenCalledWith(
-            'playlist-by-id',
+            PLAYLIST_GET_BY_ID,
             {
                 id: playlistId,
             }
@@ -116,10 +133,10 @@ describe('HomeComponent', () => {
     it('should send an event to the main process to get a playlist by URL', () => {
         const playlistTitle = 'playlist.m3u';
         const playlistUrl = 'http://test.com/' + playlistTitle;
-        spyOn(electronService, 'sendIpcEvent');
+        jest.spyOn(electronService, 'sendIpcEvent');
         component.sendPlaylistsUrl(playlistUrl);
         expect(electronService.sendIpcEvent).toHaveBeenCalledWith(
-            'parse-playlist-by-url',
+            PLAYLIST_PARSE_BY_URL,
             {
                 title: playlistTitle,
                 url: playlistUrl,
@@ -128,7 +145,7 @@ describe('HomeComponent', () => {
     });
 
     it('should send an event to the main process to parse a playlist', () => {
-        spyOn(electronService, 'sendIpcEvent');
+        jest.spyOn(electronService, 'sendIpcEvent');
         const title = 'my-list.m3u';
         const path = '/home/user/iptv/' + title;
         const playlistContent = 'test';
@@ -159,7 +176,7 @@ describe('HomeComponent', () => {
     });
 
     it('should set IPC event listeners', () => {
-        spyOn(electronService, 'listenOn');
+        jest.spyOn(electronService, 'listenOn');
         component.setRendererListeners();
         expect(electronService.listenOn).toHaveBeenCalledTimes(
             component.commandsList.length
@@ -167,13 +184,13 @@ describe('HomeComponent', () => {
     });
 
     it('should send notification on file reject', () => {
-        spyOn(component, 'showNotification');
+        jest.spyOn(component, 'showNotification');
         component.rejectFile('wrong-file.txt');
         expect(component.showNotification).toHaveBeenCalledTimes(1);
     });
 
     it('should navigate to the player view', () => {
-        spyOn(router, 'navigateByUrl');
+        jest.spyOn(router, 'navigateByUrl');
         component.navigateToPlayer();
         expect(router.navigateByUrl).toHaveBeenCalledTimes(1);
         expect(router.navigateByUrl).toHaveBeenCalledWith(
@@ -183,7 +200,7 @@ describe('HomeComponent', () => {
     });
 
     it('should remove all ipc listeners on destroy', () => {
-        spyOn(electronService, 'removeAllListeners');
+        jest.spyOn(electronService, 'removeAllListeners');
         component.ngOnDestroy();
         expect(electronService.removeAllListeners).toHaveBeenCalledTimes(
             component.commandsList.length

src/app/home/home.component.ts

@@ -7,8 +7,14 @@ import { MatSnackBar } from '@angular/material/snack-bar';
 import { Playlist } from '../../../shared/playlist.interface';
 import {
     ERROR,
+    PLAYLIST_GET_ALL,
+    PLAYLIST_GET_ALL_RESPONSE,
+    PLAYLIST_GET_BY_ID,
     PLAYLIST_PARSE,
+    PLAYLIST_PARSE_BY_URL,
     PLAYLIST_PARSE_RESPONSE,
+    PLAYLIST_REMOVE_BY_ID,
+    PLAYLIST_REMOVE_BY_ID_RESPONSE,
     PLAYLIST_UPDATE,
     PLAYLIST_UPDATE_RESPONSE,
 } from '../../../shared/ipc-commands';
@@ -49,18 +55,18 @@ export class HomeComponent {
                 this.setPlaylist(response.payload),
         },
         {
-            id: 'playlist-all-result',
+            id: PLAYLIST_GET_ALL_RESPONSE,
             execute: (response: { payload: Partial<PlaylistMeta[]> }): void => {
                 this.playlists = response.payload;
             },
         },
         {
-            id: 'playlist-remove-by-id-result',
+            id: PLAYLIST_REMOVE_BY_ID_RESPONSE,
             execute: (): void => {
                 this.snackBar.open('Done! Playlist was removed.', null, {
                     duration: 2000,
                 });
-                this.electronService.sendIpcEvent('playlists-all');
+                this.electronService.sendIpcEvent(PLAYLIST_GET_ALL);
             },
         },
         {
@@ -82,22 +88,24 @@ export class HomeComponent {
     /**
      * Creates an instanceof HomeComponent
      * @param channelStore channels store
+     * @param dialogService dialog service
      * @param electronService electron service
-     * @param ngZone angulars ngZone module
-     * @param router angulars router
-     * @param snackBar snackbars with notification messages
+     * @param ngZone angular ngZone module
+     * @param router angular router
+     * @param snackBar snackbar for notification messages
+     * @param translate translate service
      */
     constructor(
+        private electronService: DataService,
         private channelStore: ChannelStore,
         private dialogService: DialogService,
-        private electronService: DataService,
         private ngZone: NgZone,
         private router: Router,
         private snackBar: MatSnackBar,
         private translate: TranslateService
     ) {
         // get all playlists
-        this.electronService.sendIpcEvent('playlists-all');
+        this.electronService.sendIpcEvent(PLAYLIST_GET_ALL);
         // set all renderer listeners
         this.setRendererListeners();
     }
@@ -107,9 +115,17 @@ export class HomeComponent {
      */
     setRendererListeners(): void {
         this.commandsList.forEach((command) => {
-            this.electronService.listenOn(command.id, (event, response) => {
-                this.ngZone.run(() => command.execute(response));
-            });
+            if (this.electronService.isElectron) {
+                this.electronService.listenOn(command.id, (event, response) =>
+                    this.ngZone.run(() => command.execute(response))
+                );
+            } else {
+                this.electronService.listenOn(command.id, (response) => {
+                    if (response.data.type === command.id) {
+                        command.execute(response.data);
+                    }
+                });
+            }
         });
     }
 
@@ -135,7 +151,7 @@ export class HomeComponent {
         this.electronService.sendIpcEvent(PLAYLIST_PARSE, {
             title: payload.file.name,
             playlist: array,
-            path: payload.file.nativeFile.path,
+            path: (payload.file.nativeFile as any).path,
         });
     }
 
@@ -153,7 +169,7 @@ export class HomeComponent {
      */
     sendPlaylistsUrl(playlistUrl: string): void {
         this.isLoading = true;
-        this.electronService.sendIpcEvent('parse-playlist-by-url', {
+        this.electronService.sendIpcEvent(PLAYLIST_PARSE_BY_URL, {
             title: this.getLastUrlSegment(playlistUrl),
             url: playlistUrl,
         });
@@ -198,7 +214,7 @@ export class HomeComponent {
      * @param playlistId playlist id to remove
      */
     removePlaylist(playlistId: string): void {
-        this.electronService.sendIpcEvent('playlist-remove-by-id', {
+        this.electronService.sendIpcEvent(PLAYLIST_REMOVE_BY_ID, {
             id: playlistId,
         });
     }
@@ -219,7 +235,7 @@ export class HomeComponent {
      * @param playlistId playlist id
      */
     getPlaylist(playlistId: string): void {
-        this.electronService.sendIpcEvent('playlist-by-id', {
+        this.electronService.sendIpcEvent(PLAYLIST_GET_BY_ID, {
             id: playlistId,
         });
     }

src/app/home/recent-playlists/playlist-info/playlist-info.component.html

@@ -36,7 +36,7 @@
             }}</mat-label>
             <input matInput formControlName="count" />
         </mat-form-field>
-        <mat-form-field class="full-width mb-10">
+        <mat-form-field class="full-width mb-10" *ngIf="isElectron">
             <mat-label>{{
                 'HOME.PLAYLISTS.INFO_DIALOG.USER_AGENT' | translate
             }}</mat-label>
@@ -54,18 +54,19 @@
                 {{ 'HOME.PLAYLISTS.INFO_DIALOG.UPDATE_FAILED' | translate }}
             </mat-hint>
         </mat-form-field>
-        <mat-checkbox
-            *ngIf="playlist.url || playlist.filePath"
-            class="full-width"
-            formControlName="autoRefresh"
-        >
-            {{ 'HOME.PLAYLISTS.INFO_DIALOG.AUTO_UPDATE' | translate }}
-        </mat-checkbox>
-        <p>
-            {{
-                'HOME.PLAYLISTS.INFO_DIALOG.AUTO_UPDATE_DESCRIPTION' | translate
-            }}
-        </p>
+        <ng-container *ngIf="playlist.url || playlist.filePath">
+            <mat-checkbox
+                class="full-width"
+                formControlName="autoRefresh"
+            >
+                {{ 'HOME.PLAYLISTS.INFO_DIALOG.AUTO_UPDATE' | translate }}
+            </mat-checkbox>
+            <p>
+                {{
+                    'HOME.PLAYLISTS.INFO_DIALOG.AUTO_UPDATE_DESCRIPTION' | translate
+                }}
+            </p>
+        </ng-container>
     </mat-dialog-content>
     <mat-dialog-actions align="end">
         <button

src/app/home/recent-playlists/playlist-info/playlist-info.component.ts

@@ -18,6 +18,9 @@ import { DataService } from '../../../services/data.service';
     providers: [DatePipe],
 })
 export class PlaylistInfoComponent {
+    /** Flag that returns true if application runs in electron-based environment */
+    isElectron = this.electronService.isElectron;
+
     /** Playlist object */
     playlist: Playlist;