synapse-react-client 4.0.19 → 4.0.20

package/dist/components/EntityFinder/tree/VirtualizedTree.js.map

@@ -1 +1 @@
-{"version":3,"file":"VirtualizedTree.js","names":[],"sources":["../../../../src/components/EntityFinder/tree/VirtualizedTree.tsx"],"sourcesContent":["import React from 'react'\nimport { getEntityChildren } from '@/synapse-client'\nimport { useSynapseContext } from '@/utils'\nimport { formatDate } from '@/utils/functions/DateFormatter'\nimport {\n  getEntityTypeFromHeader,\n  isContainerType,\n} from '@/utils/functions/EntityTypeUtils'\nimport { Writable } from '@/utils/types/Writable'\nimport { ChevronRight, ExpandMore } from '@mui/icons-material'\nimport { Skeleton, Tooltip, Typography } from '@mui/material'\nimport { EntityType } from '@sage-bionetworks/synapse-client'\nimport { EntityChildrenRequest } from '@sage-bionetworks/synapse-types'\nimport { useQueryClient } from '@tanstack/react-query'\nimport dayjs from 'dayjs'\nimport { cloneDeep } from 'lodash-es'\nimport { ReactNode, useCallback, useEffect, useRef, useState } from 'react'\nimport { useInView } from 'react-intersection-observer'\nimport AutoSizer from 'react-virtualized-auto-sizer'\nimport {\n  TreeWalker,\n  TreeWalkerValue,\n  VariableSizeNodeData,\n  VariableSizeNodePublicState,\n  VariableSizeTree,\n} from 'react-vtree'\nimport { NodeComponentProps } from 'react-vtree/dist/es/Tree'\nimport { EntityBadgeIcons } from '../../EntityBadgeIcons'\nimport { EntityTypeIcon } from '../../EntityIcon'\nimport { SynapseSpinner } from '../../LoadingScreen/LoadingScreen'\nimport { UserBadge } from '../../UserCard/UserBadge'\nimport { EntityFinderHeader } from '../EntityFinderHeader'\nimport { EntitySelectionMapType } from '../useEntitySelection'\n\nexport enum EntityTreeNodeType {\n  /** The tree component's appearance and interactions will facilitate selection. Nodes will be larger and styles will indicate primary selection */\n  SINGLE_PANE,\n  /** The tree component's appearance and interactions will facilitate browsing. Nodes will be smaller and styles will indicate secondary selection */\n  DUAL_PANE,\n}\n\ntype NodeChildren = Readonly<{\n  /** The node's children. If undefined, then children have not been fetched. */\n  children?: EntityHeaderNode[]\n  /** The token used to fetch the next page of children for this entity. If this property is nullish and children is defined, then all children have been fetched. */\n  childrenNextPageToken?: string | null\n}>\n\nexport type EntityHeaderNode = (\n  | EntityFinderHeader\n  // Only will have a subset of fields if the node is fetched via the entity path:\n  | Pick<EntityFinderHeader, 'id' | 'name' | 'type'>\n) &\n  NodeChildren\ntype PaginationNode = { __paginationNode: true }\n\ntype TreeNode = EntityHeaderNode | RootNodeConfiguration | PaginationNode\n\nfunction getTreeNodeType(\n  node: TreeNode,\n): 'entityHeader' | 'rootNodeConfiguration' | 'pagination' {\n  if ('__paginationNode' in node) {\n    return 'pagination'\n  }\n  return 'id' in node ? 'entityHeader' : 'rootNodeConfiguration'\n}\n\nfunction isPaginationNode(node: TreeNode): node is PaginationNode {\n  return getTreeNodeType(node) === 'pagination'\n}\n\nfunction isEntityHeaderNode(node: TreeNode): node is EntityHeaderNode {\n  return getTreeNodeType(node) === 'entityHeader'\n}\n\nfunction isRootNodeConfiguration(\n  node: TreeNode,\n): node is RootNodeConfiguration {\n  return getTreeNodeType(node) === 'rootNodeConfiguration'\n}\n\nfunction hasMoreChildren(node: TreeNode) {\n  if (isPaginationNode(node)) {\n    return false\n  } else if (isRootNodeConfiguration(node)) {\n    return node.hasNextPage\n  }\n\n  return node.children == null || node.childrenNextPageToken != null\n}\n\nfunction isLeafNode(node: TreeNode) {\n  if (isPaginationNode(node)) {\n    return true\n  } else if (isRootNodeConfiguration(node)) {\n    return false\n  } else {\n    return (\n      // Entity is not a container\n      !isContainerType(getEntityTypeFromHeader(node)) ||\n      // OR Children have been fetched (nonnull) and there are 0 children\n      (node.children != null && node.children.length === 0)\n    )\n  }\n}\n\nfunction maybeHasChildren(\n  node: TreeNode,\n): node is RootNodeConfiguration | EntityHeaderNode {\n  if (isPaginationNode(node)) {\n    return false\n  } else if (isRootNodeConfiguration(node)) {\n    return node.children.length > 0 || node.hasNextPage\n  } else {\n    return !isLeafNode(node)\n  }\n}\n\nexport type TreeData = VariableSizeNodeData &\n  Readonly<{\n    node: TreeNode\n    getNextPageOfChildren: () => Promise<void>\n    isLeaf: boolean\n    nestingLevel: number\n    setSelectedId: (entityId: string) => void\n    treeNodeType: EntityTreeNodeType\n    isSelected: boolean\n    isDisabled: boolean\n  }>\n\ntype NodeMeta = Readonly<{\n  nestingLevel: number\n  node: TreeNode\n}>\n\nexport type RootNodeConfiguration = {\n  show: boolean\n  nodeText: string\n  children: EntityHeaderNode[]\n  /** If undefined, no more entities to fetch */\n  fetchNextPage: () => Promise<void>\n  hasNextPage: boolean\n}\n\n/**\n * Converts a TreeNode and related data into a TreeWalkerValue that react-vtree can use to render the tree.\n * Exported for testing purposes only.\n * @param config\n * @returns\n */\nexport const getNodeData = (config: {\n  node: TreeNode\n  nestingLevel: number\n  getNextPageOfChildren: () => Promise<void>\n  setSelectedId: (entityId: string) => void\n  treeNodeType: EntityTreeNodeType\n  selected: EntitySelectionMapType\n  selectableTypes: EntityType[]\n  autoExpand: (entityId: string) => boolean\n  defaultHeight: number\n  currentContainer?: string | 'root' | null\n}): TreeWalkerValue<TreeData, NodeMeta> => {\n  const {\n    node,\n    nestingLevel,\n    getNextPageOfChildren,\n    setSelectedId,\n    treeNodeType,\n    selected,\n    selectableTypes,\n    autoExpand,\n    defaultHeight,\n    currentContainer,\n  } = config\n\n  if (isPaginationNode(node)) {\n    throw new Error('Cannot create data for a pagination node')\n  }\n\n  const id = isRootNodeConfiguration(node) ? 'root' : node.id\n\n  const isSelected =\n    treeNodeType === EntityTreeNodeType.SINGLE_PANE\n      ? selected.has(id)\n      : currentContainer === id\n  const isDisabled =\n    !isRootNodeConfiguration(node) &&\n    !selectableTypes.includes(getEntityTypeFromHeader(node))\n\n  const isOpenByDefault = autoExpand(id)\n  /*\n   * If the node is open by default and we haven't fetched its children,\n   * fetch the first page (otherwise we won't fetch unless re-toggled)\n   */\n  if (isOpenByDefault && node.children == null && hasMoreChildren(node)) {\n    getNextPageOfChildren()\n  }\n\n  return {\n    data: {\n      node,\n      getNextPageOfChildren,\n      id: id,\n      isLeaf: isLeafNode(node),\n      isOpenByDefault: isOpenByDefault,\n      nestingLevel,\n      setSelectedId,\n      treeNodeType,\n      isSelected,\n      isDisabled,\n      defaultHeight,\n    },\n    nestingLevel,\n    node,\n  }\n}\n\n/**\n * Node component for the react-vtree virtualized tree. Exported only for testing purposes\n */\nexport function Node(\n  props: NodeComponentProps<TreeData, VariableSizeNodePublicState<TreeData>>,\n) {\n  const {\n    data: {\n      node,\n      getNextPageOfChildren,\n      isLeaf,\n      id,\n      nestingLevel,\n      setSelectedId,\n      treeNodeType,\n      isSelected,\n      isDisabled,\n    },\n    isOpen,\n    style,\n    setOpen,\n  } = props\n\n  const [isLoading, setLoading] = useState(false)\n\n  const nodeText = isEntityHeaderNode(node) ? (\n    <span>{node.name}</span>\n  ) : isRootNodeConfiguration(node) ? (\n    <span>{node.nodeText}</span>\n  ) : (\n    // Pagination node\n    <Skeleton width={100} />\n  )\n\n  // We only use this for pagination nodes. If the pagination node comes into view, then immediately call `getNextPageOfChildren`\n  const { ref, inView } = useInView()\n\n  useEffect(() => {\n    if (isPaginationNode(node) && inView) {\n      getNextPageOfChildren()\n    }\n  }, [node, inView, getNextPageOfChildren])\n\n  const toggleExpand = useCallback(async () => {\n    if (hasMoreChildren(node)) {\n      setLoading(true)\n      await getNextPageOfChildren()\n      await setOpen(!isOpen)\n      setLoading(false)\n    } else {\n      await setOpen(!isOpen)\n    }\n  }, [getNextPageOfChildren, node, isOpen, setOpen])\n\n  /**\n   * If in the dual-pane view, expand a node when it becomes selected\n   */\n  useEffect(() => {\n    if (\n      treeNodeType === EntityTreeNodeType.DUAL_PANE &&\n      isSelected &&\n      !isOpen\n    ) {\n      toggleExpand()\n    }\n    // Intentionally only toggle the expanded state when isSelected changes, otherwise the node cannot be un-expanded\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [isSelected])\n\n  /**\n   * If the height is 0, the node is purposefully hidden. Just render a fragment.\n   */\n  if ('height' in style && style.height === 0) {\n    return <></>\n  }\n\n  let tooltipContent: ReactNode = ''\n  if (isEntityHeaderNode(node)) {\n    tooltipContent = (\n      <div style={{ textAlign: 'center' }}>\n        <Typography\n          component=\"span\"\n          variant=\"smallText1\"\n          sx={{\n            display: 'inline',\n          }}\n        >\n          {node.name}\n          <br />\n          <b>ID: </b>\n          {node.id}\n          {'modifiedBy' in node && (\n            <>\n              <br />\n              <b>Modified By: </b>\n              <UserBadge\n                userId={node.modifiedBy.toString()}\n                showFullName\n                disableLink\n                showCardOnHover={false}\n              />\n            </>\n          )}\n          {'modifiedOn' in node && (\n            <>\n              <br />\n              <b>Modified On: </b>\n              {formatDate(dayjs(node.modifiedOn))}\n            </>\n          )}\n        </Typography>\n      </div>\n    )\n  }\n\n  const ExpandIcon = isOpen ? ExpandMore : ChevronRight\n\n  return (\n    <div\n      className={`Node ${\n        treeNodeType === EntityTreeNodeType.SINGLE_PANE\n          ? 'SelectNode'\n          : 'BrowseNode'\n      }`}\n      aria-selected={isSelected}\n      aria-disabled={isDisabled}\n      onClick={event => {\n        event.stopPropagation()\n        if (!isDisabled) {\n          setSelectedId(id)\n        }\n      }}\n      style={{\n        ...style,\n        paddingLeft: `${nestingLevel * 20}px`,\n      }}\n    >\n      {!isLeaf && (\n        <>\n          {isLoading ? (\n            <SynapseSpinner size={10} />\n          ) : (\n            <button\n              aria-label={isOpen ? 'Collapse' : 'Expand'}\n              onClick={event => {\n                event.stopPropagation()\n                toggleExpand()\n              }}\n            >\n              <ExpandIcon className=\"ExpandButton\" />\n            </button>\n          )}\n        </>\n      )}\n      {treeNodeType === EntityTreeNodeType.SINGLE_PANE && ( // SWC-5592\n        <div className=\"EntityIcon\">\n          {isEntityHeaderNode(node) && (\n            <EntityTypeIcon type={getEntityTypeFromHeader(node)} />\n          )}\n        </div>\n      )}\n\n      <Tooltip title={tooltipContent} placement=\"right\">\n        <div className=\"EntityName\" ref={ref}>\n          {nodeText}\n        </div>\n      </Tooltip>\n\n      {treeNodeType === EntityTreeNodeType.SINGLE_PANE && (\n        <EntityBadgeIcons\n          entityId={id}\n          showHasDiscussionThread={false}\n          showHasWiki={false}\n          showUnlink={false}\n          canOpenModal={false}\n        />\n      )}\n    </div>\n  )\n}\n\n/**\n * Extracted from the React component for testing purposes\n * @returns a generator function compatible with react-vtree\n */\nexport function getTreeWalkerFunction(\n  rootNode: RootNodeConfiguration,\n  setSelectedId: VirtualizedTreeProps['setSelectedId'],\n  treeNodeType: VirtualizedTreeProps['treeNodeType'],\n  selected: VirtualizedTreeProps['selected'],\n  selectableTypes: VirtualizedTreeProps['selectableTypes'],\n  autoExpand: VirtualizedTreeProps['autoExpand'],\n  itemSize: (index?: number) => number,\n  currentContainer: VirtualizedTreeProps['currentContainer'],\n  fetchNextPageOfChildren: (node: Writable<EntityHeaderNode>) => Promise<void>,\n): TreeWalker<TreeData, NodeMeta> {\n  return function* treeWalker() {\n    // Step [1]: Define the root node of our tree.\n    yield getNodeData({\n      node: rootNode,\n      nestingLevel: 0,\n      getNextPageOfChildren: rootNode.fetchNextPage,\n      setSelectedId,\n      treeNodeType,\n      selected,\n      selectableTypes,\n      autoExpand,\n      defaultHeight: itemSize(),\n      currentContainer,\n    })\n\n    while (true) {\n      // Step [2]: Get the parent node and nesting level, which will be passed into the Generator.next function by react-vtree.\n      // Yielding `undefined` indicates to react-vtree that we've finished iterating children from the last time we were in the loop.\n      const parentMeta = yield\n\n      if (maybeHasChildren(parentMeta.node)) {\n        // Step [3]: Yielding all the known children of the parent\n        if (parentMeta.node.children) {\n          for (let i = 0; i < parentMeta.node.children.length; i++) {\n            const childNode = parentMeta.node.children[i]\n\n            yield getNodeData({\n              node: childNode,\n              nestingLevel: parentMeta.nestingLevel + 1,\n              getNextPageOfChildren: () => fetchNextPageOfChildren(childNode),\n              setSelectedId,\n              treeNodeType,\n              selected,\n              selectableTypes,\n              autoExpand,\n              defaultHeight: itemSize(),\n              currentContainer,\n            })\n          }\n        }\n\n        // Step [4] - If the parent node has more children, render a \"pagination node\" that will fetch more children when it comes into view (via intersection observer)\n        if (hasMoreChildren(parentMeta.node)) {\n          const paginationNode: PaginationNode = {\n            __paginationNode: true,\n          }\n          const paginationTreeWalkerValue: TreeWalkerValue<TreeData, NodeMeta> =\n            {\n              data: {\n                id: parentMeta.data.id + '-pagination',\n                node: paginationNode,\n                isOpenByDefault: false,\n                getNextPageOfChildren: parentMeta.data.getNextPageOfChildren,\n                isLeaf: true,\n                isSelected: false,\n                defaultHeight: itemSize(),\n                isDisabled: true,\n                nestingLevel: parentMeta.nestingLevel + 1,\n                setSelectedId: () => {},\n                treeNodeType,\n              },\n              nestingLevel: parentMeta.nestingLevel + 1,\n              node: {\n                __paginationNode: true,\n              },\n            }\n          yield paginationTreeWalkerValue\n        }\n      }\n    }\n  }\n}\n\nexport type VirtualizedTreeProps = Readonly<{\n  treeNodeType: EntityTreeNodeType\n  rootNodeConfiguration: RootNodeConfiguration\n  setSelectedId: (entityId: string) => void\n  selected: EntitySelectionMapType\n  /* currentContainer is the container whose contents are shown on in the right pane in dual-pane configuration, and may only be defined when treeNodeType is DUAL_PANE */\n  currentContainer?: string | 'root' | null\n  autoExpand: (entityId: string) => boolean\n  selectableTypes: EntityType[]\n  visibleTypes: EntityType[]\n}>\n\n/**\n * Component that utilizes react-vtree to efficiently display a tree of entities. react-vtree utilizes react-window\n * to only render visible nodes, which eliminates performance issues as seen in SWC-5978.\n */\nexport const VirtualizedTree = (\n  props: VirtualizedTreeProps,\n): React.ReactNode => {\n  const {\n    rootNodeConfiguration,\n    setSelectedId,\n    treeNodeType,\n    selected,\n    currentContainer,\n    selectableTypes,\n    visibleTypes,\n    autoExpand,\n  } = props\n\n  const { accessToken, keyFactory } = useSynapseContext()\n  const queryClient = useQueryClient()\n\n  const [rootNode, setRootNode] = useState<RootNodeConfiguration>(\n    rootNodeConfiguration,\n  )\n\n  const treeInstance = useRef<VariableSizeTree<TreeData>>(null)\n\n  useEffect(() => {\n    setRootNode(rootNodeConfiguration)\n  }, [rootNodeConfiguration, rootNodeConfiguration.children])\n\n  // This function is used by VariableSizeTree to identify the size of each node in the tree.\n  const itemSize = useCallback(\n    (index?: number) => {\n      /**\n       * We must have a root node, but we don't always want to show it.\n       * In those cases, set the height of the root node to 0.\n       */\n      if (index === 0 && !rootNodeConfiguration.show) {\n        return 0\n      }\n      /**\n       * The height of all other nodes in the tree varies depending on the tree node type.\n       */\n      return treeNodeType === EntityTreeNodeType.DUAL_PANE ? 30 : 60\n    },\n    [treeNodeType, rootNodeConfiguration.show],\n  )\n\n  /**\n   * Fetches the next page of children for a given node. After fetching the children, this method will make a deep clone of the\n   *  full tree, including the new data, and updates the state of the component\n   */\n  const fetchNextPageOfChildren = useCallback(\n    // Because we update the root node with a copy at the end of this function, we can write to the node under update.\n    async (node: Writable<EntityHeaderNode>) => {\n      // Fetch the children of the node\n      const entityChildrenRequest: EntityChildrenRequest = {\n        parentId: node.id,\n        nextPageToken: node.childrenNextPageToken,\n        includeTypes: visibleTypes,\n      }\n      const children = await queryClient.fetchQuery({\n        queryKey: keyFactory.getEntityChildrenQueryKey(\n          entityChildrenRequest,\n          false,\n        ),\n        queryFn: () => getEntityChildren(entityChildrenRequest, accessToken),\n      })\n      // Update the node data -- add the children and store the nextPageToken\n      if (node.children) {\n        for (const newChild of children.page) {\n          // SWC-6751 - Prevent adding duplicate entries in case this function is called twice\n          if (!node.children.find(child => child.id == newChild.id)) {\n            node.children.push(newChild)\n          }\n        }\n      } else {\n        node.children = children.page\n      }\n      node.childrenNextPageToken = children.nextPageToken\n\n      // Ensure the node for which we fetched children is expanded/open\n      if (treeInstance.current) {\n        await treeInstance.current.recomputeTree({\n          [node.id]: {\n            open: true,\n          },\n        })\n      }\n\n      // cloneDeep is required to re-render the tree with the new children\n      setRootNode(cloneDeep(rootNode))\n    },\n    [visibleTypes, queryClient, keyFactory, rootNode, accessToken],\n  )\n\n  /**\n   * treeWalker is a generator function used by react-vtree to generate the tree structure. The tree is re-built when the function is updated,\n   * so the dependencies specified in useCallback are important.\n   */\n  const memoizedTreeWalker = useCallback(\n    getTreeWalkerFunction(\n      rootNode,\n      setSelectedId,\n      treeNodeType,\n      selected,\n      selectableTypes,\n      autoExpand,\n      itemSize,\n      currentContainer,\n      fetchNextPageOfChildren,\n    ),\n    [\n      rootNode,\n      setSelectedId,\n      treeNodeType,\n      selected,\n      selectableTypes,\n      autoExpand,\n      currentContainer,\n      fetchNextPageOfChildren,\n      itemSize,\n    ],\n  )\n\n  return (\n    <AutoSizer disableWidth>\n      {({ height }: { height: number }) => (\n        <VariableSizeTree\n          ref={treeInstance}\n          treeWalker={memoizedTreeWalker}\n          itemSize={itemSize}\n          height={height}\n          async={true}\n          width=\"100%\"\n        >\n          {Node}\n        </VariableSizeTree>\n      )}\n    </AutoSizer>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAkCA,IAAY,IAAL,yBAAA,GAAA;QAEL,EAAA,EAAA,cAAA,KAAA,eAEA,EAAA,EAAA,YAAA,KAAA;KACD;AAmBD,SAAS,EACP,GACyD;AAIzD,QAHI,sBAAsB,IACjB,eAEF,QAAQ,IAAO,iBAAiB;;AAGzC,SAAS,EAAiB,GAAwC;AAChE,QAAO,EAAgB,EAAK,KAAK;;AAGnC,SAAS,EAAmB,GAA0C;AACpE,QAAO,EAAgB,EAAK,KAAK;;AAGnC,SAAS,EACP,GAC+B;AAC/B,QAAO,EAAgB,EAAK,KAAK;;AAGnC,SAAS,EAAgB,GAAgB;AAOvC,QANI,EAAiB,EAAK,GACjB,KACE,EAAwB,EAAK,GAC/B,EAAK,cAGP,EAAK,YAAY,QAAQ,EAAK,yBAAyB;;AAGhE,SAAS,EAAW,GAAgB;AAMhC,QALE,EAAiB,EAAK,GACjB,KACE,EAAwB,EAAK,GAC/B,KAIL,CAAC,EAAgB,EAAwB,EAAK,CAAC,IAE9C,EAAK,YAAY,QAAQ,EAAK,SAAS,WAAW;;AAKzD,SAAS,EACP,GACkD;AAMhD,QALE,EAAiB,EAAK,GACjB,KACE,EAAwB,EAAK,GAC/B,EAAK,SAAS,SAAS,KAAK,EAAK,cAEjC,CAAC,EAAW,EAAK;;AAoC5B,IAAa,KAAe,MAWe;CACzC,IAAM,EACJ,SACA,iBACA,0BACA,kBACA,iBACA,aACA,oBACA,eACA,kBACA,wBACE;AAEJ,KAAI,EAAiB,EAAK,CACxB,OAAU,MAAM,2CAA2C;CAG7D,IAAM,IAAK,EAAwB,EAAK,GAAG,SAAS,EAAK,IAEnD,IACJ,MAAiB,EAAmB,cAChC,EAAS,IAAI,EAAG,GAChB,MAAqB,GACrB,IACJ,CAAC,EAAwB,EAAK,IAC9B,CAAC,EAAgB,SAAS,EAAwB,EAAK,CAAC,EAEpD,IAAkB,EAAW,EAAG;AAStC,QAJI,KAAmB,EAAK,YAAY,QAAQ,EAAgB,EAAK,IACnE,GAAuB,EAGlB;EACL,MAAM;GACJ;GACA;GACI;GACJ,QAAQ,EAAW,EAAK;GACP;GACjB;GACA;GACA;GACA;GACA;GACA;GACD;EACD;EACA;EACD;;AAMH,SAAgB,EACd,GACA;CACA,IAAM,EACJ,MAAM,EACJ,SACA,0BACA,WACA,OACA,iBACA,kBACA,iBACA,eACA,iBAEF,WACA,UACA,eACE,GAEE,CAAC,GAAW,KAAc,EAAS,GAAM,EAEzC,IAAW,EAAmB,EAAK,GACvC,kBAAC,QAAD,EAAA,UAAO,EAAK,MAAY,CAAA,GACtB,EAAwB,EAAK,GAC/B,kBAAC,QAAD,EAAA,UAAO,EAAK,UAAgB,CAAA,GAG5B,kBAAC,GAAD,EAAU,OAAO,KAAO,CAAA,EAIpB,EAAE,QAAK,cAAW,GAAW;AAEnC,SAAgB;AACd,EAAI,EAAiB,EAAK,IAAI,KAC5B,GAAuB;IAExB;EAAC;EAAM;EAAQ;EAAsB,CAAC;CAEzC,IAAM,IAAe,EAAY,YAAY;AAC3C,EAAI,EAAgB,EAAK,IACvB,EAAW,GAAK,EAChB,MAAM,GAAuB,EAC7B,MAAM,EAAQ,CAAC,EAAO,EACtB,EAAW,GAAM,IAEjB,MAAM,EAAQ,CAAC,EAAO;IAEvB;EAAC;EAAuB;EAAM;EAAQ;EAAQ,CAAC;AAoBlD,KAfA,QAAgB;AACd,EACE,MAAiB,EAAmB,aACpC,KACA,CAAC,KAED,GAAc;IAIf,CAAC,EAAW,CAAC,EAKZ,YAAY,KAAS,EAAM,WAAW,EACxC,QAAO,kBAAA,GAAA,EAAK,CAAA;CAGd,IAAI,IAA4B;AAChC,CAAI,EAAmB,EAAK,KAC1B,IACE,kBAAC,OAAD;EAAK,OAAO,EAAE,WAAW,UAAU;YACjC,kBAAC,GAAD;GACE,WAAU;GACV,SAAQ;GACR,IAAI,EACF,SAAS,UACV;aALH;IAOG,EAAK;IACN,kBAAC,MAAD,EAAM,CAAA;IACN,kBAAC,KAAD,EAAA,UAAG,QAAQ,CAAA;IACV,EAAK;IACL,gBAAgB,KACf,kBAAA,GAAA,EAAA,UAAA;KACE,kBAAC,MAAD,EAAM,CAAA;KACN,kBAAC,KAAD,EAAA,UAAG,iBAAiB,CAAA;KACpB,kBAAC,GAAD;MACE,QAAQ,EAAK,WAAW,UAAU;MAClC,cAAA;MACA,aAAA;MACA,iBAAiB;MACjB,CAAA;KACD,EAAA,CAAA;IAEJ,gBAAgB,KACf,kBAAA,GAAA,EAAA,UAAA;KACE,kBAAC,MAAD,EAAM,CAAA;KACN,kBAAC,KAAD,EAAA,UAAG,iBAAiB,CAAA;KACnB,EAAW,EAAM,EAAK,WAAW,CAAC;KAClC,EAAA,CAAA;IAEM;;EACT,CAAA;CAIV,IAAM,IAAa,IAAS,IAAa;AAEzC,QACE,kBAAC,OAAD;EACE,WAAW,QACT,MAAiB,EAAmB,cAChC,eACA;EAEN,iBAAe;EACf,iBAAe;EACf,UAAS,MAAS;AAEhB,GADA,EAAM,iBAAiB,EAClB,KACH,EAAc,EAAG;;EAGrB,OAAO;GACL,GAAG;GACH,aAAa,GAAG,IAAe,GAAG;GACnC;YAjBH;GAmBG,CAAC,KACA,kBAAA,GAAA,EAAA,UACG,IACC,kBAAC,GAAD,EAAgB,MAAM,IAAM,CAAA,GAE5B,kBAAC,UAAD;IACE,cAAY,IAAS,aAAa;IAClC,UAAS,MAAS;AAEhB,KADA,EAAM,iBAAiB,EACvB,GAAc;;cAGhB,kBAAC,GAAD,EAAY,WAAU,gBAAiB,CAAA;IAChC,CAAA,EAEV,CAAA;GAEJ,MAAiB,EAAmB,eACnC,kBAAC,OAAD;IAAK,WAAU;cACZ,EAAmB,EAAK,IACvB,kBAAC,GAAD,EAAgB,MAAM,EAAwB,EAAK,EAAI,CAAA;IAErD,CAAA;GAGR,kBAAC,GAAD;IAAS,OAAO;IAAgB,WAAU;cACxC,kBAAC,OAAD;KAAK,WAAU;KAAkB;eAC9B;KACG,CAAA;IACE,CAAA;GAET,MAAiB,EAAmB,eACnC,kBAAC,GAAD;IACE,UAAU;IACV,yBAAyB;IACzB,aAAa;IACb,YAAY;IACZ,cAAc;IACd,CAAA;GAEA;;;AAQV,SAAgB,EACd,GACA,GACA,GACA,GACA,GACA,GACA,GACA,GACA,GACgC;AAChC,QAAO,aAAuB;AAe5B,OAbA,MAAM,EAAY;GAChB,MAAM;GACN,cAAc;GACd,uBAAuB,EAAS;GAChC;GACA;GACA;GACA;GACA;GACA,eAAe,GAAU;GACzB;GACD,CAAC,IAEW;GAGX,IAAM,IAAa;AAEnB,OAAI,EAAiB,EAAW,KAAK,EAAE;AAErC,QAAI,EAAW,KAAK,SAClB,MAAK,IAAI,IAAI,GAAG,IAAI,EAAW,KAAK,SAAS,QAAQ,KAAK;KACxD,IAAM,IAAY,EAAW,KAAK,SAAS;AAE3C,WAAM,EAAY;MAChB,MAAM;MACN,cAAc,EAAW,eAAe;MACxC,6BAA6B,EAAwB,EAAU;MAC/D;MACA;MACA;MACA;MACA;MACA,eAAe,GAAU;MACzB;MACD,CAAC;;AAKN,IAAI,EAAgB,EAAW,KAAK,KAwBlC,MAAM;KAlBF,MAAM;MACJ,IAAI,EAAW,KAAK,KAAK;MACzB,MAAM,EANV,kBAAkB,IAMR;MACN,iBAAiB;MACjB,uBAAuB,EAAW,KAAK;MACvC,QAAQ;MACR,YAAY;MACZ,eAAe,GAAU;MACzB,YAAY;MACZ,cAAc,EAAW,eAAe;MACxC,qBAAqB;MACrB;MACD;KACD,cAAc,EAAW,eAAe;KACxC,MAAM,EACJ,kBAAkB,IACnB;KAEC;;;;;AAuBhB,IAAa,KACX,MACoB;CACpB,IAAM,EACJ,0BACA,kBACA,iBACA,aACA,qBACA,oBACA,iBACA,kBACE,GAEE,EAAE,gBAAa,kBAAe,GAAmB,EACjD,IAAc,GAAgB,EAE9B,CAAC,GAAU,KAAe,EAC9B,EACD,EAEK,IAAe,EAAmC,KAAK;AAE7D,SAAgB;AACd,IAAY,EAAsB;IACjC,CAAC,GAAuB,EAAsB,SAAS,CAAC;CAG3D,IAAM,IAAW,GACd,MAKK,MAAU,KAAK,CAAC,EAAsB,OACjC,IAKF,MAAiB,EAAmB,YAAY,KAAK,IAE9D,CAAC,GAAc,EAAsB,KAAK,CAC3C,EAMK,IAA0B,EAE9B,OAAO,MAAqC;EAE1C,IAAM,IAA+C;GACnD,UAAU,EAAK;GACf,eAAe,EAAK;GACpB,cAAc;GACf,EACK,IAAW,MAAM,EAAY,WAAW;GAC5C,UAAU,EAAW,0BACnB,GACA,GACD;GACD,eAAe,EAAkB,GAAuB,EAAY;GACrE,CAAC;AAEF,MAAI,EAAK,eACF,IAAM,KAAY,EAAS,KAE9B,CAAK,EAAK,SAAS,MAAK,MAAS,EAAM,MAAM,EAAS,GAAG,IACvD,EAAK,SAAS,KAAK,EAAS;MAIhC,GAAK,WAAW,EAAS;AAc3B,EAZA,EAAK,wBAAwB,EAAS,eAGlC,EAAa,WACf,MAAM,EAAa,QAAQ,cAAc,GACtC,EAAK,KAAK,EACT,MAAM,IACP,EACF,CAAC,EAIJ,EAAY,EAAU,EAAS,CAAC;IAElC;EAAC;EAAc;EAAa;EAAY;EAAU;EAAY,CAC/D,EAMK,IAAqB,EACzB,EACE,GACA,GACA,GACA,GACA,GACA,GACA,GACA,GACA,EACD,EACD;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;AAED,QACE,kBAAC,GAAD;EAAW,cAAA;aACP,EAAE,gBACF,kBAAC,GAAD;GACE,KAAK;GACL,YAAY;GACF;GACF;GACR,OAAO;GACP,OAAM;aAEL;GACgB,CAAA;EAEX,CAAA"}
+{"version":3,"file":"VirtualizedTree.js","names":[],"sources":["../../../../src/components/EntityFinder/tree/VirtualizedTree.tsx"],"sourcesContent":["import React from 'react'\nimport { getEntityChildren } from '@/synapse-client'\nimport { useSynapseContext } from '@/utils'\nimport { formatDate } from '@/utils/functions/DateFormatter'\nimport {\n  getEntityTypeFromHeader,\n  isContainerType,\n} from '@/utils/functions/EntityTypeUtils'\nimport { Writable } from '@/utils/types/Writable'\nimport { ChevronRight, ExpandMore } from '@mui/icons-material'\nimport { Skeleton, Tooltip, Typography } from '@mui/material'\nimport { EntityType } from '@sage-bionetworks/synapse-client'\nimport { EntityChildrenRequest } from '@sage-bionetworks/synapse-types'\nimport { useQueryClient } from '@tanstack/react-query'\nimport dayjs from 'dayjs'\nimport { cloneDeep } from 'lodash-es'\nimport { ReactNode, useCallback, useEffect, useRef, useState } from 'react'\nimport { useInView } from 'react-intersection-observer'\nimport AutoSizer from 'react-virtualized-auto-sizer'\nimport {\n  TreeWalker,\n  TreeWalkerValue,\n  VariableSizeNodeData,\n  VariableSizeNodePublicState,\n  VariableSizeTree,\n} from 'react-vtree'\nimport { NodeComponentProps } from 'react-vtree/dist/es/Tree'\nimport { EntityBadgeIcons } from '../../EntityBadgeIcons'\nimport { EntityTypeIcon } from '../../EntityIcon'\nimport { SynapseSpinner } from '../../LoadingScreen/LoadingScreen'\nimport { UserBadge } from '../../UserCard/UserBadge'\nimport { EntityFinderHeader } from '../EntityFinderHeader'\nimport { EntitySelectionMapType } from '../useEntitySelection'\n\nexport enum EntityTreeNodeType {\n  /** The tree component's appearance and interactions will facilitate selection. Nodes will be larger and styles will indicate primary selection */\n  SINGLE_PANE,\n  /** The tree component's appearance and interactions will facilitate browsing. Nodes will be smaller and styles will indicate secondary selection */\n  DUAL_PANE,\n}\n\ntype NodeChildren = Readonly<{\n  /** The node's children. If undefined, then children have not been fetched. */\n  children?: EntityHeaderNode[]\n  /** The token used to fetch the next page of children for this entity. If this property is nullish and children is defined, then all children have been fetched. */\n  childrenNextPageToken?: string | null\n}>\n\nexport type EntityHeaderNode = (\n  | EntityFinderHeader\n  // Only will have a subset of fields if the node is fetched via the entity path:\n  | Pick<EntityFinderHeader, 'id' | 'name' | 'type'>\n) &\n  NodeChildren\ntype PaginationNode = { __paginationNode: true }\n\ntype TreeNode = EntityHeaderNode | RootNodeConfiguration | PaginationNode\n\nfunction getTreeNodeType(\n  node: TreeNode,\n): 'entityHeader' | 'rootNodeConfiguration' | 'pagination' {\n  if ('__paginationNode' in node) {\n    return 'pagination'\n  }\n  return 'id' in node ? 'entityHeader' : 'rootNodeConfiguration'\n}\n\nfunction isPaginationNode(node: TreeNode): node is PaginationNode {\n  return getTreeNodeType(node) === 'pagination'\n}\n\nfunction isEntityHeaderNode(node: TreeNode): node is EntityHeaderNode {\n  return getTreeNodeType(node) === 'entityHeader'\n}\n\nfunction isRootNodeConfiguration(\n  node: TreeNode,\n): node is RootNodeConfiguration {\n  return getTreeNodeType(node) === 'rootNodeConfiguration'\n}\n\nfunction hasMoreChildren(node: TreeNode) {\n  if (isPaginationNode(node)) {\n    return false\n  } else if (isRootNodeConfiguration(node)) {\n    return node.hasNextPage\n  }\n\n  return node.children == null || node.childrenNextPageToken != null\n}\n\nfunction isLeafNode(node: TreeNode) {\n  if (isPaginationNode(node)) {\n    return true\n  } else if (isRootNodeConfiguration(node)) {\n    return false\n  } else {\n    return (\n      // Entity is not a container\n      !isContainerType(getEntityTypeFromHeader(node)) ||\n      // OR Children have been fetched (nonnull) and there are 0 children\n      (node.children != null && node.children.length === 0)\n    )\n  }\n}\n\nfunction maybeHasChildren(\n  node: TreeNode,\n): node is RootNodeConfiguration | EntityHeaderNode {\n  if (isPaginationNode(node)) {\n    return false\n  } else if (isRootNodeConfiguration(node)) {\n    return node.children.length > 0 || node.hasNextPage\n  } else {\n    return !isLeafNode(node)\n  }\n}\n\nexport type TreeData = VariableSizeNodeData &\n  Readonly<{\n    node: TreeNode\n    getNextPageOfChildren: () => Promise<void>\n    isLeaf: boolean\n    nestingLevel: number\n    setSelectedId: (entityId: string) => void\n    treeNodeType: EntityTreeNodeType\n    isSelected: boolean\n    isDisabled: boolean\n  }>\n\ntype NodeMeta = Readonly<{\n  nestingLevel: number\n  node: TreeNode\n}>\n\nexport type RootNodeConfiguration = {\n  show: boolean\n  nodeText: string\n  children: EntityHeaderNode[]\n  /** If undefined, no more entities to fetch */\n  fetchNextPage: () => Promise<void>\n  hasNextPage: boolean\n}\n\n/**\n * Converts a TreeNode and related data into a TreeWalkerValue that react-vtree can use to render the tree.\n * Exported for testing purposes only.\n * @param config\n * @returns\n */\nexport const getNodeData = (config: {\n  node: TreeNode\n  nestingLevel: number\n  getNextPageOfChildren: () => Promise<void>\n  setSelectedId: (entityId: string) => void\n  treeNodeType: EntityTreeNodeType\n  selected: EntitySelectionMapType\n  selectableTypes: EntityType[]\n  autoExpand: (entityId: string) => boolean\n  defaultHeight: number\n  currentContainer?: string | 'root' | null\n}): TreeWalkerValue<TreeData, NodeMeta> => {\n  const {\n    node,\n    nestingLevel,\n    getNextPageOfChildren,\n    setSelectedId,\n    treeNodeType,\n    selected,\n    selectableTypes,\n    autoExpand,\n    defaultHeight,\n    currentContainer,\n  } = config\n\n  if (isPaginationNode(node)) {\n    throw new Error('Cannot create data for a pagination node')\n  }\n\n  const id = isRootNodeConfiguration(node) ? 'root' : node.id\n\n  const isSelected =\n    treeNodeType === EntityTreeNodeType.SINGLE_PANE\n      ? selected.has(id)\n      : currentContainer === id\n  const isDisabled =\n    !isRootNodeConfiguration(node) &&\n    !selectableTypes.includes(getEntityTypeFromHeader(node))\n\n  const isOpenByDefault = autoExpand(id)\n  /*\n   * If the node is open by default and we haven't fetched its children,\n   * fetch the first page (otherwise we won't fetch unless re-toggled)\n   */\n  if (isOpenByDefault && node.children == null && hasMoreChildren(node)) {\n    getNextPageOfChildren()\n  }\n\n  return {\n    data: {\n      node,\n      getNextPageOfChildren,\n      id: id,\n      isLeaf: isLeafNode(node),\n      isOpenByDefault: isOpenByDefault,\n      nestingLevel,\n      setSelectedId,\n      treeNodeType,\n      isSelected,\n      isDisabled,\n      defaultHeight,\n    },\n    nestingLevel,\n    node,\n  }\n}\n\n/**\n * Node component for the react-vtree virtualized tree. Exported only for testing purposes\n */\nexport function Node(\n  props: NodeComponentProps<TreeData, VariableSizeNodePublicState<TreeData>>,\n) {\n  const {\n    data: {\n      node,\n      getNextPageOfChildren,\n      isLeaf,\n      id,\n      nestingLevel,\n      setSelectedId,\n      treeNodeType,\n      isSelected,\n      isDisabled,\n    },\n    isOpen,\n    style,\n    setOpen,\n  } = props\n\n  const [isLoading, setLoading] = useState(false)\n\n  const nodeText = isEntityHeaderNode(node) ? (\n    <span>{node.name}</span>\n  ) : isRootNodeConfiguration(node) ? (\n    <span>{node.nodeText}</span>\n  ) : (\n    // Pagination node\n    <Skeleton width={100} />\n  )\n\n  // We only use this for pagination nodes. If the pagination node comes into view, then immediately call `getNextPageOfChildren`\n  const { ref, inView } = useInView()\n\n  useEffect(() => {\n    if (isPaginationNode(node) && inView) {\n      getNextPageOfChildren()\n    }\n  }, [node, inView, getNextPageOfChildren])\n\n  const toggleExpand = useCallback(async () => {\n    if (hasMoreChildren(node)) {\n      setLoading(true)\n      await getNextPageOfChildren()\n      await setOpen(!isOpen)\n      setLoading(false)\n    } else {\n      await setOpen(!isOpen)\n    }\n  }, [getNextPageOfChildren, node, isOpen, setOpen])\n\n  /**\n   * If in the dual-pane view, expand a node when it becomes selected\n   */\n  useEffect(() => {\n    if (\n      treeNodeType === EntityTreeNodeType.DUAL_PANE &&\n      isSelected &&\n      !isOpen\n    ) {\n      toggleExpand()\n    }\n    // Intentionally only toggle the expanded state when isSelected changes, otherwise the node cannot be un-expanded\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [isSelected])\n\n  /**\n   * If the height is 0, the node is purposefully hidden. Just render a fragment.\n   */\n  if ('height' in style && style.height === 0) {\n    return <></>\n  }\n\n  let tooltipContent: ReactNode = ''\n  if (isEntityHeaderNode(node)) {\n    tooltipContent = (\n      <div style={{ textAlign: 'center' }}>\n        <Typography\n          component=\"span\"\n          variant=\"smallText1\"\n          sx={{\n            display: 'inline',\n          }}\n        >\n          {node.name}\n          <br />\n          <b>ID: </b>\n          {node.id}\n          {'modifiedBy' in node && (\n            <>\n              <br />\n              <b>Modified By: </b>\n              <UserBadge\n                userId={node.modifiedBy.toString()}\n                showFullName\n                disableLink\n                showCardOnHover={false}\n              />\n            </>\n          )}\n          {'modifiedOn' in node && (\n            <>\n              <br />\n              <b>Modified On: </b>\n              {formatDate(dayjs(node.modifiedOn))}\n            </>\n          )}\n        </Typography>\n      </div>\n    )\n  }\n\n  const ExpandIcon = isOpen ? ExpandMore : ChevronRight\n\n  return (\n    <div\n      className={`Node ${\n        treeNodeType === EntityTreeNodeType.SINGLE_PANE\n          ? 'SelectNode'\n          : 'BrowseNode'\n      }`}\n      aria-selected={isSelected}\n      aria-disabled={isDisabled}\n      onClick={event => {\n        event.stopPropagation()\n        if (!isDisabled) {\n          setSelectedId(id)\n        }\n      }}\n      style={{\n        ...style,\n        paddingLeft: `${nestingLevel * 20}px`,\n      }}\n    >\n      {!isLeaf && (\n        <>\n          {isLoading ? (\n            <SynapseSpinner size={10} />\n          ) : (\n            <button\n              aria-label={isOpen ? 'Collapse' : 'Expand'}\n              onClick={event => {\n                event.stopPropagation()\n                toggleExpand()\n              }}\n            >\n              <ExpandIcon className=\"ExpandButton\" />\n            </button>\n          )}\n        </>\n      )}\n      {treeNodeType === EntityTreeNodeType.SINGLE_PANE && ( // SWC-5592\n        <div className=\"EntityIcon\">\n          {isEntityHeaderNode(node) && (\n            <EntityTypeIcon type={getEntityTypeFromHeader(node)} />\n          )}\n        </div>\n      )}\n\n      <Tooltip title={tooltipContent} placement=\"right\">\n        <div className=\"EntityName\" ref={ref}>\n          {nodeText}\n        </div>\n      </Tooltip>\n\n      {treeNodeType === EntityTreeNodeType.SINGLE_PANE && (\n        <EntityBadgeIcons\n          entityId={id}\n          showHasDiscussionThread={false}\n          showHasWiki={false}\n          showUnlink={false}\n          canOpenModal={false}\n        />\n      )}\n    </div>\n  )\n}\n\n/**\n * Extracted from the React component for testing purposes\n * @returns a generator function compatible with react-vtree\n */\nexport function getTreeWalkerFunction(\n  rootNode: RootNodeConfiguration,\n  setSelectedId: VirtualizedTreeProps['setSelectedId'],\n  treeNodeType: VirtualizedTreeProps['treeNodeType'],\n  selected: VirtualizedTreeProps['selected'],\n  selectableTypes: VirtualizedTreeProps['selectableTypes'],\n  autoExpand: VirtualizedTreeProps['autoExpand'],\n  itemSize: (index?: number) => number,\n  currentContainer: VirtualizedTreeProps['currentContainer'],\n  fetchNextPageOfChildren: (node: Writable<EntityHeaderNode>) => Promise<void>,\n): TreeWalker<TreeData, NodeMeta> {\n  return function* treeWalker() {\n    // Step [1]: Define the root node of our tree.\n    yield getNodeData({\n      node: rootNode,\n      nestingLevel: 0,\n      getNextPageOfChildren: rootNode.fetchNextPage,\n      setSelectedId,\n      treeNodeType,\n      selected,\n      selectableTypes,\n      autoExpand,\n      defaultHeight: itemSize(),\n      currentContainer,\n    })\n\n    while (true) {\n      // Step [2]: Get the parent node and nesting level, which will be passed into the Generator.next function by react-vtree.\n      // Yielding `undefined` indicates to react-vtree that we've finished iterating children from the last time we were in the loop.\n      const parentMeta = yield\n\n      if (maybeHasChildren(parentMeta.node)) {\n        // Step [3]: Yielding all the known children of the parent\n        if (parentMeta.node.children) {\n          for (let i = 0; i < parentMeta.node.children.length; i++) {\n            const childNode = parentMeta.node.children[i]\n\n            yield getNodeData({\n              node: childNode,\n              nestingLevel: parentMeta.nestingLevel + 1,\n              getNextPageOfChildren: () => fetchNextPageOfChildren(childNode),\n              setSelectedId,\n              treeNodeType,\n              selected,\n              selectableTypes,\n              autoExpand,\n              defaultHeight: itemSize(),\n              currentContainer,\n            })\n          }\n        }\n\n        // Step [4] - If the parent node has more children, render a \"pagination node\" that will fetch more children when it comes into view (via intersection observer)\n        if (hasMoreChildren(parentMeta.node)) {\n          const paginationNode: PaginationNode = {\n            __paginationNode: true,\n          }\n          const paginationTreeWalkerValue: TreeWalkerValue<TreeData, NodeMeta> =\n            {\n              data: {\n                id: parentMeta.data.id + '-pagination',\n                node: paginationNode,\n                isOpenByDefault: false,\n                getNextPageOfChildren: parentMeta.data.getNextPageOfChildren,\n                isLeaf: true,\n                isSelected: false,\n                defaultHeight: itemSize(),\n                isDisabled: true,\n                nestingLevel: parentMeta.nestingLevel + 1,\n                setSelectedId: () => {},\n                treeNodeType,\n              },\n              nestingLevel: parentMeta.nestingLevel + 1,\n              node: {\n                __paginationNode: true,\n              },\n            }\n          yield paginationTreeWalkerValue\n        }\n      }\n    }\n  }\n}\n\nexport type VirtualizedTreeProps = Readonly<{\n  treeNodeType: EntityTreeNodeType\n  rootNodeConfiguration: RootNodeConfiguration\n  setSelectedId: (entityId: string) => void\n  selected: EntitySelectionMapType\n  /* currentContainer is the container whose contents are shown on in the right pane in dual-pane configuration, and may only be defined when treeNodeType is DUAL_PANE */\n  currentContainer?: string | 'root' | null\n  autoExpand: (entityId: string) => boolean\n  selectableTypes: EntityType[]\n  visibleTypes: EntityType[]\n}>\n\n/**\n * Component that utilizes react-vtree to efficiently display a tree of entities. react-vtree utilizes react-window\n * to only render visible nodes, which eliminates performance issues as seen in SWC-5978.\n */\nexport const VirtualizedTree = (\n  props: VirtualizedTreeProps,\n): React.ReactNode => {\n  const {\n    rootNodeConfiguration,\n    setSelectedId,\n    treeNodeType,\n    selected,\n    currentContainer,\n    selectableTypes,\n    visibleTypes,\n    autoExpand,\n  } = props\n\n  const { accessToken, keyFactory } = useSynapseContext()\n  const queryClient = useQueryClient()\n\n  const [rootNode, setRootNode] = useState<RootNodeConfiguration>(\n    rootNodeConfiguration,\n  )\n\n  const treeInstance = useRef<VariableSizeTree<TreeData>>(null)\n\n  useEffect(() => {\n    setRootNode(rootNodeConfiguration)\n  }, [rootNodeConfiguration, rootNodeConfiguration.children])\n\n  // This function is used by VariableSizeTree to identify the size of each node in the tree.\n  const itemSize = useCallback(\n    (index?: number) => {\n      /**\n       * We must have a root node, but we don't always want to show it.\n       * In those cases, set the height of the root node to 0.\n       */\n      if (index === 0 && !rootNodeConfiguration.show) {\n        return 0\n      }\n      /**\n       * The height of all other nodes in the tree varies depending on the tree node type.\n       */\n      return treeNodeType === EntityTreeNodeType.DUAL_PANE ? 30 : 60\n    },\n    [treeNodeType, rootNodeConfiguration.show],\n  )\n\n  /**\n   * Fetches the next page of children for a given node. After fetching the children, this method will make a deep clone of the\n   *  full tree, including the new data, and updates the state of the component\n   */\n  const fetchNextPageOfChildren = useCallback(\n    // Because we update the root node with a copy at the end of this function, we can write to the node under update.\n    async (node: Writable<EntityHeaderNode>) => {\n      // Fetch the children of the node\n      const entityChildrenRequest: EntityChildrenRequest = {\n        parentId: node.id,\n        nextPageToken: node.childrenNextPageToken,\n        includeTypes: visibleTypes,\n      }\n      const children = await queryClient.fetchQuery({\n        queryKey: keyFactory.getEntityChildrenQueryKey(\n          entityChildrenRequest,\n          false,\n        ),\n        queryFn: () => getEntityChildren(entityChildrenRequest, accessToken),\n      })\n      // Update the node data -- add the children and store the nextPageToken\n      if (node.children) {\n        for (const newChild of children.page) {\n          // SWC-6751 - Prevent adding duplicate entries in case this function is called twice\n          if (!node.children.find(child => child.id == newChild.id)) {\n            node.children.push(newChild)\n          }\n        }\n      } else {\n        node.children = children.page\n      }\n      node.childrenNextPageToken = children.nextPageToken\n\n      // Ensure the node for which we fetched children is expanded/open\n      if (treeInstance.current) {\n        await treeInstance.current.recomputeTree({\n          [node.id]: {\n            open: true,\n          },\n        })\n      }\n\n      // cloneDeep is required to re-render the tree with the new children\n      setRootNode(cloneDeep(rootNode))\n    },\n    [visibleTypes, queryClient, keyFactory, rootNode, accessToken],\n  )\n\n  /**\n   * treeWalker is a generator function used by react-vtree to generate the tree structure. The tree is re-built when the function is updated,\n   * so the dependencies specified in useCallback are important.\n   */\n  const memoizedTreeWalker = useCallback(\n    getTreeWalkerFunction(\n      rootNode,\n      setSelectedId,\n      treeNodeType,\n      selected,\n      selectableTypes,\n      autoExpand,\n      itemSize,\n      currentContainer,\n      fetchNextPageOfChildren,\n    ),\n    [\n      rootNode,\n      setSelectedId,\n      treeNodeType,\n      selected,\n      selectableTypes,\n      autoExpand,\n      currentContainer,\n      fetchNextPageOfChildren,\n      itemSize,\n    ],\n  )\n\n  return (\n    <AutoSizer disableWidth>\n      {({ height }: { height: number }) => (\n        <VariableSizeTree\n          ref={treeInstance}\n          treeWalker={memoizedTreeWalker}\n          itemSize={itemSize}\n          height={height}\n          async={true}\n          width=\"100%\"\n        >\n          {Node}\n        </VariableSizeTree>\n      )}\n    </AutoSizer>\n  )\n}\n"],"mappings":"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"}

package/dist/components/EntityFinder/useEntitySelection.js.map

@@ -1 +1 @@
-{"version":3,"file":"useEntitySelection.js","names":[],"sources":["../../../src/components/EntityFinder/useEntitySelection.ts"],"sourcesContent":["import { Reference } from '@sage-bionetworks/synapse-types'\nimport { Map } from 'immutable'\nimport { isEqual } from 'lodash-es'\nimport { useCallback, useReducer } from 'react'\n\n// Represents the selection type. The key is the entity ID. Only one version of an entity can be chosen at a time.\nexport type EntitySelectionMapType = Map<string, Reference>\n\nexport function useEntitySelection(\n  selectMultiple: boolean,\n  initialSelection: EntitySelectionMapType = Map<string, Reference>(),\n) {\n  /**\n   *\n   * @param entity The entity to check selected status\n   * @param selected the list of selected entities\n   * @returns a boolean array of length equal to entities.length denoting selection status\n   */\n  const isSelected = useCallback(\n    (entity: Reference, selected: EntitySelectionMapType): boolean => {\n      const match = selected.get(entity.targetId)\n      if (match == null) {\n        return false\n      }\n      return isEqual(entity, match)\n    },\n    [],\n  )\n\n  type ReducerAction =\n    | {\n        type: 'toggleSelection'\n        toggledReferences: Reference | Reference[]\n      }\n    | {\n        type: 'setSelection'\n        selection: EntitySelectionMapType\n      }\n    | {\n        type: 'setInitialVersion'\n        entityId: string\n        version: number\n      }\n\n  /**\n   * Given the existing selections and a list of toggled references, return the new list of selections\n   * @param currentState\n   * @param action\n   * @returns\n   */\n  const entitySelectionReducer = useCallback(\n    (\n      currentState: EntitySelectionMapType,\n      action: ReducerAction,\n    ): EntitySelectionMapType => {\n      if (action.type === 'setSelection') {\n        return action.selection\n      }\n      if (action.type === 'setInitialVersion') {\n        // Safe to call from effects multiple times — only acts the first time\n        const existing = currentState.get(action.entityId)\n        if (existing != null && existing.targetVersionNumber == null) {\n          return currentState.set(action.entityId, {\n            targetId: action.entityId,\n            targetVersionNumber: action.version,\n          })\n        }\n        // Entity not selected, or already has a version - no-op\n        return currentState\n      }\n      if (action.type === 'toggleSelection') {\n        let toggledReferences = action.toggledReferences\n        return currentState.withMutations(map => {\n          // Note: we currently don't allow selecting two versions of the same entity, so we replace previous selected version with new selected version\n          if (!Array.isArray(toggledReferences)) {\n            toggledReferences = [toggledReferences]\n          }\n          toggledReferences.forEach(toggledReference => {\n            if (isSelected(toggledReference, currentState)) {\n              // remove from selection\n              map.delete(toggledReference.targetId)\n            } else {\n              // add to selection\n              if (!selectMultiple) {\n                map.clear()\n              }\n              map.set(toggledReference.targetId, toggledReference)\n            }\n          })\n        })\n      }\n      return currentState\n    },\n    [isSelected, selectMultiple],\n  )\n\n  const [selectedEntities, dispatch] = useReducer(\n    entitySelectionReducer,\n    initialSelection,\n  )\n\n  const toggleSelection = useCallback(\n    (toggledReferences: Reference | Reference[]) =>\n      dispatch({ type: 'toggleSelection', toggledReferences }),\n    [],\n  )\n\n  const setSelection = useCallback(\n    (selection: EntitySelectionMapType) =>\n      dispatch({ type: 'setSelection', selection }),\n    [],\n  )\n\n  const setInitialVersion = useCallback(\n    (entityId: string, version: number) =>\n      dispatch({ type: 'setInitialVersion', entityId, version }),\n    [],\n  )\n\n  return {\n    selectedEntities,\n    toggleSelection,\n    setSelection,\n    setInitialVersion,\n  }\n}\n"],"mappings":";;;;AAQA,SAAgB,EACd,GACA,IAA2C,GAAwB,EACnE;CAOA,IAAM,IAAa,GAChB,GAAmB,MAA8C;EAChE,IAAM,IAAQ,EAAS,IAAI,EAAO,SAAS;AAI3C,SAHI,KAAS,OACJ,KAEF,EAAQ,GAAQ,EAAM;IAE/B,EAAE,CACH,EAqEK,CAAC,GAAkB,KAAY,EA9CN,GAE3B,GACA,MAC2B;AAC3B,MAAI,EAAO,SAAS,eAClB,QAAO,EAAO;AAEhB,MAAI,EAAO,SAAS,qBAAqB;GAEvC,IAAM,IAAW,EAAa,IAAI,EAAO,SAAS;AAQlD,UAPI,KAAY,QAAQ,EAAS,uBAAuB,OAC/C,EAAa,IAAI,EAAO,UAAU;IACvC,UAAU,EAAO;IACjB,qBAAqB,EAAO;IAC7B,CAAC,GAGG;;AAET,MAAI,EAAO,SAAS,mBAAmB;GACrC,IAAI,IAAoB,EAAO;AAC/B,UAAO,EAAa,eAAc,MAAO;AAKvC,IAHK,MAAM,QAAQ,EAAkB,KACnC,IAAoB,CAAC,EAAkB,GAEzC,EAAkB,SAAQ,MAAoB;AAC5C,KAAI,EAAW,GAAkB,EAAa,GAE5C,EAAI,OAAO,EAAiB,SAAS,IAGhC,KACH,EAAI,OAAO,EAEb,EAAI,IAAI,EAAiB,UAAU,EAAiB;MAEtD;KACF;;AAEJ,SAAO;IAET,CAAC,GAAY,EAAe,CAI5B,EACA,EACD;AAoBD,QAAO;EACL;EACA,iBApBsB,GACrB,MACC,EAAS;GAAE,MAAM;GAAmB;GAAmB,CAAC,EAC1D,EAAE,CAiBF;EACA,cAfmB,GAClB,MACC,EAAS;GAAE,MAAM;GAAgB;GAAW,CAAC,EAC/C,EAAE,CAYF;EACA,mBAVwB,GACvB,GAAkB,MACjB,EAAS;GAAE,MAAM;GAAqB;GAAU;GAAS,CAAC,EAC5D,EAAE,CAOF;EACD"}
+{"version":3,"file":"useEntitySelection.js","names":[],"sources":["../../../src/components/EntityFinder/useEntitySelection.ts"],"sourcesContent":["import { Reference } from '@sage-bionetworks/synapse-types'\nimport { Map } from 'immutable'\nimport { isEqual } from 'lodash-es'\nimport { useCallback, useReducer } from 'react'\n\n// Represents the selection type. The key is the entity ID. Only one version of an entity can be chosen at a time.\nexport type EntitySelectionMapType = Map<string, Reference>\n\nexport function useEntitySelection(\n  selectMultiple: boolean,\n  initialSelection: EntitySelectionMapType = Map<string, Reference>(),\n) {\n  /**\n   *\n   * @param entity The entity to check selected status\n   * @param selected the list of selected entities\n   * @returns a boolean array of length equal to entities.length denoting selection status\n   */\n  const isSelected = useCallback(\n    (entity: Reference, selected: EntitySelectionMapType): boolean => {\n      const match = selected.get(entity.targetId)\n      if (match == null) {\n        return false\n      }\n      return isEqual(entity, match)\n    },\n    [],\n  )\n\n  type ReducerAction =\n    | {\n        type: 'toggleSelection'\n        toggledReferences: Reference | Reference[]\n      }\n    | {\n        type: 'setSelection'\n        selection: EntitySelectionMapType\n      }\n    | {\n        type: 'setInitialVersion'\n        entityId: string\n        version: number\n      }\n\n  /**\n   * Given the existing selections and a list of toggled references, return the new list of selections\n   * @param currentState\n   * @param action\n   * @returns\n   */\n  const entitySelectionReducer = useCallback(\n    (\n      currentState: EntitySelectionMapType,\n      action: ReducerAction,\n    ): EntitySelectionMapType => {\n      if (action.type === 'setSelection') {\n        return action.selection\n      }\n      if (action.type === 'setInitialVersion') {\n        // Safe to call from effects multiple times — only acts the first time\n        const existing = currentState.get(action.entityId)\n        if (existing != null && existing.targetVersionNumber == null) {\n          return currentState.set(action.entityId, {\n            targetId: action.entityId,\n            targetVersionNumber: action.version,\n          })\n        }\n        // Entity not selected, or already has a version - no-op\n        return currentState\n      }\n      if (action.type === 'toggleSelection') {\n        let toggledReferences = action.toggledReferences\n        return currentState.withMutations(map => {\n          // Note: we currently don't allow selecting two versions of the same entity, so we replace previous selected version with new selected version\n          if (!Array.isArray(toggledReferences)) {\n            toggledReferences = [toggledReferences]\n          }\n          toggledReferences.forEach(toggledReference => {\n            if (isSelected(toggledReference, currentState)) {\n              // remove from selection\n              map.delete(toggledReference.targetId)\n            } else {\n              // add to selection\n              if (!selectMultiple) {\n                map.clear()\n              }\n              map.set(toggledReference.targetId, toggledReference)\n            }\n          })\n        })\n      }\n      return currentState\n    },\n    [isSelected, selectMultiple],\n  )\n\n  const [selectedEntities, dispatch] = useReducer(\n    entitySelectionReducer,\n    initialSelection,\n  )\n\n  const toggleSelection = useCallback(\n    (toggledReferences: Reference | Reference[]) =>\n      dispatch({ type: 'toggleSelection', toggledReferences }),\n    [],\n  )\n\n  const setSelection = useCallback(\n    (selection: EntitySelectionMapType) =>\n      dispatch({ type: 'setSelection', selection }),\n    [],\n  )\n\n  const setInitialVersion = useCallback(\n    (entityId: string, version: number) =>\n      dispatch({ type: 'setInitialVersion', entityId, version }),\n    [],\n  )\n\n  return {\n    selectedEntities,\n    toggleSelection,\n    setSelection,\n    setInitialVersion,\n  }\n}\n"],"mappings":";;;;AAQA,SAAgB,EACd,GACA,IAA2C,EAAuB,GAClE;CAOA,IAAM,IAAa,GAChB,GAAmB,MAA8C;EAChE,IAAM,IAAQ,EAAS,IAAI,EAAO,QAAQ;EAI1C,OAHI,KAAS,OACJ,KAEF,EAAQ,GAAQ,CAAK;CAC9B,GACA,CAAC,CACH,GAqEM,CAAC,GAAkB,KAAY,EA9CN,GAE3B,GACA,MAC2B;EAC3B,IAAI,EAAO,SAAS,gBAClB,OAAO,EAAO;EAEhB,IAAI,EAAO,SAAS,qBAAqB;GAEvC,IAAM,IAAW,EAAa,IAAI,EAAO,QAAQ;GAQjD,OAPI,KAAY,QAAQ,EAAS,uBAAuB,OAC/C,EAAa,IAAI,EAAO,UAAU;IACvC,UAAU,EAAO;IACjB,qBAAqB,EAAO;GAC9B,CAAC,IAGI;EACT;EACA,IAAI,EAAO,SAAS,mBAAmB;GACrC,IAAI,IAAoB,EAAO;GAC/B,OAAO,EAAa,eAAc,MAAO;IAKvC,AAHK,MAAM,QAAQ,CAAiB,MAClC,IAAoB,CAAC,CAAiB,IAExC,EAAkB,SAAQ,MAAoB;KAC5C,AAAI,EAAW,GAAkB,CAAY,IAE3C,EAAI,OAAO,EAAiB,QAAQ,KAG/B,KACH,EAAI,MAAM,GAEZ,EAAI,IAAI,EAAiB,UAAU,CAAgB;IAEvD,CAAC;GACH,CAAC;EACH;EACA,OAAO;CACT,GACA,CAAC,GAAY,CAAc,CAI3B,GACA,CACF;CAoBA,OAAO;EACL;EACA,iBApBsB,GACrB,MACC,EAAS;GAAE,MAAM;GAAmB;EAAkB,CAAC,GACzD,CAAC,CAiBD;EACA,cAfmB,GAClB,MACC,EAAS;GAAE,MAAM;GAAgB;EAAU,CAAC,GAC9C,CAAC,CAYD;EACA,mBAVwB,GACvB,GAAkB,MACjB,EAAS;GAAE,MAAM;GAAqB;GAAU;EAAQ,CAAC,GAC3D,CAAC,CAOD;CACF;AACF"}

package/dist/components/EntityForm/EntityForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityForm.js","names":[],"sources":["../../../src/components/EntityForm/EntityForm.tsx"],"sourcesContent":["// EntityForm:\nimport SynapseClient from '@/synapse-client'\nimport { getFileHandleContent } from '@/synapse-client/SynapseClient'\nimport { SynapseContext } from '@/utils/context/SynapseContext'\n// Will generate a Form (based on your schema files).\n// Gathers user input (including files)\n// Will give you the Synapse ID of the FileEntity that contains the user form data.\nimport Form from '@rjsf/core'\nimport validator from '@rjsf/validator-ajv8'\nimport {\n  EntityId,\n  EntityLookupRequest,\n  FileEntity,\n  UserProfile,\n} from '@sage-bionetworks/synapse-types'\nimport { Component, ContextType, createRef } from 'react'\n\nexport type EntityFormProps = {\n  // Provide the parent container (folder/project), that should contain a folder (named <user_id>) that this user can write to.\n  parentContainerId: string\n  formSchemaEntityId: string // Synapse file that contains the form schema.\n  formUiSchemaEntityId: string // Synapse file that contains the form ui schema.\n  initFormData: boolean // If true, it indicates that you’d like to download and pre-fill the form with the user's previous response.\n  synIdCallback: (synId: string) => void // callback.  Once the form output has been saved to a FileEntity, will send synID back\n}\ntype EntityFormState = {\n  error?: any\n  isLoading?: boolean\n  successfullyUploaded: boolean\n  containerId?: string\n  userprofile?: UserProfile\n  currentFileEntity?: FileEntity // file holding user form data\n  formData?: any // form data that prepopulates the form\n  formSchema?: any // schema that drives the form\n  formUiSchema?: any // ui schema that directs how to render the form elements\n}\n\nexport class EntityForm extends Component<EntityFormProps, EntityFormState> {\n  static contextType = SynapseContext\n  declare context: NonNullable<ContextType<typeof SynapseContext>>\n\n  formRef: any\n\n  constructor(props: EntityFormProps) {\n    super(props)\n    this.formRef = createRef()\n    this.state = {\n      isLoading: true,\n      successfullyUploaded: false,\n    }\n  }\n\n  componentDidMount() {\n    this.refresh()\n  }\n\n  submitForm = () => {\n    this.formRef.current.submit()\n  }\n\n  refresh = () => {\n    if (this.context.isAuthenticated && this.context.accessToken) {\n      const promises = [\n        SynapseClient.getUserProfile(this.context.accessToken),\n        SynapseClient.getEntity(\n          this.context.accessToken,\n          this.props.formSchemaEntityId,\n        ),\n        SynapseClient.getEntity(\n          this.context.accessToken,\n          this.props.formUiSchemaEntityId,\n        ),\n      ] as Promise<any>[]\n      Promise.all(promises)\n        .then(values => {\n          const userprofile: UserProfile = values[0]\n          this.getTargetContainer(userprofile, this.context.accessToken!).then(\n            // @ts-ignore\n            (targetContainerId: string) => {\n              const formSchemaFileEntity: FileEntity = values[1]\n              const formUiSchemaFileEntity: FileEntity = values[2]\n              this.getSchemaFileContent(\n                targetContainerId,\n                formSchemaFileEntity,\n                formUiSchemaFileEntity,\n              )\n            },\n          )\n        })\n        .catch(error => {\n          this.onError(error)\n        })\n    }\n  }\n\n  getSchemaFileContent = (\n    targetFolderId: string,\n    formSchemaFileEntity: FileEntity,\n    formUiSchemaFileEntity: FileEntity,\n  ) => {\n    const promises = [\n      SynapseClient.getFileResult(\n        formSchemaFileEntity,\n        this.context.accessToken,\n        true,\n        true,\n      ),\n      SynapseClient.getFileResult(\n        formUiSchemaFileEntity,\n        this.context.accessToken,\n        true,\n        true,\n      ),\n    ]\n\n    Promise.all(promises)\n      .then(values => {\n        try {\n          const fileContent = values.map(el => {\n            return getFileHandleContent(el.fileHandle!, el.preSignedURL!)\n          })\n          Promise.all(fileContent)\n            .then(el => {\n              const formSchemaContent = JSON.parse(el[0])\n              const formUiSchemaContent = JSON.parse(el[1])\n              this.getExistingFileData(\n                targetFolderId,\n                formSchemaContent,\n                formUiSchemaContent,\n              )\n            })\n            .catch(e => {\n              console.log('getSchemaFileContent: Error getting form content', e)\n            })\n        } catch (e) {\n          console.log('getSchemaFileContent: Error getting schema content', e)\n        }\n      })\n      .catch(error => {\n        this.onError(error)\n      })\n  }\n\n  getExistingFileData = (\n    targetFolderId: string,\n    formSchemaContent: any,\n    formUiSchemaContent: any,\n  ) => {\n    // if data already exists, save a reference to the existing entity and prefill the form\n    const fileName = `${formSchemaContent.title}.json`\n    const entityLookupRequest = {\n      entityName: fileName,\n      parentId: targetFolderId,\n    }\n    let formData: any\n    let currentFileEntity: FileEntity\n    SynapseClient.lookupChildEntity(\n      entityLookupRequest,\n      this.context.accessToken,\n    )\n      .then((entityId: EntityId) => {\n        // ok, found the existing file\n        return SynapseClient.getEntity<FileEntity>(\n          this.context.accessToken,\n          entityId.id,\n        ).then(entity => {\n          currentFileEntity = entity\n          if (this.props.initFormData) {\n            return SynapseClient.getFileResult(\n              currentFileEntity,\n              this.context.accessToken,\n              true,\n              true,\n            ).then(async existingFileData => {\n              try {\n                const fileContent = await getFileHandleContent(\n                  existingFileData.fileHandle!,\n                  existingFileData.preSignedURL!,\n                )\n                formData = JSON.parse(fileContent)\n              } catch (e) {\n                console.log('getExistingFileData: Error setting form data', e)\n              }\n            })\n          }\n          // else we're done\n          return Promise.resolve()\n        })\n      })\n      .finally(() => {\n        this.setState({\n          formData,\n          currentFileEntity,\n          formSchema: formSchemaContent,\n          formUiSchema: formUiSchemaContent,\n        })\n      })\n  }\n\n  getTargetContainer = async (userprofile: UserProfile, token: string) => {\n    const entityLookupRequest: EntityLookupRequest = {\n      entityName: userprofile.ownerId,\n      parentId: this.props.parentContainerId,\n    }\n    try {\n      const entityId = await SynapseClient.lookupChildEntity(\n        entityLookupRequest,\n        token,\n      )\n      // ok, found an entity of the same name.\n      console.log(\n        `EntityForm uploading to https://www.synapse.org/Synapse:${entityId.id}`,\n      )\n      this.setState({\n        userprofile,\n        containerId: entityId.id,\n        isLoading: false,\n      })\n      return entityId.id\n    } catch (error) {\n      if (error.status === 404) {\n        return this.onError(\n          new Error(\n            'Your folder has not yet been set up, please retry in a few minutes.',\n          ),\n        )\n      }\n      // else\n      return this.onError(error)\n    }\n  }\n\n  finishedProcessing = () => {\n    this.setState({\n      isLoading: false,\n      successfullyUploaded: true,\n    })\n  }\n\n  onError = (error: any) => {\n    this.setState({\n      error,\n      isLoading: false,\n      successfullyUploaded: false,\n    })\n  }\n\n  onSubmit = ({ formData }: any) => {\n    this.setState({\n      isLoading: true,\n      successfullyUploaded: false,\n    })\n\n    const submissionFileAndForm: Blob = new Blob([JSON.stringify(formData)], {\n      type: 'text/json',\n    })\n    this.createEntityFile(submissionFileAndForm)\n  }\n\n  createEntityFile = (fileContentsBlob: Blob) => {\n    const fileName = `${this.state.formSchema.title}.json`\n    SynapseClient.uploadFile(\n      this.context.accessToken,\n      fileName,\n      fileContentsBlob,\n    )\n      .then(fileUploadComplete => {\n        // do we need to create a new file entity, or update an existing file entity?\n        const newFileHandleId = fileUploadComplete.fileHandleId\n        if (this.state.currentFileEntity) {\n          const updatedFileEntity = {\n            ...this.state.currentFileEntity,\n            dataFileHandleId: newFileHandleId,\n          }\n          this.setState({\n            currentFileEntity: updatedFileEntity,\n          })\n          return SynapseClient.updateEntity(\n            updatedFileEntity,\n            this.context.accessToken,\n          )\n        }\n        // else, it's a new file entity\n        const newFileEntity: FileEntity = {\n          parentId: this.state.containerId!,\n          name: fileName,\n          concreteType: 'org.sagebionetworks.repo.model.FileEntity',\n          dataFileHandleId: newFileHandleId,\n        }\n        return SynapseClient.createEntity(\n          newFileEntity,\n          this.context.accessToken,\n        )\n      })\n      .then(fileEntity => {\n        // by this point we've either found and updated the existing file entity, or created a new one.\n        this.finishedProcessing()\n        if (this.props.synIdCallback) {\n          this.props.synIdCallback(fileEntity.id!)\n        }\n      })\n      .catch((error: any) => {\n        this.onError(error)\n      })\n  }\n\n  render() {\n    return (\n      <div>\n        {this.state.error && (\n          <div className=\"panel panel-danger errors\">\n            <div className=\"panel-heading\">\n              <h3 className=\"panel-title\">Error</h3>\n            </div>\n            <ul className=\"list-group\">\n              <li className=\"list-group-item text-danger\">\n                {this.state.error.name} {this.state.error.reason}\n                {this.state.error.message}\n              </li>\n            </ul>\n          </div>\n        )}\n        {this.context.accessToken &&\n          !this.state.isLoading &&\n          !this.state.successfullyUploaded &&\n          this.state.formSchema &&\n          this.state.formUiSchema &&\n          !this.state.error && (\n            <Form\n              validator={validator}\n              formData={this.state.formData}\n              schema={this.state.formSchema}\n              uiSchema={this.state.formUiSchema}\n              onSubmit={this.onSubmit}\n              ref={this.formRef}\n            >\n              <div style={{ display: 'none' }}>\n                <button type=\"submit\" className=\"btn btn-info\">\n                  Submit\n                </button>\n              </div>\n            </Form>\n          )}\n        {!this.state.error &&\n          this.context.accessToken &&\n          this.state.isLoading && (\n            <>\n              <span>Saving&hellip;</span>\n              <span style={{ marginLeft: '2px' }} className={'spinner'} />\n            </>\n          )}\n      </div>\n    )\n  }\n}\n\nexport default EntityForm\n"],"mappings":"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"}
+{"version":3,"file":"EntityForm.js","names":[],"sources":["../../../src/components/EntityForm/EntityForm.tsx"],"sourcesContent":["// EntityForm:\nimport SynapseClient from '@/synapse-client'\nimport { getFileHandleContent } from '@/synapse-client/SynapseClient'\nimport { SynapseContext } from '@/utils/context/SynapseContext'\n// Will generate a Form (based on your schema files).\n// Gathers user input (including files)\n// Will give you the Synapse ID of the FileEntity that contains the user form data.\nimport Form from '@rjsf/core'\nimport validator from '@rjsf/validator-ajv8'\nimport {\n  EntityId,\n  EntityLookupRequest,\n  FileEntity,\n  UserProfile,\n} from '@sage-bionetworks/synapse-types'\nimport { Component, ContextType, createRef } from 'react'\n\nexport type EntityFormProps = {\n  // Provide the parent container (folder/project), that should contain a folder (named <user_id>) that this user can write to.\n  parentContainerId: string\n  formSchemaEntityId: string // Synapse file that contains the form schema.\n  formUiSchemaEntityId: string // Synapse file that contains the form ui schema.\n  initFormData: boolean // If true, it indicates that you’d like to download and pre-fill the form with the user's previous response.\n  synIdCallback: (synId: string) => void // callback.  Once the form output has been saved to a FileEntity, will send synID back\n}\ntype EntityFormState = {\n  error?: any\n  isLoading?: boolean\n  successfullyUploaded: boolean\n  containerId?: string\n  userprofile?: UserProfile\n  currentFileEntity?: FileEntity // file holding user form data\n  formData?: any // form data that prepopulates the form\n  formSchema?: any // schema that drives the form\n  formUiSchema?: any // ui schema that directs how to render the form elements\n}\n\nexport class EntityForm extends Component<EntityFormProps, EntityFormState> {\n  static contextType = SynapseContext\n  declare context: NonNullable<ContextType<typeof SynapseContext>>\n\n  formRef: any\n\n  constructor(props: EntityFormProps) {\n    super(props)\n    this.formRef = createRef()\n    this.state = {\n      isLoading: true,\n      successfullyUploaded: false,\n    }\n  }\n\n  componentDidMount() {\n    this.refresh()\n  }\n\n  submitForm = () => {\n    this.formRef.current.submit()\n  }\n\n  refresh = () => {\n    if (this.context.isAuthenticated && this.context.accessToken) {\n      const promises = [\n        SynapseClient.getUserProfile(this.context.accessToken),\n        SynapseClient.getEntity(\n          this.context.accessToken,\n          this.props.formSchemaEntityId,\n        ),\n        SynapseClient.getEntity(\n          this.context.accessToken,\n          this.props.formUiSchemaEntityId,\n        ),\n      ] as Promise<any>[]\n      Promise.all(promises)\n        .then(values => {\n          const userprofile: UserProfile = values[0]\n          this.getTargetContainer(userprofile, this.context.accessToken!).then(\n            // @ts-ignore\n            (targetContainerId: string) => {\n              const formSchemaFileEntity: FileEntity = values[1]\n              const formUiSchemaFileEntity: FileEntity = values[2]\n              this.getSchemaFileContent(\n                targetContainerId,\n                formSchemaFileEntity,\n                formUiSchemaFileEntity,\n              )\n            },\n          )\n        })\n        .catch(error => {\n          this.onError(error)\n        })\n    }\n  }\n\n  getSchemaFileContent = (\n    targetFolderId: string,\n    formSchemaFileEntity: FileEntity,\n    formUiSchemaFileEntity: FileEntity,\n  ) => {\n    const promises = [\n      SynapseClient.getFileResult(\n        formSchemaFileEntity,\n        this.context.accessToken,\n        true,\n        true,\n      ),\n      SynapseClient.getFileResult(\n        formUiSchemaFileEntity,\n        this.context.accessToken,\n        true,\n        true,\n      ),\n    ]\n\n    Promise.all(promises)\n      .then(values => {\n        try {\n          const fileContent = values.map(el => {\n            return getFileHandleContent(el.fileHandle!, el.preSignedURL!)\n          })\n          Promise.all(fileContent)\n            .then(el => {\n              const formSchemaContent = JSON.parse(el[0])\n              const formUiSchemaContent = JSON.parse(el[1])\n              this.getExistingFileData(\n                targetFolderId,\n                formSchemaContent,\n                formUiSchemaContent,\n              )\n            })\n            .catch(e => {\n              console.log('getSchemaFileContent: Error getting form content', e)\n            })\n        } catch (e) {\n          console.log('getSchemaFileContent: Error getting schema content', e)\n        }\n      })\n      .catch(error => {\n        this.onError(error)\n      })\n  }\n\n  getExistingFileData = (\n    targetFolderId: string,\n    formSchemaContent: any,\n    formUiSchemaContent: any,\n  ) => {\n    // if data already exists, save a reference to the existing entity and prefill the form\n    const fileName = `${formSchemaContent.title}.json`\n    const entityLookupRequest = {\n      entityName: fileName,\n      parentId: targetFolderId,\n    }\n    let formData: any\n    let currentFileEntity: FileEntity\n    SynapseClient.lookupChildEntity(\n      entityLookupRequest,\n      this.context.accessToken,\n    )\n      .then((entityId: EntityId) => {\n        // ok, found the existing file\n        return SynapseClient.getEntity<FileEntity>(\n          this.context.accessToken,\n          entityId.id,\n        ).then(entity => {\n          currentFileEntity = entity\n          if (this.props.initFormData) {\n            return SynapseClient.getFileResult(\n              currentFileEntity,\n              this.context.accessToken,\n              true,\n              true,\n            ).then(async existingFileData => {\n              try {\n                const fileContent = await getFileHandleContent(\n                  existingFileData.fileHandle!,\n                  existingFileData.preSignedURL!,\n                )\n                formData = JSON.parse(fileContent)\n              } catch (e) {\n                console.log('getExistingFileData: Error setting form data', e)\n              }\n            })\n          }\n          // else we're done\n          return Promise.resolve()\n        })\n      })\n      .finally(() => {\n        this.setState({\n          formData,\n          currentFileEntity,\n          formSchema: formSchemaContent,\n          formUiSchema: formUiSchemaContent,\n        })\n      })\n  }\n\n  getTargetContainer = async (userprofile: UserProfile, token: string) => {\n    const entityLookupRequest: EntityLookupRequest = {\n      entityName: userprofile.ownerId,\n      parentId: this.props.parentContainerId,\n    }\n    try {\n      const entityId = await SynapseClient.lookupChildEntity(\n        entityLookupRequest,\n        token,\n      )\n      // ok, found an entity of the same name.\n      console.log(\n        `EntityForm uploading to https://www.synapse.org/Synapse:${entityId.id}`,\n      )\n      this.setState({\n        userprofile,\n        containerId: entityId.id,\n        isLoading: false,\n      })\n      return entityId.id\n    } catch (error) {\n      if (error.status === 404) {\n        return this.onError(\n          new Error(\n            'Your folder has not yet been set up, please retry in a few minutes.',\n          ),\n        )\n      }\n      // else\n      return this.onError(error)\n    }\n  }\n\n  finishedProcessing = () => {\n    this.setState({\n      isLoading: false,\n      successfullyUploaded: true,\n    })\n  }\n\n  onError = (error: any) => {\n    this.setState({\n      error,\n      isLoading: false,\n      successfullyUploaded: false,\n    })\n  }\n\n  onSubmit = ({ formData }: any) => {\n    this.setState({\n      isLoading: true,\n      successfullyUploaded: false,\n    })\n\n    const submissionFileAndForm: Blob = new Blob([JSON.stringify(formData)], {\n      type: 'text/json',\n    })\n    this.createEntityFile(submissionFileAndForm)\n  }\n\n  createEntityFile = (fileContentsBlob: Blob) => {\n    const fileName = `${this.state.formSchema.title}.json`\n    SynapseClient.uploadFile(\n      this.context.accessToken,\n      fileName,\n      fileContentsBlob,\n    )\n      .then(fileUploadComplete => {\n        // do we need to create a new file entity, or update an existing file entity?\n        const newFileHandleId = fileUploadComplete.fileHandleId\n        if (this.state.currentFileEntity) {\n          const updatedFileEntity = {\n            ...this.state.currentFileEntity,\n            dataFileHandleId: newFileHandleId,\n          }\n          this.setState({\n            currentFileEntity: updatedFileEntity,\n          })\n          return SynapseClient.updateEntity(\n            updatedFileEntity,\n            this.context.accessToken,\n          )\n        }\n        // else, it's a new file entity\n        const newFileEntity: FileEntity = {\n          parentId: this.state.containerId!,\n          name: fileName,\n          concreteType: 'org.sagebionetworks.repo.model.FileEntity',\n          dataFileHandleId: newFileHandleId,\n        }\n        return SynapseClient.createEntity(\n          newFileEntity,\n          this.context.accessToken,\n        )\n      })\n      .then(fileEntity => {\n        // by this point we've either found and updated the existing file entity, or created a new one.\n        this.finishedProcessing()\n        if (this.props.synIdCallback) {\n          this.props.synIdCallback(fileEntity.id!)\n        }\n      })\n      .catch((error: any) => {\n        this.onError(error)\n      })\n  }\n\n  render() {\n    return (\n      <div>\n        {this.state.error && (\n          <div className=\"panel panel-danger errors\">\n            <div className=\"panel-heading\">\n              <h3 className=\"panel-title\">Error</h3>\n            </div>\n            <ul className=\"list-group\">\n              <li className=\"list-group-item text-danger\">\n                {this.state.error.name} {this.state.error.reason}\n                {this.state.error.message}\n              </li>\n            </ul>\n          </div>\n        )}\n        {this.context.accessToken &&\n          !this.state.isLoading &&\n          !this.state.successfullyUploaded &&\n          this.state.formSchema &&\n          this.state.formUiSchema &&\n          !this.state.error && (\n            <Form\n              validator={validator}\n              formData={this.state.formData}\n              schema={this.state.formSchema}\n              uiSchema={this.state.formUiSchema}\n              onSubmit={this.onSubmit}\n              ref={this.formRef}\n            >\n              <div style={{ display: 'none' }}>\n                <button type=\"submit\" className=\"btn btn-info\">\n                  Submit\n                </button>\n              </div>\n            </Form>\n          )}\n        {!this.state.error &&\n          this.context.accessToken &&\n          this.state.isLoading && (\n            <>\n              <span>Saving&hellip;</span>\n              <span style={{ marginLeft: '2px' }} className={'spinner'} />\n            </>\n          )}\n      </div>\n    )\n  }\n}\n\nexport default EntityForm\n"],"mappings":"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"}

package/dist/components/EntityHeaderTable/DebouncedInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"DebouncedInput.js","names":[],"sources":["../../../src/components/EntityHeaderTable/DebouncedInput.tsx"],"sourcesContent":["import { useDebouncedEffect } from '@/utils/hooks'\nimport { Autocomplete, TextField, TextFieldProps } from '@mui/material'\nimport { useState } from 'react'\n\n// A debounced input react component\n\nexport function DebouncedInput({\n  initialValue,\n  onChange,\n  options,\n  delay = 250,\n  ...textFieldProps\n}: {\n  initialValue: string\n  onChange: (value: string) => void\n  options: string[]\n  delay?: number\n} & Pick<\n  TextFieldProps,\n  'type' | 'value' | 'placeholder' | 'className' | 'label'\n>) {\n  const [value, setValue] = useState(initialValue)\n  useDebouncedEffect(\n    () => {\n      onChange(value)\n    },\n    [onChange, value],\n    delay,\n  )\n\n  return (\n    <Autocomplete\n      freeSolo\n      disablePortal\n      isOptionEqualToValue={(option, value) =>\n        value.length == 0 || option === value\n      }\n      options={options}\n      value={value}\n      onChange={(event, newValue) => {\n        setValue(newValue ?? '')\n      }}\n      sx={{ marginRight: '10px' }}\n      renderInput={params => (\n        <TextField\n          {...params}\n          {...textFieldProps}\n          value={value}\n          onChange={e => setValue(e.target.value)}\n        />\n      )}\n    />\n  )\n}\n"],"mappings":";;;;;;AAMA,SAAgB,EAAe,EAC7B,iBACA,aACA,YACA,WAAQ,KACR,GAAG,KASF;CACD,IAAM,CAAC,GAAO,KAAY,EAAS,EAAa;AAShD,QARA,QACQ;AACJ,IAAS,EAAM;IAEjB,CAAC,GAAU,EAAM,EACjB,EACD,EAGC,kBAAC,GAAD;EACE,UAAA;EACA,eAAA;EACA,uBAAuB,GAAQ,MAC7B,EAAM,UAAU,KAAK,MAAW;EAEzB;EACF;EACP,WAAW,GAAO,MAAa;AAC7B,KAAS,KAAY,GAAG;;EAE1B,IAAI,EAAE,aAAa,QAAQ;EAC3B,cAAa,MACX,kBAAC,GAAD;GACE,GAAI;GACJ,GAAI;GACG;GACP,WAAU,MAAK,EAAS,EAAE,OAAO,MAAM;GACvC,CAAA;EAEJ,CAAA"}
+{"version":3,"file":"DebouncedInput.js","names":[],"sources":["../../../src/components/EntityHeaderTable/DebouncedInput.tsx"],"sourcesContent":["import { useDebouncedEffect } from '@/utils/hooks'\nimport { Autocomplete, TextField, TextFieldProps } from '@mui/material'\nimport { useState } from 'react'\n\n// A debounced input react component\n\nexport function DebouncedInput({\n  initialValue,\n  onChange,\n  options,\n  delay = 250,\n  ...textFieldProps\n}: {\n  initialValue: string\n  onChange: (value: string) => void\n  options: string[]\n  delay?: number\n} & Pick<\n  TextFieldProps,\n  'type' | 'value' | 'placeholder' | 'className' | 'label'\n>) {\n  const [value, setValue] = useState(initialValue)\n  useDebouncedEffect(\n    () => {\n      onChange(value)\n    },\n    [onChange, value],\n    delay,\n  )\n\n  return (\n    <Autocomplete\n      freeSolo\n      disablePortal\n      isOptionEqualToValue={(option, value) =>\n        value.length == 0 || option === value\n      }\n      options={options}\n      value={value}\n      onChange={(event, newValue) => {\n        setValue(newValue ?? '')\n      }}\n      sx={{ marginRight: '10px' }}\n      renderInput={params => (\n        <TextField\n          {...params}\n          {...textFieldProps}\n          value={value}\n          onChange={e => setValue(e.target.value)}\n        />\n      )}\n    />\n  )\n}\n"],"mappings":";;;;;;AAMA,SAAgB,EAAe,EAC7B,iBACA,aACA,YACA,WAAQ,KACR,GAAG,KASF;CACD,IAAM,CAAC,GAAO,KAAY,EAAS,CAAY;CAS/C,OARA,QACQ;EACJ,EAAS,CAAK;CAChB,GACA,CAAC,GAAU,CAAK,GAChB,CACF,GAGE,kBAAC,GAAD;EACE,UAAA;EACA,eAAA;EACA,uBAAuB,GAAQ,MAC7B,EAAM,UAAU,KAAK,MAAW;EAEzB;EACF;EACP,WAAW,GAAO,MAAa;GAC7B,EAAS,KAAY,EAAE;EACzB;EACA,IAAI,EAAE,aAAa,OAAO;EAC1B,cAAa,MACX,kBAAC,GAAD;GACE,GAAI;GACJ,GAAI;GACG;GACP,WAAU,MAAK,EAAS,EAAE,OAAO,KAAK;EACvC,CAAA;CAEJ,CAAA;AAEL"}

