feat: auto-refresh playlists on app startup

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

@@ -42,6 +42,27 @@
             }}</mat-label>
             <input formControlName="userAgent" matInput />
         </mat-form-field>
+        <mat-form-field class="full-width" *ngIf="playlist.filePath">
+            <mat-label>
+                {{ 'HOME.PLAYLISTS.INFO_DIALOG.FILE_PATH' | translate }}
+            </mat-label>
+            <input formControlName="filePath" matInput />
+            <mat-hint *ngIf="playlist.updateState === 2">
+                {{ '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>
     </mat-dialog-content>
     <mat-dialog-actions align="end">
         <button

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

@@ -10,6 +10,7 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { DatePipe } from '@angular/common';
 import { PlaylistInfoComponent } from './playlist-info.component';
 import { FormsModule, ReactiveFormsModule, FormBuilder } from '@angular/forms';
+import { Playlist } from '../../playlist.interface';
 
 describe('PlaylistInfoComponent', () => {
     let component: PlaylistInfoComponent;
@@ -51,7 +52,7 @@ describe('PlaylistInfoComponent', () => {
     });
 
     it('should send an event to the main process after save', () => {
-        const playlistToSave = { _id: 'a12345', title: 'Playlist' };
+        const playlistToSave = { _id: 'a12345', title: 'Playlist' } as Playlist;
         spyOn(electronService.ipcRenderer, 'send');
         component.saveChanges(playlistToSave);
         expect(electronService.ipcRenderer.send).toHaveBeenCalledTimes(1);

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

@@ -61,6 +61,11 @@ export class PlaylistInfoComponent {
                 disabled: true,
             }),
             url: new FormControl({ value: this.playlist.url, disabled: true }),
+            filePath: new FormControl({
+                value: this.playlist.filePath,
+                disabled: true,
+            }),
+            autoRefresh: new FormControl(this.playlist.autoRefresh),
         });
     }
 
@@ -68,7 +73,9 @@ export class PlaylistInfoComponent {
      * Saves updated playlist information
      * @param data updated form data
      */
-    saveChanges(data: Pick<Playlist, '_id' | 'title' | 'userAgent'>): void {
+    saveChanges(
+        data: Pick<Playlist, '_id' | 'title' | 'userAgent' | 'autoRefresh'>
+    ): void {
         this.electronService.ipcRenderer.send(PLAYLIST_SAVE_DETAILS, data);
     }
 }

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

@@ -36,6 +36,15 @@
                 | {{ 'HOME.PLAYLISTS.UPDATED' | translate }}:
                 {{ item.updateDate | date: 'MMMM d, yyyy, HH:mm' }}
             </ng-container>
+            <ng-container *ngIf="item.updateState === 2">
+                <mat-icon
+                    [matTooltip]="
+                        'HOME.PLAYLISTS.INFO_DIALOG.UPDATE_FAILED' | translate
+                    "
+                    [inline]="true"
+                    >warning</mat-icon
+                >
+            </ng-container>
         </div>
         <button
             *ngIf="item.url || item.filePath"