feat: add discover customization (#3182)

server/api/themoviedb/index.ts

@@ -3,9 +3,12 @@ import cacheManager from '@server/lib/cache';
 import { sortBy } from 'lodash';
 import type {
   TmdbCollection,
+  TmdbCompanySearchResponse,
   TmdbExternalIdResponse,
   TmdbGenre,
   TmdbGenresResult,
+  TmdbKeyword,
+  TmdbKeywordSearchResponse,
   TmdbLanguage,
   TmdbMovieDetails,
   TmdbNetwork,
@@ -41,6 +44,7 @@ interface DiscoverMovieOptions {
   originalLanguage?: string;
   genre?: number;
   studio?: number;
+  keywords?: string;
   sortBy?:
     | 'popularity.asc'
     | 'popularity.desc'
@@ -67,6 +71,7 @@ interface DiscoverTvOptions {
   originalLanguage?: string;
   genre?: number;
   network?: number;
+  keywords?: string;
   sortBy?:
     | 'popularity.asc'
     | 'popularity.desc'
@@ -440,6 +445,7 @@ class TheMovieDb extends ExternalAPI {
     originalLanguage,
     genre,
     studio,
+    keywords,
   }: DiscoverMovieOptions = {}): Promise<TmdbSearchMovieResponse> => {
     try {
       const data = await this.get<TmdbSearchMovieResponse>('/discover/movie', {
@@ -454,6 +460,7 @@ class TheMovieDb extends ExternalAPI {
           'primary_release_date.lte': primaryReleaseDateLte,
           with_genres: genre,
           with_companies: studio,
+          with_keywords: keywords,
         },
       });
 
@@ -473,6 +480,7 @@ class TheMovieDb extends ExternalAPI {
     originalLanguage,
     genre,
     network,
+    keywords,
   }: DiscoverTvOptions = {}): Promise<TmdbSearchTvResponse> => {
     try {
       const data = await this.get<TmdbSearchTvResponse>('/discover/tv', {
@@ -487,6 +495,7 @@ class TheMovieDb extends ExternalAPI {
           include_null_first_air_dates: includeEmptyReleaseDate,
           with_genres: genre,
           with_networks: network,
+          with_keywords: keywords,
         },
       });
 
@@ -874,6 +883,74 @@ class TheMovieDb extends ExternalAPI {
       throw new Error(`[TMDB] Failed to fetch TV genres: ${e.message}`);
     }
   }
+
+  public async getKeywordDetails({
+    keywordId,
+  }: {
+    keywordId: number;
+  }): Promise<TmdbKeyword> {
+    try {
+      const data = await this.get<TmdbKeyword>(
+        `/keyword/${keywordId}`,
+        undefined,
+        604800 // 7 days
+      );
+
+      return data;
+    } catch (e) {
+      throw new Error(`[TMDB] Failed to fetch keyword: ${e.message}`);
+    }
+  }
+
+  public async searchKeyword({
+    query,
+    page = 1,
+  }: {
+    query: string;
+    page?: number;
+  }): Promise<TmdbKeywordSearchResponse> {
+    try {
+      const data = await this.get<TmdbKeywordSearchResponse>(
+        '/search/keyword',
+        {
+          params: {
+            query,
+            page,
+          },
+        },
+        86400 // 24 hours
+      );
+
+      return data;
+    } catch (e) {
+      throw new Error(`[TMDB] Failed to search keyword: ${e.message}`);
+    }
+  }
+
+  public async searchCompany({
+    query,
+    page = 1,
+  }: {
+    query: string;
+    page?: number;
+  }): Promise<TmdbCompanySearchResponse> {
+    try {
+      const data = await this.get<TmdbCompanySearchResponse>(
+        '/search/company',
+        {
+          params: {
+            query,
+            page,
+          },
+        },
+        86400 // 24 hours
+      );
+
+      return data;
+    } catch (e) {
+      throw new Error(`[TMDB] Failed to search companies: ${e.message}`);
+    }
+  }
 }
 
 export default TheMovieDb;

server/api/themoviedb/interfaces.ts

@@ -428,3 +428,18 @@ export interface TmdbWatchProviderDetails {
   provider_id: number;
   provider_name: string;
 }
+
+export interface TmdbKeywordSearchResponse extends TmdbPaginatedResponse {
+  results: TmdbKeyword[];
+}
+
+// We have production companies, but the company search results return less data
+export interface TmdbCompany {
+  id: number;
+  logo_path?: string;
+  name: string;
+}
+
+export interface TmdbCompanySearchResponse extends TmdbPaginatedResponse {
+  results: TmdbCompany[];
+}

server/constants/discover.ts

@@ -0,0 +1,98 @@
+import type DiscoverSlider from '@server/entity/DiscoverSlider';
+
+export enum DiscoverSliderType {
+  RECENTLY_ADDED = 1,
+  RECENT_REQUESTS,
+  PLEX_WATCHLIST,
+  TRENDING,
+  POPULAR_MOVIES,
+  MOVIE_GENRES,
+  UPCOMING_MOVIES,
+  STUDIOS,
+  POPULAR_TV,
+  TV_GENRES,
+  UPCOMING_TV,
+  NETWORKS,
+  TMDB_MOVIE_KEYWORD,
+  TMDB_MOVIE_GENRE,
+  TMDB_TV_KEYWORD,
+  TMDB_TV_GENRE,
+  TMDB_SEARCH,
+  TMDB_STUDIO,
+  TMDB_NETWORK,
+}
+
+export const defaultSliders: Partial<DiscoverSlider>[] = [
+  {
+    type: DiscoverSliderType.RECENTLY_ADDED,
+    enabled: true,
+    isBuiltIn: true,
+    order: 0,
+  },
+  {
+    type: DiscoverSliderType.RECENT_REQUESTS,
+    enabled: true,
+    isBuiltIn: true,
+    order: 1,
+  },
+  {
+    type: DiscoverSliderType.PLEX_WATCHLIST,
+    enabled: true,
+    isBuiltIn: true,
+    order: 2,
+  },
+  {
+    type: DiscoverSliderType.TRENDING,
+    enabled: true,
+    isBuiltIn: true,
+    order: 3,
+  },
+  {
+    type: DiscoverSliderType.POPULAR_MOVIES,
+    enabled: true,
+    isBuiltIn: true,
+    order: 4,
+  },
+  {
+    type: DiscoverSliderType.MOVIE_GENRES,
+    enabled: true,
+    isBuiltIn: true,
+    order: 5,
+  },
+  {
+    type: DiscoverSliderType.UPCOMING_MOVIES,
+    enabled: true,
+    isBuiltIn: true,
+    order: 6,
+  },
+  {
+    type: DiscoverSliderType.STUDIOS,
+    enabled: true,
+    isBuiltIn: true,
+    order: 7,
+  },
+  {
+    type: DiscoverSliderType.POPULAR_TV,
+    enabled: true,
+    isBuiltIn: true,
+    order: 8,
+  },
+  {
+    type: DiscoverSliderType.TV_GENRES,
+    enabled: true,
+    isBuiltIn: true,
+    order: 9,
+  },
+  {
+    type: DiscoverSliderType.UPCOMING_TV,
+    enabled: true,
+    isBuiltIn: true,
+    order: 10,
+  },
+  {
+    type: DiscoverSliderType.NETWORKS,
+    enabled: true,
+    isBuiltIn: true,
+    order: 11,
+  },
+];

server/entity/DiscoverSlider.ts

@@ -0,0 +1,69 @@
+import type { DiscoverSliderType } from '@server/constants/discover';
+import { defaultSliders } from '@server/constants/discover';
+import { getRepository } from '@server/datasource';
+import logger from '@server/logger';
+import {
+  Column,
+  CreateDateColumn,
+  Entity,
+  PrimaryGeneratedColumn,
+  UpdateDateColumn,
+} from 'typeorm';
+
+@Entity()
+class DiscoverSlider {
+  public static async bootstrapSliders(): Promise<void> {
+    const sliderRepository = getRepository(DiscoverSlider);
+
+    for (const slider of defaultSliders) {
+      const existingSlider = await sliderRepository.findOne({
+        where: {
+          type: slider.type,
+        },
+      });
+
+      if (!existingSlider) {
+        logger.info('Creating built-in discovery slider', {
+          label: 'Discover Slider',
+          slider,
+        });
+        await sliderRepository.save(new DiscoverSlider(slider));
+      }
+    }
+  }
+
+  @PrimaryGeneratedColumn()
+  public id: number;
+
+  @Column({ type: 'int' })
+  public type: DiscoverSliderType;
+
+  @Column({ type: 'int' })
+  public order: number;
+
+  @Column({ default: false })
+  public isBuiltIn: boolean;
+
+  @Column({ default: true })
+  public enabled: boolean;
+
+  @Column({ nullable: true })
+  // Title is not required for built in sliders because we will
+  // use translations for them.
+  public title?: string;
+
+  @Column({ nullable: true })
+  public data?: string;
+
+  @CreateDateColumn()
+  public createdAt: Date;
+
+  @UpdateDateColumn()
+  public updatedAt: Date;
+
+  constructor(init?: Partial<DiscoverSlider>) {
+    Object.assign(this, init);
+  }
+}
+
+export default DiscoverSlider;

server/index.ts

@@ -1,5 +1,6 @@
 import PlexAPI from '@server/api/plexapi';
 import dataSource, { getRepository } from '@server/datasource';
+import DiscoverSlider from '@server/entity/DiscoverSlider';
 import { Session } from '@server/entity/Session';
 import { User } from '@server/entity/User';
 import { startJobs } from '@server/job/schedule';
@@ -95,6 +96,9 @@ app
     // Start Jobs
     startJobs();
 
+    // Bootstrap Discovery Sliders
+    await DiscoverSlider.bootstrapSliders();
+
     const server = express();
     if (settings.main.trustProxy) {
       server.enable('trust proxy');

server/migration/1672041273674-AddDiscoverSlider.ts

@@ -0,0 +1,15 @@
+import type { MigrationInterface, QueryRunner } from 'typeorm';
+
+export class AddDiscoverSlider1672041273674 implements MigrationInterface {
+  name = 'AddDiscoverSlider1672041273674';
+
+  public async up(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(
+      `CREATE TABLE "discover_slider" ("id" integer PRIMARY KEY AUTOINCREMENT NOT NULL, "type" integer NOT NULL, "order" integer NOT NULL, "isBuiltIn" boolean NOT NULL DEFAULT (0), "enabled" boolean NOT NULL DEFAULT (1), "title" varchar, "data" varchar, "createdAt" datetime NOT NULL DEFAULT (datetime('now')), "updatedAt" datetime NOT NULL DEFAULT (datetime('now')))`
+    );
+  }
+
+  public async down(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(`DROP TABLE "discover_slider"`);
+  }
+}

server/routes/discover.ts

@@ -1,5 +1,6 @@
 import PlexTvAPI from '@server/api/plextv';
 import TheMovieDb from '@server/api/themoviedb';
+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';
@@ -48,6 +49,7 @@ const discoverRoutes = Router();
 
 discoverRoutes.get('/movies', async (req, res, next) => {
   const tmdb = createTmdbWithRegionLanguage(req.user);
+  const keywords = req.query.keywords as string;
 
   try {
     const data = await tmdb.getDiscoverMovies({
@@ -55,16 +57,29 @@ discoverRoutes.get('/movies', async (req, res, next) => {
       language: req.locale ?? (req.query.language as string),
       genre: req.query.genre ? Number(req.query.genre) : undefined,
       studio: req.query.studio ? Number(req.query.studio) : undefined,
+      keywords,
     });
 
     const media = await Media.getRelatedMedia(
       data.results.map((result) => result.id)
     );
 
+    let keywordData: TmdbKeyword[] = [];
+    if (keywords) {
+      const splitKeywords = keywords.split(',');
+
+      keywordData = await Promise.all(
+        splitKeywords.map(async (keywordId) => {
+          return await tmdb.getKeywordDetails({ keywordId: Number(keywordId) });
+        })
+      );
+    }
+
     return res.status(200).json({
       page: data.page,
       totalPages: data.total_pages,
       totalResults: data.total_results,
+      keywords: keywordData,
       results: data.results.map((result) =>
         mapMovieResult(
           result,
@@ -294,6 +309,7 @@ discoverRoutes.get('/movies/upcoming', async (req, res, next) => {
 
 discoverRoutes.get('/tv', async (req, res, next) => {
   const tmdb = createTmdbWithRegionLanguage(req.user);
+  const keywords = req.query.keywords as string;
 
   try {
     const data = await tmdb.getDiscoverTv({
@@ -301,16 +317,29 @@ discoverRoutes.get('/tv', async (req, res, next) => {
       language: req.locale ?? (req.query.language as string),
       genre: req.query.genre ? Number(req.query.genre) : undefined,
       network: req.query.network ? Number(req.query.network) : undefined,
+      keywords,
     });
 
     const media = await Media.getRelatedMedia(
       data.results.map((result) => result.id)
     );
 
+    let keywordData: TmdbKeyword[] = [];
+    if (keywords) {
+      const splitKeywords = keywords.split(',');
+
+      keywordData = await Promise.all(
+        splitKeywords.map(async (keywordId) => {
+          return await tmdb.getKeywordDetails({ keywordId: Number(keywordId) });
+        })
+      );
+    }
+
     return res.status(200).json({
       page: data.page,
       totalPages: data.total_pages,
       totalResults: data.total_results,
+      keywords: keywordData,
       results: data.results.map((result) =>
         mapTvResult(
           result,

server/routes/index.ts

@@ -4,6 +4,8 @@ import type {
   TmdbMovieResult,
   TmdbTvResult,
 } from '@server/api/themoviedb/interfaces';
+import { getRepository } from '@server/datasource';
+import DiscoverSlider from '@server/entity/DiscoverSlider';
 import type { StatusResponse } from '@server/interfaces/api/settingsInterfaces';
 import { Permission } from '@server/lib/permissions';
 import { getSettings } from '@server/lib/settings';
@@ -102,6 +104,13 @@ router.get('/settings/public', async (req, res) => {
     return res.status(200).json(settings.fullPublicSettings);
   }
 });
+router.get('/settings/discover', isAuthenticated(), async (_req, res) => {
+  const sliderRepository = getRepository(DiscoverSlider);
+
+  const sliders = await sliderRepository.find({ order: { order: 'ASC' } });
+
+  return res.json(sliders);
+});
 router.use('/settings', isAuthenticated(Permission.ADMIN), settingsRoutes);
 router.use('/search', isAuthenticated(), searchRoutes);
 router.use('/discover', isAuthenticated(), discoverRoutes);

server/routes/search.ts

@@ -56,4 +56,50 @@ searchRoutes.get('/', async (req, res, next) => {
   }
 });
 
+searchRoutes.get('/keyword', async (req, res, next) => {
+  const tmdb = new TheMovieDb();
+
+  try {
+    const results = await tmdb.searchKeyword({
+      query: req.query.query as string,
+      page: Number(req.query.page),
+    });
+
+    return res.status(200).json(results);
+  } catch (e) {
+    logger.debug('Something went wrong retrieving keyword search results', {
+      label: 'API',
+      errorMessage: e.message,
+      query: req.query.query,
+    });
+    return next({
+      status: 500,
+      message: 'Unable to retrieve keyword search results.',
+    });
+  }
+});
+
+searchRoutes.get('/company', async (req, res, next) => {
+  const tmdb = new TheMovieDb();
+
+  try {
+    const results = await tmdb.searchCompany({
+      query: req.query.query as string,
+      page: Number(req.query.page),
+    });
+
+    return res.status(200).json(results);
+  } catch (e) {
+    logger.debug('Something went wrong retrieving company search results', {
+      label: 'API',
+      errorMessage: e.message,
+      query: req.query.query,
+    });
+    return next({
+      status: 500,
+      message: 'Unable to retrieve company search results.',
+    });
+  }
+});
+
 export default searchRoutes;

server/routes/settings/discover.ts

@@ -0,0 +1,100 @@
+import { getRepository } from '@server/datasource';
+import DiscoverSlider from '@server/entity/DiscoverSlider';
+import logger from '@server/logger';
+import { Router } from 'express';
+
+const discoverSettingRoutes = Router();
+
+discoverSettingRoutes.post('/', async (req, res) => {
+  const sliderRepository = getRepository(DiscoverSlider);
+
+  const sliders = req.body as DiscoverSlider[];
+
+  if (!Array.isArray(sliders)) {
+    return res.status(400).json({ message: 'Invalid request body.' });
+  }
+
+  for (let x = 0; x < sliders.length; x++) {
+    const slider = sliders[x];
+    const existingSlider = await sliderRepository.findOne({
+      where: {
+        id: slider.id,
+      },
+    });
+
+    if (existingSlider && slider.id) {
+      existingSlider.enabled = slider.enabled;
+      existingSlider.order = x;
+
+      // Only allow changes to the following when the slider is not built in
+      if (!existingSlider.isBuiltIn) {
+        existingSlider.title = slider.title;
+        existingSlider.data = slider.data;
+        existingSlider.type = slider.type;
+      }
+
+      await sliderRepository.save(existingSlider);
+    } else {
+      const newSlider = new DiscoverSlider({
+        isBuiltIn: false,
+        data: slider.data,
+        title: slider.title,
+        enabled: slider.enabled,
+        order: x,
+        type: slider.type,
+      });
+      await sliderRepository.save(newSlider);
+    }
+  }
+
+  return res.json(sliders);
+});
+
+discoverSettingRoutes.post('/add', async (req, res) => {
+  const sliderRepository = getRepository(DiscoverSlider);
+
+  const slider = req.body as DiscoverSlider;
+
+  const newSlider = new DiscoverSlider({
+    isBuiltIn: false,
+    data: slider.data,
+    title: slider.title,
+    enabled: false,
+    order: -1,
+    type: slider.type,
+  });
+  await sliderRepository.save(newSlider);
+
+  return res.json(newSlider);
+});
+
+discoverSettingRoutes.get('/reset', async (_req, res) => {
+  const sliderRepository = getRepository(DiscoverSlider);
+
+  await sliderRepository.clear();
+  await DiscoverSlider.bootstrapSliders();
+
+  return res.status(204).send();
+});
+
+discoverSettingRoutes.delete('/:sliderId', async (req, res, next) => {
+  const sliderRepository = getRepository(DiscoverSlider);
+
+  try {
+    const slider = await sliderRepository.findOneOrFail({
+      where: { id: Number(req.params.sliderId), isBuiltIn: false },
+    });
+
+    await sliderRepository.remove(slider);
+
+    return res.status(204).send();
+  } catch (e) {
+    logger.error('Something went wrong deleting a slider.', {
+      label: 'API',
+      errorMessage: e.message,
+    });
+    next({ status: 404, message: 'Slider not found or cannot be deleted.' });
+  }
+});
+
+export default discoverSettingRoutes;

server/routes/settings/index.ts

@@ -21,6 +21,7 @@ import type { JobId, MainSettings } from '@server/lib/settings';
 import { getSettings } from '@server/lib/settings';
 import logger from '@server/logger';
 import { isAuthenticated } from '@server/middleware/auth';
+import discoverSettingRoutes from '@server/routes/settings/discover';
 import { appDataPath } from '@server/utils/appDataVolume';
 import { getAppVersion } from '@server/utils/appVersion';
 import { Router } from 'express';
@@ -40,6 +41,7 @@ const settingsRoutes = Router();
 settingsRoutes.use('/notifications', notificationRoutes);
 settingsRoutes.use('/radarr', radarrRoutes);
 settingsRoutes.use('/sonarr', sonarrRoutes);
+settingsRoutes.use('/discover', discoverSettingRoutes);
 
 const filteredMainSettings = (
   user: User,