package/dist/components/EntityHeaderTable/EntityHeaderTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityHeaderTable.js","names":[],"sources":["../../../src/components/EntityHeaderTable/EntityHeaderTable.tsx"],"sourcesContent":["import React from 'react'\nimport AddAd from '@/assets/icons/AddAd'\nimport { StyledTableContainer } from '@/components/styled/StyledTableContainer'\nimport { useGetEntityHeaders } from '@/synapse-queries/entity/useGetEntityHeaders'\nimport {\n  entityTypeToFriendlyName,\n  getEntityTypeFromHeader,\n  normalizeSynPrefix,\n} from '@/utils/functions/EntityTypeUtils'\nimport { SYNAPSE_ENTITY_ID_REGEX } from '@/utils/functions/RegularExpressions'\nimport { AddCircleTwoTone } from '@mui/icons-material'\nimport {\n  Alert,\n  AlertTitle,\n  Box,\n  Button,\n  IconButton,\n  InputLabel,\n  TextField,\n  Tooltip,\n  Typography,\n} from '@mui/material'\nimport { EntityHeader, ReferenceList } from '@sage-bionetworks/synapse-types'\nimport {\n  ColumnDef,\n  ColumnFiltersState,\n  flexRender,\n  getCoreRowModel,\n  getFacetedMinMaxValues,\n  getFacetedRowModel,\n  getFacetedUniqueValues,\n  getFilteredRowModel,\n  getSortedRowModel,\n  useReactTable,\n} from '@tanstack/react-table'\nimport { noop, upperFirst } from 'lodash-es'\nimport papaparseLib from 'papaparse'\n// papaparse is CJS-only; pull named values from the default export.\nconst { parse } = papaparseLib\nimport pluralize from 'pluralize'\nimport { Fragment, useCallback, useEffect, useMemo, useState } from 'react'\nimport {\n  EntityFinderModal,\n  EntityFinderModalProps,\n} from '../EntityFinder/EntityFinderModal'\nimport { FinderScope } from '../EntityFinder/tree/EntityTree'\nimport { VersionSelectionType } from '../EntityFinder/VersionSelectionType'\nimport IconSvg from '../IconSvg'\nimport { SkeletonTable } from '../Skeleton'\nimport {\n  CheckBoxCell,\n  CheckBoxHeader,\n  EntityHeaderIDCell,\n  EntityHeaderNameCell,\n  EntityHeaderTypeCell,\n} from './EntityHeaderTableCellRenderers'\nimport { Filter } from './Filter'\nimport { useEntityHeaderTableState } from './useEntityHeaderTableState'\n\nconst DEFAULT_FINDER_CONFIG: EntityFinderModalProps['configuration'] = {\n  selectMultiple: true,\n  versionSelection: VersionSelectionType.DISALLOWED,\n  initialScope: FinderScope.ALL_PROJECTS,\n  initialContainer: 'root',\n}\n\nexport type EntityHeaderTableProps = {\n  references: ReferenceList\n  isEditable: boolean\n  disabled?: boolean\n  onUpdate?: (updatedRefs: ReferenceList) => void // when the references are updated, EntityHeaderTable will call this function with the updated list\n  removeSelectedRowsButtonText?: string\n  onUpdateEntityIDsTextbox?: (value: string) => void // when the entity IDs text box is updated, this is called\n  /* The word used to describe the items in the table. Default 'entity' */\n  objectNameCopy?: string\n  // If true, the text field where IDs are pasted is hidden, and confirming the entity finder will immediately call `onUpdate`\n  hideTextFieldToPasteValue?: boolean\n  entityFinderConfiguration?: EntityFinderModalProps['configuration']\n}\n\nconst UNMANAGEABLE_SUBJECT_COUNT = 10\n\n// extend EntityHeader to create dummy EntityHeader rows for those that the current user cannot view\nexport type EntityHeaderOrDummy = EntityHeader & { isDummy?: boolean }\n\n/**\n * Renders a sortable/filterable table for a set of entity references.  If editable, onUpdate will be called back\n * on any entity added/removed.\n */\nexport const EntityHeaderTable = (\n  props: EntityHeaderTableProps,\n): React.ReactNode => {\n  const {\n    references,\n    isEditable,\n    disabled,\n    onUpdate = noop,\n    removeSelectedRowsButtonText = 'Remove Selected Rows',\n    onUpdateEntityIDsTextbox,\n    objectNameCopy = 'entity',\n    hideTextFieldToPasteValue = false,\n    entityFinderConfiguration = DEFAULT_FINDER_CONFIG,\n  } = props\n  const [columnFilters, setColumnFilters] = useState<ColumnFiltersState>([])\n  const [showEntityFinder, setShowEntityFinder] = useState<boolean>(false)\n\n  const {\n    rowSelection,\n    setRowSelection,\n    refsInState,\n    setRefsInState,\n    newEntityIDs,\n    setNewEntityIDs,\n    parseErrors,\n    setParseErrors,\n  } = useEntityHeaderTableState(references, onUpdateEntityIDsTextbox, onUpdate)\n\n  const setInvalidEntityIDError = useCallback(\n    (invalidEntityIDs: string[]) => {\n      setParseErrors([`Invalid Synapse ID(s): ${invalidEntityIDs.join(',')}`])\n    },\n    [setParseErrors],\n  )\n\n  const addRefsFromEntityIDs = useCallback(\n    (entityIDs: string[]) => {\n      const newReferences: ReferenceList = entityIDs.map(id => {\n        return {\n          targetId: id.trim(),\n        }\n      })\n      setRefsInState([...refsInState, ...newReferences])\n    },\n    [refsInState, setRefsInState],\n  )\n\n  const addPastedValuesToArray = useCallback(() => {\n    if (newEntityIDs) {\n      if (newEntityIDs.includes(',')) {\n        parse<string[]>(newEntityIDs, {\n          complete: result => {\n            if (result.errors.length > 0) {\n              const newParseErrors = result.errors.map(\n                parseError => parseError.message,\n              )\n              setParseErrors(newParseErrors)\n            } else {\n              const newParsedEntityIDs = result.data[0]\n              const invalidEntityIDs = newParsedEntityIDs.filter(\n                id => !id.trim().match(SYNAPSE_ENTITY_ID_REGEX),\n              )\n              if (invalidEntityIDs.length > 0) {\n                setInvalidEntityIDError(invalidEntityIDs)\n              } else {\n                addRefsFromEntityIDs(newParsedEntityIDs)\n              }\n            }\n          },\n        })\n      } else {\n        // single item\n        if (!newEntityIDs.trim().match(SYNAPSE_ENTITY_ID_REGEX)) {\n          setInvalidEntityIDError([newEntityIDs])\n        } else {\n          addRefsFromEntityIDs([newEntityIDs])\n        }\n      }\n    } else {\n      setParseErrors([])\n      setNewEntityIDs('')\n    }\n  }, [\n    addRefsFromEntityIDs,\n    newEntityIDs,\n    setInvalidEntityIDError,\n    setNewEntityIDs,\n    setParseErrors,\n  ])\n\n  const pluralObjectName = upperFirst(pluralize(objectNameCopy))\n\n  const selectColumns: ColumnDef<EntityHeaderOrDummy, any>[] = useMemo(\n    () => [\n      {\n        id: 'select',\n        header: CheckBoxHeader,\n        cell: CheckBoxCell,\n      },\n    ],\n    [],\n  )\n\n  const entityHeaderColumns: ColumnDef<EntityHeaderOrDummy, any>[] = useMemo(\n    () => [\n      {\n        accessorFn: (row: EntityHeaderOrDummy) => row.name,\n        id: 'name',\n        cell: EntityHeaderNameCell,\n        header: 'Name',\n      },\n      {\n        accessorFn: (row: EntityHeaderOrDummy) => row.id,\n        id: 'id',\n        cell: EntityHeaderIDCell,\n        header: 'SynID',\n      },\n      {\n        accessorFn: (row: EntityHeaderOrDummy) =>\n          row.isDummy\n            ? '-'\n            : entityTypeToFriendlyName(getEntityTypeFromHeader(row)),\n        id: 'type',\n        header: 'Type',\n        cell: EntityHeaderTypeCell,\n        filterFn: 'includesString',\n      },\n    ],\n    [],\n  )\n\n  const columns = useMemo<ColumnDef<EntityHeaderOrDummy, any>[]>(\n    () =>\n      isEditable\n        ? selectColumns.concat(entityHeaderColumns)\n        : entityHeaderColumns,\n    [entityHeaderColumns, isEditable, selectColumns],\n  )\n  const selectionCount = Object.keys(rowSelection).length\n  const {\n    data: results,\n    isSuccess,\n    isLoading,\n  } = useGetEntityHeaders(refsInState, {\n    throwOnError: true,\n  })\n\n  const data = useMemo(() => {\n    //create dummy entries for values that were not returned by the getEntityHeaders call!\n    const newData = results ? results?.results : []\n    const newDataEntityIds = new Set()\n    newData.forEach(entityHeader =>\n      newDataEntityIds.add(normalizeSynPrefix(entityHeader.id)),\n    )\n    const missingRefs = refsInState.filter(\n      ref => !newDataEntityIds.has(normalizeSynPrefix(ref.targetId)),\n    )\n    const dummyEntityHeaders: EntityHeaderOrDummy[] = missingRefs.map(ref => {\n      return {\n        id: ref.targetId,\n        name: ref.targetId,\n        benefactorId: -1,\n        type: 'org.sagebionetworks.repo.model.Project',\n        createdOn: '',\n        modifiedOn: '',\n        createdBy: '',\n        modifiedBy: '',\n        isLatestVersion: true,\n        isDummy: true,\n      }\n    })\n    return newData.concat(dummyEntityHeaders)\n  }, [refsInState, results])\n  const table = useReactTable({\n    data,\n    columns,\n    state: {\n      rowSelection,\n      columnFilters,\n    },\n    enableRowSelection: isEditable,\n    onRowSelectionChange: setRowSelection,\n    onColumnFiltersChange: setColumnFilters,\n    getCoreRowModel: getCoreRowModel(),\n    getFilteredRowModel: getFilteredRowModel(),\n    getSortedRowModel: getSortedRowModel(),\n    getFacetedRowModel: getFacetedRowModel(),\n    getFacetedUniqueValues: getFacetedUniqueValues(),\n    getFacetedMinMaxValues: getFacetedMinMaxValues(),\n    // debugTable: true,\n    // debugHeaders: true,\n    // debugColumns: false,\n    columnResizeMode: 'onChange',\n  })\n\n  const onRemove = useCallback(() => {\n    // rowSelection looks like {3: true. 5: true} where the key is the row index.\n    // Create a new ReferenceList based on the entityHeaders in the current table.\n    const updatedData = data.filter(\n      (_value, index) => !(rowSelection[index] === true),\n    )\n    const newRowRefs: ReferenceList = updatedData.map(entityHeader => {\n      return {\n        targetId: entityHeader.id,\n      }\n    })\n    setRefsInState(newRowRefs)\n  }, [data, rowSelection, setRefsInState])\n\n  const isSelection = selectionCount > 0\n  const totalRowCount = data.length\n  const filteredRowCount = table.getPrePaginationRowModel().rows.length\n  const showFilterControls = totalRowCount > UNMANAGEABLE_SUBJECT_COUNT\n\n  /**\n   * Reset the column filters when the filter controls are hidden.\n   * This handles the following edge case:\n   *      1. List contains 100 items of type \"A\" and 1 of type \"B\"\n   *      2. User filters to show just \"A\" items\n   *      3. User removes all \"A\" items\n   *      4. Only the single \"B\" item remains, but the filter is still present on type \"A\".\n   *         The filter controls are hidden, so the user cannot see the \"B\" item.\n   *\n   * This effect will clear the filters when the filter controls are hidden, preventing this scenario.\n   */\n  useEffect(\n    function resetFiltersWhenFilterControlsAreHidden() {\n      if (!showFilterControls) {\n        table.setColumnFilters([])\n      }\n    },\n    [table, showFilterControls],\n  )\n\n  if (isLoading) {\n    return (\n      <SkeletonTable numCols={3} numRows={Math.min(10, refsInState.length)} />\n    )\n  } else if (!isSuccess) {\n    return <></>\n  }\n  return (\n    <div>\n      <Box\n        sx={{\n          display: 'flex',\n          justifyContent: 'space-between',\n          p: '12px 10px 10px 5px',\n        }}\n      >\n        {showFilterControls && (\n          <Typography variant=\"body1\" sx={{ marginBottom: '10px' }}>\n            {totalRowCount} {pluralObjectName}{' '}\n            {filteredRowCount < totalRowCount\n              ? `(${filteredRowCount} visible)`\n              : ''}\n            {isSelection && <span>{` (${selectionCount} selected)`}</span>}\n          </Typography>\n        )}\n        {isEditable && refsInState.length > 0 && (\n          <Button\n            variant=\"contained\"\n            disabled={!isSelection || disabled}\n            onClick={onRemove}\n          >\n            {removeSelectedRowsButtonText}\n          </Button>\n        )}\n      </Box>\n      <Box\n        sx={{\n          display: 'flex',\n          pb: 2,\n        }}\n      >\n        {table.getHeaderGroups().map(headerGroup =>\n          headerGroup.headers.map(header => {\n            return header.isPlaceholder ? null : (\n              <Fragment key={header.column.id}>\n                {header.column.getCanFilter() && showFilterControls ? (\n                  <Box sx={{ flexGrow: 1 }}>\n                    <Filter column={header.column} table={table} />\n                  </Box>\n                ) : null}\n              </Fragment>\n            )\n          }),\n        )}\n      </Box>\n      {totalRowCount > 0 && (\n        <StyledTableContainer\n          sx={{\n            th: {\n              zIndex: 100,\n              maxHeight: '250px',\n            },\n          }}\n        >\n          <table style={{ borderCollapse: 'collapse', width: '100%' }}>\n            <thead>\n              {table.getHeaderGroups().map(headerGroup => (\n                <tr key={headerGroup.id}>\n                  {headerGroup.headers.map(header => {\n                    let columnSize: string = '5%'\n                    switch (header.id) {\n                      case 'name':\n                        columnSize = '50%'\n                        break\n                      case 'id':\n                        columnSize = '22%'\n                        break\n                      case 'type':\n                        columnSize = '22%'\n                        break\n                      default:\n                        break\n                    }\n                    return (\n                      <th\n                        key={header.id}\n                        colSpan={header.colSpan}\n                        style={{\n                          width: columnSize,\n                          position: 'sticky',\n                          top: '0px',\n                        }}\n                      >\n                        {header.isPlaceholder ? null : (\n                          <Box\n                            sx={{\n                              display: 'flex',\n                              alignItems: 'center',\n                            }}\n                          >\n                            {flexRender(\n                              header.column.columnDef.header,\n                              header.getContext(),\n                            )}\n                            <Box\n                              sx={{\n                                mx: 'auto',\n                              }}\n                            />\n                            {header.column.getCanSort() && (\n                              <IconButton\n                                onClick={header.column.getToggleSortingHandler()}\n                                size={'small'}\n                                sx={{\n                                  marginLeft: 'auto',\n                                  marginRight: '16px',\n                                }}\n                              >\n                                <IconSvg\n                                  icon={\n                                    header.column.getIsSorted() === 'asc'\n                                      ? 'sortUp'\n                                      : 'sortDown'\n                                  }\n                                  wrap={false}\n                                  fontSize={'inherit'}\n                                  sx={{\n                                    color: header.column.getIsSorted()\n                                      ? 'primary.main'\n                                      : 'grey.700',\n                                    backgroundColor: 'none',\n                                  }}\n                                />\n                              </IconButton>\n                            )}\n                          </Box>\n                        )}\n                        {header.column.getCanResize() && (\n                          <div\n                            className={`resizer ${\n                              header.column.getIsResizing() ? 'isResizing' : ''\n                            }`}\n                            onMouseDown={header.getResizeHandler()}\n                            onTouchStart={header.getResizeHandler()}\n                          />\n                        )}\n                      </th>\n                    )\n                  })}\n                </tr>\n              ))}\n            </thead>\n            <tbody>\n              {table.getRowModel().rows.map(row => {\n                return (\n                  <tr key={row.id} style={{ height: '30px' }}>\n                    {row.getVisibleCells().map(cell => {\n                      return (\n                        <td\n                          key={cell.id}\n                          style={{\n                            width: cell.column.getSize(),\n                          }}\n                        >\n                          {flexRender(\n                            cell.column.columnDef.cell,\n                            cell.getContext(),\n                          )}\n                        </td>\n                      )\n                    })}\n                  </tr>\n                )\n              })}\n            </tbody>\n          </table>\n        </StyledTableContainer>\n      )}\n      <EntityFinderModal\n        configuration={entityFinderConfiguration}\n        promptCopy={`Select ${pluralObjectName} to add to the Synapse ID list`}\n        show={showEntityFinder}\n        title={`Select ${pluralObjectName}`}\n        confirmButtonCopy={`Add ${pluralObjectName}`}\n        onConfirm={items => {\n          if (hideTextFieldToPasteValue) {\n            const newRefs = [...refsInState, ...items]\n            setRefsInState(newRefs)\n            onUpdate(newRefs)\n          } else {\n            const newEntityIDsArray = items.map(ref => ref.targetId)\n            const newEntityIDsString =\n              newEntityIDs.trim().length > 0\n                ? newEntityIDs.concat(',')\n                : newEntityIDs\n            const newValue = newEntityIDsString.concat(\n              newEntityIDsArray.join(','),\n            )\n            setNewEntityIDs(newValue)\n          }\n          setShowEntityFinder(false)\n        }}\n        onCancel={() => setShowEntityFinder(false)}\n      />\n      {isEditable && (\n        <Box sx={{ marginTop: '10px' }}>\n          {hideTextFieldToPasteValue && (\n            <Button\n              variant=\"outlined\"\n              onClick={() => {\n                setShowEntityFinder(true)\n              }}\n              startIcon={<AddAd />}\n              disabled={disabled}\n            >\n              Add {pluralObjectName}\n            </Button>\n          )}\n          {!hideTextFieldToPasteValue && (\n            <>\n              <InputLabel htmlFor=\"synIDs\">Add Synapse IDs</InputLabel>\n              <Box\n                sx={{ display: 'grid', gridTemplateColumns: 'auto 50px 150px' }}\n              >\n                <TextField\n                  id=\"synIDs\"\n                  name=\"synIDs\"\n                  fullWidth\n                  onChange={e => {\n                    setNewEntityIDs(e.target.value)\n                  }}\n                  value={newEntityIDs}\n                  placeholder=\"Enter a list of Synapse IDs (i.e. 'syn123, syn456')\"\n                  disabled={disabled}\n                />\n                <Box sx={{ padding: '5px 0px 0px 5px' }}>\n                  {/* Entity finder button.  On select, append the selected entity ID to the newSynIDs list */}\n                  <Tooltip title=\"Add a Synapse ID to the list via the Entity Finder\">\n                    <IconButton\n                      disabled={disabled}\n                      onClick={() => {\n                        setShowEntityFinder(true)\n                      }}\n                    >\n                      <AddAd />\n                    </IconButton>\n                  </Tooltip>\n                </Box>\n                <Button\n                  variant=\"outlined\"\n                  onClick={addPastedValuesToArray}\n                  disabled={\n                    isLoading || newEntityIDs.trim().length == 0 || disabled\n                  }\n                  startIcon={<AddCircleTwoTone />}\n                >\n                  Add {pluralObjectName}\n                </Button>\n              </Box>\n            </>\n          )}\n          {parseErrors && parseErrors.length > 0 && (\n            <Alert severity={'error'} sx={{ my: 2 }}>\n              <AlertTitle>Parsing errors encountered:</AlertTitle>\n              <ul>\n                {parseErrors.map((error, index) => {\n                  return (\n                    <Typography\n                      component={parseErrors.length > 1 ? 'li' : 'span'}\n                      key={index}\n                      variant={'smallText1'}\n                      sx={{\n                        lineHeight: 1.5,\n                      }}\n                    >\n                      {error}\n                    </Typography>\n                  )\n                })}\n              </ul>\n            </Alert>\n          )}\n        </Box>\n      )}\n    </div>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"EntityHeaderTable.js","names":[],"sources":["../../../src/components/EntityHeaderTable/EntityHeaderTable.tsx"],"sourcesContent":["import React from 'react'\nimport AddAd from '@/assets/icons/AddAd'\nimport { StyledTableContainer } from '@/components/styled/StyledTableContainer'\nimport { useGetEntityHeaders } from '@/synapse-queries/entity/useGetEntityHeaders'\nimport {\n  entityTypeToFriendlyName,\n  getEntityTypeFromHeader,\n  normalizeSynPrefix,\n} from '@/utils/functions/EntityTypeUtils'\nimport { SYNAPSE_ENTITY_ID_REGEX } from '@/utils/functions/RegularExpressions'\nimport { AddCircleTwoTone } from '@mui/icons-material'\nimport {\n  Alert,\n  AlertTitle,\n  Box,\n  Button,\n  IconButton,\n  InputLabel,\n  TextField,\n  Tooltip,\n  Typography,\n} from '@mui/material'\nimport { EntityHeader, ReferenceList } from '@sage-bionetworks/synapse-types'\nimport {\n  ColumnDef,\n  ColumnFiltersState,\n  flexRender,\n  getCoreRowModel,\n  getFacetedMinMaxValues,\n  getFacetedRowModel,\n  getFacetedUniqueValues,\n  getFilteredRowModel,\n  getSortedRowModel,\n  useReactTable,\n} from '@tanstack/react-table'\nimport { noop, upperFirst } from 'lodash-es'\nimport papaparseLib from 'papaparse'\n// papaparse is CJS-only; pull named values from the default export.\nconst { parse } = papaparseLib\nimport pluralize from 'pluralize'\nimport { Fragment, useCallback, useEffect, useMemo, useState } from 'react'\nimport {\n  EntityFinderModal,\n  EntityFinderModalProps,\n} from '../EntityFinder/EntityFinderModal'\nimport { FinderScope } from '../EntityFinder/tree/EntityTree'\nimport { VersionSelectionType } from '../EntityFinder/VersionSelectionType'\nimport IconSvg from '../IconSvg'\nimport { SkeletonTable } from '../Skeleton'\nimport {\n  CheckBoxCell,\n  CheckBoxHeader,\n  EntityHeaderIDCell,\n  EntityHeaderNameCell,\n  EntityHeaderTypeCell,\n} from './EntityHeaderTableCellRenderers'\nimport { Filter } from './Filter'\nimport { useEntityHeaderTableState } from './useEntityHeaderTableState'\n\nconst DEFAULT_FINDER_CONFIG: EntityFinderModalProps['configuration'] = {\n  selectMultiple: true,\n  versionSelection: VersionSelectionType.DISALLOWED,\n  initialScope: FinderScope.ALL_PROJECTS,\n  initialContainer: 'root',\n}\n\nexport type EntityHeaderTableProps = {\n  references: ReferenceList\n  isEditable: boolean\n  disabled?: boolean\n  onUpdate?: (updatedRefs: ReferenceList) => void // when the references are updated, EntityHeaderTable will call this function with the updated list\n  removeSelectedRowsButtonText?: string\n  onUpdateEntityIDsTextbox?: (value: string) => void // when the entity IDs text box is updated, this is called\n  /* The word used to describe the items in the table. Default 'entity' */\n  objectNameCopy?: string\n  // If true, the text field where IDs are pasted is hidden, and confirming the entity finder will immediately call `onUpdate`\n  hideTextFieldToPasteValue?: boolean\n  entityFinderConfiguration?: EntityFinderModalProps['configuration']\n}\n\nconst UNMANAGEABLE_SUBJECT_COUNT = 10\n\n// extend EntityHeader to create dummy EntityHeader rows for those that the current user cannot view\nexport type EntityHeaderOrDummy = EntityHeader & { isDummy?: boolean }\n\n/**\n * Renders a sortable/filterable table for a set of entity references.  If editable, onUpdate will be called back\n * on any entity added/removed.\n */\nexport const EntityHeaderTable = (\n  props: EntityHeaderTableProps,\n): React.ReactNode => {\n  const {\n    references,\n    isEditable,\n    disabled,\n    onUpdate = noop,\n    removeSelectedRowsButtonText = 'Remove Selected Rows',\n    onUpdateEntityIDsTextbox,\n    objectNameCopy = 'entity',\n    hideTextFieldToPasteValue = false,\n    entityFinderConfiguration = DEFAULT_FINDER_CONFIG,\n  } = props\n  const [columnFilters, setColumnFilters] = useState<ColumnFiltersState>([])\n  const [showEntityFinder, setShowEntityFinder] = useState<boolean>(false)\n\n  const {\n    rowSelection,\n    setRowSelection,\n    refsInState,\n    setRefsInState,\n    newEntityIDs,\n    setNewEntityIDs,\n    parseErrors,\n    setParseErrors,\n  } = useEntityHeaderTableState(references, onUpdateEntityIDsTextbox, onUpdate)\n\n  const setInvalidEntityIDError = useCallback(\n    (invalidEntityIDs: string[]) => {\n      setParseErrors([`Invalid Synapse ID(s): ${invalidEntityIDs.join(',')}`])\n    },\n    [setParseErrors],\n  )\n\n  const addRefsFromEntityIDs = useCallback(\n    (entityIDs: string[]) => {\n      const newReferences: ReferenceList = entityIDs.map(id => {\n        return {\n          targetId: id.trim(),\n        }\n      })\n      setRefsInState([...refsInState, ...newReferences])\n    },\n    [refsInState, setRefsInState],\n  )\n\n  const addPastedValuesToArray = useCallback(() => {\n    if (newEntityIDs) {\n      if (newEntityIDs.includes(',')) {\n        parse<string[]>(newEntityIDs, {\n          complete: result => {\n            if (result.errors.length > 0) {\n              const newParseErrors = result.errors.map(\n                parseError => parseError.message,\n              )\n              setParseErrors(newParseErrors)\n            } else {\n              const newParsedEntityIDs = result.data[0]\n              const invalidEntityIDs = newParsedEntityIDs.filter(\n                id => !id.trim().match(SYNAPSE_ENTITY_ID_REGEX),\n              )\n              if (invalidEntityIDs.length > 0) {\n                setInvalidEntityIDError(invalidEntityIDs)\n              } else {\n                addRefsFromEntityIDs(newParsedEntityIDs)\n              }\n            }\n          },\n        })\n      } else {\n        // single item\n        if (!newEntityIDs.trim().match(SYNAPSE_ENTITY_ID_REGEX)) {\n          setInvalidEntityIDError([newEntityIDs])\n        } else {\n          addRefsFromEntityIDs([newEntityIDs])\n        }\n      }\n    } else {\n      setParseErrors([])\n      setNewEntityIDs('')\n    }\n  }, [\n    addRefsFromEntityIDs,\n    newEntityIDs,\n    setInvalidEntityIDError,\n    setNewEntityIDs,\n    setParseErrors,\n  ])\n\n  const pluralObjectName = upperFirst(pluralize(objectNameCopy))\n\n  const selectColumns: ColumnDef<EntityHeaderOrDummy, any>[] = useMemo(\n    () => [\n      {\n        id: 'select',\n        header: CheckBoxHeader,\n        cell: CheckBoxCell,\n      },\n    ],\n    [],\n  )\n\n  const entityHeaderColumns: ColumnDef<EntityHeaderOrDummy, any>[] = useMemo(\n    () => [\n      {\n        accessorFn: (row: EntityHeaderOrDummy) => row.name,\n        id: 'name',\n        cell: EntityHeaderNameCell,\n        header: 'Name',\n      },\n      {\n        accessorFn: (row: EntityHeaderOrDummy) => row.id,\n        id: 'id',\n        cell: EntityHeaderIDCell,\n        header: 'SynID',\n      },\n      {\n        accessorFn: (row: EntityHeaderOrDummy) =>\n          row.isDummy\n            ? '-'\n            : entityTypeToFriendlyName(getEntityTypeFromHeader(row)),\n        id: 'type',\n        header: 'Type',\n        cell: EntityHeaderTypeCell,\n        filterFn: 'includesString',\n      },\n    ],\n    [],\n  )\n\n  const columns = useMemo<ColumnDef<EntityHeaderOrDummy, any>[]>(\n    () =>\n      isEditable\n        ? selectColumns.concat(entityHeaderColumns)\n        : entityHeaderColumns,\n    [entityHeaderColumns, isEditable, selectColumns],\n  )\n  const selectionCount = Object.keys(rowSelection).length\n  const {\n    data: results,\n    isSuccess,\n    isLoading,\n  } = useGetEntityHeaders(refsInState, {\n    throwOnError: true,\n  })\n\n  const data = useMemo(() => {\n    //create dummy entries for values that were not returned by the getEntityHeaders call!\n    const newData = results ? results?.results : []\n    const newDataEntityIds = new Set()\n    newData.forEach(entityHeader =>\n      newDataEntityIds.add(normalizeSynPrefix(entityHeader.id)),\n    )\n    const missingRefs = refsInState.filter(\n      ref => !newDataEntityIds.has(normalizeSynPrefix(ref.targetId)),\n    )\n    const dummyEntityHeaders: EntityHeaderOrDummy[] = missingRefs.map(ref => {\n      return {\n        id: ref.targetId,\n        name: ref.targetId,\n        benefactorId: -1,\n        type: 'org.sagebionetworks.repo.model.Project',\n        createdOn: '',\n        modifiedOn: '',\n        createdBy: '',\n        modifiedBy: '',\n        isLatestVersion: true,\n        isDummy: true,\n      }\n    })\n    return newData.concat(dummyEntityHeaders)\n  }, [refsInState, results])\n  const table = useReactTable({\n    data,\n    columns,\n    state: {\n      rowSelection,\n      columnFilters,\n    },\n    enableRowSelection: isEditable,\n    onRowSelectionChange: setRowSelection,\n    onColumnFiltersChange: setColumnFilters,\n    getCoreRowModel: getCoreRowModel(),\n    getFilteredRowModel: getFilteredRowModel(),\n    getSortedRowModel: getSortedRowModel(),\n    getFacetedRowModel: getFacetedRowModel(),\n    getFacetedUniqueValues: getFacetedUniqueValues(),\n    getFacetedMinMaxValues: getFacetedMinMaxValues(),\n    // debugTable: true,\n    // debugHeaders: true,\n    // debugColumns: false,\n    columnResizeMode: 'onChange',\n  })\n\n  const onRemove = useCallback(() => {\n    // rowSelection looks like {3: true. 5: true} where the key is the row index.\n    // Create a new ReferenceList based on the entityHeaders in the current table.\n    const updatedData = data.filter(\n      (_value, index) => !(rowSelection[index] === true),\n    )\n    const newRowRefs: ReferenceList = updatedData.map(entityHeader => {\n      return {\n        targetId: entityHeader.id,\n      }\n    })\n    setRefsInState(newRowRefs)\n  }, [data, rowSelection, setRefsInState])\n\n  const isSelection = selectionCount > 0\n  const totalRowCount = data.length\n  const filteredRowCount = table.getPrePaginationRowModel().rows.length\n  const showFilterControls = totalRowCount > UNMANAGEABLE_SUBJECT_COUNT\n\n  /**\n   * Reset the column filters when the filter controls are hidden.\n   * This handles the following edge case:\n   *      1. List contains 100 items of type \"A\" and 1 of type \"B\"\n   *      2. User filters to show just \"A\" items\n   *      3. User removes all \"A\" items\n   *      4. Only the single \"B\" item remains, but the filter is still present on type \"A\".\n   *         The filter controls are hidden, so the user cannot see the \"B\" item.\n   *\n   * This effect will clear the filters when the filter controls are hidden, preventing this scenario.\n   */\n  useEffect(\n    function resetFiltersWhenFilterControlsAreHidden() {\n      if (!showFilterControls) {\n        table.setColumnFilters([])\n      }\n    },\n    [table, showFilterControls],\n  )\n\n  if (isLoading) {\n    return (\n      <SkeletonTable numCols={3} numRows={Math.min(10, refsInState.length)} />\n    )\n  } else if (!isSuccess) {\n    return <></>\n  }\n  return (\n    <div>\n      <Box\n        sx={{\n          display: 'flex',\n          justifyContent: 'space-between',\n          p: '12px 10px 10px 5px',\n        }}\n      >\n        {showFilterControls && (\n          <Typography variant=\"body1\" sx={{ marginBottom: '10px' }}>\n            {totalRowCount} {pluralObjectName}{' '}\n            {filteredRowCount < totalRowCount\n              ? `(${filteredRowCount} visible)`\n              : ''}\n            {isSelection && <span>{` (${selectionCount} selected)`}</span>}\n          </Typography>\n        )}\n        {isEditable && refsInState.length > 0 && (\n          <Button\n            variant=\"contained\"\n            disabled={!isSelection || disabled}\n            onClick={onRemove}\n          >\n            {removeSelectedRowsButtonText}\n          </Button>\n        )}\n      </Box>\n      <Box\n        sx={{\n          display: 'flex',\n          pb: 2,\n        }}\n      >\n        {table.getHeaderGroups().map(headerGroup =>\n          headerGroup.headers.map(header => {\n            return header.isPlaceholder ? null : (\n              <Fragment key={header.column.id}>\n                {header.column.getCanFilter() && showFilterControls ? (\n                  <Box sx={{ flexGrow: 1 }}>\n                    <Filter column={header.column} table={table} />\n                  </Box>\n                ) : null}\n              </Fragment>\n            )\n          }),\n        )}\n      </Box>\n      {totalRowCount > 0 && (\n        <StyledTableContainer\n          sx={{\n            th: {\n              zIndex: 100,\n              maxHeight: '250px',\n            },\n          }}\n        >\n          <table style={{ borderCollapse: 'collapse', width: '100%' }}>\n            <thead>\n              {table.getHeaderGroups().map(headerGroup => (\n                <tr key={headerGroup.id}>\n                  {headerGroup.headers.map(header => {\n                    let columnSize: string = '5%'\n                    switch (header.id) {\n                      case 'name':\n                        columnSize = '50%'\n                        break\n                      case 'id':\n                        columnSize = '22%'\n                        break\n                      case 'type':\n                        columnSize = '22%'\n                        break\n                      default:\n                        break\n                    }\n                    return (\n                      <th\n                        key={header.id}\n                        colSpan={header.colSpan}\n                        style={{\n                          width: columnSize,\n                          position: 'sticky',\n                          top: '0px',\n                        }}\n                      >\n                        {header.isPlaceholder ? null : (\n                          <Box\n                            sx={{\n                              display: 'flex',\n                              alignItems: 'center',\n                            }}\n                          >\n                            {flexRender(\n                              header.column.columnDef.header,\n                              header.getContext(),\n                            )}\n                            <Box\n                              sx={{\n                                mx: 'auto',\n                              }}\n                            />\n                            {header.column.getCanSort() && (\n                              <IconButton\n                                onClick={header.column.getToggleSortingHandler()}\n                                size={'small'}\n                                sx={{\n                                  marginLeft: 'auto',\n                                  marginRight: '16px',\n                                }}\n                              >\n                                <IconSvg\n                                  icon={\n                                    header.column.getIsSorted() === 'asc'\n                                      ? 'sortUp'\n                                      : 'sortDown'\n                                  }\n                                  wrap={false}\n                                  fontSize={'inherit'}\n                                  sx={{\n                                    color: header.column.getIsSorted()\n                                      ? 'primary.main'\n                                      : 'grey.700',\n                                    backgroundColor: 'none',\n                                  }}\n                                />\n                              </IconButton>\n                            )}\n                          </Box>\n                        )}\n                        {header.column.getCanResize() && (\n                          <div\n                            className={`resizer ${\n                              header.column.getIsResizing() ? 'isResizing' : ''\n                            }`}\n                            onMouseDown={header.getResizeHandler()}\n                            onTouchStart={header.getResizeHandler()}\n                          />\n                        )}\n                      </th>\n                    )\n                  })}\n                </tr>\n              ))}\n            </thead>\n            <tbody>\n              {table.getRowModel().rows.map(row => {\n                return (\n                  <tr key={row.id} style={{ height: '30px' }}>\n                    {row.getVisibleCells().map(cell => {\n                      return (\n                        <td\n                          key={cell.id}\n                          style={{\n                            width: cell.column.getSize(),\n                          }}\n                        >\n                          {flexRender(\n                            cell.column.columnDef.cell,\n                            cell.getContext(),\n                          )}\n                        </td>\n                      )\n                    })}\n                  </tr>\n                )\n              })}\n            </tbody>\n          </table>\n        </StyledTableContainer>\n      )}\n      <EntityFinderModal\n        configuration={entityFinderConfiguration}\n        promptCopy={`Select ${pluralObjectName} to add to the Synapse ID list`}\n        show={showEntityFinder}\n        title={`Select ${pluralObjectName}`}\n        confirmButtonCopy={`Add ${pluralObjectName}`}\n        onConfirm={items => {\n          if (hideTextFieldToPasteValue) {\n            const newRefs = [...refsInState, ...items]\n            setRefsInState(newRefs)\n            onUpdate(newRefs)\n          } else {\n            const newEntityIDsArray = items.map(ref => ref.targetId)\n            const newEntityIDsString =\n              newEntityIDs.trim().length > 0\n                ? newEntityIDs.concat(',')\n                : newEntityIDs\n            const newValue = newEntityIDsString.concat(\n              newEntityIDsArray.join(','),\n            )\n            setNewEntityIDs(newValue)\n          }\n          setShowEntityFinder(false)\n        }}\n        onCancel={() => setShowEntityFinder(false)}\n      />\n      {isEditable && (\n        <Box sx={{ marginTop: '10px' }}>\n          {hideTextFieldToPasteValue && (\n            <Button\n              variant=\"outlined\"\n              onClick={() => {\n                setShowEntityFinder(true)\n              }}\n              startIcon={<AddAd />}\n              disabled={disabled}\n            >\n              Add {pluralObjectName}\n            </Button>\n          )}\n          {!hideTextFieldToPasteValue && (\n            <>\n              <InputLabel htmlFor=\"synIDs\">Add Synapse IDs</InputLabel>\n              <Box\n                sx={{ display: 'grid', gridTemplateColumns: 'auto 50px 150px' }}\n              >\n                <TextField\n                  id=\"synIDs\"\n                  name=\"synIDs\"\n                  fullWidth\n                  onChange={e => {\n                    setNewEntityIDs(e.target.value)\n                  }}\n                  value={newEntityIDs}\n                  placeholder=\"Enter a list of Synapse IDs (i.e. 'syn123, syn456')\"\n                  disabled={disabled}\n                />\n                <Box sx={{ padding: '5px 0px 0px 5px' }}>\n                  {/* Entity finder button.  On select, append the selected entity ID to the newSynIDs list */}\n                  <Tooltip title=\"Add a Synapse ID to the list via the Entity Finder\">\n                    <IconButton\n                      disabled={disabled}\n                      onClick={() => {\n                        setShowEntityFinder(true)\n                      }}\n                    >\n                      <AddAd />\n                    </IconButton>\n                  </Tooltip>\n                </Box>\n                <Button\n                  variant=\"outlined\"\n                  onClick={addPastedValuesToArray}\n                  disabled={\n                    isLoading || newEntityIDs.trim().length == 0 || disabled\n                  }\n                  startIcon={<AddCircleTwoTone />}\n                >\n                  Add {pluralObjectName}\n                </Button>\n              </Box>\n            </>\n          )}\n          {parseErrors && parseErrors.length > 0 && (\n            <Alert severity={'error'} sx={{ my: 2 }}>\n              <AlertTitle>Parsing errors encountered:</AlertTitle>\n              <ul>\n                {parseErrors.map((error, index) => {\n                  return (\n                    <Typography\n                      component={parseErrors.length > 1 ? 'li' : 'span'}\n                      key={index}\n                      variant={'smallText1'}\n                      sx={{\n                        lineHeight: 1.5,\n                      }}\n                    >\n                      {error}\n                    </Typography>\n                  )\n                })}\n              </ul>\n            </Alert>\n          )}\n        </Box>\n      )}\n    </div>\n  )\n}\n"],"mappings":"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"}

