diff --git a/frontend/src/Movie/Details/MovieDetailsLinks.tsx b/frontend/src/Movie/Details/MovieDetailsLinks.tsx
index 4e15ebc9a..03d9f1baf 100644
--- a/frontend/src/Movie/Details/MovieDetailsLinks.tsx
+++ b/frontend/src/Movie/Details/MovieDetailsLinks.tsx
@@ -2,14 +2,14 @@ import React from 'react';
import Label from 'Components/Label';
import Link from 'Components/Link/Link';
import { kinds, sizes } from 'Helpers/Props';
+import Movie from 'Movie/Movie';
import translate from 'Utilities/String/translate';
import styles from './MovieDetailsLinks.css';
-interface MovieDetailsLinksProps {
- tmdbId: number;
- imdbId?: string;
- youTubeTrailerId?: string;
-}
+type MovieDetailsLinksProps = Pick<
+ Movie,
+ 'tmdbId' | 'imdbId' | 'youTubeTrailerId'
+>;
function MovieDetailsLinks(props: MovieDetailsLinksProps) {
const { tmdbId, imdbId, youTubeTrailerId } = props;
@@ -56,27 +56,43 @@ function MovieDetailsLinks(props: MovieDetailsLinksProps) {
{imdbId ? (
-
-
-
- ) : null}
+
+
- {imdbId ? (
-
-
-
+
+ MDBList
+
+
+ >
) : null}
{youTubeTrailerId ? (
diff --git a/frontend/src/Movie/Movie.ts b/frontend/src/Movie/Movie.ts
index 2d87bd53e..69cc76c0b 100644
--- a/frontend/src/Movie/Movie.ts
+++ b/frontend/src/Movie/Movie.ts
@@ -41,10 +41,10 @@ export interface Ratings {
interface Movie extends ModelBase {
tmdbId: number;
- imdbId: string;
+ imdbId?: string;
sortTitle: string;
overview: string;
- youTubeTrailerId: string;
+ youTubeTrailerId?: string;
monitored: boolean;
status: MovieStatus;
title: string;