refactor(settings): remove metadata providers logo

fix build after rebase

cypress/e2e/providers/tvdb.cy.ts

@@ -0,0 +1,148 @@
+describe('TVDB Integration', () => {
+  // Constants for routes and selectors
+  const ROUTES = {
+    home: '/',
+    metadataSettings: '/settings/metadata',
+    tomorrowIsOursTvShow: '/tv/72879',
+    monsterTvShow: '/tv/225634',
+    dragonnBallZKaiAnime: '/tv/61709',
+  };
+
+  const SELECTORS = {
+    sidebarToggle: '[data-testid=sidebar-toggle]',
+    sidebarSettingsMobile: '[data-testid=sidebar-menu-settings-mobile]',
+    settingsNavDesktop: 'nav[data-testid="settings-nav-desktop"]',
+    metadataTestButton: 'button[type="button"]:contains("Test")',
+    metadataSaveButton: '[data-testid="metadata-save-button"]',
+    tmdbStatus: '[data-testid="tmdb-status"]',
+    tvdbStatus: '[data-testid="tvdb-status"]',
+    tvMetadataProviderSelector: '[data-testid="tv-metadata-provider-selector"]',
+    animeMetadataProviderSelector:
+      '[data-testid="anime-metadata-provider-selector"]',
+    seasonSelector: '[data-testid="season-selector"]',
+    season1: 'Season 1',
+    season2: 'Season 2',
+    season3: 'Season 3',
+    episodeList: '[data-testid="episode-list"]',
+    episode9: '9 - Hang Men',
+  };
+
+  // Reusable commands
+  const navigateToMetadataSettings = () => {
+    cy.visit(ROUTES.home);
+    cy.get(SELECTORS.sidebarToggle).click();
+    cy.get(SELECTORS.sidebarSettingsMobile).click();
+    cy.get(
+      `${SELECTORS.settingsNavDesktop} a[href="${ROUTES.metadataSettings}"]`
+    ).click();
+  };
+
+  const testAndVerifyMetadataConnection = () => {
+    cy.intercept('POST', '/api/v1/settings/metadatas/test').as(
+      'testConnection'
+    );
+    cy.get(SELECTORS.metadataTestButton).click();
+    return cy.wait('@testConnection');
+  };
+
+  const saveMetadataSettings = (customBody = null) => {
+    if (customBody) {
+      cy.intercept('PUT', '/api/v1/settings/metadatas', (req) => {
+        req.body = customBody;
+      }).as('saveMetadata');
+    } else {
+      // Else just intercept without modifying body
+      cy.intercept('PUT', '/api/v1/settings/metadatas').as('saveMetadata');
+    }
+
+    cy.get(SELECTORS.metadataSaveButton).click();
+    return cy.wait('@saveMetadata');
+  };
+
+  beforeEach(() => {
+    // Perform login
+    cy.login(Cypress.env('ADMIN_EMAIL'), Cypress.env('ADMIN_PASSWORD'));
+
+    // Navigate to Metadata settings
+    navigateToMetadataSettings();
+
+    // Verify we're on the correct settings page
+    cy.contains('h3', 'Metadata Providers').should('be.visible');
+
+    // Configure TVDB as TV provider and test connection
+    cy.get(SELECTORS.tvMetadataProviderSelector).click();
+
+    // get id react-select-4-option-1
+    cy.get('[class*="react-select__option"]').contains('TheTVDB').click();
+
+    // Test the connection
+    testAndVerifyMetadataConnection().then(({ response }) => {
+      expect(response.statusCode).to.equal(200);
+      // Check TVDB connection status
+      cy.get(SELECTORS.tvdbStatus).should('contain', 'Operational');
+    });
+
+    // Save settings
+    saveMetadataSettings({
+      anime: 'tvdb',
+      tv: 'tvdb',
+    }).then(({ response }) => {
+      expect(response.statusCode).to.equal(200);
+      expect(response.body.tv).to.equal('tvdb');
+    });
+  });
+
+  it('should display "Tomorrow is Ours" show information with multiple seasons from TVDB', () => {
+    // Navigate to the TV show
+    cy.visit(ROUTES.tomorrowIsOursTvShow);
+
+    // Verify that multiple seasons are displayed (TMDB has only 1 season, TVDB has multiple)
+    // cy.get(SELECTORS.seasonSelector).should('exist');
+    cy.intercept('/api/v1/tv/225634/season/1').as('season1');
+    // Select Season 2 and verify it loads
+    cy.contains(SELECTORS.season2)
+      .should('be.visible')
+      .scrollIntoView()
+      .click();
+
+    // Verify that episodes are displayed for Season 2
+    cy.contains('260 - Episode 506').should('be.visible');
+  });
+
+  it('Should display "Monster" show information correctly when not existing on TVDB', () => {
+    // Navigate to the TV show
+    cy.visit(ROUTES.monsterTvShow);
+
+    // Intercept season 1 request
+    cy.intercept('/api/v1/tv/225634/season/1').as('season1');
+
+    // Select Season 1
+    cy.contains(SELECTORS.season1)
+      .should('be.visible')
+      .scrollIntoView()
+      .click();
+
+    // Wait for the season data to load
+    cy.wait('@season1');
+
+    // Verify specific episode exists
+    cy.contains(SELECTORS.episode9).should('be.visible');
+  });
+
+  it('should display "Dragon Ball Z Kai" show information with multiple only 2 seasons from TVDB', () => {
+    // Navigate to the TV show
+    cy.visit(ROUTES.dragonnBallZKaiAnime);
+
+    // Intercept season 1 request
+    cy.intercept('/api/v1/tv/61709/season/1').as('season1');
+
+    // Select Season 2 and verify it visible
+    cy.contains(SELECTORS.season2)
+      .should('be.visible')
+      .scrollIntoView()
+      .click();
+
+    // select season 3 and verify it not visible
+    cy.contains(SELECTORS.season3).should('not.exist');
+  });
+});

jellyseerr-api.yml

@@ -519,6 +519,20 @@ components:
         serverID:
           type: string
           readOnly: true
+    MetadataSettings:
+      type: object
+      properties:
+        settings:
+          type: object
+          properties:
+            tv:
+              type: string
+              enum: [tvdb, tmdb]
+              example: 'tvdb'
+            anime:
+              type: string
+              enum: [tvdb, tmdb]
+              example: 'tvdb'
     TautulliSettings:
       type: object
       properties:
@@ -2568,6 +2582,67 @@ paths:
                       type: string
                     thumb:
                       type: string
+  /settings/metadatas:
+    get:
+      summary: Get Metadata settings
+      description: Retrieves current Metadata settings.
+      tags:
+        - settings
+      responses:
+        '200':
+          description: OK
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/MetadataSettings'
+    put:
+      summary: Update Metadata settings
+      description: Updates Metadata settings with the provided values.
+      tags:
+        - settings
+      requestBody:
+        required: true
+        content:
+          application/json:
+            schema:
+              $ref: '#/components/schemas/MetadataSettings'
+      responses:
+        '200':
+          description: 'Values were successfully updated'
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/MetadataSettings'
+  /settings/metadatas/test:
+    post:
+      summary: Test Provider configuration
+      description: Tests if the TVDB configuration is valid. Returns a list of available languages on success.
+      tags:
+        - settings
+      requestBody:
+        required: true
+        content:
+          application/json:
+            schema:
+              type: object
+              properties:
+                tmdb:
+                  type: boolean
+                  example: true
+                tvdb:
+                  type: boolean
+                  example: true
+      responses:
+        '200':
+          description: Succesfully connected to TVDB
+          content:
+            application/json:
+              schema:
+                type: object
+                properties:
+                  message:
+                    type: string
+                    example: 'Successfully connected to TVDB'
   /settings/tautulli:
     get:
       summary: Get Tautulli settings
@@ -6472,7 +6547,7 @@ paths:
             application/json:
               schema:
                 $ref: '#/components/schemas/TvDetails'
-  /tv/{tvId}/season/{seasonId}:
+  /tv/{tvId}/season/{seasonNumber}:
     get:
       summary: Get season details and episode list
       description: Returns season details with a list of episodes in a JSON object.
@@ -6486,11 +6561,11 @@ paths:
             type: number
             example: 76479
         - in: path
-          name: seasonId
+          name: seasonNumber
           required: true
           schema:
             type: number
-            example: 1
+            example: 123456
         - in: query
           name: language
           schema:

server/api/externalapi.ts

@@ -10,7 +10,7 @@ const DEFAULT_TTL = 300;
 // 10 seconds default rolling buffer (in ms)
 const DEFAULT_ROLLING_BUFFER = 10000;
 
