import Typography from '@material-ui/core/Typography';
import { WithStyles, withStyles, StyleRulesCallback } from '@material-ui/core/styles';
import { ArvadosTheme } from 'src/common/custom-theme';
-import IconBase from '../icon/icon';
+import IconBase, { IconTypes } from '../icon/icon';
export interface EmptyStateDataProps {
message: string;
- icon: string;
+ icon: IconTypes;
details?: string;
}
import CloseIcon from '@material-ui/icons/Close';
import FolderIcon from '@material-ui/icons/Folder';
+export enum IconTypes {
+ ANNOUNCEMENT = 'announcement',
+ FOLDER = 'folder',
+ CLOSE = 'close',
+ PROJECT = 'project',
+ COLLECTION = 'collection',
+ PROCESS = 'process'
+}
+
interface IconBaseDataProps {
- icon: string;
+ icon: IconTypes;
className?: string;
}
type IconBaseProps = IconBaseDataProps;
interface IconBaseState {
- icon: string;
+ icon: IconTypes;
}
const getSpecificIcon = (props: any) => ({
class IconBase extends React.Component<IconBaseProps, IconBaseState> {
state = {
- icon: '',
+ icon: IconTypes.FOLDER,
};
render() {
import Grid from '@material-ui/core/Grid';
import * as classnames from "classnames";
import EmptyState from '../../components/empty-state/empty-state';
-import IconBase from '../../components/icon/icon';
+import IconBase, { IconTypes } from '../../components/icon/icon';
export interface DetailsPanelDataProps {
onCloseDrawer: () => void;
<Grid container alignItems='center' justify='space-around'>
{renderHeader}
{/* TODO: renderHeader */}
- <IconBase icon='process' />
+ <IconBase icon={IconTypes.PROCESS} />
<Typography variant="title">
Tutorial pipeline
</Typography>
{/* End */}
<IconButton color="inherit" onClick={onCloseDrawer}>
- <IconBase icon='close' />
+ <IconBase icon={IconTypes.CLOSE} />
</IconButton>
</Grid>
</Typography>
{tabsValue === 0 && this.renderTabContainer(
<Grid container direction="column">
{renderDetails}
- <EmptyState icon='announcement'
+ <EmptyState icon={IconTypes.ANNOUNCEMENT}
message='Select a file or folder to view its details.' />
<Attribute label='Type' value='Process' />
<Attribute label='Size' value='---' />
<Attribute label="Location">
- <IconBase icon='folder' />
+ <IconBase icon={IconTypes.FOLDER} />
Projects
</Attribute>
<Attribute label='Outputs' link='http://www.google.pl' value='New output as link' />
{tabsValue === 1 && this.renderTabContainer(
<Grid container direction="column">
{renderActivity}
- <EmptyState icon='announcement' message='Select a file or folder to view its details.' />
+ <EmptyState icon={IconTypes.ANNOUNCEMENT} message='Select a file or folder to view its details.' />
</Grid>
)}
</Drawer>