package/dist/components/EntityHeaderTable/EntityHeaderTableCellRenderers.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityHeaderTableCellRenderers.js","names":[],"sources":["../../../src/components/EntityHeaderTable/EntityHeaderTableCellRenderers.tsx"],"sourcesContent":["import { PRODUCTION_ENDPOINT_CONFIG } from '@/utils/functions/getEndpoint'\nimport { Checkbox, Link, Typography } from '@mui/material'\nimport { CellContext, HeaderContext } from '@tanstack/react-table'\nimport { EntityLink } from '../EntityLink'\nimport { EntityHeaderOrDummy } from './EntityHeaderTable'\n\nexport function EntityHeaderNameCell(\n  props: CellContext<EntityHeaderOrDummy, string | null>,\n) {\n  const { cell } = props\n  const { row } = cell\n  const { original } = row\n  const { id, isDummy } = original\n  return isDummy ? (\n    <Link href={`${PRODUCTION_ENDPOINT_CONFIG.PORTAL}Synapse:${id}`}>{id}</Link>\n  ) : (\n    <EntityLink entity={original} />\n  )\n}\nexport function EntityHeaderIDCell(\n  props: CellContext<EntityHeaderOrDummy, string | null>,\n) {\n  const { cell } = props\n  return <Typography variant=\"body1\">{cell.getContext().getValue()}</Typography>\n}\nexport function EntityHeaderTypeCell(\n  props: CellContext<EntityHeaderOrDummy, string | null>,\n) {\n  const { cell } = props\n  return (\n    <Typography variant=\"body1\" sx={{ textTransform: 'capitalize' }}>\n      {cell.getContext().getValue()}\n    </Typography>\n  )\n}\nexport function CheckBoxHeader<TData = never, TValue = never>(\n  props: HeaderContext<TData, TValue>,\n) {\n  const { table } = props\n  return (\n    <Checkbox\n      inputProps={{\n        'aria-label': 'Select All',\n      }}\n      checked={table.getIsAllRowsSelected()}\n      indeterminate={table.getIsSomeRowsSelected()}\n      onClick={table.getToggleAllRowsSelectedHandler()}\n    />\n  )\n}\nexport function CheckBoxCell<TData = never, TValue = never>(\n  props: CellContext<TData, TValue>,\n) {\n  const { row } = props\n  return (\n    <Checkbox\n      checked={row.getIsSelected()}\n      disabled={!row.getCanSelect()}\n      indeterminate={row.getIsSomeSelected()}\n      onClick={row.getToggleSelectedHandler()}\n    />\n  )\n}\n"],"mappings":";;;;;AAMA,SAAgB,EACd,GACA;CACA,IAAM,EAAE,YAAS,GACX,EAAE,WAAQ,GACV,EAAE,gBAAa,GACf,EAAE,OAAI,eAAY;AACxB,QAAO,IACL,kBAAC,GAAD;EAAM,MAAM,GAAG,EAA2B,OAAO,UAAU;YAAO;EAAU,CAAA,GAE5E,kBAAC,GAAD,EAAY,QAAQ,GAAY,CAAA;;AAGpC,SAAgB,EACd,GACA;CACA,IAAM,EAAE,YAAS;AACjB,QAAO,kBAAC,GAAD;EAAY,SAAQ;YAAS,EAAK,YAAY,CAAC,UAAU;EAAc,CAAA;;AAEhF,SAAgB,EACd,GACA;CACA,IAAM,EAAE,YAAS;AACjB,QACE,kBAAC,GAAD;EAAY,SAAQ;EAAQ,IAAI,EAAE,eAAe,cAAc;YAC5D,EAAK,YAAY,CAAC,UAAU;EAClB,CAAA;;AAGjB,SAAgB,EACd,GACA;CACA,IAAM,EAAE,aAAU;AAClB,QACE,kBAAC,GAAD;EACE,YAAY,EACV,cAAc,cACf;EACD,SAAS,EAAM,sBAAsB;EACrC,eAAe,EAAM,uBAAuB;EAC5C,SAAS,EAAM,iCAAiC;EAChD,CAAA;;AAGN,SAAgB,EACd,GACA;CACA,IAAM,EAAE,WAAQ;AAChB,QACE,kBAAC,GAAD;EACE,SAAS,EAAI,eAAe;EAC5B,UAAU,CAAC,EAAI,cAAc;EAC7B,eAAe,EAAI,mBAAmB;EACtC,SAAS,EAAI,0BAA0B;EACvC,CAAA"}
+{"version":3,"file":"EntityHeaderTableCellRenderers.js","names":[],"sources":["../../../src/components/EntityHeaderTable/EntityHeaderTableCellRenderers.tsx"],"sourcesContent":["import { PRODUCTION_ENDPOINT_CONFIG } from '@/utils/functions/getEndpoint'\nimport { Checkbox, Link, Typography } from '@mui/material'\nimport { CellContext, HeaderContext } from '@tanstack/react-table'\nimport { EntityLink } from '../EntityLink'\nimport { EntityHeaderOrDummy } from './EntityHeaderTable'\n\nexport function EntityHeaderNameCell(\n  props: CellContext<EntityHeaderOrDummy, string | null>,\n) {\n  const { cell } = props\n  const { row } = cell\n  const { original } = row\n  const { id, isDummy } = original\n  return isDummy ? (\n    <Link href={`${PRODUCTION_ENDPOINT_CONFIG.PORTAL}Synapse:${id}`}>{id}</Link>\n  ) : (\n    <EntityLink entity={original} />\n  )\n}\nexport function EntityHeaderIDCell(\n  props: CellContext<EntityHeaderOrDummy, string | null>,\n) {\n  const { cell } = props\n  return <Typography variant=\"body1\">{cell.getContext().getValue()}</Typography>\n}\nexport function EntityHeaderTypeCell(\n  props: CellContext<EntityHeaderOrDummy, string | null>,\n) {\n  const { cell } = props\n  return (\n    <Typography variant=\"body1\" sx={{ textTransform: 'capitalize' }}>\n      {cell.getContext().getValue()}\n    </Typography>\n  )\n}\nexport function CheckBoxHeader<TData = never, TValue = never>(\n  props: HeaderContext<TData, TValue>,\n) {\n  const { table } = props\n  return (\n    <Checkbox\n      inputProps={{\n        'aria-label': 'Select All',\n      }}\n      checked={table.getIsAllRowsSelected()}\n      indeterminate={table.getIsSomeRowsSelected()}\n      onClick={table.getToggleAllRowsSelectedHandler()}\n    />\n  )\n}\nexport function CheckBoxCell<TData = never, TValue = never>(\n  props: CellContext<TData, TValue>,\n) {\n  const { row } = props\n  return (\n    <Checkbox\n      checked={row.getIsSelected()}\n      disabled={!row.getCanSelect()}\n      indeterminate={row.getIsSomeSelected()}\n      onClick={row.getToggleSelectedHandler()}\n    />\n  )\n}\n"],"mappings":";;;;;AAMA,SAAgB,EACd,GACA;CACA,IAAM,EAAE,YAAS,GACX,EAAE,WAAQ,GACV,EAAE,gBAAa,GACf,EAAE,OAAI,eAAY;CACxB,OAAO,IACL,kBAAC,GAAD;EAAM,MAAM,GAAG,EAA2B,OAAO,UAAU;YAAO;CAAS,CAAA,IAE3E,kBAAC,GAAD,EAAY,QAAQ,EAAW,CAAA;AAEnC;AACA,SAAgB,EACd,GACA;CACA,IAAM,EAAE,YAAS;CACjB,OAAO,kBAAC,GAAD;EAAY,SAAQ;YAAS,EAAK,WAAW,EAAE,SAAS;CAAc,CAAA;AAC/E;AACA,SAAgB,EACd,GACA;CACA,IAAM,EAAE,YAAS;CACjB,OACE,kBAAC,GAAD;EAAY,SAAQ;EAAQ,IAAI,EAAE,eAAe,aAAa;YAC3D,EAAK,WAAW,EAAE,SAAS;CAClB,CAAA;AAEhB;AACA,SAAgB,EACd,GACA;CACA,IAAM,EAAE,aAAU;CAClB,OACE,kBAAC,GAAD;EACE,YAAY,EACV,cAAc,aAChB;EACA,SAAS,EAAM,qBAAqB;EACpC,eAAe,EAAM,sBAAsB;EAC3C,SAAS,EAAM,gCAAgC;CAChD,CAAA;AAEL;AACA,SAAgB,EACd,GACA;CACA,IAAM,EAAE,WAAQ;CAChB,OACE,kBAAC,GAAD;EACE,SAAS,EAAI,cAAc;EAC3B,UAAU,CAAC,EAAI,aAAa;EAC5B,eAAe,EAAI,kBAAkB;EACrC,SAAS,EAAI,yBAAyB;CACvC,CAAA;AAEL"}

