src/views-components/details-panel/file-details.tsx

   1 // Copyright (C) The Arvados Authors. All rights reserved.
   2 //
   3 // SPDX-License-Identifier: AGPL-3.0
   4
   5 import * as React from 'react';
   6 import { DetailsData } from "./details-data";
   7 import { CollectionFile, CollectionDirectory, CollectionFileType } from '~/models/collection-file';
   8 import { getIcon } from '~/components/file-tree/file-tree-item';
   9 import { DetailsAttribute } from '~/components/details-attribute/details-attribute';
  10 import { formatFileSize } from '~/common/formatters';
  11 import { FileThumbnail } from '~/components/file-tree/file-thumbnail';
  12
  13 export class FileDetails extends DetailsData<CollectionFile | CollectionDirectory> {
  14
  15     getIcon(className?: string) {
  16         const Icon = getIcon(this.item.type);
  17         return <Icon className={className} />;
  18     }
  19
  20     getDetails() {
  21         const { item } = this;
  22         return item.type === CollectionFileType.FILE
  23             ? <>
  24                 <DetailsAttribute label='Size' value={formatFileSize(item.size)} />
  25                 <DetailsAttribute label='Preview' />
  26                 <FileThumbnail file={item}/>
  27             </>
  28             : <div />;
  29     }
  30 }