19783: Review updates
[arvados-workbench2.git] / src / views-components / details-panel / file-details.tsx
index 7d43bd4b3b331448668817c38f8e552553e33da6..7b128c2cbd97e7ee739cc2f99825e5716fdfb412 100644 (file)
@@ -2,13 +2,14 @@
 //
 // SPDX-License-Identifier: AGPL-3.0
 
-import * as React from 'react';
+import React from 'react';
 import { DetailsData } from "./details-data";
-import { CollectionFile, CollectionDirectory, CollectionFileType } from '~/models/collection-file';
-import { getIcon } from '~/components/file-tree/file-tree-item';
-import { DetailsAttribute } from '~/components/details-attribute/details-attribute';
-import { formatFileSize } from '~/common/formatters';
-import { FileThumbnail } from '~/components/file-tree/file-thumbnail';
+import { CollectionFile, CollectionDirectory, CollectionFileType } from 'models/collection-file';
+import { getIcon } from 'components/file-tree/file-tree-item';
+import { DetailsAttribute } from 'components/details-attribute/details-attribute';
+import { formatFileSize } from 'common/formatters';
+import { FileThumbnail } from 'components/file-tree/file-thumbnail';
+import isImage from 'is-image';
 
 export class FileDetails extends DetailsData<CollectionFile | CollectionDirectory> {
 
@@ -17,13 +18,17 @@ export class FileDetails extends DetailsData<CollectionFile | CollectionDirector
         return <Icon className={className} />;
     }
 
-    getDetails() {
+    getDetails({showPreview}) {
         const { item } = this;
         return item.type === CollectionFileType.FILE
             ? <>
                 <DetailsAttribute label='Size' value={formatFileSize(item.size)} />
-                <DetailsAttribute label='Preview' />
-                <FileThumbnail file={item}/>
+                {
+                    isImage(item.url) && showPreview && <>
+                        <DetailsAttribute label='Preview' />
+                        <FileThumbnail file={item} />
+                    </>
+                }
             </>
             : <div />;
     }