feat: add start and end dates

apps/frontend/src/app/components/shows/shows-list.component.ts

@@ -69,6 +69,26 @@ import { Show, ShowStatus, ShowType, CreateShowDto, UpdateShowDto, Comment, Sugg
             </select>
           </div>
 
+          <div class="form-group">
+            <label for="dateStarted">Date Started</label>
+            <input
+              type="date"
+              id="dateStarted"
+              [(ngModel)]="newShow.dateStarted"
+              name="dateStarted"
+            >
+          </div>
+
+          <div class="form-group">
+            <label for="dateFinished">Date Finished</label>
+            <input
+              type="date"
+              id="dateFinished"
+              [(ngModel)]="newShow.dateFinished"
+              name="dateFinished"
+            >
+          </div>
+
           <div class="form-group">
             <label for="rating">Rating (1-10)</label>
             <input
@@ -197,6 +217,26 @@ import { Show, ShowStatus, ShowType, CreateShowDto, UpdateShowDto, Comment, Sugg
             </select>
           </div>
 
+          <div class="form-group">
+            <label for="edit-dateStarted">Date Started</label>
+            <input
+              type="date"
+              id="edit-dateStarted"
+              [(ngModel)]="editShow.dateStarted"
+              name="dateStarted"
+            >
+          </div>
+
+          <div class="form-group">
+            <label for="edit-dateFinished">Date Finished</label>
+            <input
+              type="date"
+              id="edit-dateFinished"
+              [(ngModel)]="editShow.dateFinished"
+              name="dateFinished"
+            >
+          </div>
+
           <div class="form-group">
             <label for="edit-rating">Rating (1-10)</label>
             <input
@@ -495,6 +535,18 @@ import { Show, ShowStatus, ShowType, CreateShowDto, UpdateShowDto, Comment, Sugg
                   </div>
                 }
 
+                @if (show.dateStarted) {
+                  <p class="date-started">
+                    Started: {{ formatDate(show.dateStarted) }}
+                  </p>
+                }
+
+                @if (show.dateFinished) {
+                  <p class="date-finished">
+                    Finished: {{ formatDate(show.dateFinished) }}
+                  </p>
+                }
+
                 @if (authService.isAdmin()) {
                   <div class="actions">
                     <button (click)="startEdit(show)" class="btn btn-secondary btn-sm">
@@ -850,6 +902,13 @@ import { Show, ShowStatus, ShowType, CreateShowDto, UpdateShowDto, Comment, Sugg
       margin: 0.5rem 0;
     }
 
+    .date-started,
+    .date-finished {
+      font-size: 0.85rem;
+      color: #4b5563;
+      margin-top: 0.5rem;
+    }
+
     .actions {
       margin-top: 1rem;
     }
@@ -1254,12 +1313,14 @@ export class ShowsListComponent implements OnInit {
 
   totalFilteredShows = computed(() => this.filteredShows().length);
 
-  newShow: Partial<CreateShowDto> = {
+  newShow: Partial<CreateShowDto> & { dateStarted?: Date; dateFinished?: Date } = {
     title: '',
     type: ShowType.tvSeries,
     status: ShowStatus.wantToWatch,
     rating: undefined,
     notes: '',
+    dateStarted: undefined,
+    dateFinished: undefined,
     tags: [],
     links: []
   };
@@ -1361,6 +1422,8 @@ export class ShowsListComponent implements OnInit {
       rating: undefined,
       notes: '',
       coverImage: undefined,
+      dateStarted: undefined,
+      dateFinished: undefined,
       tags: [],
       links: []
     };
@@ -1423,6 +1486,8 @@ export class ShowsListComponent implements OnInit {
       title: this.newShow.title,
       type: this.newShow.type,
       status: this.newShow.status,
+      dateStarted: this.newShow.dateStarted ? new Date(this.newShow.dateStarted) : undefined,
+      dateFinished: this.newShow.dateFinished ? new Date(this.newShow.dateFinished) : undefined,
       rating: this.newShow.rating,
       notes: this.newShow.notes,
       coverImage: this.newShow.coverImage,
@@ -1450,6 +1515,8 @@ export class ShowsListComponent implements OnInit {
       title: show.title,
       type: show.type,
       status: show.status,
+      dateStarted: show.dateStarted,
+      dateFinished: show.dateFinished,
       rating: show.rating,
       notes: show.notes,
       coverImage: show.coverImage,
@@ -1478,7 +1545,13 @@ export class ShowsListComponent implements OnInit {
     const show = this.editingShow();
     if (!show || !this.editShow.title || !this.editShow.type || !this.editShow.status) return;
 
-    this.showsService.updateShow(show.id, this.editShow).subscribe(() => {
+    const updateData = {
+      ...this.editShow,
+      dateStarted: this.editShow.dateStarted ? new Date(this.editShow.dateStarted) : undefined,
+      dateFinished: this.editShow.dateFinished ? new Date(this.editShow.dateFinished) : undefined,
+    };
+
+    this.showsService.updateShow(show.id, updateData).subscribe(() => {
       this.loadShows();
       this.cancelEdit();
     });
@@ -1673,7 +1746,7 @@ export class ShowsListComponent implements OnInit {
 
     try {
       await this.suggestionService.createSuggestion({
-        entityType: SuggestionEntity.SHOW,
+        entityType: SuggestionEntity.show,
         title: this.suggestedShow.title,
         type: this.suggestedShow.type,
         notes: this.suggestedShow.notes,