fixes: debugs for 422 and delete option

static/js/app.js

@@ -519,6 +519,9 @@ function showEpisodesModal(data) {
                                                 <button class="btn btn-sm btn-primary" onclick="editEpisode('${data.series.imdb_id}', ${episode.season}, ${episode.episode}, '${dateadded}', '${episode.source || ''}')">
                                                     <i class="fas fa-edit"></i> Edit
                                                 </button>
+                                                <button class="btn btn-sm btn-danger" onclick="deleteEpisode('${data.series.imdb_id}', ${episode.season}, ${episode.episode})" style="margin-left: 5px;">
+                                                    <i class="fas fa-trash"></i> Delete
+                                                </button>
                                             </td>
                                         </tr>
                                     `;
@@ -1249,4 +1252,74 @@ Analysis:
         console.error('Debug failed:', error);
         showToast('Debug failed: ' + error.message, 'error');
     }
+}
+
+// Episode deletion functionality
+async function deleteEpisode(imdbId, season, episode) {
+    const episodeStr = `S${season.toString().padStart(2, '0')}E${episode.toString().padStart(2, '0')}`;
+    
+    // Confirmation dialog
+    if (!confirm(`⚠️ Delete Episode ${episodeStr}?\n\nThis will permanently remove the episode from the database.\n\nAre you sure you want to continue?`)) {
+        return;
+    }
+    
+    try {
+        const response = await fetch(`/database/episode/${imdbId}/${season}/${episode}`, {
+            method: 'DELETE',
+            headers: {
+                'Content-Type': 'application/json'
+            }
+        });
+        
+        const result = await response.json();
+        
+        if (response.ok && result.success) {
+            showToast(`✅ Episode ${episodeStr} deleted successfully`, 'success');
+            
+            // Remove the row from the table
+            const rows = document.querySelectorAll('#episodes-table-body tr');
+            rows.forEach(row => {
+                const episodeCell = row.querySelector('td:first-child');
+                if (episodeCell && episodeCell.textContent === episodeStr) {
+                    row.remove();
+                }
+            });
+            
+            // Update episode counts in modal header
+            updateEpisodeModalCounts();
+            
+        } else {
+            const errorMsg = result.message || result.error || 'Unknown error';
+            showToast(`❌ Failed to delete episode: ${errorMsg}`, 'error');
+        }
+        
+    } catch (error) {
+        console.error('Delete episode failed:', error);
+        showToast(`❌ Delete failed: ${error.message}`, 'error');
+    }
+}
+
+// Update episode counts in modal after deletion
+function updateEpisodeModalCounts() {
+    const remainingRows = document.querySelectorAll('#episodes-table-body tr');
+    const totalEpisodes = remainingRows.length;
+    const episodesWithDates = Array.from(remainingRows).filter(row => 
+        row.getAttribute('data-has-date') === 'true'
+    ).length;
+    const episodesWithoutDates = totalEpisodes - episodesWithDates;
+    
+    // Update the stats in the modal
+    const statsDiv = document.querySelector('.episode-stats');
+    if (statsDiv) {
+        // Keep the existing "With Video" count by finding it
+        const videoCountDiv = statsDiv.querySelector('div:nth-child(4)');
+        const videoCountText = videoCountDiv ? videoCountDiv.innerHTML : '<div><strong>With Video:</strong> -</div>';
+        
+        statsDiv.innerHTML = `
+            <div><strong>Total Episodes:</strong> ${totalEpisodes}</div>
+            <div><strong>With Dates:</strong> ${episodesWithDates}</div>
+            <div style="color: #dc3545;"><strong>Missing Dates:</strong> ${episodesWithoutDates}</div>
+            ${videoCountText}
+        `;
+    }
 }