Merge branch 'master' into 14015-rename-a-file
[arvados.git] / src / views-components / collection-panel-files / collection-panel-files.ts
1 // Copyright (C) The Arvados Authors. All rights reserved.
2 //
3 // SPDX-License-Identifier: AGPL-3.0
4
5 import { connect } from "react-redux";
6 import { CollectionPanelFiles as Component, CollectionPanelFilesProps } from "~/components/collection-panel-files/collection-panel-files";
7 import { RootState } from "~/store/store";
8 import { TreeItemStatus, TreeItem } from "~/components/tree/tree";
9 import { CollectionPanelFilesState, CollectionPanelDirectory, CollectionPanelFile } from "~/store/collection-panel/collection-panel-files/collection-panel-files-state";
10 import { FileTreeData } from "~/components/file-tree/file-tree-data";
11 import { Dispatch } from "redux";
12 import { collectionPanelFilesAction } from "~/store/collection-panel/collection-panel-files/collection-panel-files-actions";
13 import { contextMenuActions } from "~/store/context-menu/context-menu-actions";
14 import { ContextMenuKind } from "../context-menu/context-menu";
15 import { Tree, getNodeChildrenIds, getNode } from "~/models/tree";
16 import { CollectionFileType } from "~/models/collection-file";
17 import { openUploadCollectionFilesDialog } from '~/store/collections/uploader/collection-uploader-actions';
18
19 const memoizedMapStateToProps = () => {
20     let prevState: CollectionPanelFilesState;
21     let prevTree: Array<TreeItem<FileTreeData>>;
22
23     return (state: RootState): Pick<CollectionPanelFilesProps, "items"> => {
24         if (prevState !== state.collectionPanelFiles) {
25             prevState = state.collectionPanelFiles;
26             prevTree = getNodeChildrenIds('')(state.collectionPanelFiles)
27                 .map(collectionItemToTreeItem(state.collectionPanelFiles));
28         }
29         return {
30             items: prevTree
31         };
32     };
33 };
34
35 const mapDispatchToProps = (dispatch: Dispatch): Pick<CollectionPanelFilesProps, 'onUploadDataClick' | 'onCollapseToggle' | 'onSelectionToggle' | 'onItemMenuOpen' | 'onOptionsMenuOpen'> => ({
36     onUploadDataClick: () => {
37         dispatch<any>(openUploadCollectionFilesDialog());
38     },
39     onCollapseToggle: (id) => {
40         dispatch(collectionPanelFilesAction.TOGGLE_COLLECTION_FILE_COLLAPSE({ id }));
41     },
42     onSelectionToggle: (event, item) => {
43         dispatch(collectionPanelFilesAction.TOGGLE_COLLECTION_FILE_SELECTION({ id: item.id }));
44     },
45     onItemMenuOpen: (event, item) => {
46         event.preventDefault();
47         dispatch(contextMenuActions.OPEN_CONTEXT_MENU({
48             position: { x: event.clientX, y: event.clientY },
49             resource: { kind: ContextMenuKind.COLLECTION_FILES_ITEM, name: item.data.name, uuid: item.id }
50         }));
51     },
52     onOptionsMenuOpen: (event) =>
53         dispatch(contextMenuActions.OPEN_CONTEXT_MENU({
54             position: { x: event.clientX, y: event.clientY },
55             resource: { kind: ContextMenuKind.COLLECTION_FILES, name: '', uuid: '' }
56         }))
57 });
58
59
60 export const CollectionPanelFiles = connect(memoizedMapStateToProps(), mapDispatchToProps)(Component);
61
62 const collectionItemToTreeItem = (tree: Tree<CollectionPanelDirectory | CollectionPanelFile>) =>
63     (id: string): TreeItem<FileTreeData> => {
64         const node = getNode(id)(tree) || {
65             id: '',
66             children: [],
67             parent: '',
68             value: {
69                 name: 'Invalid node',
70                 type: CollectionFileType.DIRECTORY,
71                 selected: false,
72                 collapsed: true
73             }
74         };
75         return {
76             active: false,
77             data: {
78                 name: node.value.name,
79                 size: node.value.type === CollectionFileType.FILE ? node.value.size : undefined,
80                 type: node.value.type
81             },
82             id: node.id,
83             items: getNodeChildrenIds(node.id)(tree)
84                 .map(collectionItemToTreeItem(tree)),
85             open: node.value.type === CollectionFileType.DIRECTORY ? !node.value.collapsed : false,
86             selected: node.value.selected,
87             status: TreeItemStatus.LOADED
88         };
89     };