fix(ui): remove duplicate download items in manage slide over (#1916)

* fix(ui): filter duplicate downloads in ManageSlideOver using downloadId

Apply the same logic as PR #927 to deduplicate season pack downloads
in the "Manage Series" slide-over panel.

* Update src/components/ManageSlideOver/index.tsx

Co-authored-by: Copilot <[email protected]>

* Update src/components/ManageSlideOver/index.tsx

Co-authored-by: Gauthier <[email protected]>

---------

Co-authored-by: Copilot <[email protected]>
Co-authored-by: Gauthier <[email protected]>

Author: 3 people

src/components/ManageSlideOver/index.tsx

@@ -25,6 +25,7 @@ import {
 } from '@server/constants/media';
 import { MediaServerType } from '@server/constants/server';
 import type { MediaWatchDataResponse } from '@server/interfaces/api/mediaInterfaces';
+import type { DownloadingItem } from '@server/lib/downloadtracker';
 import type { RadarrSettings, SonarrSettings } from '@server/lib/settings';
 import type { MovieDetails } from '@server/models/Movie';
 import type { TvDetails } from '@server/models/Tv';
@@ -33,6 +34,17 @@ import Link from 'next/link';
 import { useIntl } from 'react-intl';
 import useSWR from 'swr';
 
+const filterDuplicateDownloads = (
+  items: DownloadingItem[] = []
+): DownloadingItem[] => {
+  const seen = new Set<string>();
+  return items.filter((item) => {
+    if (seen.has(item.downloadId)) return false;
+    seen.add(item.downloadId);
+    return true;
+  });
+};
+
 const messages = defineMessages('components.ManageSlideOver', {
   manageModalTitle: 'Manage {mediaType}',
   manageModalIssues: 'Open Issues',
@@ -230,26 +242,30 @@ const ManageSlideOver = ({
             </h3>
             <div className="overflow-hidden rounded-md border border-gray-700 shadow">
               <ul>
-                {data.mediaInfo?.downloadStatus?.map((status, index) => (
-                  <Tooltip
-                    key={`dl-status-${status.externalId}-${index}`}
-                    content={status.title}
-                  >
-                    <li className="border-b border-gray-700 last:border-b-0">
-                      <DownloadBlock downloadItem={status} />
-                    </li>
-                  </Tooltip>
-                ))}
-                {data.mediaInfo?.downloadStatus4k?.map((status, index) => (
-                  <Tooltip
-                    key={`dl-status-${status.externalId}-${index}`}
-                    content={status.title}
-                  >
-                    <li className="border-b border-gray-700 last:border-b-0">
-                      <DownloadBlock downloadItem={status} is4k />
-                    </li>
-                  </Tooltip>
-                ))}
+                {filterDuplicateDownloads(data.mediaInfo?.downloadStatus).map(
+                  (status, index) => (
+                    <Tooltip
+                      key={`dl-status-${status.externalId}-${index}`}
+                      content={status.title}
+                    >
+                      <li className="border-b border-gray-700 last:border-b-0">
+                        <DownloadBlock downloadItem={status} />
+                      </li>
+                    </Tooltip>
+                  )
+                )}
+                {filterDuplicateDownloads(data.mediaInfo?.downloadStatus4k).map(
+                  (status, index) => (
+                    <Tooltip
+                      key={`dl-status-4k-${status.externalId}-${index}`}
+                      content={status.title}
+                    >
+                      <li className="border-b border-gray-700 last:border-b-0">
+                        <DownloadBlock downloadItem={status} is4k />
+                      </li>
+                    </Tooltip>
+                  )
+                )}
               </ul>
             </div>
           </div>