New: Added Mediainfo Video Dynamic Range column for movies

(cherry picked from commit ae0e23fc8ee450a20b43ca622eeccd0759451a2f)

Closes #7247

frontend/src/MovieFile/Editor/MovieFileEditorRow.css

@@ -38,6 +38,7 @@
 }
 
 .audioLanguages,
+.videoDynamicRangeType,
 .subtitles {
   composes: cell from '~Components/Table/Cells/TableRowCell.css';
 

frontend/src/MovieFile/Editor/MovieFileEditorRow.css.d.ts

@@ -17,6 +17,7 @@ interface CssExports {
   'size': string;
   'subtitles': string;
   'video': string;
+  'videoDynamicRangeType': string;
 }
 export const cssExports: CssExports;
 export default cssExports;

frontend/src/MovieFile/Editor/MovieFileEditorRow.js

@@ -201,8 +201,8 @@ class MovieFileEditorRow extends Component {
                   className={styles.audio}
                 >
                   <MediaInfoConnector
-                    movieFileId={id}
                     type={mediaInfoTypes.AUDIO}
+                    movieFileId={id}
                   />
                 </TableRowCell>
               );
@@ -243,8 +243,22 @@ class MovieFileEditorRow extends Component {
                   className={styles.video}
                 >
                   <MediaInfoConnector
-                    movieFileId={id}
                     type={mediaInfoTypes.VIDEO}
+                    movieFileId={id}
+                  />
+                </TableRowCell>
+              );
+            }
+
+            if (name === 'videoDynamicRangeType') {
+              return (
+                <TableRowCell
+                  key={name}
+                  className={styles.videoDynamicRangeType}
+                >
+                  <MediaInfoConnector
+                    type={mediaInfoTypes.VIDEO_DYNAMIC_RANGE_TYPE}
+                    movieFileId={id}
                   />
                 </TableRowCell>
               );

frontend/src/MovieFile/MediaInfo.js

@@ -42,7 +42,8 @@ function MediaInfo(props) {
     audioCodec,
     audioLanguages,
     subtitles,
-    videoCodec
+    videoCodec,
+    videoDynamicRangeType
   } = props;
 
   if (type === mediaInfoTypes.AUDIO) {
@@ -79,6 +80,14 @@ function MediaInfo(props) {
     );
   }
 
+  if (type === mediaInfoTypes.VIDEO_DYNAMIC_RANGE_TYPE) {
+    return (
+      <span>
+        {videoDynamicRangeType}
+      </span>
+    );
+  }
+
   return null;
 }
 
@@ -88,7 +97,8 @@ MediaInfo.propTypes = {
   audioCodec: PropTypes.string,
   audioLanguages: PropTypes.string,
   subtitles: PropTypes.string,
-  videoCodec: PropTypes.string
+  videoCodec: PropTypes.string,
+  videoDynamicRangeType: PropTypes.string
 };
 
 export default MediaInfo;

frontend/src/MovieFile/mediaInfoTypes.js

@@ -2,3 +2,4 @@ export const AUDIO = 'audio';
 export const AUDIO_LANGUAGES = 'audioLanguages';
 export const SUBTITLES = 'subtitles';
 export const VIDEO = 'video';
+export const VIDEO_DYNAMIC_RANGE_TYPE = 'videoDynamicRangeType';

frontend/src/Store/Actions/movieFileActions.js

@@ -44,6 +44,11 @@ export const defaultState = {
       label: () => translate('VideoCodec'),
       isVisible: true
     },
+    {
+      name: 'videoDynamicRangeType',
+      label: () => translate('VideoDynamicRange'),
+      isVisible: false
+    },
     {
       name: 'audioInfo',
       label: () => translate('AudioInfo'),