NEW Provide isPreviewable from data model to component, allowing diff…

…erent rendering by model
silverstripe · Apr 30, 2018 · 7721e67 · 7721e67
1 parent f428fcc
commit 7721e67
Show file tree

Hide file tree

Showing 6 changed files with 68 additions and 21 deletions.
diff --git a/client/dist/js/bundle.js b/client/dist/js/bundle.js
diff --git a/client/src/components/HistoryViewer/HistoryViewer.js b/client/src/components/HistoryViewer/HistoryViewer.js
@@ -95,6 +95,7 @@ class HistoryViewer extends Component {
   renderVersionDetail() {
     const {
       currentVersion,
+      isPreviewable,
       recordId,
       recordClass,
       schemaUrl,
@@ -109,6 +110,7 @@ class HistoryViewer extends Component {
     };
 
     const props = {
+      isPreviewable,
       schemaUrl: schemaUrl.replace(/:id|:class|:version/g, (match) => schemaReplacements[match]),
       version: this.getVersions().filter((version) => version.Version === currentVersion)[0],
     };
@@ -169,11 +171,11 @@ class HistoryViewer extends Component {
    * @returns {HistoryViewerVersionList}
    */
   renderVersionList() {
-    const { ListComponent, onSelect } = this.props;
+    const { isPreviewable, ListComponent, onSelect } = this.props;
 
     return (
       <div className="history-viewer fill-height">
-        <div className="panel panel--padded panel--scrollable">
+        <div className={isPreviewable ? 'panel panel--padded panel--scrollable' : ''}>
           <ListComponent
             onSelect={onSelect}
             versions={this.getVersions()}
@@ -208,6 +210,7 @@ HistoryViewer.propTypes = {
   offset: PropTypes.number,
   recordId: PropTypes.number.isRequired,
   currentVersion: PropTypes.number,
+  isPreviewable: PropTypes.bool,
   VersionDetailComponent: PropTypes.oneOfType([PropTypes.node, PropTypes.func]).isRequired,
   versions: PropTypes.shape({
     Versions: PropTypes.shape({
@@ -227,6 +230,7 @@ HistoryViewer.propTypes = {
 
 HistoryViewer.defaultProps = {
   currentVersion: 0,
+  isPreviewable: false,
   schemaUrl: '',
   versions: {
     Versions: {

diff --git a/client/src/components/HistoryViewer/HistoryViewerVersionDetail.js b/client/src/components/HistoryViewer/HistoryViewerVersionDetail.js
@@ -15,24 +15,58 @@ class HistoryViewerVersionDetail extends PureComponent {
     this.toggleToolbarClass();
   }
 
+  /**
+   * If the preview panel is enabled, return the component
+   *
+   * @returns {Preview|null}
+   */
+  getPreview() {
+    const { version, isPreviewable } = this.props;
+
+    if (!isPreviewable) {
+      return null;
+    }
+
+    return (
+      <Preview
+        className="history-viewer__preview flexbox-area-grow" // removes default: fill-height
+        itemLinks={{
+          preview: {
+            Stage: {
+              href: `${version.AbsoluteLink}&archiveDate=${version.LastEdited}`,
+              type: 'text/html',
+            },
+          },
+        }}
+        itemId={version.Version}
+      />
+    );
+  }
+
   /**
    * Until the CMS is fully React driven, we must control certain aspects of the CMS DOM with
    * manual CSS tweaks. @todo remove this when React drives the CMS.
    */
   toggleToolbarClass() {
-    document
-      .querySelector('.CMSPageHistoryViewerController div:not(.cms-content-tools) .cms-content-header')
-      .classList
-      .toggle('history-viewer__toolbar--condensed');
+    const { isPreviewable } = this.props;
+
+    const selector = document
+      .querySelector('.CMSPageHistoryViewerController div:not(.cms-content-tools) .cms-content-header');
+
+    if (selector && isPreviewable) {
+      selector
+        .classList
+        .toggle('history-viewer__toolbar--condensed');
+    }
   }
 
   render() {
-    const { ListComponent, schemaUrl, version } = this.props;
+    const { isPreviewable, ListComponent, schemaUrl, version } = this.props;
 
     return (
       <div className="flexbox-area-grow fill-width">
         <div className="flexbox-area-grow fill-height">
-          <div className="panel panel--padded panel--padded-side panel--scrollable">
+          <div className={isPreviewable ? 'panel panel--padded panel--padded-side panel--scrollable' : ''}>
             <ListComponent
               extraClass="history-viewer__table--current"
               versions={[version]}
@@ -48,29 +82,23 @@ class HistoryViewerVersionDetail extends PureComponent {
           </div>
         </div>
 
-        <Preview
-          className="history-viewer__preview" // removes default: fill-height
-          itemLinks={{
-            preview: {
-              Stage: {
-                href: `${version.AbsoluteLink}&archiveDate=${version.LastEdited}`,
-                type: 'text/html',
-              },
-            },
-          }}
-          itemId={version.Version}
-        />
+        {this.getPreview()}
       </div>
     );
   }
 }
 
 HistoryViewerVersionDetail.propTypes = {
+  isPreviewable: PropTypes.bool,
   ListComponent: PropTypes.oneOfType([PropTypes.node, PropTypes.func]).isRequired,
   schemaUrl: React.PropTypes.string.isRequired,
   version: versionType.isRequired,
 };
 
+HistoryViewerVersionDetail.defaultProps = {
+  isPreviewable: false,
+};
+
 export { HistoryViewerVersionDetail as Component };
 
 export default inject(

diff --git a/client/src/legacy/HistoryViewer/HistoryViewerEntwine.js b/client/src/legacy/HistoryViewer/HistoryViewerEntwine.js
@@ -21,6 +21,7 @@ jQuery.entwine('ss', ($) => {
         <HistoryViewerComponent
           recordId={this.data('record-id')}
           recordClass={this.data('record-class')}
+          isPreviewable={!!parseInt(this.data('preview-enabled'), 10)}
           limit={30}
           offset={0}
           page={0}

diff --git a/src/Forms/HistoryViewerField.php b/src/Forms/HistoryViewerField.php
@@ -3,6 +3,7 @@
 namespace SilverStripe\VersionedAdmin\Forms;
 
 use SilverStripe\Forms\FormField;
+use SilverStripe\ORM\CMSPreviewable;
 use SilverStripe\ORM\DataObject;
 use SilverStripe\View\Requirements;
 
@@ -32,4 +33,16 @@ public function getSourceRecord()
     {
         return $this->getForm() ? $this->getForm()->getRecord() : null;
     }
+
+    /**
+     * Get whether the record is previewable
+     *
+     * @return boolean
+     */
+    public function getPreviewEnabled()
+    {
+        $record = $this->getSourceRecord();
+
+        return $record && $record instanceof CMSPreviewable;
+    }
 }
diff --git a/templates/SilverStripe/VersionedAdmin/Forms/HistoryViewerField.ss b/templates/SilverStripe/VersionedAdmin/Forms/HistoryViewerField.ss
@@ -2,6 +2,7 @@
     class="history-viewer__container fill-height"
     data-record-id="{$getSourceRecord.ID}"
     data-record-class="{$getSourceRecord.ClassName}"
+    data-preview-enabled="$PreviewEnabled"
 >
     <%-- Rendered using the HistoryViewer React component --%>
 </div>