package/dist/components/EntityHeaderTable/Filter.js.map

@@ -1 +1 @@
-{"version":3,"file":"Filter.js","names":[],"sources":["../../../src/components/EntityHeaderTable/Filter.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { Column, Table } from '@tanstack/react-table'\nimport { DebouncedInput } from './DebouncedInput'\n\nexport function Filter({\n  column,\n  table,\n}: {\n  column: Column<any, unknown>\n  table: Table<any>\n}) {\n  const firstValue = table\n    .getPreFilteredRowModel()\n    .flatRows[0]?.getValue(column.id)\n\n  const columnFilterValue = (column.getFilterValue() as string) ?? ''\n\n  const sortedUniqueValues: string[] = useMemo(\n    () =>\n      typeof firstValue === 'number'\n        ? []\n        : Array.from(column.getFacetedUniqueValues().keys()).sort(),\n    [column.getFacetedUniqueValues()],\n  )\n  return (\n    <DebouncedInput\n      type=\"text\"\n      options={sortedUniqueValues}\n      initialValue={columnFilterValue}\n      onChange={value => column.setFilterValue(value)}\n      label={`Filter by ${column.columnDef.header} (${\n        column.getFacetedUniqueValues().size\n      })`}\n    />\n  )\n}\n"],"mappings":";;;;AAIA,SAAgB,EAAO,EACrB,WACA,YAIC;CACD,IAAM,IAAa,EAChB,wBAAwB,CACxB,SAAS,IAAI,SAAS,EAAO,GAAG,EAE7B,IAAqB,EAAO,gBAAgB,IAAe;AASjE,QACE,kBAAC,GAAD;EACE,MAAK;EACL,SAViC,QAEjC,OAAO,KAAe,WAClB,EAAE,GACF,MAAM,KAAK,EAAO,wBAAwB,CAAC,MAAM,CAAC,CAAC,MAAM,EAC/D,CAAC,EAAO,wBAAwB,CAAC,CAKtB;EACT,cAAc;EACd,WAAU,MAAS,EAAO,eAAe,EAAM;EAC/C,OAAO,aAAa,EAAO,UAAU,OAAO,IAC1C,EAAO,wBAAwB,CAAC,KACjC;EACD,CAAA"}
+{"version":3,"file":"Filter.js","names":[],"sources":["../../../src/components/EntityHeaderTable/Filter.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { Column, Table } from '@tanstack/react-table'\nimport { DebouncedInput } from './DebouncedInput'\n\nexport function Filter({\n  column,\n  table,\n}: {\n  column: Column<any, unknown>\n  table: Table<any>\n}) {\n  const firstValue = table\n    .getPreFilteredRowModel()\n    .flatRows[0]?.getValue(column.id)\n\n  const columnFilterValue = (column.getFilterValue() as string) ?? ''\n\n  const sortedUniqueValues: string[] = useMemo(\n    () =>\n      typeof firstValue === 'number'\n        ? []\n        : Array.from(column.getFacetedUniqueValues().keys()).sort(),\n    [column.getFacetedUniqueValues()],\n  )\n  return (\n    <DebouncedInput\n      type=\"text\"\n      options={sortedUniqueValues}\n      initialValue={columnFilterValue}\n      onChange={value => column.setFilterValue(value)}\n      label={`Filter by ${column.columnDef.header} (${\n        column.getFacetedUniqueValues().size\n      })`}\n    />\n  )\n}\n"],"mappings":";;;;AAIA,SAAgB,EAAO,EACrB,WACA,YAIC;CACD,IAAM,IAAa,EAChB,uBAAuB,EACvB,SAAS,IAAI,SAAS,EAAO,EAAE,GAE5B,IAAqB,EAAO,eAAe,KAAgB;CASjE,OACE,kBAAC,GAAD;EACE,MAAK;EACL,SAViC,QAEjC,OAAO,KAAe,WAClB,CAAC,IACD,MAAM,KAAK,EAAO,uBAAuB,EAAE,KAAK,CAAC,EAAE,KAAK,GAC9D,CAAC,EAAO,uBAAuB,CAAC,CAKrB;EACT,cAAc;EACd,WAAU,MAAS,EAAO,eAAe,CAAK;EAC9C,OAAO,aAAa,EAAO,UAAU,OAAO,IAC1C,EAAO,uBAAuB,EAAE,KACjC;CACF,CAAA;AAEL"}

