X-Git-Url: https://git.arvados.org/arvados-workbench2.git/blobdiff_plain/86d0ec68c0a400ab6d4de1897a68a4593f450b60..3e3eaa213219ebcac9b52c8fbe3ec3ef7c39c863:/src/views-components/tree-picker/tree-picker.ts diff --git a/src/views-components/tree-picker/tree-picker.ts b/src/views-components/tree-picker/tree-picker.ts index c34b6c37..86c76e08 100644 --- a/src/views-components/tree-picker/tree-picker.ts +++ b/src/views-components/tree-picker/tree-picker.ts @@ -3,9 +3,9 @@ // SPDX-License-Identifier: AGPL-3.0 import { connect } from "react-redux"; -import { Tree, TreeProps, TreeItem, TreeItemStatus } from "~/components/tree/tree"; -import { RootState } from "~/store/store"; -import { getNodeChildrenIds, Tree as Ttree, createTree, getNode, TreeNodeStatus } from '~/models/tree'; +import { Tree, TreeProps, TreeItem, TreeItemStatus } from "components/tree/tree"; +import { RootState } from "store/store"; +import { getNodeChildrenIds, Tree as Ttree, createTree, getNode, TreeNodeStatus } from 'models/tree'; import { Dispatch } from "redux"; import { initTreeNode } from '../../models/tree'; @@ -18,22 +18,27 @@ export interface TreePickerProps { toggleItemSelection: Callback; } -const flatTree = (depth: number, items?: any): [] => { - return items ? items.reduce((prev: any, next: any) => { - const { items } = next; +const flatTree = (itemsIdMap: Map, depth: number, items?: any): [] => { + return items ? items + .map((item: any) => addToItemsIdMap(item, itemsIdMap)) + .reduce((prev: Array, next: any) => { + const { items } = next; + prev.push({ ...next, depth }); + prev.push(...(next.open ? flatTree(itemsIdMap, depth + 1, items) : [])); + return prev; + }, []) : []; +}; - return [ - ...prev, - { ...next, depth }, - ...(next.open ? flatTree(depth + 1, items) : []), - ]; - }, []) : []; +const addToItemsIdMap = (item: TreeItem, itemsIdMap: Map>) => { + itemsIdMap[item.id] = item; + return item; }; const memoizedMapStateToProps = () => { let prevTree: Ttree; - let mappedProps: Pick, 'items' | 'disableRipple'>; - return (state: RootState, props: TreePickerProps): Pick, 'items' | 'disableRipple'> => { + let mappedProps: Pick, 'items' | 'disableRipple' | 'itemsMap'>; + return (state: RootState, props: TreePickerProps): Pick, 'items' | 'disableRipple' | 'itemsMap'> => { + const itemsIdMap: Map> = new Map(); const tree = state.treePicker[props.pickerId] || createTree(); if (tree !== prevTree) { prevTree = tree; @@ -41,11 +46,13 @@ const memoizedMapStateToProps = () => { disableRipple: true, items: getNodeChildrenIds('')(tree) .map(treePickerToTreeItems(tree)) + .map(item => addToItemsIdMap(item, itemsIdMap)) .map(parentItem => ({ ...parentItem, flatTree: true, - items: flatTree(2, parentItem.items || []), - })) + items: flatTree(itemsIdMap, 2, parentItem.items || []), + })), + itemsMap: itemsIdMap, }; } return mappedProps;