Reworked Models to use tmdb to enable integration with Radarr api. Also reworked test connection to use api to validate as I ran into CORS errors. I also set up an endpoint to call radarr to delete movies. Currently only got to retrieving movie info. Should be able to use the id retrieved to then delete the movie.

Jellyfin.Plugin.MediaCleaner/Pages/configuration.js

@@ -37,7 +37,7 @@ const testConnectionSonarr = async () => {
     var addressElement = document.getElementById('SonarrAddress');
     var validationElement = document.getElementById('SonarrConnectionValidation');
 
-    await validateConnection(apiKeyElement, addressElement, validationElement);
+    await validateConnection(apiKeyElement, addressElement, validationElement, "sonarr");
 }
 
 const testConnectionRadarr = async () => {
@@ -45,7 +45,7 @@ const testConnectionRadarr = async () => {
     var addressElement = document.getElementById('RadarrAddress');
     var validationElement = document.getElementById('RadarrConnectionValidation');
 
-    await validateConnection(apiKeyElement, addressElement, validationElement);
+    await validateConnection(apiKeyElement, addressElement, validationElement, "radarr");
 }
 
 // Validation and Normalization
@@ -57,7 +57,7 @@ const normalizeUrl = (url) => {
     return normalizedUrl;
 };
 
-const validateConnection = async (apiKeyElement, addressElement, validationElement) => {
+const validateConnection = async (apiKeyElement, addressElement, validationElement, controller) => {
     var httpAddress = addressElement.value;
     var apiKey = apiKeyElement.value;
 
@@ -77,13 +77,19 @@ const validateConnection = async (apiKeyElement, addressElement, validationEleme
         setAttemptingConnection(validationElement);
         try{
             const url = normalizeUrl(httpAddress);
-            const response = await fetch(url, {
-                method: "GET",
+            // Move endpoint to a constant?
+            const response = await fetch(`/${controller}/testConnection`, {
+                method: "POST",
                 headers: {
-                    "X-Api-Key": apiKey,
-                }
+                    "Content-Type": "application/json"
+                },
+                body: JSON.stringify({ address: url, apiKey })
             });
-            success = response.ok;
+
+            if (response.ok) {
+                const result = await response.json();
+                success = result?.success === true;
+            }
         }
         catch (error){
             console.error(`Error: ${error}`);

Jellyfin.Plugin.MediaCleaner/Pages/home.js

@@ -63,45 +63,6 @@ const getMediaCleanerMoviesTitle = async () => {
     return response.json();
 };
 
-const createCheckbox = (mediaInfo = {}, table, deleteButton) => {
-    const container = document.createElement('div');
-    container.className = 'checkboxContainer';
-    container.style.marginBottom = 0;
-
-    const label = document.createElement('label');
-    label.className = 'emby-checkbox-label';
-    label.style.textAlign = 'center';
-    label.style.paddingLeft = '1.8em';
-
-    const checkbox = document.createElement('input');
-    checkbox.type = 'checkbox';
-    checkbox.setAttribute('is', 'emby-checkbox');
-    checkbox.dataset.mediaInfo = JSON.stringify(mediaInfo) || '';
-
-    const span = document.createElement('span');
-    span.textContent = '';
-
-    label.appendChild(checkbox);
-    label.appendChild(span);
-    container.appendChild(label);
-
-    checkbox.addEventListener('change', (e) => {
-        if(isDeleteButtonVisible(table)){
-            deleteButton.style.visibility = 'visible';
-        }
-        else {
-            deleteButton.style.visibility = 'hidden';
-        }
-    });
-
-    return container;
-};
-
-const isDeleteButtonVisible = (table) => {
-    const checkboxes = table.getElementsByClassName('emby-checkbox');
-    const hasChecked = Array.from(checkboxes).some(checkbox => checkbox.checked);
-    return hasChecked;
-}
 
 const populateTables = async () => {
     var moviesInfo = await getMediaCleanerMovieInfo();
@@ -159,6 +120,46 @@ const populateTables = async () => {
     }
 };
 
+const createCheckbox = (mediaInfo = {}, table, deleteButton) => {
+    const container = document.createElement('div');
+    container.className = 'checkboxContainer';
+    container.style.marginBottom = 0;
+
+    const label = document.createElement('label');
+    label.className = 'emby-checkbox-label';
+    label.style.textAlign = 'center';
+    label.style.paddingLeft = '1.8em';
+
+    const checkbox = document.createElement('input');
+    checkbox.type = 'checkbox';
+    checkbox.setAttribute('is', 'emby-checkbox');
+    checkbox.dataset.mediaInfo = JSON.stringify(mediaInfo) || '';
+
+    const span = document.createElement('span');
+    span.textContent = '';
+
+    label.appendChild(checkbox);
+    label.appendChild(span);
+    container.appendChild(label);
+
+    checkbox.addEventListener('change', (e) => {
+        if(isDeleteButtonVisible(table)){
+            deleteButton.style.visibility = 'visible';
+        }
+        else {
+            deleteButton.style.visibility = 'hidden';
+        }
+    });
+
+    return container;
+};
+
+const isDeleteButtonVisible = (table) => {
+    const checkboxes = table.getElementsByClassName('emby-checkbox');
+    const hasChecked = Array.from(checkboxes).some(checkbox => checkbox.checked);
+    return hasChecked;
+}
+
 const addClickHandlersToLinks = () => {
     const linkBtns = document.querySelectorAll("button.links");
     linkBtns.forEach(btn => {
@@ -177,15 +178,41 @@ const addClickHandlersToDeleteButtons = () => {
     deleteSeriesButtonElement.addEventListener("click", deleteFromSonarr);
 }
 
-const deleteFromRadarr = () => {
-    // Need to GET first for movieIds?
+const getCheckedMedia = (table) => {
+    const checkboxes = table.getElementsByClassName('emby-checkbox');
+    const selectedMediaCheckboxes = Array.from(checkboxes).filter(checkbox => checkbox.checked);
+    const selectedMedia = selectedMediaCheckboxes.map(selectedMediaCheckbox => JSON.parse(selectedMediaCheckbox.dataset.mediaInfo));
+    console.log("Selected media: ", selectedMedia);
+    return selectedMedia;
+}
 
-    // Likely need to use MovieEditor DELETE endpoint (/api/v3/movie/editor)
+const deleteMovieFromRadarrApi = async (movie) => {
+    console.log("Movie to post: ", movie);
+    const response = await fetch("/radarr/deleteMovieFromRadarr", {
+        method: "POST",
+        headers: {
+            'Content-Type': 'application/json'
+        },
+        body: JSON.stringify(movie)
+    });
+
+    if(!response.ok){
+        throw new Error(`Response status: ${response.status}`)
+    }
+    return console.log("Response: ", response.json());
+}
+
+const deleteFromRadarr = async () => {
+    // Get all movies with checked checkboxes
+    const selectedMovies = getCheckedMedia(moviesTable);
+    selectedMovies.forEach(async movie => await deleteMovieFromRadarrApi(movie));
+    // Need to GET first for movieIds?
+    // /api/v3/movie?tmdbId=383275
+
+    // Likely need to use Movie DELETE endpoint (/api/v3/movie/{id})
     // Payload:
     // {
-    //   "movieIds": [
-    //     0
-    //   ],
+    //   "id": id
     //   "deleteFiles": true
     // }
     console.log("Delete from Radarr!")
@@ -193,16 +220,13 @@ const deleteFromRadarr = () => {
 
 const deleteFromSonarr = () => {
     // Need to GET first for seriesIds?
+    getCheckedMedia(seriesTable);
+    // Use tvdbId included in filenames.
+    // /api/v5/series?tvdbId=383275
+    // Possibly use statistics from GET to show on front end?
 
-    // Likely need to use SeriesEditor DELETE endpoint
-    // Payload:
-    // {
-    //    "seriesIds": [
-    //        1
-    //    ],
-    //    "seasonFolder": null,
-    //    "deleteFiles": true,
-    // }
+    // Likely need to use EpisodeFile bulk DELETE endpoint
+    // /api/v5/episodefile/bulk​
     console.log("Delete from Sonarr!")
 }