package/dist/components/EntityHeaderTable/useEntityHeaderTableState.js.map

@@ -1 +1 @@
-{"version":3,"file":"useEntityHeaderTableState.js","names":[],"sources":["../../../src/components/EntityHeaderTable/useEntityHeaderTableState.ts"],"sourcesContent":["import { useState, useCallback, useEffect } from 'react'\nimport { RowSelectionState } from '@tanstack/react-table'\nimport { cloneDeep } from 'lodash-es'\nimport { ReferenceList } from '@sage-bionetworks/synapse-types'\n\nexport function useEntityHeaderTableState(\n  references: ReferenceList,\n  onUpdateEntityIDsTextbox?: (value: string) => void,\n  onUpdate?: (updatedRefs: ReferenceList) => void,\n) {\n  const [rowSelection, setRowSelection] = useState<RowSelectionState>({})\n  const [refsInState, _setRefsInState] = useState<ReferenceList>(\n    cloneDeep(references),\n  )\n  const [newEntityIDs, _setNewEntityIDs] = useState<string>('')\n  const [parseErrors, setParseErrors] = useState<string[]>([])\n\n  /* Reset state if the `references` argument changes */\n  useEffect(() => {\n    _setRefsInState(cloneDeep(references))\n  }, [references])\n\n  const setNewEntityIDs = useCallback(\n    (newValue: string) => {\n      _setNewEntityIDs(newValue)\n      if (onUpdateEntityIDsTextbox) {\n        onUpdateEntityIDsTextbox(newValue)\n      }\n    },\n    [onUpdateEntityIDsTextbox],\n  )\n\n  const setRefsInState = useCallback(\n    (refs: ReferenceList) => {\n      setRowSelection({})\n      _setRefsInState(refs)\n      if (onUpdate) {\n        onUpdate(refs)\n      }\n      setParseErrors([])\n      setNewEntityIDs('')\n    },\n    [onUpdate, setNewEntityIDs],\n  )\n\n  return {\n    rowSelection,\n    setRowSelection,\n    refsInState,\n    setRefsInState,\n    newEntityIDs,\n    setNewEntityIDs,\n    parseErrors,\n    setParseErrors,\n  }\n}\n"],"mappings":";;;AAKA,SAAgB,EACd,GACA,GACA,GACA;CACA,IAAM,CAAC,GAAc,KAAmB,EAA4B,EAAE,CAAC,EACjE,CAAC,GAAa,KAAmB,EACrC,EAAU,EAAW,CACtB,EACK,CAAC,GAAc,KAAoB,EAAiB,GAAG,EACvD,CAAC,GAAa,KAAkB,EAAmB,EAAE,CAAC;AAG5D,SAAgB;AACd,IAAgB,EAAU,EAAW,CAAC;IACrC,CAAC,EAAW,CAAC;CAEhB,IAAM,IAAkB,GACrB,MAAqB;AAEpB,EADA,EAAiB,EAAS,EACtB,KACF,EAAyB,EAAS;IAGtC,CAAC,EAAyB,CAC3B;AAeD,QAAO;EACL;EACA;EACA;EACA,gBAjBqB,GACpB,MAAwB;AAOvB,GANA,EAAgB,EAAE,CAAC,EACnB,EAAgB,EAAK,EACjB,KACF,EAAS,EAAK,EAEhB,EAAe,EAAE,CAAC,EAClB,EAAgB,GAAG;KAErB,CAAC,GAAU,EAAgB,CAO3B;EACA;EACA;EACA;EACA;EACD"}
+{"version":3,"file":"useEntityHeaderTableState.js","names":[],"sources":["../../../src/components/EntityHeaderTable/useEntityHeaderTableState.ts"],"sourcesContent":["import { useState, useCallback, useEffect } from 'react'\nimport { RowSelectionState } from '@tanstack/react-table'\nimport { cloneDeep } from 'lodash-es'\nimport { ReferenceList } from '@sage-bionetworks/synapse-types'\n\nexport function useEntityHeaderTableState(\n  references: ReferenceList,\n  onUpdateEntityIDsTextbox?: (value: string) => void,\n  onUpdate?: (updatedRefs: ReferenceList) => void,\n) {\n  const [rowSelection, setRowSelection] = useState<RowSelectionState>({})\n  const [refsInState, _setRefsInState] = useState<ReferenceList>(\n    cloneDeep(references),\n  )\n  const [newEntityIDs, _setNewEntityIDs] = useState<string>('')\n  const [parseErrors, setParseErrors] = useState<string[]>([])\n\n  /* Reset state if the `references` argument changes */\n  useEffect(() => {\n    _setRefsInState(cloneDeep(references))\n  }, [references])\n\n  const setNewEntityIDs = useCallback(\n    (newValue: string) => {\n      _setNewEntityIDs(newValue)\n      if (onUpdateEntityIDsTextbox) {\n        onUpdateEntityIDsTextbox(newValue)\n      }\n    },\n    [onUpdateEntityIDsTextbox],\n  )\n\n  const setRefsInState = useCallback(\n    (refs: ReferenceList) => {\n      setRowSelection({})\n      _setRefsInState(refs)\n      if (onUpdate) {\n        onUpdate(refs)\n      }\n      setParseErrors([])\n      setNewEntityIDs('')\n    },\n    [onUpdate, setNewEntityIDs],\n  )\n\n  return {\n    rowSelection,\n    setRowSelection,\n    refsInState,\n    setRefsInState,\n    newEntityIDs,\n    setNewEntityIDs,\n    parseErrors,\n    setParseErrors,\n  }\n}\n"],"mappings":";;;AAKA,SAAgB,EACd,GACA,GACA,GACA;CACA,IAAM,CAAC,GAAc,KAAmB,EAA4B,CAAC,CAAC,GAChE,CAAC,GAAa,KAAmB,EACrC,EAAU,CAAU,CACtB,GACM,CAAC,GAAc,KAAoB,EAAiB,EAAE,GACtD,CAAC,GAAa,KAAkB,EAAmB,CAAC,CAAC;CAG3D,QAAgB;EACd,EAAgB,EAAU,CAAU,CAAC;CACvC,GAAG,CAAC,CAAU,CAAC;CAEf,IAAM,IAAkB,GACrB,MAAqB;EAEpB,AADA,EAAiB,CAAQ,GACrB,KACF,EAAyB,CAAQ;CAErC,GACA,CAAC,CAAwB,CAC3B;CAeA,OAAO;EACL;EACA;EACA;EACA,gBAjBqB,GACpB,MAAwB;GAOvB,AANA,EAAgB,CAAC,CAAC,GAClB,EAAgB,CAAI,GAChB,KACF,EAAS,CAAI,GAEf,EAAe,CAAC,CAAC,GACjB,EAAgB,EAAE;EACpB,GACA,CAAC,GAAU,CAAe,CAO1B;EACA;EACA;EACA;EACA;CACF;AACF"}