-interface ExternalAPIOptions {
+export interface ExternalAPIOptions {
   nodeCache?: NodeCache;
   headers?: Record<string, unknown>;
   rateLimit?: {

server/api/metadata.ts

@@ -0,0 +1,39 @@
+import type { TvShowProvider } from '@server/api/provider';
+import TheMovieDb from '@server/api/themoviedb';
+import Tvdb from '@server/api/tvdb';
+import { getSettings, MetadataProviderType } from '@server/lib/settings';
+import logger from '@server/logger';
+
+export const getMetadataProvider = async (
+  mediaType: 'movie' | 'tv' | 'anime'
+): Promise<TvShowProvider> => {
+  try {
+    const settings = await getSettings();
+
+    if (mediaType == 'movie') {
+      return new TheMovieDb();
+    }
+
+    if (
+      mediaType == 'tv' &&
+      settings.metadataSettings.tv == MetadataProviderType.TVDB
+    ) {
+      return await Tvdb.getInstance();
+    }
+
+    if (
+      mediaType == 'anime' &&
+      settings.metadataSettings.anime == MetadataProviderType.TVDB
+    ) {
+      return await Tvdb.getInstance();
+    }
+
+    return new TheMovieDb();
+  } catch (e) {
+    logger.error('Failed to get metadata provider', {
+      label: 'Metadata',
+      message: e.message,
+    });
+    return new TheMovieDb();
+  }
+};

server/api/provider.ts

@@ -0,0 +1,30 @@
+import type {
+  TmdbSeasonWithEpisodes,
+  TmdbTvDetails,
+} from '@server/api/themoviedb/interfaces';
+
+export interface TvShowProvider {
+  getTvShow({
+    tvId,
+    language,
+  }: {
+    tvId: number;
+    language?: string;
+  }): Promise<TmdbTvDetails>;
+  getTvSeason({
+    tvId,
+    seasonNumber,
+    language,
+  }: {
+    tvId: number;
+    seasonNumber: number;
+    language?: string;
+  }): Promise<TmdbSeasonWithEpisodes>;
+  getShowByTvdbId({
+    tvdbId,
+    language,
+  }: {
+    tvdbId: number;
+    language?: string;
+  }): Promise<TmdbTvDetails>;
+}

server/api/themoviedb/index.ts

@@ -1,4 +1,5 @@
 import ExternalAPI from '@server/api/externalapi';
+import type { TvShowProvider } from '@server/api/provider';
 import cacheManager from '@server/lib/cache';
 import { getSettings } from '@server/lib/settings';
 import { sortBy } from 'lodash';
@@ -120,7 +121,7 @@ interface DiscoverTvOptions {
   certificationCountry?: string;
 }
 
-class TheMovieDb extends ExternalAPI {
+class TheMovieDb extends ExternalAPI implements TvShowProvider {
   private locale: string;
   private discoverRegion?: string;
   private originalLanguage?: string;
@@ -341,6 +342,13 @@ class TheMovieDb extends ExternalAPI {
         }
       );
 
+      data.episodes = data.episodes.map((episode) => {
+        if (episode.still_path) {
+          episode.still_path = `https://image.tmdb.org/t/p/original/${episode.still_path}`;
+        }
+        return episode;
+      });
+
       return data;
     } catch (e) {
       throw new Error(`[TMDB] Failed to fetch TV show details: ${e.message}`);

server/api/themoviedb/interfaces.ts

@@ -220,7 +220,7 @@ export interface TmdbTvEpisodeResult {
   show_id: number;
   still_path: string;
   vote_average: number;
-  vote_cuont: number;
+  vote_count: number;
 }
 
 export interface TmdbTvSeasonResult {

server/api/tvdb/index.ts

@@ -0,0 +1,431 @@
+import ExternalAPI from '@server/api/externalapi';
+import type { TvShowProvider } from '@server/api/provider';
+import TheMovieDb from '@server/api/themoviedb';
+import type {
+  TmdbSeasonWithEpisodes,
+  TmdbTvDetails,
+  TmdbTvEpisodeResult,
+  TmdbTvSeasonResult,
+} from '@server/api/themoviedb/interfaces';
+import type {
+  TvdbBaseResponse,
+  TvdbEpisode,
+  TvdbLoginResponse,
+  TvdbSeasonDetails,
+  TvdbTvDetails,
+} from '@server/api/tvdb/interfaces';
+import cacheManager, { type AvailableCacheIds } from '@server/lib/cache';
+import logger from '@server/logger';
+
+interface TvdbConfig {
+  baseUrl: string;
+  maxRequestsPerSecond: number;
+  maxRequests: number;
+  cachePrefix: AvailableCacheIds;
+}
+
+const DEFAULT_CONFIG: TvdbConfig = {
+  baseUrl: 'https://api4.thetvdb.com/v4',
+  maxRequestsPerSecond: 50,
+  maxRequests: 20,
+  cachePrefix: 'tvdb' as const,
+};
+
+const enum TvdbIdStatus {
+  INVALID = -1,
+}
+
+type TvdbId = number;
+type ValidTvdbId = Exclude<TvdbId, TvdbIdStatus.INVALID>;
+
+class Tvdb extends ExternalAPI implements TvShowProvider {
+  static instance: Tvdb;
+  private readonly tmdb: TheMovieDb;
+  private static readonly DEFAULT_CACHE_TTL = 43200;
+  private static readonly DEFAULT_LANGUAGE = 'eng';
+  private token: string;
+  private pin?: string;
+
+  constructor(pin?: string) {
+    const finalConfig = { ...DEFAULT_CONFIG };
+    super(
+      finalConfig.baseUrl,
+      {},
+      {
+        nodeCache: cacheManager.getCache(finalConfig.cachePrefix).data,
+        rateLimit: {
+          maxRequests: finalConfig.maxRequests,
+          maxRPS: finalConfig.maxRequestsPerSecond,
+        },
+      }
+    );
+    this.pin = pin;
+    this.tmdb = new TheMovieDb();
+  }
+
+  public static async getInstance(): Promise<Tvdb> {
+    if (!this.instance) {
+      this.instance = new Tvdb();
+      await this.instance.login();
+    }
+
+    return this.instance;
+  }
+
+  private async refreshToken(): Promise<void> {
+    try {
+      if (!this.token) {
+        await this.login();
+        return;
+      }
+
+      const base64Url = this.token.split('.')[1];
+      const base64 = base64Url.replace(/-/g, '+').replace(/_/g, '/');
+      const payload = JSON.parse(Buffer.from(base64, 'base64').toString());
+
+      if (!payload.exp) {
+        await this.login();
+      }
+
+      const now = Math.floor(Date.now() / 1000);
+      const diff = payload.exp - now;
+
+      // refresh token 1 week before expiration
+      if (diff < 604800) {
+        await this.login();
+      }
+    } catch (error) {
+      this.handleError('Failed to refresh token', error);
+    }
+  }
+
+  public async test(): Promise<void> {
+    try {
+      await this.login();
+    } catch (error) {
+      this.handleError('Login failed', error);
+      throw error;
+    }
+  }
+
+  async login(): Promise<TvdbLoginResponse> {
+    let body: { apiKey: string; pin?: string } = {
+      apiKey: 'd00d9ecb-a9d0-4860-958a-74b14a041405',
+    };
+
+    if (this.pin) {
+      body = {
+        ...body,
+        pin: this.pin,
+      };
+    }
+
+    const response = await this.post<TvdbBaseResponse<TvdbLoginResponse>>(
+      '/login',
+      {
+        ...body,
+      }
+    );
+
+    this.token = response.data.token;
+
+    return response.data;
+  }
+
+  public async getShowByTvdbId({
+    tvdbId,
+    language,
+  }: {
+    tvdbId: number;
+    language?: string;
+  }): Promise<TmdbTvDetails> {
+    try {
+      const tmdbTvShow = await this.tmdb.getShowByTvdbId({
+        tvdbId: tvdbId,
+        language,
+      });
+
+      try {
+        await this.refreshToken();
+
+        const validTvdbId = this.getTvdbIdFromTmdb(tmdbTvShow);
+
+        if (this.isValidTvdbId(validTvdbId)) {
+          return this.enrichTmdbShowWithTvdbData(tmdbTvShow, validTvdbId);
+        }
+
+        return tmdbTvShow;
+      } catch (error) {
+        return tmdbTvShow;
+      }
+    } catch (error) {
+      this.handleError('Failed to fetch TV show details', error);
+      throw error;
+    }
+  }
+
+  public async getTvShow({
+    tvId,
+    language,
+  }: {
+    tvId: number;
+    language?: string;
+  }): Promise<TmdbTvDetails> {
+    try {
+      const tmdbTvShow = await this.tmdb.getTvShow({ tvId, language });
+
+      try {
+        await this.refreshToken();
+
+        const tvdbId = this.getTvdbIdFromTmdb(tmdbTvShow);
+
+        if (this.isValidTvdbId(tvdbId)) {
+          return await this.enrichTmdbShowWithTvdbData(tmdbTvShow, tvdbId);
+        }
+
+        return tmdbTvShow;
+      } catch (error) {
+        this.handleError('Failed to fetch TV show details', error);
+        return tmdbTvShow;
+      }
+    } catch (error) {
+      this.handleError('Failed to fetch TV show details', error);
+      return this.tmdb.getTvShow({ tvId, language });
+    }
+  }
+
+  public async getTvSeason({
+    tvId,
+    seasonNumber,
+    language = Tvdb.DEFAULT_LANGUAGE,
+  }: {
+    tvId: number;
+    seasonNumber: number;
+    language?: string;
+  }): Promise<TmdbSeasonWithEpisodes> {
+    if (seasonNumber === 0) {
+      return this.createEmptySeasonResponse(tvId);
+    }
+
+    try {
+      const tmdbTvShow = await this.tmdb.getTvShow({ tvId, language });
+
+      try {
+        await this.refreshToken();
+
+        const tvdbId = this.getTvdbIdFromTmdb(tmdbTvShow);
+
+        if (!this.isValidTvdbId(tvdbId)) {
+          return await this.tmdb.getTvSeason({ tvId, seasonNumber, language });
+        }
+
+        return await this.getTvdbSeasonData(tvdbId, seasonNumber, tvId);
+      } catch (error) {
+        this.handleError('Failed to fetch TV season details', error);
+        return await this.tmdb.getTvSeason({ tvId, seasonNumber, language });
+      }
+    } catch (error) {
+      logger.error(
+        `[TVDB] Failed to fetch TV season details: ${error.message}`
+      );
+      throw error;
+    }
+  }
+
+  private async enrichTmdbShowWithTvdbData(
+    tmdbTvShow: TmdbTvDetails,
+    tvdbId: ValidTvdbId
+  ): Promise<TmdbTvDetails> {
+    try {
+      await this.refreshToken();
+
+      const tvdbData = await this.fetchTvdbShowData(tvdbId);
+      const seasons = this.processSeasons(tvdbData);
+
+      if (!seasons.length) {
+        return tmdbTvShow;
+      }
+
+      return { ...tmdbTvShow, seasons };
+    } catch (error) {
+      logger.error(
+        `Failed to enrich TMDB show with TVDB data: ${error.message} token: ${this.token}`
+      );
+      return tmdbTvShow;
+    }
+  }
+
+  private async fetchTvdbShowData(tvdbId: number): Promise<TvdbTvDetails> {
+    const resp = await this.get<TvdbBaseResponse<TvdbTvDetails>>(
+      `/series/${tvdbId}/extended?meta=episodes&short=true`,
+      {
+        headers: {
+          Authorization: `Bearer ${this.token}`,
+        },
+      },
+      Tvdb.DEFAULT_CACHE_TTL
+    );
+
+    return resp.data;
+  }
+
+  private processSeasons(tvdbData: TvdbTvDetails): TmdbTvSeasonResult[] {
+    if (!tvdbData || !tvdbData.seasons || !tvdbData.episodes) {
+      return [];
+    }
+
+    const seasons = tvdbData.seasons
+      .filter(
+        (season) =>
+          season.number > 0 && season.type && season.type.type === 'official'
+      )
+      .sort((a, b) => a.number - b.number)
+      .map((season) => this.createSeasonData(season, tvdbData));
+
+    return seasons;
+  }
+
+  private createSeasonData(
+    season: TvdbSeasonDetails,
+    tvdbData: TvdbTvDetails
+  ): TmdbTvSeasonResult {
+    if (!season.number) {
+      return {
+        id: 0,
+        episode_count: 0,
+        name: '',
+        overview: '',
+        season_number: 0,
+        poster_path: '',
+        air_date: '',
+      };
+    }
+
+    const episodeCount = tvdbData.episodes.filter(
+      (episode) => episode.seasonNumber === season.number
+    ).length;
+
+    return {
+      id: tvdbData.id,
+      episode_count: episodeCount,
+      name: `${season.number}`,
+      overview: '',
+      season_number: season.number,
+      poster_path: '',
+      air_date: '',
+    };
+  }
+
+  private async getTvdbSeasonData(
+    tvdbId: number,
+    seasonNumber: number,
+    tvId: number
+    //language: string = Tvdb.DEFAULT_LANGUAGE
+  ): Promise<TmdbSeasonWithEpisodes> {
+    const tvdbData = await this.fetchTvdbShowData(tvdbId);
+
+    if (!tvdbData) {
+      logger.error(`Failed to fetch TVDB data for ID: ${tvdbId}`);
+      return this.createEmptySeasonResponse(tvId);
+    }
+
+    // get season id
+    const season = tvdbData.seasons.find(
+      (season) =>
+        season.number === seasonNumber &&
+        season.type.type &&
+        season.type.type === 'official'
+    );
+
+    if (!season) {
+      logger.error(
+        `Failed to find season ${seasonNumber} for TVDB ID: ${tvdbId}`
+      );
+      return this.createEmptySeasonResponse(tvId);
+    }
+
+    const resp = await this.get<TvdbBaseResponse<TvdbSeasonDetails>>(
+      `/seasons/${season.id}/extended`,
+      {
+        headers: {
+          Authorization: `Bearer ${this.token}`,
+        },
+      }
+    );
+
+    const seasons = resp.data;
+
+    const episodes = this.processEpisodes(seasons, seasonNumber, tvId);
+
+    return {
+      episodes,
+      external_ids: { tvdb_id: tvdbId },
+      name: '',
+      overview: '',
+      id: seasons.id,
+      air_date: seasons.firstAired,
+      season_number: episodes.length,
+    };
+  }
+
+  private processEpisodes(
+    tvdbSeason: TvdbSeasonDetails,
+    seasonNumber: number,
+    tvId: number
+  ): TmdbTvEpisodeResult[] {
+    if (!tvdbSeason || !tvdbSeason.episodes) {
+      logger.error('No episodes found in TVDB season data');
+      return [];
+    }
+
+    return tvdbSeason.episodes
+      .filter((episode) => episode.seasonNumber === seasonNumber)
+      .map((episode, index) => this.createEpisodeData(episode, index, tvId));
+  }
+
+  private createEpisodeData(
+    episode: TvdbEpisode,
+    index: number,
+    tvId: number
+  ): TmdbTvEpisodeResult {
+    return {
+      id: episode.id,
+      air_date: episode.aired,
+      episode_number: episode.number,
+      name: episode.name || `Episode ${index + 1}`,
+      overview: episode.overview || '',
+      season_number: episode.seasonNumber,
+      production_code: '',
+      show_id: tvId,
+      still_path: episode.image ? episode.image : '',
+      vote_average: 1,
+      vote_count: 1,
+    };
+  }
+
+  private createEmptySeasonResponse(tvId: number): TmdbSeasonWithEpisodes {
+    return {
+      episodes: [],
+      external_ids: { tvdb_id: tvId },
+      name: '',
+      overview: '',
+      id: 0,
+      air_date: '',
+      season_number: 0,
+    };
+  }
+
+  private getTvdbIdFromTmdb(tmdbTvShow: TmdbTvDetails): TvdbId {
+    return tmdbTvShow?.external_ids?.tvdb_id ?? TvdbIdStatus.INVALID;
+  }
+
+  private isValidTvdbId(tvdbId: TvdbId): tvdbId is ValidTvdbId {
+    return tvdbId !== TvdbIdStatus.INVALID;
+  }
+
+  private handleError(context: string, error: Error): void {
+    throw new Error(`[TVDB] ${context}: ${error.message}`);
+  }
+}
+
+export default Tvdb;

server/api/tvdb/interfaces.ts

@@ -0,0 +1,144 @@
+export interface TvdbBaseResponse<T> {
+  data: T;
+  errors: string;
+}
+
+export interface TvdbLoginResponse {
+  token: string;
+}
+
+interface TvDetailsAliases {
+  language: string;
+  name: string;
+}
+
+interface TvDetailsStatus {
+  id: number;
+  name: string;
+  recordType: string;
+  keepUpdated: boolean;
+}
+
+export interface TvdbTvDetails {
+  id: number;
+  name: string;
+  slug: string;
+  image: string;
+  nameTranslations: string[];
+  overwiewTranslations: string[];
+  aliases: TvDetailsAliases[];
+  firstAired: Date;
+  lastAired: Date;
+  nextAired: Date | string;
+  score: number;
+  status: TvDetailsStatus;
+  originalCountry: string;
+  originalLanguage: string;
+  defaultSeasonType: string;
+  isOrderRandomized: boolean;
+  lastUpdated: Date;
+  averageRuntime: number;
+  seasons: TvdbSeasonDetails[];
+  episodes: TvdbEpisode[];
+}
+
+interface TvdbCompanyType {
+  companyTypeId: number;
+  companyTypeName: string;
+}
+
+interface TvdbParentCompany {
+  id?: number;
+  name?: string;
+  relation?: {
+    id?: number;
+    typeName?: string;
+  };
+}
+
+interface TvdbCompany {
+  id: number;
+  name: string;
+  slug: string;
+  nameTranslations?: string[];
+  overviewTranslations?: string[];
+  aliases?: string[];
+  country: string;
+  primaryCompanyType: number;
+  activeDate: string;
+  inactiveDate?: string;
+  companyType: TvdbCompanyType;
+  parentCompany: TvdbParentCompany;
+  tagOptions?: string[];
+}
+
+interface TvdbType {
+  id: number;
+  name: string;
+  type: string;
+  alternateName?: string;
+}
+
+interface TvdbArtwork {
+  id: number;
+  image: string;
+  thumbnail: string;
+  language: string;
+  type: number;
+  score: number;
+  width: number;
+  height: number;
+  includesText: boolean;
+}
+
+export interface TvdbEpisode {
+  id: number;
+  seriesId: number;
+  name: string;
+  aired: string;
+  runtime: number;
+  nameTranslations: string[];
+  overview?: string;
+  overviewTranslations: string[];
+  image: string;
+  imageType: number;
+  isMovie: number;
+  seasons?: string[];
+  number: number;
+  absoluteNumber: number;
+  seasonNumber: number;
+  lastUpdated: string;
+  finaleType?: string;
+  year: string;
+}
+
+export interface TvdbSeasonDetails {
+  id: number;
+  seriesId: number;
+  type: TvdbType;
+  number: number;
+  nameTranslations: string[];
+  overviewTranslations: string[];
+  image: string;
+  imageType: number;
+  companies: {
+    studio: TvdbCompany[];
+    network: TvdbCompany[];
+    production: TvdbCompany[];
+    distributor: TvdbCompany[];
+    special_effects: TvdbCompany[];
+  };
+  lastUpdated: string;
+  year: string;
+  episodes: TvdbEpisode[];
+  trailers: string[];
+  artwork: TvdbArtwork[];
+  tagOptions?: string[];
+  firstAired: string;
+}
+
+export interface TvdbEpisodeTranslation {
+  name: string;
+  overview: string;
+  language: string;
+}

server/lib/cache.ts

@@ -9,7 +9,8 @@ export type AvailableCacheIds =
   | 'github'
   | 'plexguid'
   | 'plextv'
-  | 'plexwatchlist';
+  | 'plexwatchlist'
+  | 'tvdb';
 
 const DEFAULT_TTL = 300;
 const DEFAULT_CHECK_PERIOD = 120;
@@ -70,6 +71,10 @@ class CacheManager {
       checkPeriod: 60,
     }),
     plexwatchlist: new Cache('plexwatchlist', 'Plex Watchlist'),
+    tvdb: new Cache('tvdb', 'The TVDB API', {
+      stdTtl: 21600,
+      checkPeriod: 60 * 30,
+    }),
   };
 
   public getCache(id: AvailableCacheIds): Cache {

server/lib/scanners/jellyfin/index.ts

@@ -1,7 +1,12 @@
 import type { JellyfinLibraryItem } from '@server/api/jellyfin';
 import JellyfinAPI from '@server/api/jellyfin';
+import { getMetadataProvider } from '@server/api/metadata';
 import TheMovieDb from '@server/api/themoviedb';
-import type { TmdbTvDetails } from '@server/api/themoviedb/interfaces';
+import { ANIME_KEYWORD_ID } from '@server/api/themoviedb/constants';
+import type {
+  TmdbKeyword,
+  TmdbTvDetails,
+} from '@server/api/themoviedb/interfaces';
 import { MediaStatus, MediaType } from '@server/constants/media';
 import { MediaServerType } from '@server/constants/server';
 import { getRepository } from '@server/datasource';
@@ -43,6 +48,7 @@ class JellyfinScanner {
 
   constructor({ isRecentOnly }: { isRecentOnly?: boolean } = {}) {
     this.tmdb = new TheMovieDb();
+
     this.isRecentOnly = isRecentOnly ?? false;
   }
 
@@ -192,6 +198,42 @@ class JellyfinScanner {
     }
   }
 
+  private async getTvShow({
+    tmdbId,
+    tvdbId,
+  }: {
+    tmdbId?: number;
+    tvdbId?: number;
+  }): Promise<TmdbTvDetails> {
+    let tvShow;
+
+    if (tmdbId) {
+      tvShow = await this.tmdb.getTvShow({
+        tvId: Number(tmdbId),
+      });
+    } else if (tvdbId) {
+      tvShow = await this.tmdb.getShowByTvdbId({
+        tvdbId: Number(tvdbId),
+      });
+    } else {
+      throw new Error('No ID provided');
+    }
+
+    const metadataProvider = tvShow.keywords.results.some(
+      (keyword: TmdbKeyword) => keyword.id === ANIME_KEYWORD_ID
+    )
+      ? await getMetadataProvider('anime')
+      : await getMetadataProvider('tv');
+
+    if (!(metadataProvider instanceof TheMovieDb)) {
+      tvShow = await metadataProvider.getTvShow({
+        tvId: Number(tmdbId),
+      });
+    }
+
+    return tvShow;
+  }
+
   private async processShow(jellyfinitem: JellyfinLibraryItem) {
     const mediaRepository = getRepository(Media);
 
@@ -212,8 +254,8 @@ class JellyfinScanner {
 
       if (metadata.ProviderIds.Tmdb) {
         try {
-          tvShow = await this.tmdb.getTvShow({
+          tvShow = await this.getTvShow({
-            tvId: Number(metadata.ProviderIds.Tmdb),
+            tmdbId: Number(metadata.ProviderIds.Tmdb),
           });
         } catch {
           this.log('Unable to find TMDb ID for this title.', 'debug', {
@@ -223,7 +265,7 @@ class JellyfinScanner {
       }
       if (!tvShow && metadata.ProviderIds.Tvdb) {
         try {
-          tvShow = await this.tmdb.getShowByTvdbId({
+          tvShow = await this.getTvShow({
             tvdbId: Number(metadata.ProviderIds.Tvdb),
           });
         } catch {

server/lib/scanners/plex/index.ts

@@ -1,7 +1,13 @@
 import animeList from '@server/api/animelist';
+import { getMetadataProvider } from '@server/api/metadata';
 import type { PlexLibraryItem, PlexMetadata } from '@server/api/plexapi';
 import PlexAPI from '@server/api/plexapi';
-import type { TmdbTvDetails } from '@server/api/themoviedb/interfaces';
+import TheMovieDb from '@server/api/themoviedb';
+import { ANIME_KEYWORD_ID } from '@server/api/themoviedb/constants';
+import type {
+  TmdbKeyword,
+  TmdbTvDetails,
+} from '@server/api/themoviedb/interfaces';
 import { getRepository } from '@server/datasource';
 import { User } from '@server/entity/User';
 import cacheManager from '@server/lib/cache';
@@ -249,6 +255,42 @@ class PlexScanner
     });
   }
 
+  private async getTvShow({
+    tmdbId,
+    tvdbId,
+  }: {
+    tmdbId?: number;
+    tvdbId?: number;
+  }): Promise<TmdbTvDetails> {
+    let tvShow;
+
+    if (tmdbId) {
+      tvShow = await this.tmdb.getTvShow({
+        tvId: Number(tmdbId),
+      });
+    } else if (tvdbId) {
+      tvShow = await this.tmdb.getShowByTvdbId({
+        tvdbId: Number(tvdbId),
+      });
+    } else {
+      throw new Error('No ID provided');
+    }
+
+    const metadataProvider = tvShow.keywords.results.some(
+      (keyword: TmdbKeyword) => keyword.id === ANIME_KEYWORD_ID
+    )
+      ? await getMetadataProvider('anime')
+      : await getMetadataProvider('tv');
+
+    if (!(metadataProvider instanceof TheMovieDb)) {
+      tvShow = await metadataProvider.getTvShow({
+        tvId: Number(tmdbId),
+      });
+    }
+
+    return tvShow;
+  }
+
   private async processPlexShow(plexitem: PlexLibraryItem) {
     const ratingKey =
       plexitem.grandparentRatingKey ??
@@ -273,7 +315,9 @@ class PlexScanner
       await this.processHamaSpecials(metadata, mediaIds.tvdbId);
     }
 
-    const tvShow = await this.tmdb.getTvShow({ tvId: mediaIds.tmdbId });
+    const tvShow = await this.getTvShow({
+      tmdbId: mediaIds.tmdbId,
+    });
 
     const seasons = tvShow.seasons;
     const processableSeasons: ProcessableSeason[] = [];

server/lib/settings/index.ts

@@ -100,6 +100,27 @@ interface Quota {
   quotaDays?: number;
 }
 
+export enum MetadataProviderType {
+  TMDB = 'tmdb',
+  TVDB = 'tvdb',
+}
+
+export interface MetadataSettings {
+  tv: MetadataProviderType;
+  anime: MetadataProviderType;
+}
+
+export interface ProxySettings {
+  enabled: boolean;
+  hostname: string;
+  port: number;
+  useSsl: boolean;
+  user: string;
+  password: string;
+  bypassFilter: string;
+  bypassLocalAddresses: boolean;
+}
+
 export interface MainSettings {
   apiKey: string;
   applicationTitle: string;
@@ -339,6 +360,7 @@ export interface AllSettings {
   notifications: NotificationSettings;
   jobs: Record<JobId, JobSettings>;
   network: NetworkSettings;
+  metadataSettings: MetadataSettings;
 }
 
 const SETTINGS_PATH = process.env.CONFIG_DIRECTORY
@@ -399,6 +421,10 @@ class Settings {
         apiKey: '',
       },
       tautulli: {},
+      metadataSettings: {
+        tv: MetadataProviderType.TMDB,
+        anime: MetadataProviderType.TMDB,
+      },
       radarr: [],
       sonarr: [],
       public: {
@@ -593,6 +619,14 @@ class Settings {
     this.data.tautulli = data;
   }
 
+  get metadataSettings(): MetadataSettings {
+    return this.data.metadataSettings;
+  }
+
+  set metadataSettings(data: MetadataSettings) {
+    this.data.metadataSettings = data;
+  }
+
   get radarr(): RadarrSettings[] {
     return this.data.radarr;
   }

server/models/Tv.ts

@@ -124,7 +124,7 @@ const mapEpisodeResult = (episode: TmdbTvEpisodeResult): Episode => ({
   seasonNumber: episode.season_number,
   showId: episode.show_id,
   voteAverage: episode.vote_average,
-  voteCount: episode.vote_cuont,
+  voteCount: episode.vote_count,
   stillPath: episode.still_path,
 });
 

server/routes/settings/index.ts

@@ -39,6 +39,7 @@ import { rescheduleJob } from 'node-schedule';
 import path from 'path';
 import semver from 'semver';
 import { URL } from 'url';
+import metadataRoutes from './metadata';
 import notificationRoutes from './notifications';
 import radarrRoutes from './radarr';
 import sonarrRoutes from './sonarr';
@@ -49,6 +50,7 @@ settingsRoutes.use('/notifications', notificationRoutes);
 settingsRoutes.use('/radarr', radarrRoutes);
 settingsRoutes.use('/sonarr', sonarrRoutes);
 settingsRoutes.use('/discover', discoverSettingRoutes);
+settingsRoutes.use('/metadatas', metadataRoutes);
 
 const filteredMainSettings = (
   user: User,

server/routes/settings/metadata.ts

@@ -0,0 +1,153 @@
+import TheMovieDb from '@server/api/themoviedb';
+import Tvdb from '@server/api/tvdb';
+import {
+  getSettings,
+  MetadataProviderType,
+  type MetadataSettings,
+} from '@server/lib/settings';
+import logger from '@server/logger';
+import { Router } from 'express';
+
+function getTestResultString(testValue: number): string {
+  if (testValue === -1) return 'not tested';
+  if (testValue === 0) return 'failed';
+  return 'ok';
+}
+
+const metadataRoutes = Router();
+
+metadataRoutes.get('/', (_req, res) => {
+  const settings = getSettings();
+  res.status(200).json({
+    tv: settings.metadataSettings.tv,
+    anime: settings.metadataSettings.anime,
+  });
+});
+
+metadataRoutes.put('/', async (req, res) => {
+  const settings = getSettings();
+  const body = req.body as MetadataSettings;
+
+  let tvdbTest = -1;
+  let tmdbTest = -1;
+
+  try {
+    if (
+      body.tv === MetadataProviderType.TVDB ||
+      body.anime === MetadataProviderType.TVDB
+    ) {
+      tvdbTest = 0;
+      const tvdb = await Tvdb.getInstance();
+      await tvdb.test();
+      tvdbTest = 1;
+    }
+  } catch (e) {
+    logger.error('Failed to test metadata provider', {
+      label: 'Metadata',
+      message: e.message,
+    });
+  }
+
+  try {
+    if (
+      body.tv === MetadataProviderType.TMDB ||
+      body.anime === MetadataProviderType.TMDB
+    ) {
+      tmdbTest = 0;
+      const tmdb = new TheMovieDb();
+      await tmdb.getTvShow({ tvId: 1054 });
+      tmdbTest = 1;
+    }
+  } catch (e) {
+    logger.error('Failed to test metadata provider', {
+      label: 'MetadataProvider',
+      message: e.message,
+    });
+  }
+
+  // If a test failed, return the test results
+  if (tvdbTest === 0 || tmdbTest === 0) {
+    return res.status(500).json({
+      success: false,
+      tests: {
+        tvdb: getTestResultString(tvdbTest),
+        tmdb: getTestResultString(tmdbTest),
+      },
+    });
+  }
+
+  settings.metadataSettings = {
+    tv: body.tv,
+    anime: body.anime,
+  };
+  await settings.save();
+
+  res.status(200).json({
+    success: true,
+    tv: body.tv,
+    anime: body.anime,
+    tests: {
+      tvdb: getTestResultString(tvdbTest),
+      tmdb: getTestResultString(tmdbTest),
+    },
+  });
+});
+
+metadataRoutes.post('/test', async (req, res) => {
+  let tvdbTest = -1;
+  let tmdbTest = -1;
+
+  try {
+    const body = req.body as { tmdb: boolean; tvdb: boolean };
+
+    try {
+      if (body.tmdb) {
+        tmdbTest = 0;
+        const tmdb = new TheMovieDb();
+        await tmdb.getTvShow({ tvId: 1054 });
+        tmdbTest = 1;
+      }
+    } catch (e) {
+      logger.error('Failed to test metadata provider', {
+        label: 'MetadataProvider',
+        message: e.message,
+      });
+    }
+
+    try {
+      if (body.tvdb) {
+        tvdbTest = 0;
+        const tvdb = await Tvdb.getInstance();
+        await tvdb.test();
+        tvdbTest = 1;
+      }
+    } catch (e) {
+      logger.error('Failed to test metadata provider', {
+        label: 'MetadataProvider',
+        message: e.message,
+      });
+    }
+
+    const success = !(tvdbTest === 0 || tmdbTest === 0);
+    const statusCode = success ? 200 : 500;
+
+    return res.status(statusCode).json({
+      success: success,
+      tests: {
+        tmdb: getTestResultString(tmdbTest),
+        tvdb: getTestResultString(tvdbTest),
+      },
+    });
+  } catch (e) {
+    return res.status(500).json({
+      success: false,
+      tests: {
+        tmdb: getTestResultString(tmdbTest),
+        tvdb: getTestResultString(tvdbTest),
+      },
+      error: e.message,
+    });
+  }
+});
+
+export default metadataRoutes;

server/routes/tv.ts

@@ -1,5 +1,8 @@
+import { getMetadataProvider } from '@server/api/metadata';
 import RottenTomatoes from '@server/api/rating/rottentomatoes';
 import TheMovieDb from '@server/api/themoviedb';
+import { ANIME_KEYWORD_ID } from '@server/api/themoviedb/constants';
+import type { TmdbKeyword } from '@server/api/themoviedb/interfaces';
 import { MediaType } from '@server/constants/media';
 import { getRepository } from '@server/datasource';
 import Media from '@server/entity/Media';
@@ -13,12 +16,20 @@ const tvRoutes = Router();
 
 tvRoutes.get('/:id', async (req, res, next) => {
   const tmdb = new TheMovieDb();
+
   try {
-    const tv = await tmdb.getTvShow({
+    const tmdbTv = await tmdb.getTvShow({
+      tvId: Number(req.params.id),
+    });
+    const metadataProvider = tmdbTv.keywords.results.some(
+      (keyword: TmdbKeyword) => keyword.id === ANIME_KEYWORD_ID
+    )
+      ? await getMetadataProvider('anime')
+      : await getMetadataProvider('tv');
+    const tv = await metadataProvider.getTvShow({
       tvId: Number(req.params.id),
       language: (req.query.language as string) ?? req.locale,
     });
-
     const media = await Media.getMedia(tv.id, MediaType.TV);
 
     const onUserWatchlist = await getRepository(Watchlist).exist({
@@ -34,7 +45,9 @@ tvRoutes.get('/:id', async (req, res, next) => {
 
     // TMDB issue where it doesnt fallback to English when no overview is available in requested locale.
     if (!data.overview) {
-      const tvEnglish = await tmdb.getTvShow({ tvId: Number(req.params.id) });
+      const tvEnglish = await metadataProvider.getTvShow({
+        tvId: Number(req.params.id),
+      });
       data.overview = tvEnglish.overview;
     }
 
@@ -53,13 +66,20 @@ tvRoutes.get('/:id', async (req, res, next) => {
 });
 
 tvRoutes.get('/:id/season/:seasonNumber', async (req, res, next) => {
-  const tmdb = new TheMovieDb();
-
   try {
-    const season = await tmdb.getTvSeason({
+    const tmdb = new TheMovieDb();
+    const tmdbTv = await tmdb.getTvShow({
+      tvId: Number(req.params.id),
+    });
+    const metadataProvider = tmdbTv.keywords.results.some(
+      (keyword: TmdbKeyword) => keyword.id === ANIME_KEYWORD_ID
+    )
+      ? await getMetadataProvider('anime')
+      : await getMetadataProvider('tv');
+
+    const season = await metadataProvider.getTvSeason({
       tvId: Number(req.params.id),
       seasonNumber: Number(req.params.seasonNumber),
-      language: (req.query.language as string) ?? req.locale,
     });
 
     return res.status(200).json(mapSeasonWithEpisodes(season));

src/components/MetadataSelector/index.tsx

@@ -0,0 +1,91 @@
+import defineMessages from '@app/utils/defineMessages';
+import { useIntl } from 'react-intl';
+import Select, { type StylesConfig } from 'react-select';
+
+enum MetadataProviderType {
+  TMDB = 'tmdb',
+  TVDB = 'tvdb',
+}
+
+type MetadataProviderOptionType = {
+  testId?: string;
+  value: MetadataProviderType;
+  label: string;
+};
+
+const messages = defineMessages('components.MetadataSelector', {
+  tmdbLabel: 'The Movie Database (TMDB)',
+  tvdbLabel: 'TheTVDB',
+  selectMetdataProvider: 'Select a metadata provider',
+});
+
+interface MetadataSelectorProps {
+  testId: string;
+  value: MetadataProviderType;
+  onChange: (value: MetadataProviderType) => void;
+  isDisabled?: boolean;
+}
+
+const MetadataSelector = ({
+  testId = 'metadata-provider-selector',
+  value,
+  onChange,
+  isDisabled = false,
+}: MetadataSelectorProps) => {
+  const intl = useIntl();
+
+  const metadataProviderOptions: MetadataProviderOptionType[] = [
+    {
+      testId: 'tmdb-option',
+      value: MetadataProviderType.TMDB,
+      label: intl.formatMessage(messages.tmdbLabel),
+    },
+    {
+      testId: 'tvdb-option',
+      value: MetadataProviderType.TVDB,
+      label: intl.formatMessage(messages.tvdbLabel),
+    },
+  ];
+
+  const customStyles: StylesConfig<MetadataProviderOptionType, false> = {
+    option: (base) => ({
+      ...base,
+      display: 'flex',
+      alignItems: 'center',
+    }),
+    singleValue: (base) => ({
+      ...base,
+      display: 'flex',
+      alignItems: 'center',
+    }),
+  };
+
+  const formatOptionLabel = (option: MetadataProviderOptionType) => (
+    <div className="flex items-center">
+      <span data-testid={option.testId}>{option.label}</span>
+    </div>
+  );
+
+  return (
+    <div data-testid={testId}>
+      <Select
+        options={metadataProviderOptions}
+        isDisabled={isDisabled}
+        className="react-select-container"
+        classNamePrefix="react-select"
+        value={metadataProviderOptions.find((option) => option.value === value)}
+        onChange={(selectedOption) => {
+          if (selectedOption) {
+            onChange(selectedOption.value);
+          }
+        }}
+        placeholder={intl.formatMessage(messages.selectMetdataProvider)}
+        styles={customStyles}
+        formatOptionLabel={formatOptionLabel}
+      />
+    </div>
+  );
+};
+
+export { MetadataProviderType };
+export default MetadataSelector;

src/components/Settings/SettingsLayout.tsx

@@ -18,6 +18,7 @@ const messages = defineMessages('components.Settings', {
   menuLogs: 'Logs',
   menuJobs: 'Jobs & Cache',
   menuAbout: 'About',
+  menuMetadataProviders: 'Metadata Providers',
 });
 
 type SettingsLayoutProps = {
@@ -59,6 +60,11 @@ const SettingsLayout = ({ children }: SettingsLayoutProps) => {
       route: '/settings/network',
       regex: /^\/settings\/network/,
     },
+    {
+      text: intl.formatMessage(messages.menuMetadataProviders),
+      route: '/settings/metadata',
+      regex: /^\/settings\/metadata/,
+    },
     {
       text: intl.formatMessage(messages.menuNotifications),
       route: '/settings/notifications/email',

src/components/Settings/SettingsMetadata.tsx

@@ -0,0 +1,476 @@
+import Badge from '@app/components/Common/Badge';
+import Button from '@app/components/Common/Button';
+import LoadingSpinner from '@app/components/Common/LoadingSpinner';
+import PageTitle from '@app/components/Common/PageTitle';
+import MetadataSelector, {
+  MetadataProviderType,
+} from '@app/components/MetadataSelector';
+import globalMessages from '@app/i18n/globalMessages';
+import defineMessages from '@app/utils/defineMessages';
+import { ArrowDownOnSquareIcon, BeakerIcon } from '@heroicons/react/24/outline';
+import axios from 'axios';
+import { Form, Formik } from 'formik';
+import { useState } from 'react';
+import { useIntl } from 'react-intl';
+import { useToasts } from 'react-toast-notifications';
+import useSWR from 'swr';
+
+const messages = defineMessages('components.Settings', {
+  metadataProviderSettings: 'Metadata Providers',
+  general: 'General',
+  settings: 'Settings',
+  seriesMetadataProvider: 'Series metadata provider',
+  animeMetadataProvider: 'Anime metadata provider',
+  metadataSettings: 'Settings for metadata provider',
+  clickTest:
+    'Click on the "Test" button to check connectivity with metadata providers',
+  notTested: 'Not Tested',
+  failed: 'Does not work',
+  operational: 'Operational',
+  providerStatus: 'Metadata Provider Status',
+  chooseProvider: 'Choose metadata providers for different content types',
+  metadataProviderSelection: 'Metadata Provider Selection',
+  tmdbProviderDoesnotWork:
+    'TMDB provider does not work, please select another metadata provider',
+  tvdbProviderDoesnotWork:
+    'TVDB provider does not work, please select another metadata provider',
+  allChosenProvidersAreOperational:
+    'All chosen metadata providers are operational',
+  connectionTestFailed: 'Connection test failed',
+  failedToSaveMetadataSettings: 'Failed to save metadata provider settings',
+  metadataSettingsSaved: 'Metadata provider settings saved',
+});
+
+type ProviderStatus = 'ok' | 'not tested' | 'failed';
+
+interface ProviderResponse {
+  tvdb: ProviderStatus;
+  tmdb: ProviderStatus;
+}
+
+interface MetadataValues {
+  tv: MetadataProviderType;
+  anime: MetadataProviderType;
+}
+
+interface MetadataSettings {
+  metadata: MetadataValues;
+}
+
+const SettingsMetadata = () => {
+  const intl = useIntl();
+  const { addToast } = useToasts();
+  const [isTesting, setIsTesting] = useState(false);
+  const defaultStatus: ProviderResponse = {
+    tmdb: 'not tested',
+    tvdb: 'not tested',
+  };
+
+  const [providerStatus, setProviderStatus] =
+    useState<ProviderResponse>(defaultStatus);
+
+  const { data, error } = useSWR<MetadataSettings>(
+    '/api/v1/settings/metadatas',
+    async (url: string) => {
+      const response = await axios.get<{
+        tv: MetadataProviderType;
+        anime: MetadataProviderType;
+      }>(url);
+
+      return {
+        metadata: {
+          tv: response.data.tv,
+          anime: response.data.anime,
+        },
+      };
+    }
+  );
+
+  const testConnection = async (
+    values: MetadataValues
+  ): Promise<ProviderResponse> => {
+    const useTmdb =
+      values.tv === MetadataProviderType.TMDB ||
+      values.anime === MetadataProviderType.TMDB;
+    const useTvdb =
+      values.tv === MetadataProviderType.TVDB ||
+      values.anime === MetadataProviderType.TVDB;
+
+    const testData = {
+      tmdb: useTmdb,
+      tvdb: useTvdb,
+    };
+
+    try {
+      const response = await axios.post<{
+        success: boolean;
+        tests: ProviderResponse;
+      }>('/api/v1/settings/metadatas/test', testData);
+
+      const newStatus: ProviderResponse = {
+        tmdb: useTmdb ? response.data.tests.tmdb : 'not tested',
+        tvdb: useTvdb ? response.data.tests.tvdb : 'not tested',
+      };
+
+      setProviderStatus(newStatus);
+      return newStatus;
+    } catch (error) {
+      if (axios.isAxiosError(error) && error.response) {
+        // If we receive an error response with a valid format
+        const errorData = error.response.data as {
+          success: boolean;
+          tests: ProviderResponse;
+        };
+
+        if (errorData.tests) {
+          const newStatus: ProviderResponse = {
+            tmdb: useTmdb ? errorData.tests.tmdb : 'not tested',
+            tvdb: useTvdb ? errorData.tests.tvdb : 'not tested',
+          };
+
+          setProviderStatus(newStatus);
+          return newStatus;
+        }
+      }
+
+      // In case of error without usable data
+      throw new Error('Failed to test connection');
+    }
+  };
+
+  const saveSettings = async (
+    values: MetadataValues
+  ): Promise<MetadataSettings> => {
+    try {
+      const response = await axios.put<{
+        success: boolean;
+        tv: MetadataProviderType;
+        anime: MetadataProviderType;
+        tests?: {
+          tvdb: ProviderStatus;
+          tmdb: ProviderStatus;
+        };
+      }>('/api/v1/settings/metadatas', {
+        tv: values.tv,
+        anime: values.anime,
+      });
+
+      // Update metadata provider status if available
+      if (response.data.tests) {
+        const mapStatusValue = (status: string): ProviderStatus => {
+          if (status === 'ok') return 'ok';
+          if (status === 'failed') return 'failed';
+          return 'not tested';
+        };
+
+        setProviderStatus({
+          tmdb: mapStatusValue(response.data.tests.tmdb),
+          tvdb: mapStatusValue(response.data.tests.tvdb),
+        });
+      }
+
+      // Adapt the response to the format expected by the component
+      return {
+        metadata: {
+          tv: response.data.tv,
+          anime: response.data.anime,
+        },
+      };
+    } catch (error) {
+      // Retrieve test data in case of error
+      if (axios.isAxiosError(error) && error.response?.data) {
+        const errorData = error.response.data as {
+          success: boolean;
+          tests?: {
+            tvdb: string;
+            tmdb: string;
+          };
+        };
+
+        // If test data is available in the error response
+        if (errorData.tests) {
+          const mapStatusValue = (status: string): ProviderStatus => {
+            if (status === 'ok') return 'ok';
+            if (status === 'failed') return 'failed';
+            return 'not tested';
+          };
+
+          // Update metadata provider status with error data
+          setProviderStatus({
+            tmdb: mapStatusValue(errorData.tests.tmdb),
+            tvdb: mapStatusValue(errorData.tests.tvdb),
+          });
+        }
+      }
+
+      throw new Error('Failed to save Metadata settings');
+    }
+  };
+
+  const getStatusClass = (status: ProviderStatus): string => {
+    switch (status) {
+      case 'ok':
+        return 'text-green-500';
+      case 'not tested':
+        return 'text-yellow-500';
+      case 'failed':
+        return 'text-red-500';
+    }
+  };
+
+  const getStatusMessage = (status: ProviderStatus): string => {
+    switch (status) {
+      case 'ok':
+        return intl.formatMessage(messages.operational);
+      case 'not tested':
+        return intl.formatMessage(messages.notTested);
+      case 'failed':
+        return intl.formatMessage(messages.failed);
+    }
+  };
+
+  const getBadgeType = (
+    status: ProviderStatus
+  ):
+    | 'default'
+    | 'primary'
+    | 'danger'
+    | 'warning'
+    | 'success'
+    | 'dark'
+    | 'light'
+    | undefined => {
+    switch (status) {
+      case 'ok':
+        return 'success';
+      case 'not tested':
+        return 'warning';
+      case 'failed':
+        return 'danger';
+    }
+  };
+
+  if (!data && !error) {
+    return <LoadingSpinner />;
+  }
+
+  const initialValues: MetadataValues = data?.metadata || {
+    tv: MetadataProviderType.TMDB,
+    anime: MetadataProviderType.TMDB,
+  };
+
+  return (
+    <>
+      <PageTitle
+        title={[
+          intl.formatMessage(messages.general),
+          intl.formatMessage(globalMessages.settings),
+        ]}
+      />
+
+      <div className="mb-6">
+        <h3 className="heading">
+          {intl.formatMessage(messages.metadataProviderSettings)}
+        </h3>
+        <p className="description">
+          {intl.formatMessage(messages.metadataSettings)}
+        </p>
+      </div>
+
+      <div className="mb-6 rounded-lg bg-gray-800 p-4">
+        <h4 className="mb-3 text-lg font-medium">
+          {intl.formatMessage(messages.providerStatus)}
+        </h4>
+        <div className="flex flex-col space-y-3">
+          <div className="flex items-center">
+            <span className="mr-2 w-24">TheMovieDB:</span>
+            <span
+              className={`text-sm ${getStatusClass(providerStatus.tmdb)}`}
+              data-testid="tmdb-status-container"
+            >
+              <Badge badgeType={getBadgeType(providerStatus.tmdb)}>
+                {getStatusMessage(providerStatus.tmdb)}
+              </Badge>
+            </span>
+          </div>
+          <div className="flex items-center">
+            <span className="mr-2 w-24">TheTVDB:</span>
+            <span
+              className={`text-sm ${getStatusClass(providerStatus.tvdb)}`}
+              data-testid="tvdb-status"
+            >
+              <Badge badgeType={getBadgeType(providerStatus.tvdb)}>
+                {getStatusMessage(providerStatus.tvdb)}
+              </Badge>
+            </span>
+          </div>
+        </div>
+      </div>
+
+      <div className="section">
+        <Formik
+          initialValues={{ metadata: initialValues }}
+          onSubmit={async (values) => {
+            try {
+              const result = await saveSettings(values.metadata);
+
+              if (data) {
+                data.metadata = result.metadata;
+              }
+
+              addToast(intl.formatMessage(messages.metadataSettingsSaved), {
+                appearance: 'success',
+              });
+            } catch (e) {
+              addToast(
+                intl.formatMessage(messages.failedToSaveMetadataSettings),
+                {
+                  appearance: 'error',
+                }
+              );
+            }
+          }}
+        >
+          {({ isSubmitting, isValid, values, setFieldValue }) => {
+            return (
+              <Form className="section" data-testid="settings-main-form">
+                <div className="mb-6">
+                  <h2 className="heading">
+                    {intl.formatMessage(messages.metadataProviderSelection)}
+                  </h2>
+                  <p className="description">
+                    {intl.formatMessage(messages.chooseProvider)}
+                  </p>
+                </div>
+
+                <div className="form-row">
+                  <label
+                    htmlFor="tv-metadata-provider"
+                    className="checkbox-label"
+                  >
+                    <span className="mr-2">
+                      {intl.formatMessage(messages.seriesMetadataProvider)}
+                    </span>
+                  </label>
+                  <div className="form-input-area">
+                    <MetadataSelector
+                      testId="tv-metadata-provider-selector"
+                      value={values.metadata.tv}
+                      onChange={(value) => setFieldValue('metadata.tv', value)}
+                      isDisabled={isSubmitting}
+                    />
+                  </div>
+                </div>
+
+                <div className="form-row">
+                  <label
+                    htmlFor="anime-metadata-provider"
+                    className="checkbox-label"
+                  >
+                    <span className="mr-2">
+                      {intl.formatMessage(messages.animeMetadataProvider)}
+                    </span>
+                  </label>
+                  <div className="form-input-area">
+                    <MetadataSelector
+                      testId="anime-metadata-provider-selector"
+                      value={values.metadata.anime}
+                      onChange={(value) =>
+                        setFieldValue('metadata.anime', value)
+                      }
+                      isDisabled={isSubmitting}
+                    />
+                  </div>
+                </div>
+
+                <div className="actions">
+                  <div className="flex justify-end">
+                    <span className="ml-3 inline-flex rounded-md shadow-sm">
+                      <Button
+                        buttonType="warning"
+                        type="button"
+                        disabled={isSubmitting || !isValid}
+                        onClick={async () => {
+                          setIsTesting(true);
+                          try {
+                            const resp = await testConnection(values.metadata);
+
+                            if (resp.tvdb === 'failed') {
+                              addToast(
+                                intl.formatMessage(
+                                  messages.tvdbProviderDoesnotWork
+                                ),
+                                {
+                                  appearance: 'error',
+                                  autoDismiss: true,
+                                }
+                              );
+                            } else if (resp.tmdb === 'failed') {
+                              addToast(
+                                intl.formatMessage(
+                                  messages.tmdbProviderDoesnotWork
+                                ),
+                                {
+                                  appearance: 'error',
+                                  autoDismiss: true,
+                                }
+                              );
+                            } else {
+                              addToast(
+                                intl.formatMessage(
+                                  messages.allChosenProvidersAreOperational
+                                ),
+                                {
+                                  appearance: 'success',
+                                }
+                              );
+                            }
+                          } catch (e) {
+                            addToast(
+                              intl.formatMessage(messages.connectionTestFailed),
+                              {
+                                appearance: 'error',
+                                autoDismiss: true,
+                              }
+                            );
+                          } finally {
+                            setIsTesting(false);
+                          }
+                        }}
+                      >
+                        <BeakerIcon />
+                        <span>
+                          {isTesting
+                            ? intl.formatMessage(globalMessages.testing)
+                            : intl.formatMessage(globalMessages.test)}
+                        </span>
+                      </Button>
+                    </span>
+
+                    <span className="ml-3 inline-flex rounded-md shadow-sm">
+                      <Button
+                        data-testid="metadata-save-button"
+                        buttonType="primary"
+                        type="submit"
+                        disabled={isSubmitting || !isValid || isTesting}
+                      >
+                        <ArrowDownOnSquareIcon />
+                        <span>
+                          {isSubmitting
+                            ? intl.formatMessage(globalMessages.saving)
+                            : intl.formatMessage(globalMessages.save)}
+                        </span>
+                      </Button>
+                    </span>
+                  </div>
+                </div>
+              </Form>
+            );
+          }}
+        </Formik>
+      </div>
+    </>
+  );
+};
+
+export default SettingsMetadata;

src/components/TvDetails/Season/index.tsx

@@ -60,7 +60,7 @@ const Season = ({ seasonNumber, tvId }: SeasonProps) => {
                     <CachedImage
                       type="tmdb"
                       className="rounded-lg object-contain"
-                      src={`https://image.tmdb.org/t/p/original/${episode.stillPath}`}
+                      src={episode.stillPath}
                       alt=""
                       fill
                     />

src/components/TvDetails/index.tsx

@@ -35,6 +35,7 @@ import { sortCrewPriority } from '@app/utils/creditHelpers';
 import defineMessages from '@app/utils/defineMessages';
 import { refreshIntervalHelper } from '@app/utils/refreshIntervalHelper';
 import { Disclosure, Transition } from '@headlessui/react';
+import { ChevronDownIcon } from '@heroicons/react/24/outline';
 import {
   ArrowRightCircleIcon,
   CogIcon,
@@ -44,8 +45,7 @@ import {
   MinusCircleIcon,
   PlayIcon,
   StarIcon,
-} from '@heroicons/react/24/outline';
+} from '@heroicons/react/24/solid';
-import { ChevronDownIcon } from '@heroicons/react/24/solid';
 import type { RTRating } from '@server/api/rating/rottentomatoes';
 import { ANIME_KEYWORD_ID } from '@server/api/themoviedb/constants';
 import { IssueStatus } from '@server/constants/issue';
@@ -118,9 +118,7 @@ const TvDetails = ({ tv }: TvDetailsProps) => {
   const intl = useIntl();
   const { locale } = useLocale();
   const [showRequestModal, setShowRequestModal] = useState(false);
-  const [showManager, setShowManager] = useState(
+  const [showManager, setShowManager] = useState(router.query.manage == '1');
-    router.query.manage == '1' ? true : false
-  );
   const [showIssueModal, setShowIssueModal] = useState(false);
   const [isUpdating, setIsUpdating] = useState<boolean>(false);
   const [toggleWatchlist, setToggleWatchlist] = useState<boolean>(
@@ -156,7 +154,7 @@ const TvDetails = ({ tv }: TvDetailsProps) => {
   );
 
   useEffect(() => {
-    setShowManager(router.query.manage == '1' ? true : false);
+    setShowManager(router.query.manage == '1');
   }, [router.query.manage]);
 
   const closeBlacklistModal = useCallback(

src/i18n/locale/en.json

@@ -104,6 +104,7 @@
   "components.Discover.StudioSlider.studios": "Studios",
   "components.Discover.TvGenreList.seriesgenres": "Series Genres",
   "components.Discover.TvGenreSlider.tvgenres": "Series Genres",
+  "components.DiscoverTvUpcoming.upcomingtv": "Upcoming Series",
   "components.Discover.createnewslider": "Create New Slider",
   "components.Discover.customizediscover": "Customize Discover",
   "components.Discover.discover": "Discover",
@@ -137,7 +138,6 @@
   "components.Discover.upcomingtv": "Upcoming Series",
   "components.Discover.updatefailed": "Something went wrong updating the discover customization settings.",
   "components.Discover.updatesuccess": "Updated discover customization settings.",
-  "components.DiscoverTvUpcoming.upcomingtv": "Upcoming Series",
   "components.DownloadBlock.estimatedtime": "Estimated {time}",
   "components.DownloadBlock.formattedTitle": "{title}: Season {seasonNumber} Episode {episodeNumber}",
   "components.IssueDetails.IssueComment.areyousuredelete": "Are you sure you want to delete this comment?",
@@ -307,6 +307,9 @@
   "components.ManageSlideOver.removearr4k": "Remove from 4K {arr}",
   "components.ManageSlideOver.tvshow": "series",
   "components.MediaSlider.ShowMoreCard.seemore": "See More",
+  "components.MetadataSelector.selectMetdataProvider": "Select a metadata provider",
+  "components.MetadataSelector.tmdbLabel": "The Movie Database (TMDB)",
+  "components.MetadataSelector.tvdbLabel": "TheTVDB",
   "components.MovieDetails.MovieCast.fullcast": "Full Cast",
   "components.MovieDetails.MovieCrew.fullcrew": "Full Crew",
   "components.MovieDetails.addtowatchlist": "Add To Watchlist",
@@ -1092,12 +1095,17 @@
   "components.Settings.addrule": "New Override Rule",
   "components.Settings.addsonarr": "Add Sonarr Server",
   "components.Settings.advancedTooltip": "Incorrectly configuring this setting may result in broken functionality",
+  "components.Settings.allChosenProvidersAreOperational": "All chosen metadata providers are operational",
+  "components.Settings.animeMetadataProvider": "Anime metadata provider",
   "components.Settings.apiKey": "API key",
   "components.Settings.blacklistedTagImportInstructions": "Paste blacklist tag configuration below.",
   "components.Settings.blacklistedTagImportTitle": "Import Blacklisted Tag Configuration",
   "components.Settings.blacklistedTagsText": "Blacklisted Tags",
   "components.Settings.cancelscan": "Cancel Scan",
+  "components.Settings.chooseProvider": "Choose metadata providers for different content types",
   "components.Settings.clearBlacklistedTagsConfirm": "Are you sure you want to clear the blacklisted tags?",
+  "components.Settings.clickTest": "Click on the \"Test\" button to check connectivity with metadata providers",
+  "components.Settings.connectionTestFailed": "Connection test failed",
   "components.Settings.copyBlacklistedTags": "Copied blacklisted tags to clipboard.",
   "components.Settings.copyBlacklistedTagsEmpty": "Nothing to copy",
   "components.Settings.copyBlacklistedTagsTip": "Copy blacklisted tag configuration",
@@ -1110,6 +1118,9 @@
   "components.Settings.enablessl": "Use SSL",
   "components.Settings.experimentalTooltip": "Enabling this setting may result in unexpected application behavior",
   "components.Settings.externalUrl": "External URL",
+  "components.Settings.failed": "Does not work",
+  "components.Settings.failedToSaveMetadataSettings": "Failed to save metadata provider settings",
+  "components.Settings.general": "General",
   "components.Settings.hostname": "Hostname or IP Address",
   "components.Settings.importBlacklistedTagsTip": "Import blacklisted tag configuration",
   "components.Settings.invalidKeyword": "{keywordId} is not a TMDB keyword.",
@@ -1139,21 +1150,27 @@
   "components.Settings.menuJellyfinSettings": "{mediaServerName}",
   "components.Settings.menuJobs": "Jobs & Cache",
   "components.Settings.menuLogs": "Logs",
+  "components.Settings.menuMetadataProviders": "Metadata Providers",
   "components.Settings.menuNetwork": "Network",
   "components.Settings.menuNotifications": "Notifications",
   "components.Settings.menuPlexSettings": "Plex",
   "components.Settings.menuServices": "Services",
   "components.Settings.menuUsers": "Users",
+  "components.Settings.metadataProviderSelection": "Metadata Provider Selection",
+  "components.Settings.metadataSettings": "Settings for metadata provider",
+  "components.Settings.metadataSettingsSaved": "Metadata provider settings saved",
   "components.Settings.no": "No",
   "components.Settings.noDefault4kServer": "A 4K {serverType} server must be marked as default in order to enable users to submit 4K {mediaType} requests.",
   "components.Settings.noDefaultNon4kServer": "If you only have a single {serverType} server for both non-4K and 4K content (or if you only download 4K content), your {serverType} server should <strong>NOT</strong> be designated as a 4K server.",
   "components.Settings.noDefaultServer": "At least one {serverType} server must be marked as default in order for {mediaType} requests to be processed.",
   "components.Settings.noSpecialCharacters": "Configuration must be a comma delimited list of TMDB keyword ids, and must not start or end with a comma.",
   "components.Settings.nooptions": "No results.",
+  "components.Settings.notTested": "Not Tested",
   "components.Settings.notificationAgentSettingsDescription": "Configure and enable notification agents.",
   "components.Settings.notifications": "Notifications",
   "components.Settings.notificationsettings": "Notification Settings",
   "components.Settings.notrunning": "Not Running",
+  "components.Settings.operational": "Operational",
   "components.Settings.overrideRules": "Override Rules",
   "components.Settings.overrideRulesDescription": "Override rules allow you to specify properties that will be replaced if a request matches the rule.",
   "components.Settings.plex": "Plex",
@@ -1162,6 +1179,7 @@
   "components.Settings.plexsettings": "Plex Settings",
   "components.Settings.plexsettingsDescription": "Configure the settings for your Plex server. Jellyseerr scans your Plex libraries to determine content availability.",
   "components.Settings.port": "Port",
+  "components.Settings.providerStatus": "Metadata Provider Status",
   "components.Settings.radarrsettings": "Radarr Settings",
   "components.Settings.restartrequiredTooltip": "Jellyseerr must be restarted for changes to this setting to take effect",
   "components.Settings.save": "Save Changes",
@@ -1170,6 +1188,7 @@
   "components.Settings.scanbackground": "Scanning will run in the background. You can continue the setup process in the meantime.",
   "components.Settings.scanning": "Syncing…",
   "components.Settings.searchKeywords": "Search keywords…",
+  "components.Settings.seriesMetadataProvider": "Series metadata provider",
   "components.Settings.serverLocal": "local",
   "components.Settings.serverRemote": "remote",
   "components.Settings.serverSecure": "secure",
@@ -1180,6 +1199,7 @@
   "components.Settings.serviceSettingsDescription": "Configure your {serverType} server(s) below. You can connect multiple {serverType} servers, but only two of them can be marked as defaults (one non-4K and one 4K). Administrators are able to override the server used to process new requests prior to approval.",
   "components.Settings.services": "Services",
   "components.Settings.settingUpPlexDescription": "To set up Plex, you can either enter the details manually or select a server retrieved from <RegisterPlexTVLink>plex.tv</RegisterPlexTVLink>. Press the button to the right of the dropdown to fetch the list of available servers.",
+  "components.Settings.settings": "Settings",
   "components.Settings.sonarrsettings": "Sonarr Settings",
   "components.Settings.ssl": "SSL",
   "components.Settings.startscan": "Start Scan",
@@ -1191,6 +1211,7 @@
   "components.Settings.tautulliSettingsDescription": "Optionally configure the settings for your Tautulli server. Jellyseerr fetches watch history data for your Plex media from Tautulli.",
   "components.Settings.timeout": "Timeout",
   "components.Settings.tip": "Tip",
+  "components.Settings.tmdbProviderDoesnotWork": "TMDB provider does not work, please select another metadata provider",
   "components.Settings.toastPlexConnecting": "Attempting to connect to Plex…",
   "components.Settings.toastPlexConnectingFailure": "Failed to connect to Plex.",
   "components.Settings.toastPlexConnectingSuccess": "Plex connection established successfully!",
@@ -1199,6 +1220,7 @@
   "components.Settings.toastPlexRefreshSuccess": "Plex server list retrieved successfully!",
   "components.Settings.toastTautulliSettingsFailure": "Something went wrong while saving Tautulli settings.",
   "components.Settings.toastTautulliSettingsSuccess": "Tautulli settings saved successfully!",
+  "components.Settings.tvdbProviderDoesnotWork": "TVDB provider does not work, please select another metadata provider",
   "components.Settings.urlBase": "URL Base",
   "components.Settings.validationApiKey": "You must provide an API key",
   "components.Settings.validationHostnameRequired": "You must provide a valid hostname or IP address",
@@ -1225,7 +1247,7 @@
   "components.Setup.librarieserror": "Validation failed. Please toggle the libraries again to continue.",
   "components.Setup.servertype": "Choose Server Type",
   "components.Setup.setup": "Setup",
-  "components.Setup.signin": "Sign in to your account",
+  "components.Setup.signin": "Sign In",
   "components.Setup.signinMessage": "Get started by signing in",
   "components.Setup.signinWithEmby": "Enter your Emby details",
   "components.Setup.signinWithJellyfin": "Enter your Jellyfin details",

src/pages/settings/metadata.tsx

@@ -0,0 +1,16 @@
+import SettingsLayout from '@app/components/Settings/SettingsLayout';
+import SettingsMetadata from '@app/components/Settings/SettingsMetadata';
+import useRouteGuard from '@app/hooks/useRouteGuard';
+import { Permission } from '@app/hooks/useUser';
+import type { NextPage } from 'next';
+
+const MetadataSettingsPage: NextPage = () => {
+  useRouteGuard(Permission.ADMIN);
+  return (
+    <SettingsLayout>
+      <SettingsMetadata />
+    </SettingsLayout>
+  );
+};
+
+export default MetadataSettingsPage;