refactored conditional rendering of thumbnail component

public/bundle/bundle.js

@@ -18749,16 +18749,12 @@ var PublishDetails = function (_React$Component6) {
   function PublishDetails(props) {
     _classCallCheck(this, PublishDetails);
 
+    // set defaults
     var _this6 = _possibleConstructorReturn(this, (PublishDetails.__proto__ || Object.getPrototypeOf(PublishDetails)).call(this, props));
 
-    _this6.state = {
+    _this6.updateUploaderState = _this6.updateUploaderState.bind(_this6);
-      showThumbnailSelector: false
-      // set defaults
-    };_this6.updateUploaderState = _this6.updateUploaderState.bind(_this6);
-    _this6.showThumbnailTool = _this6.showThumbnailTool.bind(_this6);
-    _this6.hideThumbnailTool = _this6.hideThumbnailTool.bind(_this6);
-    _this6.publish = _this6.publish.bind(_this6);
     _this6.clearUploaderState = _this6.clearUploaderState.bind(_this6);
+    _this6.publish = _this6.publish.bind(_this6);
     return _this6;
   }
 
@@ -18768,25 +18764,15 @@ var PublishDetails = function (_React$Component6) {
       this.props.updateUploaderState(name, value);
     }
   }, {
-    key: 'showThumbnailTool',
+    key: 'clearUploaderState',
-    value: function showThumbnailTool() {
+    value: function clearUploaderState() {
-      this.setState({ showThumbnailSelector: true });
+      this.props.clearUploaderState();
-    }
-  }, {
-    key: 'hideThumbnailTool',
-    value: function hideThumbnailTool() {
-      this.setState({ showThumbnailSelector: false });
     }
   }, {
     key: 'publish',
     value: function publish() {
       // publish the asset
     }
-  }, {
-    key: 'clearUploaderState',
-    value: function clearUploaderState() {
-      this.props.clearUploaderState();
-    }
   }, {
     key: 'render',
     value: function render() {
@@ -18805,9 +18791,7 @@ var PublishDetails = function (_React$Component6) {
             'div',
             { className: 'row row--padded' },
             _react2.default.createElement(_preview2.default, {
-              file: this.props.file,
+              file: this.props.file
-              hideThumbnailTool: this.hideThumbnailTool,
-              showThumbnailTool: this.showThumbnailTool
             })
           )
         ),
@@ -18819,7 +18803,7 @@ var PublishDetails = function (_React$Component6) {
             { id: 'publish-active-area', className: 'row row--padded' },
             _react2.default.createElement(Channel, null),
             _react2.default.createElement(Url, { file: this.props.file }),
-            this.state.showThumbnailSelector && _react2.default.createElement(Thumbnail, { thumbnail: this.props.thumbnail }),
+            this.props.file.type === 'video/mp4' && _react2.default.createElement(Thumbnail, { thumbnail: this.props.thumbnail }),
             _react2.default.createElement(Details, null),
             _react2.default.createElement(
               'div',
@@ -18924,12 +18908,8 @@ var Preview = function (_React$Component) {
         previewReader.onloadend = function () {
           that.setState({ previewSource: previewReader.result });
         };
-        // clear & hide the thumbnail selection input
-        this.props.hideThumbnailTool();
       } else {
         that.setState({ previewSource: '/assets/img/video_thumb_default.png' });
-        // clear & show the thumbnail selection input
-        this.props.showThumbnailTool();
       }
     }
   }, {

react/components/preview.jsx

@@ -21,12 +21,8 @@ class Preview extends React.Component {
       previewReader.onloadend = function () {
         that.setState({previewSource: previewReader.result});
       };
-      // clear & hide the thumbnail selection input
-      this.props.hideThumbnailTool();
     } else {
       that.setState({previewSource: '/assets/img/video_thumb_default.png'});
-      // clear & show the thumbnail selection input
-      this.props.showThumbnailTool();
     }
   }
   render () {

react/components/publishDetails.jsx

@@ -62,31 +62,20 @@ class Details extends React.Component {
 class PublishDetails extends React.Component {
   constructor (props) {
     super(props);
-    this.state = {
-      showThumbnailSelector: false,
-    }
     // set defaults
     this.updateUploaderState = this.updateUploaderState.bind(this);
-    this.showThumbnailTool = this.showThumbnailTool.bind(this);
-    this.hideThumbnailTool = this.hideThumbnailTool.bind(this);
-    this.publish = this.publish.bind(this);
     this.clearUploaderState = this.clearUploaderState.bind(this);
+    this.publish = this.publish.bind(this);
   }
   updateUploaderState (name, value) {
     this.props.updateUploaderState(name, value);
   }
-  showThumbnailTool () {
+  clearUploaderState () {
-    this.setState({showThumbnailSelector: true});
+    this.props.clearUploaderState();
-  }
-  hideThumbnailTool () {
-    this.setState({showThumbnailSelector: false});
   }
   publish () {
     // publish the asset
   }
-  clearUploaderState () {
-    this.props.clearUploaderState();
-  }
   render () {
     return (
       <div className="row row--no-bottom">
@@ -97,8 +86,6 @@ class PublishDetails extends React.Component {
           <div className="row row--padded">
             <Preview
               file={this.props.file}
-              hideThumbnailTool={this.hideThumbnailTool}
-              showThumbnailTool={this.showThumbnailTool}
             />
           </div>
         </div>
@@ -106,7 +93,7 @@ class PublishDetails extends React.Component {
           <div id="publish-active-area" className="row row--padded">
             <Channel />
             <Url file={this.props.file}/>
-            { this.state.showThumbnailSelector && <Thumbnail thumbnail={this.props.thumbnail}/> }
+            { (this.props.file.type === 'video/mp4') && <Thumbnail thumbnail={this.props.thumbnail}/> }
             <Details />
 
             <div className="row row--padded row--wide">