package/dist/components/EntityIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityIcon.js","names":[],"sources":["../../src/components/EntityIcon.tsx"],"sourcesContent":["import { entityTypeToFriendlyName } from '@/utils/functions/EntityTypeUtils'\nimport { EntityType } from '@sage-bionetworks/synapse-client'\nimport { CSSProperties, Fragment } from 'react'\nimport IconSvg, {\n  IconName,\n  IconSvgProps,\n  type2SvgIconName,\n} from './IconSvg/IconSvg'\n\nconst getIconTypeForEntity = (type: EntityType): IconName | '' => {\n  switch (type) {\n    case EntityType.project:\n    case EntityType.folder:\n    case EntityType.file:\n    case EntityType.table:\n    case EntityType.link:\n    case EntityType.entityview:\n    case EntityType.dockerrepo:\n    case EntityType.submissionview:\n    case EntityType.dataset:\n    case EntityType.datasetcollection:\n    case EntityType.materializedview:\n    case EntityType.virtualtable:\n    case EntityType.recordset:\n    case EntityType.searchindex:\n      return type2SvgIconName[type]\n    default:\n      return ''\n  }\n}\n\ntype EntityTypeIconProps = {\n  type: EntityType\n  style?: CSSProperties\n  className?: string\n  includeTooltip?: boolean\n  wrap?: boolean\n}\n\nexport function EntityTypeIcon(\n  props: Omit<IconSvgProps, 'icon'> & EntityTypeIconProps,\n) {\n  const {\n    type,\n    style,\n    className,\n    includeTooltip = true,\n    wrap = true,\n    ...rest\n  } = props\n  if (!type) {\n    return <></>\n  }\n  const iconType = getIconTypeForEntity(type)\n  if (iconType === '') {\n    console.warn('Could not retrieve icon for Entity with type: ', type)\n    return <Fragment />\n  }\n\n  const label = includeTooltip ? entityTypeToFriendlyName(type) : undefined\n\n  if (wrap) {\n    return (\n      <span style={style} className={className}>\n        <IconSvg icon={iconType} label={label} wrap={wrap} {...rest} />\n      </span>\n    )\n  }\n  return <IconSvg icon={iconType} label={label} wrap={wrap} {...rest} />\n}\n\nexport default EntityTypeIcon\n"],"mappings":";;;;;;AASA,IAAM,KAAwB,MAAoC;AAChE,SAAQ,GAAR;EACE,KAAK,EAAW;EAChB,KAAK,EAAW;EAChB,KAAK,EAAW;EAChB,KAAK,EAAW;EAChB,KAAK,EAAW;EAChB,KAAK,EAAW;EAChB,KAAK,EAAW;EAChB,KAAK,EAAW;EAChB,KAAK,EAAW;EAChB,KAAK,EAAW;EAChB,KAAK,EAAW;EAChB,KAAK,EAAW;EAChB,KAAK,EAAW;EAChB,KAAK,EAAW,YACd,QAAO,EAAiB;EAC1B,QACE,QAAO;;;AAYb,SAAgB,EACd,GACA;CACA,IAAM,EACJ,SACA,UACA,cACA,oBAAiB,IACjB,UAAO,IACP,GAAG,MACD;AACJ,KAAI,CAAC,EACH,QAAO,kBAAA,GAAA,EAAK,CAAA;CAEd,IAAM,IAAW,EAAqB,EAAK;AAC3C,KAAI,MAAa,GAEf,QADA,QAAQ,KAAK,kDAAkD,EAAK,EAC7D,kBAAC,GAAD,EAAY,CAAA;CAGrB,IAAM,IAAQ,IAAiB,EAAyB,EAAK,GAAG,KAAA;AAShE,QAPI,IAEA,kBAAC,QAAD;EAAa;EAAkB;YAC7B,kBAAC,GAAD;GAAS,MAAM;GAAiB;GAAa;GAAM,GAAI;GAAQ,CAAA;EAC1D,CAAA,GAGJ,kBAAC,GAAD;EAAS,MAAM;EAAiB;EAAa;EAAM,GAAI;EAAQ,CAAA"}
+{"version":3,"file":"EntityIcon.js","names":[],"sources":["../../src/components/EntityIcon.tsx"],"sourcesContent":["import { entityTypeToFriendlyName } from '@/utils/functions/EntityTypeUtils'\nimport { EntityType } from '@sage-bionetworks/synapse-client'\nimport { CSSProperties, Fragment } from 'react'\nimport IconSvg, {\n  IconName,\n  IconSvgProps,\n  type2SvgIconName,\n} from './IconSvg/IconSvg'\n\nconst getIconTypeForEntity = (type: EntityType): IconName | '' => {\n  switch (type) {\n    case EntityType.project:\n    case EntityType.folder:\n    case EntityType.file:\n    case EntityType.table:\n    case EntityType.link:\n    case EntityType.entityview:\n    case EntityType.dockerrepo:\n    case EntityType.submissionview:\n    case EntityType.dataset:\n    case EntityType.datasetcollection:\n    case EntityType.materializedview:\n    case EntityType.virtualtable:\n    case EntityType.recordset:\n    case EntityType.searchindex:\n      return type2SvgIconName[type]\n    default:\n      return ''\n  }\n}\n\ntype EntityTypeIconProps = {\n  type: EntityType\n  style?: CSSProperties\n  className?: string\n  includeTooltip?: boolean\n  wrap?: boolean\n}\n\nexport function EntityTypeIcon(\n  props: Omit<IconSvgProps, 'icon'> & EntityTypeIconProps,\n) {\n  const {\n    type,\n    style,\n    className,\n    includeTooltip = true,\n    wrap = true,\n    ...rest\n  } = props\n  if (!type) {\n    return <></>\n  }\n  const iconType = getIconTypeForEntity(type)\n  if (iconType === '') {\n    console.warn('Could not retrieve icon for Entity with type: ', type)\n    return <Fragment />\n  }\n\n  const label = includeTooltip ? entityTypeToFriendlyName(type) : undefined\n\n  if (wrap) {\n    return (\n      <span style={style} className={className}>\n        <IconSvg icon={iconType} label={label} wrap={wrap} {...rest} />\n      </span>\n    )\n  }\n  return <IconSvg icon={iconType} label={label} wrap={wrap} {...rest} />\n}\n\nexport default EntityTypeIcon\n"],"mappings":";;;;;;AASA,IAAM,KAAwB,MAAoC;CAChE,QAAQ,GAAR;EACE,KAAK,EAAW;EAChB,KAAK,EAAW;EAChB,KAAK,EAAW;EAChB,KAAK,EAAW;EAChB,KAAK,EAAW;EAChB,KAAK,EAAW;EAChB,KAAK,EAAW;EAChB,KAAK,EAAW;EAChB,KAAK,EAAW;EAChB,KAAK,EAAW;EAChB,KAAK,EAAW;EAChB,KAAK,EAAW;EAChB,KAAK,EAAW;EAChB,KAAK,EAAW,aACd,OAAO,EAAiB;EAC1B,SACE,OAAO;CACX;AACF;AAUA,SAAgB,EACd,GACA;CACA,IAAM,EACJ,SACA,UACA,cACA,oBAAiB,IACjB,UAAO,IACP,GAAG,MACD;CACJ,IAAI,CAAC,GACH,OAAO,kBAAA,GAAA,CAAI,CAAA;CAEb,IAAM,IAAW,EAAqB,CAAI;CAC1C,IAAI,MAAa,IAEf,OADA,QAAQ,KAAK,kDAAkD,CAAI,GAC5D,kBAAC,GAAD,CAAW,CAAA;CAGpB,IAAM,IAAQ,IAAiB,EAAyB,CAAI,IAAI,KAAA;CAShE,OAPI,IAEA,kBAAC,QAAD;EAAa;EAAkB;YAC7B,kBAAC,GAAD;GAAS,MAAM;GAAiB;GAAa;GAAM,GAAI;EAAO,CAAA;CAC1D,CAAA,IAGH,kBAAC,GAAD;EAAS,MAAM;EAAiB;EAAa;EAAM,GAAI;CAAO,CAAA;AACvE"}

