From 276e67b5fa5dba1ee55909da3f72335a3a484e49 Mon Sep 17 00:00:00 2001
From: Mark McDowall <mark@mcdowall.ca>
Date: Tue, 6 Jan 2026 18:43:26 -0800
Subject: [PATCH] Add alt text for series images

Closes #8332
---
 .../AddNewSeries/AddNewSeriesModalContent.tsx |  1 +
 .../AddNewSeries/AddNewSeriesSearchResult.tsx |  1 +
 .../Page/Header/SeriesSearchResult.tsx        |  1 +
 frontend/src/Series/Details/SeriesDetails.tsx |  1 +
 .../Index/Overview/SeriesIndexOverview.tsx    |  1 +
 .../Index/Posters/SeriesIndexPoster.tsx       |  1 +
 .../src/Series/Index/Table/SeriesIndexRow.tsx |  1 +
 frontend/src/Series/SeriesImage.tsx           | 33 ++++++++++++++++++-
 src/NzbDrone.Core/Localization/Core/en.json   |  4 +++
 9 files changed, 43 insertions(+), 1 deletion(-)

diff --git a/frontend/src/AddSeries/AddNewSeries/AddNewSeriesModalContent.tsx b/frontend/src/AddSeries/AddNewSeries/AddNewSeriesModalContent.tsx
index c5562855d..e9112bc00 100644
--- a/frontend/src/AddSeries/AddNewSeries/AddNewSeriesModalContent.tsx
+++ b/frontend/src/AddSeries/AddNewSeries/AddNewSeriesModalContent.tsx
@@ -136,6 +136,7 @@ function AddNewSeriesModalContent({
                 className={styles.poster}
                 images={images}
                 size={250}
+                title={title}
               />
             </div>
           )}
diff --git a/frontend/src/AddSeries/AddNewSeries/AddNewSeriesSearchResult.tsx b/frontend/src/AddSeries/AddNewSeries/AddNewSeriesSearchResult.tsx
index 48665c80f..8fc9386b6 100644
--- a/frontend/src/AddSeries/AddNewSeries/AddNewSeriesSearchResult.tsx
+++ b/frontend/src/AddSeries/AddNewSeries/AddNewSeriesSearchResult.tsx
@@ -74,6 +74,7 @@ function AddNewSeriesSearchResult({ series }: AddNewSeriesSearchResultProps) {
             size={250}
             overflow={true}
             lazy={false}
+            title={title}
           />
         )}
 
