Added data selector for workbench data explorer

[arvados-workbench2.git] / src / views / data-explorer / data-explorer.tsx

diff --git a/src/views/data-explorer/data-explorer.tsx b/src/views/data-explorer/data-explorer.tsx
index f4ee36f3b4af2542add0564b6405a075d1e38eaf..a667469a2e5317678ea31909132d0aee68b2f64a 100644 (file)
--- a/src/views/data-explorer/data-explorer.tsx
+++ b/src/views/data-explorer/data-explorer.tsx
@@ -5,32 +5,35 @@
 import * as React from 'react';
 import { RouteComponentProps } from 'react-router';
 import { Project } from '../../models/project';
-import { ProjectState, findTreeItem } from '../../store/project/project-reducer';
+import { ProjectState } from '../../store/project/project-reducer';
 import { RootState } from '../../store/store';
 import { connect, DispatchProp } from 'react-redux';
 import { push } from 'react-router-redux';
-import projectActions from "../../store/project/project-action";
 import { DataColumns } from "../../components/data-table/data-table";
 import DataExplorer, { DataExplorerContextActions } from "../../views-components/data-explorer/data-explorer";
-import { mapProjectTreeItem } from "./data-explorer-selectors";
+import { projectExplorerItems } from "./data-explorer-selectors";
 import { DataItem } from "../../views-components/data-explorer/data-item";
+import { CollectionState } from "../../store/collection/collection-reducer";
+import { ResourceKind } from "../../models/resource";
+import projectActions from "../../store/project/project-action";
+import { getCollectionList } from "../../store/collection/collection-action";
 
 interface DataExplorerViewDataProps {
     projects: ProjectState;
+    collections: CollectionState;
 }
 
-type DataExplorerViewProps = DataExplorerViewDataProps & RouteComponentProps<{ name: string }> & DispatchProp;
+type DataExplorerViewProps = DataExplorerViewDataProps & RouteComponentProps<{ uuid: string }> & DispatchProp;
 type DataExplorerViewState = DataColumns<Project>;
 
 class DataExplorerView extends React.Component<DataExplorerViewProps, DataExplorerViewState> {
-
     render() {
-        const project = findTreeItem(this.props.projects, this.props.match.params.name);
-        const projectItems = project && project.items || [];
+        const treeItemId = this.props.match.params.uuid;
+        const items = projectExplorerItems(this.props.projects, treeItemId, this.props.collections);
         return (
             <DataExplorer
-                items={projectItems.map(mapProjectTreeItem)}
-                onItemClick={this.goToProject}
+                items={items}
+                onItemClick={this.goToItem}
                 contextActions={this.contextActions}
             />
         );
@@ -46,14 +49,19 @@ class DataExplorerView extends React.Component<DataExplorerViewProps, DataExplor
         onShare: console.log
     };
 
-    goToProject = (item: DataItem) => {
-        this.props.dispatch(push(`/project/${item}`));
-        this.props.dispatch(projectActions.TOGGLE_PROJECT_TREE_ITEM(item.uuid));
+    goToItem = (item: DataItem) => {
+        // FIXME: Unify project tree switch action
+        this.props.dispatch(push(item.url));
+        if (item.type === ResourceKind.PROJECT || item.type === ResourceKind.LEVEL_UP) {
+            this.props.dispatch(projectActions.TOGGLE_PROJECT_TREE_ITEM(item.uuid));
+        }
+        this.props.dispatch<any>(getCollectionList(item.uuid));
     }
 }
 
 export default connect(
     (state: RootState) => ({
-        projects: state.projects
+        projects: state.projects,
+        collections: state.collections
     })
 )(DataExplorerView);