package/dist/components/EntityLink.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityLink.js","names":[],"sources":["../../src/components/EntityLink.tsx"],"sourcesContent":["import React from 'react'\nimport { useGetEntity, useGetEntityHeader } from '@/synapse-queries'\nimport {\n  convertToEntityType,\n  getEntityTypeFromHeader,\n} from '@/utils/functions/EntityTypeUtils'\nimport {\n  BackendDestinationEnum,\n  getEndpoint,\n} from '@/utils/functions/getEndpoint'\nimport { Link, Skeleton } from '@mui/material'\nimport { Entity, EntityHeader } from '@sage-bionetworks/synapse-types'\nimport { EntityTypeIcon } from './EntityIcon'\nimport { ErrorBanner } from './error/ErrorBanner'\nimport ErrorChip from './error/ErrorChip'\n\nexport type EntityLinkProps = {\n  entity: string | EntityHeader | Entity\n  versionNumber?: number\n  /** Whether the component should link to the entity page in Synapse. Link can be overriden by passing a string. Default true */\n  link?: boolean | string\n  className?: string\n  /** Whether to display an icon identifying the entity type. Default true */\n  showIcon?: boolean\n  /** The field of the entity to display. Default is 'name' */\n  displayTextField?: keyof Entity | keyof EntityHeader\n  onEntityIdClicked?: (entityId: string) => void\n}\n\nexport const EntityLink = (props: EntityLinkProps): React.ReactNode => {\n  const {\n    entity: entityOrId,\n    className,\n    versionNumber,\n    displayTextField = 'name',\n    link = true,\n    showIcon = true,\n    onEntityIdClicked,\n  } = props\n\n  let entityId = ''\n  if (typeof entityOrId === 'string') {\n    entityId = entityOrId\n  }\n\n  const fetchHeader = !!entityId && typeof entityOrId === 'string'\n\n  const { data: fetchedEntity, isLoading } = useGetEntityHeader(\n    entityId,\n    versionNumber,\n    {\n      enabled: fetchHeader,\n    },\n  )\n\n  // We don't get 4XX errors from useGetEntityHeader, so fetch the entity object to get an error response\n  // See PLFM-7989\n  const fetchFullEntity =\n    fetchHeader && fetchedEntity == undefined && !isLoading\n  const { error } = useGetEntity(entityId, versionNumber, {\n    enabled: fetchFullEntity,\n  })\n\n  if (fetchedEntity || typeof entityOrId !== 'string') {\n    const entity = fetchedEntity ?? (entityOrId as Entity | EntityHeader)\n    let type\n    if ('concreteType' in entity) {\n      type = convertToEntityType(entity.concreteType)\n    } else {\n      type = getEntityTypeFromHeader(entity)\n    }\n    const href =\n      typeof link === 'string'\n        ? link\n        : `${getEndpoint(\n            BackendDestinationEnum.PORTAL_ENDPOINT,\n          )}Synapse:${entity.id!}${versionNumber ? `.${versionNumber}` : ''}`\n    if (link) {\n      return (\n        <Link\n          className={className}\n          target=\"_blank\"\n          rel=\"noopener noreferrer\"\n          onClick={\n            onEntityIdClicked\n              ? e => {\n                  e.preventDefault()\n                  onEntityIdClicked(entity.id!)\n                }\n              : undefined\n          }\n          href={href}\n        >\n          {showIcon && (\n            <EntityTypeIcon type={type} style={{ marginRight: '6px' }} />\n          )}\n          {entity[displayTextField as keyof typeof entity]}\n        </Link>\n      )\n    } else {\n      return (\n        <p className={className}>\n          {showIcon && (\n            <EntityTypeIcon type={type} style={{ marginRight: '6px' }} />\n          )}\n          {entity[displayTextField as keyof typeof entity]}\n        </p>\n      )\n    }\n  } else if (error) {\n    if (entityId) {\n      return <ErrorChip chipText={entityId} error={error} />\n    }\n    return <ErrorBanner error={error} />\n  } else {\n    return <Skeleton variant=\"rectangular\" width=\"100\" />\n  }\n}\n"],"mappings":";;;;;;;;;;;;AA6BA,IAAa,KAAc,MAA4C;CACrE,IAAM,EACJ,QAAQ,GACR,cACA,kBACA,sBAAmB,QACnB,UAAO,IACP,cAAW,IACX,yBACE,GAEA,IAAW;AACf,CAAI,OAAO,KAAe,aACxB,IAAW;CAGb,IAAM,IAAc,CAAC,CAAC,KAAY,OAAO,KAAe,UAElD,EAAE,MAAM,GAAe,iBAAc,EACzC,GACA,GACA,EACE,SAAS,GACV,CACF,EAMK,EAAE,aAAU,EAAa,GAAU,GAAe,EACtD,SAFA,KAAe,KAAiB,QAAa,CAAC,GAG/C,CAAC;AAEF,KAAI,KAAiB,OAAO,KAAe,UAAU;EACnD,IAAM,IAAS,KAAkB,GAC7B;AACJ,EAGE,IAHE,kBAAkB,IACb,EAAoB,EAAO,aAAa,GAExC,EAAwB,EAAO;EAExC,IAAM,IACJ,OAAO,KAAS,WACZ,IACA,GAAG,EACD,EAAuB,gBACxB,CAAC,UAAU,EAAO,KAAM,IAAgB,IAAI,MAAkB;AAwBnE,SAvBE,IAEA,kBAAC,GAAD;GACa;GACX,QAAO;GACP,KAAI;GACJ,SACE,KACI,MAAK;AAEH,IADA,EAAE,gBAAgB,EAClB,EAAkB,EAAO,GAAI;OAE/B,KAAA;GAEA;aAZR,CAcG,KACC,kBAAC,GAAD;IAAsB;IAAM,OAAO,EAAE,aAAa,OAAO;IAAI,CAAA,EAE9D,EAAO,GACH;OAIP,kBAAC,KAAD;GAAc;aAAd,CACG,KACC,kBAAC,GAAD;IAAsB;IAAM,OAAO,EAAE,aAAa,OAAO;IAAI,CAAA,EAE9D,EAAO,GACN;;YAGC,EAIT,QAHI,IACK,kBAAC,GAAD;EAAW,UAAU;EAAiB;EAAS,CAAA,GAEjD,kBAAC,GAAD,EAAoB,UAAS,CAAA;KAEpC,QAAO,kBAAC,GAAD;EAAU,SAAQ;EAAc,OAAM;EAAQ,CAAA"}
+{"version":3,"file":"EntityLink.js","names":[],"sources":["../../src/components/EntityLink.tsx"],"sourcesContent":["import React from 'react'\nimport { useGetEntity, useGetEntityHeader } from '@/synapse-queries'\nimport {\n  convertToEntityType,\n  getEntityTypeFromHeader,\n} from '@/utils/functions/EntityTypeUtils'\nimport {\n  BackendDestinationEnum,\n  getEndpoint,\n} from '@/utils/functions/getEndpoint'\nimport { Link, Skeleton } from '@mui/material'\nimport { Entity, EntityHeader } from '@sage-bionetworks/synapse-types'\nimport { EntityTypeIcon } from './EntityIcon'\nimport { ErrorBanner } from './error/ErrorBanner'\nimport ErrorChip from './error/ErrorChip'\n\nexport type EntityLinkProps = {\n  entity: string | EntityHeader | Entity\n  versionNumber?: number\n  /** Whether the component should link to the entity page in Synapse. Link can be overriden by passing a string. Default true */\n  link?: boolean | string\n  className?: string\n  /** Whether to display an icon identifying the entity type. Default true */\n  showIcon?: boolean\n  /** The field of the entity to display. Default is 'name' */\n  displayTextField?: keyof Entity | keyof EntityHeader\n  onEntityIdClicked?: (entityId: string) => void\n}\n\nexport const EntityLink = (props: EntityLinkProps): React.ReactNode => {\n  const {\n    entity: entityOrId,\n    className,\n    versionNumber,\n    displayTextField = 'name',\n    link = true,\n    showIcon = true,\n    onEntityIdClicked,\n  } = props\n\n  let entityId = ''\n  if (typeof entityOrId === 'string') {\n    entityId = entityOrId\n  }\n\n  const fetchHeader = !!entityId && typeof entityOrId === 'string'\n\n  const { data: fetchedEntity, isLoading } = useGetEntityHeader(\n    entityId,\n    versionNumber,\n    {\n      enabled: fetchHeader,\n    },\n  )\n\n  // We don't get 4XX errors from useGetEntityHeader, so fetch the entity object to get an error response\n  // See PLFM-7989\n  const fetchFullEntity =\n    fetchHeader && fetchedEntity == undefined && !isLoading\n  const { error } = useGetEntity(entityId, versionNumber, {\n    enabled: fetchFullEntity,\n  })\n\n  if (fetchedEntity || typeof entityOrId !== 'string') {\n    const entity = fetchedEntity ?? (entityOrId as Entity | EntityHeader)\n    let type\n    if ('concreteType' in entity) {\n      type = convertToEntityType(entity.concreteType)\n    } else {\n      type = getEntityTypeFromHeader(entity)\n    }\n    const href =\n      typeof link === 'string'\n        ? link\n        : `${getEndpoint(\n            BackendDestinationEnum.PORTAL_ENDPOINT,\n          )}Synapse:${entity.id!}${versionNumber ? `.${versionNumber}` : ''}`\n    if (link) {\n      return (\n        <Link\n          className={className}\n          target=\"_blank\"\n          rel=\"noopener noreferrer\"\n          onClick={\n            onEntityIdClicked\n              ? e => {\n                  e.preventDefault()\n                  onEntityIdClicked(entity.id!)\n                }\n              : undefined\n          }\n          href={href}\n        >\n          {showIcon && (\n            <EntityTypeIcon type={type} style={{ marginRight: '6px' }} />\n          )}\n          {entity[displayTextField as keyof typeof entity]}\n        </Link>\n      )\n    } else {\n      return (\n        <p className={className}>\n          {showIcon && (\n            <EntityTypeIcon type={type} style={{ marginRight: '6px' }} />\n          )}\n          {entity[displayTextField as keyof typeof entity]}\n        </p>\n      )\n    }\n  } else if (error) {\n    if (entityId) {\n      return <ErrorChip chipText={entityId} error={error} />\n    }\n    return <ErrorBanner error={error} />\n  } else {\n    return <Skeleton variant=\"rectangular\" width=\"100\" />\n  }\n}\n"],"mappings":";;;;;;;;;;;;AA6BA,IAAa,KAAc,MAA4C;CACrE,IAAM,EACJ,QAAQ,GACR,cACA,kBACA,sBAAmB,QACnB,UAAO,IACP,cAAW,IACX,yBACE,GAEA,IAAW;CACf,AAAI,OAAO,KAAe,aACxB,IAAW;CAGb,IAAM,IAAc,CAAC,CAAC,KAAY,OAAO,KAAe,UAElD,EAAE,MAAM,GAAe,iBAAc,EACzC,GACA,GACA,EACE,SAAS,EACX,CACF,GAMM,EAAE,aAAU,EAAa,GAAU,GAAe,EACtD,SAFA,KAAe,KAAiB,QAAa,CAAC,EAGhD,CAAC;CAED,IAAI,KAAiB,OAAO,KAAe,UAAU;EACnD,IAAM,IAAS,KAAkB,GAC7B;EACJ,AAGE,IAHE,kBAAkB,IACb,EAAoB,EAAO,YAAY,IAEvC,EAAwB,CAAM;EAEvC,IAAM,IACJ,OAAO,KAAS,WACZ,IACA,GAAG,EACD,EAAuB,eACzB,EAAE,UAAU,EAAO,KAAM,IAAgB,IAAI,MAAkB;EAwBnE,OAvBE,IAEA,kBAAC,GAAD;GACa;GACX,QAAO;GACP,KAAI;GACJ,SACE,KACI,MAAK;IAEH,AADA,EAAE,eAAe,GACjB,EAAkB,EAAO,EAAG;GAC9B,IACA,KAAA;GAEA;aAZR,CAcG,KACC,kBAAC,GAAD;IAAsB;IAAM,OAAO,EAAE,aAAa,MAAM;GAAI,CAAA,GAE7D,EAAO,EACJ;OAIN,kBAAC,KAAD;GAAc;aAAd,CACG,KACC,kBAAC,GAAD;IAAsB;IAAM,OAAO,EAAE,aAAa,MAAM;GAAI,CAAA,GAE7D,EAAO,EACP;;CAGT,OAAO,IAAI,GAIT,OAHI,IACK,kBAAC,GAAD;EAAW,UAAU;EAAiB;CAAQ,CAAA,IAEhD,kBAAC,GAAD,EAAoB,SAAQ,CAAA;MAEnC,OAAO,kBAAC,GAAD;EAAU,SAAQ;EAAc,OAAM;CAAO,CAAA;AAExD"}

package/dist/components/EntitySubjectsSelector/EntitySubjectsSelector.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntitySubjectsSelector.js","names":[],"sources":["../../../src/components/EntitySubjectsSelector/EntitySubjectsSelector.tsx"],"sourcesContent":["import { Box, Typography } from '@mui/material'\nimport {\n  Reference,\n  ReferenceList,\n  RestrictableObjectDescriptor,\n  RestrictableObjectType,\n} from '@sage-bionetworks/synapse-types'\nimport { isEqual, uniqWith } from 'lodash-es'\nimport { useMemo } from 'react'\nimport EntityHeaderTable, { EntityHeaderTableProps } from '../EntityHeaderTable'\n\nexport const REMOVE_BUTTON_TEXT = 'Mark for Removal from AR'\nexport const NO_ENTITIES_SELECTED = 'No entities selected.'\n\nexport type EntitySubjectsSelectorProps = {\n  // will be filtered to only entity subjects\n  subjects: RestrictableObjectDescriptor[]\n  onUpdate?: (subjects: RestrictableObjectDescriptor[]) => void\n  onUpdateEntityIDsTextbox: EntityHeaderTableProps['onUpdateEntityIDsTextbox']\n}\n\nfunction EntitySubjectsSelector(props: EntitySubjectsSelectorProps) {\n  const { subjects, onUpdate, onUpdateEntityIDsTextbox } = props\n\n  const references = useMemo(() => {\n    return subjects\n      .filter(subject => {\n        return subject.type === RestrictableObjectType.ENTITY\n      })\n      .map(subject => {\n        const ref: Reference = {\n          targetId: subject.id,\n        }\n        return ref\n      })\n  }, [subjects])\n\n  const handleChange = (updatedReferences: ReferenceList) => {\n    if (onUpdate) {\n      const dedupedReferences = uniqWith(updatedReferences, isEqual)\n      const updatedSubjects = dedupedReferences.map(reference => {\n        const subject: RestrictableObjectDescriptor = {\n          id: reference.targetId,\n          type: RestrictableObjectType.ENTITY,\n        }\n        return subject\n      })\n      onUpdate(updatedSubjects)\n    }\n  }\n\n  return (\n    <Box\n      sx={{\n        mb: 2,\n      }}\n    >\n      {references.length === 0 && (\n        <Typography\n          variant=\"body1Italic\"\n          sx={{\n            mb: -4,\n          }}\n        >\n          {NO_ENTITIES_SELECTED}\n        </Typography>\n      )}\n      <EntityHeaderTable\n        references={references}\n        isEditable={Boolean(onUpdate)}\n        onUpdate={newReferences => {\n          handleChange(newReferences)\n        }}\n        removeSelectedRowsButtonText={REMOVE_BUTTON_TEXT}\n        onUpdateEntityIDsTextbox={onUpdateEntityIDsTextbox}\n      />\n    </Box>\n  )\n}\n\nexport default EntitySubjectsSelector\n"],"mappings":";;;;;;;AAWA,IAAa,IAAqB,4BACrB,IAAuB;AASpC,SAAS,EAAuB,GAAoC;CAClE,IAAM,EAAE,aAAU,aAAU,gCAA6B,GAEnD,IAAa,QACV,EACJ,QAAO,MACC,EAAQ,SAAS,EAAuB,OAC/C,CACD,KAAI,OAII,EAFL,UAAU,EAAQ,IAEb,EACP,EACH,CAAC,EAAS,CAAC,EAER,KAAgB,MAAqC;AACzD,EAAI,KASF,EAR0B,EAAS,GAAmB,EAC9B,CAAkB,KAAI,OAKrC;GAHL,IAAI,EAAU;GACd,MAAM,EAAuB;GAExB,EAEA,CAAgB;;AAI7B,QACE,kBAAC,GAAD;EACE,IAAI,EACF,IAAI,GACL;YAHH,CAKG,EAAW,WAAW,KACrB,kBAAC,GAAD;GACE,SAAQ;GACR,IAAI,EACF,IAAI,IACL;;GAGU,CAAA,EAEf,kBAAC,GAAD;GACc;GACZ,YAAY,EAAQ;GACpB,WAAU,MAAiB;AACzB,MAAa,EAAc;;GAE7B,8BAA8B;GACJ;GAC1B,CAAA,CACE"}
+{"version":3,"file":"EntitySubjectsSelector.js","names":[],"sources":["../../../src/components/EntitySubjectsSelector/EntitySubjectsSelector.tsx"],"sourcesContent":["import { Box, Typography } from '@mui/material'\nimport {\n  Reference,\n  ReferenceList,\n  RestrictableObjectDescriptor,\n  RestrictableObjectType,\n} from '@sage-bionetworks/synapse-types'\nimport { isEqual, uniqWith } from 'lodash-es'\nimport { useMemo } from 'react'\nimport EntityHeaderTable, { EntityHeaderTableProps } from '../EntityHeaderTable'\n\nexport const REMOVE_BUTTON_TEXT = 'Mark for Removal from AR'\nexport const NO_ENTITIES_SELECTED = 'No entities selected.'\n\nexport type EntitySubjectsSelectorProps = {\n  // will be filtered to only entity subjects\n  subjects: RestrictableObjectDescriptor[]\n  onUpdate?: (subjects: RestrictableObjectDescriptor[]) => void\n  onUpdateEntityIDsTextbox: EntityHeaderTableProps['onUpdateEntityIDsTextbox']\n}\n\nfunction EntitySubjectsSelector(props: EntitySubjectsSelectorProps) {\n  const { subjects, onUpdate, onUpdateEntityIDsTextbox } = props\n\n  const references = useMemo(() => {\n    return subjects\n      .filter(subject => {\n        return subject.type === RestrictableObjectType.ENTITY\n      })\n      .map(subject => {\n        const ref: Reference = {\n          targetId: subject.id,\n        }\n        return ref\n      })\n  }, [subjects])\n\n  const handleChange = (updatedReferences: ReferenceList) => {\n    if (onUpdate) {\n      const dedupedReferences = uniqWith(updatedReferences, isEqual)\n      const updatedSubjects = dedupedReferences.map(reference => {\n        const subject: RestrictableObjectDescriptor = {\n          id: reference.targetId,\n          type: RestrictableObjectType.ENTITY,\n        }\n        return subject\n      })\n      onUpdate(updatedSubjects)\n    }\n  }\n\n  return (\n    <Box\n      sx={{\n        mb: 2,\n      }}\n    >\n      {references.length === 0 && (\n        <Typography\n          variant=\"body1Italic\"\n          sx={{\n            mb: -4,\n          }}\n        >\n          {NO_ENTITIES_SELECTED}\n        </Typography>\n      )}\n      <EntityHeaderTable\n        references={references}\n        isEditable={Boolean(onUpdate)}\n        onUpdate={newReferences => {\n          handleChange(newReferences)\n        }}\n        removeSelectedRowsButtonText={REMOVE_BUTTON_TEXT}\n        onUpdateEntityIDsTextbox={onUpdateEntityIDsTextbox}\n      />\n    </Box>\n  )\n}\n\nexport default EntitySubjectsSelector\n"],"mappings":";;;;;;;AAWA,IAAa,IAAqB,4BACrB,IAAuB;AASpC,SAAS,EAAuB,GAAoC;CAClE,IAAM,EAAE,aAAU,aAAU,gCAA6B,GAEnD,IAAa,QACV,EACJ,QAAO,MACC,EAAQ,SAAS,EAAuB,MAChD,EACA,KAAI,OAII,EAFL,UAAU,EAAQ,GAEb,EACR,GACF,CAAC,CAAQ,CAAC,GAEP,KAAgB,MAAqC;EACzD,AAAI,KASF,EAR0B,EAAS,GAAmB,CAC9B,EAAkB,KAAI,OAKrC;GAHL,IAAI,EAAU;GACd,MAAM,EAAuB;EAExB,EAEA,CAAe;CAE5B;CAEA,OACE,kBAAC,GAAD;EACE,IAAI,EACF,IAAI,EACN;YAHF,CAKG,EAAW,WAAW,KACrB,kBAAC,GAAD;GACE,SAAQ;GACR,IAAI,EACF,IAAI,GACN;;EAGU,CAAA,GAEd,kBAAC,GAAD;GACc;GACZ,YAAY,EAAQ;GACpB,WAAU,MAAiB;IACzB,EAAa,CAAa;GAC5B;GACA,8BAA8B;GACJ;EAC3B,CAAA,CACE;;AAET"}

package/dist/components/EntityTreeTable/EntityTreeTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityTreeTable.js","names":[],"sources":["../../../src/components/EntityTreeTable/EntityTreeTable.tsx"],"sourcesContent":["import React, { useMemo } from 'react'\nimport styles from './EntityTreeTable.module.scss'\nimport { useReactTable, getCoreRowModel } from '@tanstack/react-table'\nimport { EntityHeader } from '@sage-bionetworks/synapse-types'\nimport { Box } from '@mui/material'\nimport { useEntityTreeState } from './hooks/useEntityTreeState'\nimport { useTreeOperationsWithDirectFetch } from './hooks/useTreeOperationsWithDirectFetch'\nimport { useTableColumns } from './hooks/useTableColumns'\nimport { useTableData } from './hooks/useTableData'\nexport { type TreeNode } from './hooks/useEntityTreeState'\nimport { EntityTreeTableView } from './components/EntityTreeTableView'\nimport { EntityTreeTableContext } from './components/EntityTreeTableContext'\nimport NoContentAvailable from '../SynapseTable/NoContentAvailable'\n\ntype EntityTreeTableProps = {\n  /** The Synapse ID of the root entity to display */\n  rootId: string\n  /** Whether to expand the root node by default. Defaults to true */\n  expandRootByDefault?: boolean\n  /** Whether to show the root node in the tree. Defaults to true */\n  showRootNode?: boolean\n  /** Whether to enable column sorting. Defaults to true */\n  enableSorting?: boolean\n  /** Callback when an entity is clicked. If not provided, defaults to opening Synapse.org page. */\n  onEntityIdClicked?: (entityId: string) => void\n}\n\nexport type EntityBundleRow = {\n  entityId: string\n  entityHeader: EntityHeader\n  depth: number\n  isLeaf: boolean\n  parentId?: string\n  versionNumber?: number\n  isLoadMore?: boolean\n  pageToken?: string\n}\n\nexport const EntityTreeTable: React.FC<EntityTreeTableProps> = ({\n  rootId,\n  expandRootByDefault = true,\n  showRootNode = true,\n  enableSorting = true,\n  onEntityIdClicked,\n}) => {\n  // Use hook for state management and data initialization\n  const {\n    expanded,\n    setExpanded,\n    tree,\n    setTree,\n    loadingIds,\n    setLoadingIds,\n    loadedChildren,\n    setLoadedChildren,\n    nextPageTokens,\n    setNextPageTokens,\n    loadingPageTokens,\n    setLoadingPageTokens,\n    sorting,\n    setSorting,\n    sortBy,\n    sortDirection,\n  } = useEntityTreeState(rootId, expandRootByDefault, showRootNode)\n\n  // Use tree operations hook with direct fetch\n  const { handleToggleExpanded, loadMoreChildren, flattenTree } =\n    useTreeOperationsWithDirectFetch(\n      expanded,\n      setExpanded,\n      tree,\n      setTree,\n      loadedChildren,\n      setLoadedChildren,\n      loadingIds,\n      setLoadingIds,\n      setNextPageTokens,\n      setLoadingPageTokens,\n      loadingPageTokens,\n      nextPageTokens,\n      sortBy,\n      sortDirection,\n    )\n\n  // Get table columns\n  const columns = useTableColumns(enableSorting)\n\n  // Get table data\n  const rows = useTableData(\n    tree,\n    rootId,\n    showRootNode,\n    expanded,\n    nextPageTokens,\n    flattenTree,\n  )\n\n  const isTreeEmpty = useMemo(() => {\n    const rootNode = tree[rootId]\n    if (!rootNode) return false\n\n    // If we're showing the root node, we always have content (at least the root)\n    if (showRootNode) return false\n\n    // If we're not showing root node, check if root has children loaded and they're empty\n    if (loadedChildren.has(rootId)) {\n      return !rootNode.children || rootNode.children.length === 0\n    }\n\n    // If children haven't been loaded yet, don't show no content\n    return false\n  }, [tree, rootId, showRootNode, loadedChildren])\n\n  const table = useReactTable({\n    data: rows,\n    columns,\n    getCoreRowModel: getCoreRowModel(),\n    columnResizeMode: 'onChange',\n    state: { expanded, sorting },\n    // Make row ids robust: include parent/depth for normal rows so that the\n    // same entity appearing in different places (or synthetic rows) won't\n    // collide. For load-more rows, use parentId and depth to create unique identifier.\n    getRowId: row =>\n      row.isLoadMore\n        ? `loadmore::${row.parentId}::${row.depth}::${\n            row.pageToken || 'no-token'\n          }`\n        : `${row.entityId || row.entityHeader.id}::${row.parentId ?? 'root'}::${\n            row.depth\n          }`,\n    manualExpanding: true,\n    manualSorting: true,\n    enableSorting,\n    onSortingChange: setSorting,\n    enableColumnFilters: false,\n  })\n\n  return (\n    <Box>\n      <EntityTreeTableContext.Provider\n        value={{\n          expanded,\n          loadingIds,\n          handleToggleExpanded: (entityId: string) => {\n            void handleToggleExpanded(entityId)\n          },\n          loadMoreChildren: (entityId: string, pageToken?: string) => {\n            void loadMoreChildren(entityId, pageToken)\n          },\n          nextPageTokens,\n          onEntityIdClicked,\n        }}\n      >\n        {isTreeEmpty ? (\n          <NoContentAvailable />\n        ) : (\n          <EntityTreeTableView\n            table={table}\n            className={styles.entityTreeTable}\n          />\n        )}\n      </EntityTreeTableContext.Provider>\n    </Box>\n  )\n}\n\nexport default EntityTreeTable\n"],"mappings":";;;;;;;;;;;;;AAsCA,IAAa,KAAmD,EAC9D,WACA,yBAAsB,IACtB,kBAAe,IACf,mBAAgB,IAChB,2BACI;CAEJ,IAAM,EACJ,aACA,gBACA,SACA,YACA,eACA,kBACA,mBACA,sBACA,mBACA,sBACA,sBACA,yBACA,YACA,eACA,WACA,qBACE,EAAmB,GAAQ,GAAqB,EAAa,EAG3D,EAAE,yBAAsB,qBAAkB,mBAC9C,EACE,GACA,GACA,GACA,GACA,GACA,GACA,GACA,GACA,GACA,GACA,GACA,GACA,GACA,EACD,EAGG,IAAU,EAAgB,EAAc,EAGxC,IAAO,EACX,GACA,GACA,GACA,GACA,GACA,EACD,EAEK,IAAc,QAAc;EAChC,IAAM,IAAW,EAAK;AAYtB,SAXI,CAAC,KAGD,IAAqB,KAGrB,EAAe,IAAI,EAAO,GACrB,CAAC,EAAS,YAAY,EAAS,SAAS,WAAW,IAIrD;IACN;EAAC;EAAM;EAAQ;EAAc;EAAe,CAAC,EAE1C,IAAQ,EAAc;EAC1B,MAAM;EACN;EACA,iBAAiB,GAAiB;EAClC,kBAAkB;EAClB,OAAO;GAAE;GAAU;GAAS;EAI5B,WAAU,MACR,EAAI,aACA,aAAa,EAAI,SAAS,IAAI,EAAI,MAAM,IACtC,EAAI,aAAa,eAEnB,GAAG,EAAI,YAAY,EAAI,aAAa,GAAG,IAAI,EAAI,YAAY,OAAO,IAChE,EAAI;EAEZ,iBAAiB;EACjB,eAAe;EACf;EACA,iBAAiB;EACjB,qBAAqB;EACtB,CAAC;AAEF,QACE,kBAAC,GAAD,EAAA,UACE,kBAAC,EAAuB,UAAxB;EACE,OAAO;GACL;GACA;GACA,uBAAuB,MAAqB;AACrC,MAAqB,EAAS;;GAErC,mBAAmB,GAAkB,MAAuB;AACrD,MAAiB,GAAU,EAAU;;GAE5C;GACA;GACD;YAEA,IACC,kBAAC,GAAD,EAAsB,CAAA,GAEtB,kBAAC,GAAD;GACS;GACP,WAAW,EAAO;GAClB,CAAA;EAE4B,CAAA,EAC9B,CAAA"}
+{"version":3,"file":"EntityTreeTable.js","names":[],"sources":["../../../src/components/EntityTreeTable/EntityTreeTable.tsx"],"sourcesContent":["import React, { useMemo } from 'react'\nimport styles from './EntityTreeTable.module.scss'\nimport { useReactTable, getCoreRowModel } from '@tanstack/react-table'\nimport { EntityHeader } from '@sage-bionetworks/synapse-types'\nimport { Box } from '@mui/material'\nimport { useEntityTreeState } from './hooks/useEntityTreeState'\nimport { useTreeOperationsWithDirectFetch } from './hooks/useTreeOperationsWithDirectFetch'\nimport { useTableColumns } from './hooks/useTableColumns'\nimport { useTableData } from './hooks/useTableData'\nexport { type TreeNode } from './hooks/useEntityTreeState'\nimport { EntityTreeTableView } from './components/EntityTreeTableView'\nimport { EntityTreeTableContext } from './components/EntityTreeTableContext'\nimport NoContentAvailable from '../SynapseTable/NoContentAvailable'\n\ntype EntityTreeTableProps = {\n  /** The Synapse ID of the root entity to display */\n  rootId: string\n  /** Whether to expand the root node by default. Defaults to true */\n  expandRootByDefault?: boolean\n  /** Whether to show the root node in the tree. Defaults to true */\n  showRootNode?: boolean\n  /** Whether to enable column sorting. Defaults to true */\n  enableSorting?: boolean\n  /** Callback when an entity is clicked. If not provided, defaults to opening Synapse.org page. */\n  onEntityIdClicked?: (entityId: string) => void\n}\n\nexport type EntityBundleRow = {\n  entityId: string\n  entityHeader: EntityHeader\n  depth: number\n  isLeaf: boolean\n  parentId?: string\n  versionNumber?: number\n  isLoadMore?: boolean\n  pageToken?: string\n}\n\nexport const EntityTreeTable: React.FC<EntityTreeTableProps> = ({\n  rootId,\n  expandRootByDefault = true,\n  showRootNode = true,\n  enableSorting = true,\n  onEntityIdClicked,\n}) => {\n  // Use hook for state management and data initialization\n  const {\n    expanded,\n    setExpanded,\n    tree,\n    setTree,\n    loadingIds,\n    setLoadingIds,\n    loadedChildren,\n    setLoadedChildren,\n    nextPageTokens,\n    setNextPageTokens,\n    loadingPageTokens,\n    setLoadingPageTokens,\n    sorting,\n    setSorting,\n    sortBy,\n    sortDirection,\n  } = useEntityTreeState(rootId, expandRootByDefault, showRootNode)\n\n  // Use tree operations hook with direct fetch\n  const { handleToggleExpanded, loadMoreChildren, flattenTree } =\n    useTreeOperationsWithDirectFetch(\n      expanded,\n      setExpanded,\n      tree,\n      setTree,\n      loadedChildren,\n      setLoadedChildren,\n      loadingIds,\n      setLoadingIds,\n      setNextPageTokens,\n      setLoadingPageTokens,\n      loadingPageTokens,\n      nextPageTokens,\n      sortBy,\n      sortDirection,\n    )\n\n  // Get table columns\n  const columns = useTableColumns(enableSorting)\n\n  // Get table data\n  const rows = useTableData(\n    tree,\n    rootId,\n    showRootNode,\n    expanded,\n    nextPageTokens,\n    flattenTree,\n  )\n\n  const isTreeEmpty = useMemo(() => {\n    const rootNode = tree[rootId]\n    if (!rootNode) return false\n\n    // If we're showing the root node, we always have content (at least the root)\n    if (showRootNode) return false\n\n    // If we're not showing root node, check if root has children loaded and they're empty\n    if (loadedChildren.has(rootId)) {\n      return !rootNode.children || rootNode.children.length === 0\n    }\n\n    // If children haven't been loaded yet, don't show no content\n    return false\n  }, [tree, rootId, showRootNode, loadedChildren])\n\n  const table = useReactTable({\n    data: rows,\n    columns,\n    getCoreRowModel: getCoreRowModel(),\n    columnResizeMode: 'onChange',\n    state: { expanded, sorting },\n    // Make row ids robust: include parent/depth for normal rows so that the\n    // same entity appearing in different places (or synthetic rows) won't\n    // collide. For load-more rows, use parentId and depth to create unique identifier.\n    getRowId: row =>\n      row.isLoadMore\n        ? `loadmore::${row.parentId}::${row.depth}::${\n            row.pageToken || 'no-token'\n          }`\n        : `${row.entityId || row.entityHeader.id}::${row.parentId ?? 'root'}::${\n            row.depth\n          }`,\n    manualExpanding: true,\n    manualSorting: true,\n    enableSorting,\n    onSortingChange: setSorting,\n    enableColumnFilters: false,\n  })\n\n  return (\n    <Box>\n      <EntityTreeTableContext.Provider\n        value={{\n          expanded,\n          loadingIds,\n          handleToggleExpanded: (entityId: string) => {\n            void handleToggleExpanded(entityId)\n          },\n          loadMoreChildren: (entityId: string, pageToken?: string) => {\n            void loadMoreChildren(entityId, pageToken)\n          },\n          nextPageTokens,\n          onEntityIdClicked,\n        }}\n      >\n        {isTreeEmpty ? (\n          <NoContentAvailable />\n        ) : (\n          <EntityTreeTableView\n            table={table}\n            className={styles.entityTreeTable}\n          />\n        )}\n      </EntityTreeTableContext.Provider>\n    </Box>\n  )\n}\n\nexport default EntityTreeTable\n"],"mappings":";;;;;;;;;;;;;AAsCA,IAAa,KAAmD,EAC9D,WACA,yBAAsB,IACtB,kBAAe,IACf,mBAAgB,IAChB,2BACI;CAEJ,IAAM,EACJ,aACA,gBACA,SACA,YACA,eACA,kBACA,mBACA,sBACA,mBACA,sBACA,sBACA,yBACA,YACA,eACA,WACA,qBACE,EAAmB,GAAQ,GAAqB,CAAY,GAG1D,EAAE,yBAAsB,qBAAkB,mBAC9C,EACE,GACA,GACA,GACA,GACA,GACA,GACA,GACA,GACA,GACA,GACA,GACA,GACA,GACA,CACF,GAGI,IAAU,EAAgB,CAAa,GAGvC,IAAO,EACX,GACA,GACA,GACA,GACA,GACA,CACF,GAEM,IAAc,QAAc;EAChC,IAAM,IAAW,EAAK;EAYtB,OAXI,CAAC,KAGD,IAAqB,KAGrB,EAAe,IAAI,CAAM,IACpB,CAAC,EAAS,YAAY,EAAS,SAAS,WAAW,IAIrD;CACT,GAAG;EAAC;EAAM;EAAQ;EAAc;CAAc,CAAC,GAEzC,IAAQ,EAAc;EAC1B,MAAM;EACN;EACA,iBAAiB,EAAgB;EACjC,kBAAkB;EAClB,OAAO;GAAE;GAAU;EAAQ;EAI3B,WAAU,MACR,EAAI,aACA,aAAa,EAAI,SAAS,IAAI,EAAI,MAAM,IACtC,EAAI,aAAa,eAEnB,GAAG,EAAI,YAAY,EAAI,aAAa,GAAG,IAAI,EAAI,YAAY,OAAO,IAChE,EAAI;EAEZ,iBAAiB;EACjB,eAAe;EACf;EACA,iBAAiB;EACjB,qBAAqB;CACvB,CAAC;CAED,OACE,kBAAC,GAAD,EAAA,UACE,kBAAC,EAAuB,UAAxB;EACE,OAAO;GACL;GACA;GACA,uBAAuB,MAAqB;IAC1C,EAA0B,CAAQ;GACpC;GACA,mBAAmB,GAAkB,MAAuB;IAC1D,EAAsB,GAAU,CAAS;GAC3C;GACA;GACA;EACF;YAEC,IACC,kBAAC,GAAD,CAAqB,CAAA,IAErB,kBAAC,GAAD;GACS;GACP,WAAW,EAAO;EACnB,CAAA;CAE4B,CAAA,EAC9B,CAAA;AAET"}

package/dist/components/EntityTreeTable/components/AutoLoadMore.js.map

@@ -1 +1 @@
-{"version":3,"file":"AutoLoadMore.js","names":[],"sources":["../../../../src/components/EntityTreeTable/components/AutoLoadMore.tsx"],"sourcesContent":["import { SynapseSpinner } from '@/components/LoadingScreen/LoadingScreen'\nimport { useEffect, useRef } from 'react'\nimport { useInView } from 'react-intersection-observer'\nimport { depthPaddingMultiplierPx } from './EntityNameCell'\n\nexport const AutoLoadMore: React.FC<{\n  depth: number\n  isLoading: boolean\n  onLoadMore: () => void\n  pageToken?: string\n}> = ({ depth, isLoading, onLoadMore }) => {\n  const hasTriggered = useRef(false)\n  const { ref, inView } = useInView({\n    threshold: 0.1,\n    rootMargin: '50px',\n    triggerOnce: true,\n  })\n\n  useEffect(() => {\n    // Only trigger if we're in view, not loading, and haven't triggered yet\n    // Each component instance is now unique per page token due to unique row IDs\n    if (inView && !isLoading && !hasTriggered.current) {\n      hasTriggered.current = true\n      onLoadMore()\n    }\n  }, [inView, isLoading, onLoadMore])\n\n  return (\n    <div\n      ref={ref}\n      style={{\n        paddingLeft: depth * depthPaddingMultiplierPx + 45,\n        minHeight: '40px',\n        display: 'flex',\n        alignItems: 'center',\n        gap: '8px',\n      }}\n    >\n      <>\n        <SynapseSpinner size={16} margin={'0px'} />\n        <span>Loading...</span>\n      </>\n    </div>\n  )\n}\n"],"mappings":";;;;;;AAKA,IAAa,KAKP,EAAE,UAAO,cAAW,oBAAiB;CACzC,IAAM,IAAe,EAAO,GAAM,EAC5B,EAAE,QAAK,cAAW,EAAU;EAChC,WAAW;EACX,YAAY;EACZ,aAAa;EACd,CAAC;AAWF,QATA,QAAgB;AAGd,EAAI,KAAU,CAAC,KAAa,CAAC,EAAa,YACxC,EAAa,UAAU,IACvB,GAAY;IAEb;EAAC;EAAQ;EAAW;EAAW,CAAC,EAGjC,kBAAC,OAAD;EACO;EACL,OAAO;GACL,aAAa,IAAA,KAAmC;GAChD,WAAW;GACX,SAAS;GACT,YAAY;GACZ,KAAK;GACN;YAED,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;GAAgB,MAAM;GAAI,QAAQ;GAAS,CAAA,EAC3C,kBAAC,QAAD,EAAA,UAAM,cAAiB,CAAA,CACtB,EAAA,CAAA;EACC,CAAA"}
+{"version":3,"file":"AutoLoadMore.js","names":[],"sources":["../../../../src/components/EntityTreeTable/components/AutoLoadMore.tsx"],"sourcesContent":["import { SynapseSpinner } from '@/components/LoadingScreen/LoadingScreen'\nimport { useEffect, useRef } from 'react'\nimport { useInView } from 'react-intersection-observer'\nimport { depthPaddingMultiplierPx } from './EntityNameCell'\n\nexport const AutoLoadMore: React.FC<{\n  depth: number\n  isLoading: boolean\n  onLoadMore: () => void\n  pageToken?: string\n}> = ({ depth, isLoading, onLoadMore }) => {\n  const hasTriggered = useRef(false)\n  const { ref, inView } = useInView({\n    threshold: 0.1,\n    rootMargin: '50px',\n    triggerOnce: true,\n  })\n\n  useEffect(() => {\n    // Only trigger if we're in view, not loading, and haven't triggered yet\n    // Each component instance is now unique per page token due to unique row IDs\n    if (inView && !isLoading && !hasTriggered.current) {\n      hasTriggered.current = true\n      onLoadMore()\n    }\n  }, [inView, isLoading, onLoadMore])\n\n  return (\n    <div\n      ref={ref}\n      style={{\n        paddingLeft: depth * depthPaddingMultiplierPx + 45,\n        minHeight: '40px',\n        display: 'flex',\n        alignItems: 'center',\n        gap: '8px',\n      }}\n    >\n      <>\n        <SynapseSpinner size={16} margin={'0px'} />\n        <span>Loading...</span>\n      </>\n    </div>\n  )\n}\n"],"mappings":";;;;;;AAKA,IAAa,KAKP,EAAE,UAAO,cAAW,oBAAiB;CACzC,IAAM,IAAe,EAAO,EAAK,GAC3B,EAAE,QAAK,cAAW,EAAU;EAChC,WAAW;EACX,YAAY;EACZ,aAAa;CACf,CAAC;CAWD,OATA,QAAgB;EAGd,AAAI,KAAU,CAAC,KAAa,CAAC,EAAa,YACxC,EAAa,UAAU,IACvB,EAAW;CAEf,GAAG;EAAC;EAAQ;EAAW;CAAU,CAAC,GAGhC,kBAAC,OAAD;EACO;EACL,OAAO;GACL,aAAa,IAAA,KAAmC;GAChD,WAAW;GACX,SAAS;GACT,YAAY;GACZ,KAAK;EACP;YAEA,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;GAAgB,MAAM;GAAI,QAAQ;EAAQ,CAAA,GAC1C,kBAAC,QAAD,EAAA,UAAM,aAAgB,CAAA,CACtB,EAAA,CAAA;CACC,CAAA;AAET"}

package/dist/components/EntityTreeTable/components/ColumnHeaders.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColumnHeaders.js","names":[],"sources":["../../../../src/components/EntityTreeTable/components/ColumnHeaders.tsx"],"sourcesContent":["import React from 'react'\nimport { HeaderContext } from '@tanstack/react-table'\nimport { EntityBundleRow } from '../EntityTreeTable'\nimport ColumnHeader from '../../TanStackTable/ColumnHeader'\n\nexport const NameColumnHeader: React.FC<\n  HeaderContext<EntityBundleRow, unknown>\n> = props => <ColumnHeader {...props} title={'Name'} />\n\nexport const CreatedOnColumnHeader: React.FC<\n  HeaderContext<EntityBundleRow, unknown>\n> = props => <ColumnHeader {...props} title={'Created On'} />\n\nexport const ModifiedOnColumnHeader: React.FC<\n  HeaderContext<EntityBundleRow, unknown>\n> = props => <ColumnHeader {...props} title={'Modified On'} />\n"],"mappings":";;;;AAKA,IAAa,KAET,MAAS,kBAAC,GAAD;CAAc,GAAI;CAAO,OAAO;CAAU,CAAA,EAE1C,KAET,MAAS,kBAAC,GAAD;CAAc,GAAI;CAAO,OAAO;CAAgB,CAAA,EAEhD,KAET,MAAS,kBAAC,GAAD;CAAc,GAAI;CAAO,OAAO;CAAiB,CAAA"}
+{"version":3,"file":"ColumnHeaders.js","names":[],"sources":["../../../../src/components/EntityTreeTable/components/ColumnHeaders.tsx"],"sourcesContent":["import React from 'react'\nimport { HeaderContext } from '@tanstack/react-table'\nimport { EntityBundleRow } from '../EntityTreeTable'\nimport ColumnHeader from '../../TanStackTable/ColumnHeader'\n\nexport const NameColumnHeader: React.FC<\n  HeaderContext<EntityBundleRow, unknown>\n> = props => <ColumnHeader {...props} title={'Name'} />\n\nexport const CreatedOnColumnHeader: React.FC<\n  HeaderContext<EntityBundleRow, unknown>\n> = props => <ColumnHeader {...props} title={'Created On'} />\n\nexport const ModifiedOnColumnHeader: React.FC<\n  HeaderContext<EntityBundleRow, unknown>\n> = props => <ColumnHeader {...props} title={'Modified On'} />\n"],"mappings":";;;;AAKA,IAAa,KAET,MAAS,kBAAC,GAAD;CAAc,GAAI;CAAO,OAAO;AAAS,CAAA,GAEzC,KAET,MAAS,kBAAC,GAAD;CAAc,GAAI;CAAO,OAAO;AAAe,CAAA,GAE/C,KAET,MAAS,kBAAC,GAAD;CAAc,GAAI;CAAO,OAAO;AAAgB,CAAA"}

package/dist/components/EntityTreeTable/components/EntityBadgeIconsCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityBadgeIconsCell.js","names":[],"sources":["../../../../src/components/EntityTreeTable/components/EntityBadgeIconsCell.tsx"],"sourcesContent":["import EntityBadgeIcons from '@/components/EntityBadgeIcons'\nimport { EntityIdAndVersionNumber } from '@/components/EntityFinder/details/view/table/TableCellTypes'\nimport { CellContext } from '@tanstack/react-table'\n\n/**\n * Renders Entity Badges using the entity bundle.\n * @param props\n * @returns\n */\nexport function EntityBadgeIconsCell<T extends EntityIdAndVersionNumber>(\n  props: CellContext<T, any>,\n) {\n  const { row } = props\n\n  return (\n    <EntityBadgeIcons\n      entityId={row.original.entityId}\n      versionNumber={row.original.versionNumber}\n      showHasDiscussionThread={false}\n      showHasWiki={true}\n      showUnlink={true}\n      canOpenModal={false}\n    />\n  )\n}\n"],"mappings":";;;AASA,SAAgB,EACd,GACA;CACA,IAAM,EAAE,WAAQ;AAEhB,QACE,kBAAC,GAAD;EACE,UAAU,EAAI,SAAS;EACvB,eAAe,EAAI,SAAS;EAC5B,yBAAyB;EACzB,aAAa;EACb,YAAY;EACZ,cAAc;EACd,CAAA"}
+{"version":3,"file":"EntityBadgeIconsCell.js","names":[],"sources":["../../../../src/components/EntityTreeTable/components/EntityBadgeIconsCell.tsx"],"sourcesContent":["import EntityBadgeIcons from '@/components/EntityBadgeIcons'\nimport { EntityIdAndVersionNumber } from '@/components/EntityFinder/details/view/table/TableCellTypes'\nimport { CellContext } from '@tanstack/react-table'\n\n/**\n * Renders Entity Badges using the entity bundle.\n * @param props\n * @returns\n */\nexport function EntityBadgeIconsCell<T extends EntityIdAndVersionNumber>(\n  props: CellContext<T, any>,\n) {\n  const { row } = props\n\n  return (\n    <EntityBadgeIcons\n      entityId={row.original.entityId}\n      versionNumber={row.original.versionNumber}\n      showHasDiscussionThread={false}\n      showHasWiki={true}\n      showUnlink={true}\n      canOpenModal={false}\n    />\n  )\n}\n"],"mappings":";;;AASA,SAAgB,EACd,GACA;CACA,IAAM,EAAE,WAAQ;CAEhB,OACE,kBAAC,GAAD;EACE,UAAU,EAAI,SAAS;EACvB,eAAe,EAAI,SAAS;EAC5B,yBAAyB;EACzB,aAAa;EACb,YAAY;EACZ,cAAc;CACf,CAAA;AAEL"}