diff --git a/frontend/src/Components/Page/Header/SeriesSearchResult.tsx b/frontend/src/Components/Page/Header/SeriesSearchResult.tsx
index 9da3ee471..68b123195 100644
--- a/frontend/src/Components/Page/Header/SeriesSearchResult.tsx
+++ b/frontend/src/Components/Page/Header/SeriesSearchResult.tsx
@@ -45,6 +45,7 @@ function SeriesSearchResult(props: SeriesSearchResultProps) {
         size={250}
         lazy={false}
         overflow={true}
+        title={title}
       />
 
       <div className={styles.titles}>
diff --git a/frontend/src/Series/Details/SeriesDetails.tsx b/frontend/src/Series/Details/SeriesDetails.tsx
index 53f2bcbd9..efda5a65a 100644
--- a/frontend/src/Series/Details/SeriesDetails.tsx
+++ b/frontend/src/Series/Details/SeriesDetails.tsx
@@ -526,6 +526,7 @@ function SeriesDetails({ seriesId }: SeriesDetailsProps) {
                 images={images}
                 size={500}
                 lazy={false}
+                title={title}
               />
 
               <div className={styles.info}>
diff --git a/frontend/src/Series/Index/Overview/SeriesIndexOverview.tsx b/frontend/src/Series/Index/Overview/SeriesIndexOverview.tsx
index 61ed6c44c..975af55c2 100644
--- a/frontend/src/Series/Index/Overview/SeriesIndexOverview.tsx
+++ b/frontend/src/Series/Index/Overview/SeriesIndexOverview.tsx
@@ -171,6 +171,7 @@ function SeriesIndexOverview(props: SeriesIndexOverviewProps) {
                 size={250}
                 lazy={false}
                 overflow={true}
+                title={title}
               />
             </Link>
           </div>
diff --git a/frontend/src/Series/Index/Posters/SeriesIndexPoster.tsx b/frontend/src/Series/Index/Posters/SeriesIndexPoster.tsx
index 1cdceab68..b402f2b7e 100644
--- a/frontend/src/Series/Index/Posters/SeriesIndexPoster.tsx
+++ b/frontend/src/Series/Index/Posters/SeriesIndexPoster.tsx
@@ -183,6 +183,7 @@ function SeriesIndexPoster(props: SeriesIndexPosterProps) {
             size={250}
             lazy={false}
             overflow={true}
+            title={title}
             onError={onPosterLoadError}
             onLoad={onPosterLoad}
           />
diff --git a/frontend/src/Series/Index/Table/SeriesIndexRow.tsx b/frontend/src/Series/Index/Table/SeriesIndexRow.tsx
index 5b8c777d4..48d0392ca 100644
--- a/frontend/src/Series/Index/Table/SeriesIndexRow.tsx
+++ b/frontend/src/Series/Index/Table/SeriesIndexRow.tsx
@@ -198,6 +198,7 @@ function SeriesIndexRow(props: SeriesIndexRowProps) {
                     images={images}
                     lazy={false}
                     overflow={true}
+                    title={title}
                     onError={onBannerLoadError}
                     onLoad={onBannerLoad}
                   />
diff --git a/frontend/src/Series/SeriesImage.tsx b/frontend/src/Series/SeriesImage.tsx
index 89771e182..fe099b42f 100644
--- a/frontend/src/Series/SeriesImage.tsx
+++ b/frontend/src/Series/SeriesImage.tsx
@@ -1,5 +1,12 @@
-import React, { useCallback, useEffect, useRef, useState } from 'react';
+import React, {
+  useCallback,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+} from 'react';
 import LazyLoad from 'react-lazyload';
+import translate from 'Utilities/String/translate';
 import { CoverType, Image } from './Series';
 
 function findImage(images: Image[], coverType: CoverType) {
@@ -23,6 +30,7 @@ export interface SeriesImageProps {
   size?: number;
   lazy?: boolean;
   overflow?: boolean;
+  title: string;
   onError?: () => void;
   onLoad?: () => void;
 }
@@ -38,6 +46,7 @@ function SeriesImage({
   size = 250,
   lazy = true,
   overflow = false,
+  title,
   onError,
   onLoad,
 }: SeriesImageProps) {
@@ -46,6 +55,26 @@ function SeriesImage({
   const [isLoaded, setIsLoaded] = useState(true);
   const image = useRef<Image | null>(null);
 
+  const alt = useMemo(() => {
+    let type = translate('ImagePoster');
+
+    switch (coverType) {
+      case 'banner':
+        type = translate('Banner');
+        break;
+      case 'fanart':
+        type = translate('ImageFanart');
+        break;
+      case 'season':
+        type = translate('ImageSeason');
+        break;
+      default:
+        break;
+    }
+
+    return `${title} ${type}`;
+  }, [title, coverType]);
+
   const handleLoad = useCallback(() => {
     setHasError(false);
     setIsLoaded(true);
@@ -103,6 +132,7 @@ function SeriesImage({
         }
       >
         <img
+          alt={alt}
           className={className}
           style={style}
           src={url}
@@ -116,6 +146,7 @@ function SeriesImage({
 
   return (
     <img
+      alt={alt}
       className={className}
       style={style}
       src={isLoaded ? url : placeholder}
diff --git a/src/NzbDrone.Core/Localization/Core/en.json b/src/NzbDrone.Core/Localization/Core/en.json
index 006773b9d..c277d499a 100644
--- a/src/NzbDrone.Core/Localization/Core/en.json
+++ b/src/NzbDrone.Core/Localization/Core/en.json
@@ -842,7 +842,11 @@
   "IgnoreDownloadsHint": "Stops {appName} from processing these downloads further",
   "Ignored": "Ignored",
   "IgnoredAddresses": "Ignored Addresses",
+  "ImageBanner": "banner",
+  "ImageFanart": "fanart",
+  "ImagePoster": "poster",
   "Images": "Images",
+  "ImageSeason": "season",
   "ImdbId": "IMDb ID",
   "Implementation": "Implementation",
   "Import": "Import",