1 // Copyright (C) The Arvados Authors. All rights reserved.
3 // SPDX-License-Identifier: AGPL-3.0
5 import * as React from 'react';
6 import { ReactElement } from 'react';
7 import { StyleRulesCallback, Theme, WithStyles, withStyles } from '@material-ui/core/styles';
8 import ListItemText from "@material-ui/core/ListItemText/ListItemText";
9 import ListItemIcon from '@material-ui/core/ListItemIcon';
10 import Typography from '@material-ui/core/Typography';
12 import Tree, { TreeItem } from '../tree/tree';
13 import { Project } from '../../models/project';
15 type CssRules = 'active' | 'row' | 'treeContainer';
17 const styles: StyleRulesCallback<CssRules> = (theme: Theme) => ({
35 interface WorkbenchProps {
36 projects: Array<TreeItem<Project>>;
37 toggleProjectTreeItem: (id: string) => any;
40 class ProjectTree<T> extends React.Component<WorkbenchProps & WithStyles<CssRules>> {
41 render(): ReactElement<any> {
42 const {classes, projects} = this.props;
44 <div className={classes.treeContainer}>
45 <Tree items={projects}
46 toggleItem={this.props.toggleProjectTreeItem}
47 render={(project: TreeItem<Project>) => <span className={classes.row}>
48 <div><ListItemIcon className={project.active ? classes.active : ''}>{project.data.icon}</ListItemIcon></div>
49 <div><ListItemText primary={<Typography className={project.active ? classes.active : ''}>{project.data.name}</Typography>} /></div>
56 export default withStyles(styles)(ProjectTree)