From 5c3fda48f70d783303f13b92490df42dcfae2225 Mon Sep 17 00:00:00 2001
From: Qstick <qstick@gmail.com>
Date: Fri, 1 Nov 2019 23:16:52 -0400
Subject: [PATCH] New: Custom Formats on Movie Details File Tab

---
 frontend/src/MovieFile/Editor/MovieFileEditorRow.css     | 1 +
 frontend/src/MovieFile/Editor/MovieFileEditorRow.js      | 9 +++++++++
 .../src/MovieFile/Editor/MovieFileEditorTableContent.js  | 9 ++++++++-
 3 files changed, 18 insertions(+), 1 deletion(-)

diff --git a/frontend/src/MovieFile/Editor/MovieFileEditorRow.css b/frontend/src/MovieFile/Editor/MovieFileEditorRow.css
index 6393d7193..2c849aece 100644
--- a/frontend/src/MovieFile/Editor/MovieFileEditorRow.css
+++ b/frontend/src/MovieFile/Editor/MovieFileEditorRow.css
@@ -5,6 +5,7 @@
 }
 
 .quality,
+.formats,
 .language {
   composes: cell from '~Components/Table/Cells/TableRowCell.css';
 }
diff --git a/frontend/src/MovieFile/Editor/MovieFileEditorRow.js b/frontend/src/MovieFile/Editor/MovieFileEditorRow.js
index 8a8df4f0e..bd8e38553 100644
--- a/frontend/src/MovieFile/Editor/MovieFileEditorRow.js
+++ b/frontend/src/MovieFile/Editor/MovieFileEditorRow.js
@@ -7,6 +7,7 @@ import TableRow from 'Components/Table/TableRow';
 import TableRowCell from 'Components/Table/Cells/TableRowCell';
 import TableRowCellButton from 'Components/Table/Cells/TableRowCellButton';
 import MovieQuality from 'Movie/MovieQuality';
+import MovieFormats from 'Movie/MovieFormats';
 import MovieLanguage from 'Movie/MovieLanguage';
 import ConfirmModal from 'Components/Modal/ConfirmModal';
 import Icon from 'Components/Icon';
@@ -160,6 +161,14 @@ class MovieFileEditorRow extends Component {
           }
         </TableRowCellButton>
 
+        <TableRowCell
+          className={styles.formats}
+        >
+          <MovieFormats
+            formats={quality.customFormats}
+          />
+        </TableRowCell>
+
         <TableRowCell className={styles.actions}>
           <Popover
             anchor={
diff --git a/frontend/src/MovieFile/Editor/MovieFileEditorTableContent.js b/frontend/src/MovieFile/Editor/MovieFileEditorTableContent.js
index e8cd41e4f..65086aef5 100644
--- a/frontend/src/MovieFile/Editor/MovieFileEditorTableContent.js
+++ b/frontend/src/MovieFile/Editor/MovieFileEditorTableContent.js
@@ -1,5 +1,7 @@
 import PropTypes from 'prop-types';
 import React, { Component } from 'react';
+import { icons } from 'Helpers/Props';
+import Icon from 'Components/Icon';
 import Table from 'Components/Table/Table';
 import TableBody from 'Components/Table/TableBody';
 import MovieFileEditorRow from './MovieFileEditorRow';
@@ -36,9 +38,14 @@ const columns = [
     label: 'Quality',
     isVisible: true
   },
+  {
+    name: 'quality.customFormats',
+    label: 'Formats',
+    isVisible: true
+  },
   {
     name: 'action',
-    label: 'Action',
+    label: React.createElement(Icon, { name: icons.ADVANCED_SETTINGS }),
     isVisible: true
   }
 ];