src/components/icon/icon.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 * as classnames from "classnames";
   7 import CloseAnnouncement from '@material-ui/icons/Announcement';
   8 import CloseIcon from '@material-ui/icons/Close';
   9 import FolderIcon from '@material-ui/icons/Folder';
  10
  11 export enum IconTypes {
  12     ANNOUNCEMENT = 'announcement',
  13     FOLDER = 'folder',
  14     CLOSE = 'close',
  15     PROJECT  = 'project',
  16     COLLECTION = 'collection',
  17     PROCESS = 'process'
  18 }
  19
  20 interface IconBaseDataProps {
  21     icon: IconTypes;
  22     className?: string;
  23 }
  24
  25 type IconBaseProps = IconBaseDataProps;
  26
  27 interface IconBaseState {
  28     icon: IconTypes;
  29 }
  30
  31 const getSpecificIcon = (props: any) => ({
  32     announcement: <CloseAnnouncement className={props.className} />,
  33     folder: <FolderIcon className={props.className} />,
  34     close: <CloseIcon className={props.className} />,
  35     project: <i className={classnames([props.className, 'fas fa-folder fa-lg'])} />,
  36     collection: <i className={classnames([props.className, 'fas fa-archive fa-lg'])} />,
  37     process: <i className={classnames([props.className, 'fas fa-cogs fa-lg'])} />
  38 });
  39
  40 class IconBase extends React.Component<IconBaseProps, IconBaseState> {
  41     state = {
  42         icon: IconTypes.FOLDER,
  43     };
  44
  45     render() {
  46         return getSpecificIcon(this.props)[this.props.icon];
  47     }
  48 }
  49
  50 export default IconBase;