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}
/>
)}
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}
/>
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}
/>
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}
/>
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
(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({
}
>
