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 { TreeItem, TreeItemStatus } from '~/components/tree/tree';
9 import { ProjectResource } from "~/models/project";
10 import { treePickerActions } from "~/store/tree-picker/tree-picker-actions";
11 import { ListItemTextIcon } from "~/components/list-item-text-icon/list-item-text-icon";
12 import { ProjectIcon, InputIcon, IconType, CollectionIcon } from '~/components/icon/icon';
13 import { loadProject, loadCollection } from '~/store/tree-picker/tree-picker-actions';
14 import { GroupContentsResource } from '~/services/groups-service/groups-service';
15 import { CollectionDirectory, CollectionFile, CollectionFileType } from '~/models/collection-file';
16 import { ResourceKind } from '~/models/resource';
17 import { TreePickerProps, TreePicker } from "~/views-components/tree-picker/tree-picker";
19 export interface ProjectsTreePickerRootItem {
24 export type ProjectsTreePickerItem = ProjectsTreePickerRootItem | GroupContentsResource | CollectionDirectory | CollectionFile;
25 type PickedTreePickerProps = Pick<TreePickerProps<ProjectsTreePickerItem>, 'onContextMenu' | 'toggleItemActive' | 'toggleItemOpen' | 'toggleItemSelection'>;
27 export interface ProjectsTreePickerDataProps {
28 includeCollections?: boolean;
29 includeFiles?: boolean;
30 rootItemIcon: IconType;
31 rootItemSelection?: boolean;
32 projectsSelection?: boolean;
33 collectionsSelection?: boolean;
34 filesSelection?: boolean;
35 loadRootItem: (item: TreeItem<ProjectsTreePickerRootItem>, pickerId: string, includeCollections?: boolean, inlcudeFiles?: boolean) => void;
38 export type ProjectsTreePickerProps = ProjectsTreePickerDataProps & Partial<PickedTreePickerProps>;
40 const mapStateToProps = (_: any, { rootItemIcon, ...props }: ProjectsTreePickerProps) => ({
41 render: renderTreeItem(rootItemIcon),
42 showSelection: isSelectionVisible(props),
45 const mapDispatchToProps = (dispatch: Dispatch, { loadRootItem, includeCollections, includeFiles, ...props }: ProjectsTreePickerProps): PickedTreePickerProps => ({
46 onContextMenu: () => { return; },
47 toggleItemActive: (event, item, pickerId) => {
48 dispatch(treePickerActions.ACTIVATE_TREE_PICKER_NODE({ id: item.id, pickerId }));
49 if (props.toggleItemActive) {
50 props.toggleItemActive(event, item, pickerId);
53 toggleItemOpen: (_, item, pickerId) => {
54 const { id, data, status } = item;
55 if (status === TreeItemStatus.INITIAL) {
58 data.kind === ResourceKind.COLLECTION
59 ? loadCollection(id, pickerId)
60 : loadProject({ id, pickerId, includeCollections, includeFiles })
62 } else if (!('type' in data) && loadRootItem) {
63 loadRootItem(item as TreeItem<ProjectsTreePickerRootItem>, pickerId, includeCollections, includeFiles);
65 } else if (status === TreeItemStatus.LOADED) {
66 dispatch(treePickerActions.TOGGLE_TREE_PICKER_NODE_COLLAPSE({ id, pickerId }));
69 toggleItemSelection: (_, { id }, pickerId) => {
70 dispatch<any>(treePickerActions.TOGGLE_TREE_PICKER_NODE_SELECTION({ id, pickerId }));
74 export const ProjectsTreePicker = connect(mapStateToProps, mapDispatchToProps)(TreePicker);
76 const getProjectPickerIcon = ({ data }: TreeItem<ProjectsTreePickerItem>, rootIcon: IconType): IconType => {
79 case ResourceKind.COLLECTION:
80 return CollectionIcon;
84 } else if ('type' in data) {
86 case CollectionFileType.FILE:
95 interface IsSelectionVisibleParams {
96 rootItemSelection?: boolean;
97 projectsSelection?: boolean;
98 collectionsSelection?: boolean;
99 filesSelection?: boolean;
101 const isSelectionVisible = (params: IsSelectionVisibleParams) =>
102 ({ data, status }: TreeItem<ProjectsTreePickerItem>) => {
103 if ('kind' in data) {
105 case ResourceKind.COLLECTION:
106 return !!params.collectionsSelection;
108 return !!params.projectsSelection;
110 } else if ('type' in data) {
111 return !!params.filesSelection;
113 return !!params.rootItemSelection;
117 const renderTreeItem = (rootItemIcon: IconType) => (item: TreeItem<ProjectResource>) =>
119 icon={getProjectPickerIcon(item, rootItemIcon)}
120 name={item.data.name}
121 isActive={item.active}