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 { 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
  16 const mapStateToProps = (state: RootState): Pick<CollectionPanelFilesProps, "items"> => ({
  17     items: state.collectionPanelFiles
  18         .filter(f => f.parentId === undefined)
  19         .map(fileToTreeItem(state.collectionPanelFiles))
  20 });
  21
  22 const mapDispatchToProps = (dispatch: Dispatch): Pick<CollectionPanelFilesProps, 'onCollapseToggle' | 'onSelectionToggle' | 'onItemMenuOpen' | 'onOptionsMenuOpen'> => ({
  23     onCollapseToggle: (id) => dispatch(collectionPanelFilesAction.TOGGLE_COLLECTION_FILE_COLLAPSE({ id })),
  24     onSelectionToggle: (event, item) => dispatch(collectionPanelFilesAction.TOGGLE_COLLECTION_FILE_SELECTION({ id: item.id })),
  25     onItemMenuOpen: (event, item) => {
  26         event.preventDefault();
  27         dispatch(contextMenuActions.OPEN_CONTEXT_MENU({
  28             position: { x: event.clientX, y: event.clientY },
  29             resource: { kind: ContextMenuKind.COLLECTION_FILES_ITEM, name: item.data.name, uuid: item.id }
  30         }));
  31     },
  32     onOptionsMenuOpen: (event) =>
  33         dispatch(contextMenuActions.OPEN_CONTEXT_MENU({
  34             position: { x: event.clientX, y: event.clientY },
  35             resource: { kind: ContextMenuKind.COLLECTION_FILES, name: '', uuid: '' }
  36         }))
  37 });
  38
  39
  40 export const CollectionPanelFiles = connect(mapStateToProps, mapDispatchToProps)(Component);
  41
  42 const fileToTreeItem = (files: CollectionPanelFile[]) => (file: CollectionPanelFile): TreeItem<FileTreeData> => {
  43     return {
  44         active: false,
  45         data: {
  46             name: file.name,
  47             size: file.size,
  48             type: file.type
  49         },
  50         id: file.id,
  51         items: files
  52             .filter(f => f.parentId === file.id)
  53             .map(fileToTreeItem(files)),
  54         open: !file.collapsed,
  55         selected: file.selected,
  56         status: TreeItemStatus.LOADED
  57     };
  58 };