New: Runtime Column/Filter on Movie Index

Fixes #4131

frontend/src/Movie/Index/Table/MovieIndexHeader.css

@@ -32,6 +32,7 @@
 .added,
 .inCinemas,
 .physicalRelease,
+.runtime,
 .genres {
   composes: headerCell from '~Components/Table/VirtualTableHeaderCell.css';
 

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

@@ -39,6 +39,7 @@
 .added,
 .inCinemas,
 .physicalRelease,
+.runtime,
 .genres {
   composes: cell;
 

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

@@ -71,6 +71,7 @@ class MovieIndexRow extends Component {
       added,
       inCinemas,
       physicalRelease,
+      runtime,
       minimumAvailability,
       path,
       sizeOnDisk,
@@ -212,6 +213,17 @@ class MovieIndexRow extends Component {
               );
             }
 
+            if (name === 'runtime') {
+              return (
+                <VirtualTableRowCell
+                  key={name}
+                  className={styles[name]}
+                >
+                  {runtime} Minutes
+                </VirtualTableRowCell>
+              );
+            }
+
             if (name === 'minimumAvailability') {
               return (
                 <VirtualTableRowCell
@@ -376,6 +388,7 @@ MovieIndexRow.propTypes = {
   added: PropTypes.string,
   inCinemas: PropTypes.string,
   physicalRelease: PropTypes.string,
+  runtime: PropTypes.number,
   minimumAvailability: PropTypes.string.isRequired,
   path: PropTypes.string.isRequired,
   sizeOnDisk: PropTypes.number.isRequired,

frontend/src/Store/Actions/movieIndexActions.js

@@ -114,6 +114,12 @@ export const defaultState = {
       isSortable: true,
       isVisible: false
     },
+    {
+      name: 'runtime',
+      label: 'Runtime',
+      isSortable: true,
+      isVisible: false
+    },
     {
       name: 'minimumAvailability',
       label: 'Min Availability',
@@ -272,6 +278,11 @@ export const defaultState = {
       type: filterBuilderTypes.DATE,
       valueType: filterBuilderValueTypes.DATE
     },
+    {
+      name: 'runtime',
+      label: 'Runtime',
+      type: filterBuilderTypes.NUMBER
+    },
     {
       name: 'path',
       label: 'Path',