Improve warning for missing release dates on movie details page when year is not set

Towards #10569

frontend/src/Movie/Details/MovieDetails.js

@@ -429,26 +429,31 @@ class MovieDetails extends Component {
                         null
                     }
 
-                    {
-                      year > 0 ?
-                        <span className={styles.year}>
-                          <Popover
-                            anchor={
-                              year
-                            }
-                            title={translate('ReleaseDates')}
-                            body={
-                              <MovieReleaseDates
-                                inCinemas={inCinemas}
-                                digitalRelease={digitalRelease}
-                                physicalRelease={physicalRelease}
-                              />
-                            }
-                            position={tooltipPositions.BOTTOM}
+                    <span className={styles.year}>
+                      <Popover
+                        anchor={
+                          year > 0 ? (
+                            year
+                          ) : (
+                            <Icon
+                              name={icons.WARNING}
+                              kind={kinds.WARNING}
+                              size={20}
+                            />
+                          )
+                        }
+                        title={translate('ReleaseDates')}
+                        body={
+                          <MovieReleaseDates
+                            tmdbId={tmdbId}
+                            inCinemas={inCinemas}
+                            digitalRelease={digitalRelease}
+                            physicalRelease={physicalRelease}
                           />
-                        </span> :
-                        null
-                    }
+                        }
+                        position={tooltipPositions.BOTTOM}
+                      />
+                    </span>
 
                     {
                       runtime ?

frontend/src/Movie/Details/MovieReleaseDates.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import { useSelector } from 'react-redux';
 import Icon from 'Components/Icon';
+import InlineMarkdown from 'Components/Markdown/InlineMarkdown';
 import { icons } from 'Helpers/Props';
 import Movie from 'Movie/Movie';
 import createUISettingsSelector from 'Store/Selectors/createUISettingsSelector';
@@ -11,10 +12,11 @@ import styles from './MovieReleaseDates.css';
 
 type MovieReleaseDatesProps = Pick<
   Movie,
-  'inCinemas' | 'digitalRelease' | 'physicalRelease'
+  'tmdbId' | 'inCinemas' | 'digitalRelease' | 'physicalRelease'
 >;
 
 function MovieReleaseDates({
+  tmdbId,
   inCinemas,
   digitalRelease,
   physicalRelease,
@@ -28,7 +30,12 @@ function MovieReleaseDates({
         <div className={styles.dateIcon}>
           <Icon name={icons.MISSING} />
         </div>
-        {translate('NoMovieReleaseDatesAvailable')}
+
+        <InlineMarkdown
+          data={translate('NoMovieReleaseDatesAvailable', {
+            url: `https://www.themoviedb.org/movie/${tmdbId}`,
+          })}
+        />
       </div>
     );
   }

frontend/src/Movie/Index/Table/MovieIndexRow.tsx

@@ -236,7 +236,7 @@ function MovieIndexRow(props: MovieIndexRowProps) {
         if (name === 'year') {
           return (
             <VirtualTableRowCell key={name} className={styles[name]}>
-              {year}
+              {year > 0 ? year : null}
             </VirtualTableRowCell>
           );
         }