diff --git a/server/api/themoviedb/index.ts b/server/api/themoviedb/index.ts index bcfc06bb..b6421edd 100644 --- a/server/api/themoviedb/index.ts +++ b/server/api/themoviedb/index.ts @@ -242,7 +242,7 @@ class TheMovieDb extends ExternalAPI { params: { language, append_to_response: - 'credits,external_ids,videos,release_dates,watch/providers', + 'credits,external_ids,videos,keywords,release_dates,watch/providers', }, }, 43200 diff --git a/server/api/themoviedb/interfaces.ts b/server/api/themoviedb/interfaces.ts index a3515416..9a07d769 100644 --- a/server/api/themoviedb/interfaces.ts +++ b/server/api/themoviedb/interfaces.ts @@ -171,6 +171,9 @@ export interface TmdbMovieDetails { id: number; results?: { [iso_3166_1: string]: TmdbWatchProviders }; }; + keywords: { + keywords: TmdbKeyword[]; + }; } export interface TmdbVideo { diff --git a/server/models/Movie.ts b/server/models/Movie.ts index 3c4686b2..19f812dd 100644 --- a/server/models/Movie.ts +++ b/server/models/Movie.ts @@ -9,6 +9,7 @@ import type { Crew, ExternalIds, Genre, + Keyword, ProductionCompany, WatchProviders, } from './common'; @@ -83,6 +84,7 @@ export interface MovieDetails { externalIds: ExternalIds; plexUrl?: string; watchProviders?: WatchProviders[]; + keywords: Keyword[]; } export const mapProductionCompany = ( @@ -142,4 +144,8 @@ export const mapMovieDetails = ( externalIds: mapExternalIds(movie.external_ids), mediaInfo: media, watchProviders: mapWatchProviders(movie['watch/providers']?.results ?? {}), + keywords: movie.keywords.keywords.map((keyword) => ({ + id: keyword.id, + name: keyword.name, + })), }); diff --git a/src/components/Common/Tag/index.tsx b/src/components/Common/Tag/index.tsx new file mode 100644 index 00000000..9a24c149 --- /dev/null +++ b/src/components/Common/Tag/index.tsx @@ -0,0 +1,16 @@ +import { TagIcon } from '@heroicons/react/24/outline'; + +type TagProps = { + content: string; +}; + +const Tag = ({ content }: TagProps) => { + return ( +