Fix: Address issue when runtime is under 1 hour and it falls back to 12h.

New: Update time column on Movie > Index > Table to show hour minutes instead of only minutes

frontend/src/Movie/Details/MovieDetails.js

@@ -1,5 +1,4 @@
 import _ from 'lodash';
-import moment from 'moment';
 import PropTypes from 'prop-types';
 import React, { Component } from 'react';
 import { Tab, TabList, TabPanel, Tabs } from 'react-tabs';
@@ -32,6 +31,7 @@ import ExtraFileTable from 'MovieFile/Extras/ExtraFileTable';
 import OrganizePreviewModalConnector from 'Organize/OrganizePreviewModalConnector';
 import QualityProfileNameConnector from 'Settings/Profiles/Quality/QualityProfileNameConnector';
 import fonts from 'Styles/Variables/fonts';
+import formatRuntime from 'Utilities/Date/formatRuntime';
 import formatBytes from 'Utilities/Number/formatBytes';
 import translate from 'Utilities/String/translate';
 import selectAll from 'Utilities/Table/selectAll';
@@ -282,7 +282,6 @@ class MovieDetails extends Component {
     } = this.state;
 
     const marqueeWidth = isSmallScreen ? titleWidth : (titleWidth - 150);
-    const friendlyRuntime = moment.utc((runtime * 60) * 1000).format('h[h] m[m]');
 
     return (
       <PageContent title={title}>
@@ -427,7 +426,7 @@ class MovieDetails extends Component {
                     {
                       !!runtime &&
                         <span className={styles.runtime}>
-                          {friendlyRuntime}
+                          {formatRuntime(runtime)}
                         </span>
                     }
 

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

@@ -15,6 +15,7 @@ import MovieDetailsLinks from 'Movie/Details/MovieDetailsLinks';
 import EditMovieModalConnector from 'Movie/Edit/EditMovieModalConnector';
 import MovieFileStatusConnector from 'Movie/MovieFileStatusConnector';
 import MovieTitleLink from 'Movie/MovieTitleLink';
+import formatRuntime from 'Utilities/Date/formatRuntime';
 import formatBytes from 'Utilities/Number/formatBytes';
 import titleCase from 'Utilities/String/titleCase';
 import MovieStatusCell from './MovieStatusCell';
@@ -251,7 +252,7 @@ class MovieIndexRow extends Component {
                   key={name}
                   className={styles[name]}
                 >
-                  {runtime} Minutes
+                  {formatRuntime(runtime)}
                 </VirtualTableRowCell>
               );
             }

frontend/src/Utilities/Date/formatRuntime.js

@@ -0,0 +1,13 @@
+function formatRuntime(minutes) {
+  if (!minutes) {
+    return '0m';
+  }
+
+  const movieHours = Math.floor(minutes / 60);
+  const movieMinutes = (minutes <= 59) ? minutes : minutes % 60;
+  const formattedRuntime = `${((movieHours > 0) ? `${movieHours}h ` : '') + movieMinutes}m`;
+
+  return formattedRuntime;
+}
+
+export default formatRuntime;