1 // Copyright (C) The Arvados Authors. All rights reserved.
3 // SPDX-License-Identifier: AGPL-3.0
5 import * as React from "react";
6 import { Dispatch } from "redux";
7 import { connect } from "react-redux";
8 import { Typography } from "@material-ui/core";
9 import { TreePicker } from "../tree-picker/tree-picker";
10 import { TreeProps, TreeItem, TreeItemStatus } from "../../components/tree/tree";
11 import { ProjectResource } from "../../models/project";
12 import { treePickerActions } from "../../store/tree-picker/tree-picker-actions";
13 import { ListItemTextIcon } from "../../components/list-item-text-icon/list-item-text-icon";
14 import { ProjectIcon } from "../../components/icon/icon";
15 import { createTreePickerNode } from "../../store/tree-picker/tree-picker";
16 import { RootState } from "../../store/store";
17 import { ServiceRepository } from "../../services/services";
18 import { FilterBuilder } from "../../common/api/filter-builder";
20 type ProjectTreePickerProps = Pick<TreeProps<ProjectResource>, 'toggleItemActive' | 'toggleItemOpen'>;
22 const mapDispatchToProps = (dispatch: Dispatch, props: {onChange: (projectUuid: string) => void}): ProjectTreePickerProps => ({
23 toggleItemActive: id => {
24 dispatch(treePickerActions.TOGGLE_TREE_PICKER_NODE_SELECT({ id }));
27 toggleItemOpen: (id, status) => {
28 status === TreeItemStatus.INITIAL
29 ? dispatch<any>(loadProjectTreePickerProjects(id))
30 : dispatch(treePickerActions.TOGGLE_TREE_PICKER_NODE_COLLAPSE({ id }));
34 export const ProjectTreePicker = connect(undefined, mapDispatchToProps)((props: ProjectTreePickerProps) =>
35 <div style={{display: 'flex', flexDirection: 'column'}}>
36 <Typography variant='caption' style={{flexShrink: 0}}>
39 <div style={{flexGrow: 1, overflow: 'auto'}}>
40 <TreePicker {...props} render={renderTreeItem} />
44 // TODO: move action creator to store directory
45 export const loadProjectTreePickerProjects = (id: string) =>
46 async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
47 dispatch(treePickerActions.LOAD_TREE_PICKER_NODE({ id }));
49 const ownerUuid = id.length === 0 ? services.authService.getUuid() || '' : id;
51 const filters = FilterBuilder
53 .addEqual('ownerUuid', ownerUuid);
55 const { items } = await services.projectService.list({ filters });
57 dispatch<any>(receiveProjectTreePickerData(id, items));
60 const renderTreeItem = (item: TreeItem<ProjectResource>) =>
64 isActive={item.active}
67 // TODO: move action creator to store directory
68 const receiveProjectTreePickerData = (id: string, projects: ProjectResource[]) =>
69 (dispatch: Dispatch) => {
70 dispatch(treePickerActions.LOAD_TREE_PICKER_NODE_SUCCESS({
72 nodes: projects.map(project => createTreePickerNode({ id: project.uuid, value: project }))
74 dispatch(treePickerActions.TOGGLE_TREE_PICKER_NODE_COLLAPSE({ id }));