X-Git-Url: https://git.arvados.org/arvados-workbench2.git/blobdiff_plain/1a1007b664c6158c905a2fbfa998e7a5737ab7e1..f0ac109691369516a5adf9370838cb4eacf16a45:/src/views-components/project-tree/project-tree.tsx

diff --git a/src/views-components/project-tree/project-tree.tsx b/src/views-components/project-tree/project-tree.tsx
index 411e6dd7..8c1ed330 100644
--- a/src/views-components/project-tree/project-tree.tsx
+++ b/src/views-components/project-tree/project-tree.tsx
@@ -4,37 +4,12 @@
 
 import * as React from 'react';
 import { ReactElement } from 'react';
-import { StyleRulesCallback, Theme, WithStyles, withStyles } from '@material-ui/core/styles';
-import Tree, { TreeItem, TreeItemStatus } from '../../components/tree/tree';
-import { ProjectResource } from '../../models/project';
-import { ProjectIcon } from '../../components/icon/icon';
-import { ArvadosTheme } from '../../common/custom-theme';
-import SingleListItem from '../../components/single-list-item/single-list-item';
-
-export interface ProjectTreeProps {
-    projects: Array<TreeItem<ProjectResource>>;
-    toggleOpen: (id: string, status: TreeItemStatus) => void;
-    toggleActive: (id: string, status: TreeItemStatus) => void;
-    onContextMenu: (event: React.MouseEvent<HTMLElement>, item: TreeItem<ProjectResource>) => void;
-}
-
-class ProjectTree<T> extends React.Component<ProjectTreeProps & WithStyles<CssRules>> {
-    render(): ReactElement<any> {
-        const { classes, projects, toggleOpen, toggleActive, onContextMenu } = this.props;
-        return (
-            <div className={classes.root}>
-                <Tree items={projects}
-                    onContextMenu={onContextMenu}
-                    toggleItemOpen={toggleOpen}
-                    toggleItemActive={toggleActive}
-                    render={
-                        (project: TreeItem<ProjectResource>) =>
-                            <SingleListItem icon={ProjectIcon} name={project.data.name} isActive={project.active} hasMargin={true} />
-                    }/>
-            </div>
-        );
-    }
-}
+import { StyleRulesCallback, WithStyles, withStyles } from '@material-ui/core/styles';
+import { Tree, TreeItem, TreeItemStatus } from '~/components/tree/tree';
+import { ProjectResource } from '~/models/project';
+import { ProjectIcon } from '~/components/icon/icon';
+import { ArvadosTheme } from '~/common/custom-theme';
+import { ListItemTextIcon } from '~/components/list-item-text-icon/list-item-text-icon';
 
 type CssRules = 'root';
 
@@ -44,4 +19,33 @@ const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
     }
 });
 
-export default withStyles(styles)(ProjectTree);
+export interface ProjectTreeProps {
+    projects: Array<TreeItem<ProjectResource>>;
+    toggleOpen: (id: string, status: TreeItemStatus) => void;
+    toggleActive: (id: string, status: TreeItemStatus) => void;
+    onContextMenu: (event: React.MouseEvent<HTMLElement>, item: TreeItem<ProjectResource>) => void;
+}
+
+export const ProjectTree = withStyles(styles)(
+    class ProjectTreeGeneric<T> extends React.Component<ProjectTreeProps & WithStyles<CssRules>> {
+        render(): ReactElement<any> {
+            const { classes, projects, toggleOpen, toggleActive, onContextMenu } = this.props;
+            return (
+                <div className={classes.root}>
+                    <Tree items={projects}
+                        onContextMenu={onContextMenu}
+                        toggleItemOpen={toggleOpen}
+                        toggleItemActive={toggleActive}
+                        render={
+                            (project: TreeItem<ProjectResource>) =>
+                                <ListItemTextIcon
+                                    icon={ProjectIcon}
+                                    name={project.data.name}
+                                    isActive={project.active}
+                                    hasMargin={true}/>
+                        }/>
+                </div>
+            );
+        }
+    }
+);