feat: add caching for TVDB images (#1655)

src/components/Common/CachedImage/index.tsx

@@ -6,7 +6,7 @@ const imageLoader: ImageLoader = ({ src }) => src;
 
 export type CachedImageProps = ImageProps & {
   src: string;
-  type: 'tmdb' | 'avatar';
+  type: 'tmdb' | 'avatar' | 'tvdb';
 };
 
 /**
@@ -22,7 +22,15 @@ const CachedImage = ({ src, type, ...props }: CachedImageProps) => {
     // tmdb stuff
     imageUrl =
       currentSettings.cacheImages && !src.startsWith('/')
-        ? src.replace(/^https:\/\/image\.tmdb\.org\//, '/imageproxy/')
+        ? src.replace(/^https:\/\/image\.tmdb\.org\//, '/imageproxy/tmdb/')
+        : src;
+  } else if (type === 'tvdb') {
+    imageUrl =
+      currentSettings.cacheImages && !src.startsWith('/')
+        ? src.replace(
+            /^https:\/\/artworks\.thetvdb\.com\//,
+            '/imageproxy/tvdb/'
+          )
         : src;
   } else if (type === 'avatar') {
     // jellyfin avatar (if any)

src/components/RequestModal/SearchByNameModal/index.tsx

@@ -1,9 +1,9 @@
 import Alert from '@app/components/Common/Alert';
+import CachedImage from '@app/components/Common/CachedImage';
 import Modal from '@app/components/Common/Modal';
 import globalMessages from '@app/i18n/globalMessages';
 import defineMessages from '@app/utils/defineMessages';
 import type { SonarrSeries } from '@server/api/servarr/sonarr';
-import Image from 'next/image';
 import { useIntl } from 'react-intl';
 import useSWR from 'swr';
 
@@ -89,7 +89,8 @@ const SearchByNameModal = ({
               } `}
             >
               <div className="relative flex w-24 flex-none items-center space-x-4 self-stretch">
-                <Image
+                <CachedImage
+                  type="tvdb"
                   src={
                     item.remotePoster ??
                     '/images/jellyseerr_poster_not_found.png'