synapse-react-client 4.0.45 → 4.0.47

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?.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    // oxlint-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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"}
+{"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 from '@mui/icons-material/ChevronRight'\nimport ExpandMore from '@mui/icons-material/ExpandMore'\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?.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    // oxlint-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/EntityHeaderTable/EntityHeaderTable.js

@@ -16,8 +16,8 @@ import { Fragment as l, useCallback as u, useEffect as d, useMemo as f, useState
 import { noop as ue, upperFirst as de } from "lodash-es";
 import { Alert as fe, AlertTitle as pe, Box as m, Button as h, IconButton as g, InputLabel as me, TextField as he, Tooltip as ge, Typography as _ } from "@mui/material";
 import { Fragment as v, jsx as y, jsxs as b } from "react/jsx-runtime";
-import { AddCircleTwoTone as _e } from "@mui/icons-material";
-import ve from "pluralize";
+import _e from "pluralize";
+import ve from "@mui/icons-material/AddCircleTwoTone";
 import { flexRender as x, getCoreRowModel as ye, getFacetedMinMaxValues as be, getFacetedRowModel as xe, getFacetedUniqueValues as Se, getFilteredRowModel as Ce, getSortedRowModel as S, useReactTable as C } from "@tanstack/react-table";
 import w from "papaparse";
 //#region src/components/EntityHeaderTable/EntityHeaderTable.tsx
@@ -46,7 +46,7 @@ var { parse: T } = w, E = {
 		B,
 		L,
 		z
-	]), H = de(ve(Te)), U = f(() => [{
+	]), H = de(_e(Te)), U = f(() => [{
 		id: "select",
 		header: ae,
 		cell: ie
@@ -296,7 +296,7 @@ var { parse: T } = w, E = {
 							variant: "outlined",
 							onClick: je,
 							disabled: q || I.trim().length == 0 || O,
-							startIcon: /* @__PURE__ */ y(_e, {}),
+							startIcon: /* @__PURE__ */ y(ve, {}),
 							children: ["Add ", H]
 						})
 					]

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/AddCircleTwoTone'\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/Filter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Filter.d.ts","sourceRoot":"","sources":["../../../src/components/EntityHeaderTable/Filter.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAA;AAGrD,wBAAgB,MAAM,CAAC,EACrB,MAAM,EACN,KAAK,GACN,EAAE;IACD,MAAM,EAAE,MAAM,CAAC,GAAG,EAAE,OAAO,CAAC,CAAA;IAC5B,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,CAAA;CAClB,2CAyBA"}
+{"version":3,"file":"Filter.d.ts","sourceRoot":"","sources":["../../../src/components/EntityHeaderTable/Filter.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAA;AAGrD,wBAAgB,MAAM,CAAC,EACrB,MAAM,EACN,KAAK,GACN,EAAE;IACD,MAAM,EAAE,MAAM,CAAC,GAAG,EAAE,OAAO,CAAC,CAAA;IAC5B,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,CAAA;CAClB,2CA2BA"}

package/dist/components/EntityHeaderTable/Filter.js

@@ -6,7 +6,7 @@ function r({ column: r, table: i }) {
 	let a = i.getPreFilteredRowModel().flatRows[0]?.getValue(r.id), o = r.getFilterValue() ?? "";
 	return /* @__PURE__ */ n(e, {
 		type: "text",
-		options: t(() => typeof a == "number" ? [] : Array.from(r.getFacetedUniqueValues().keys()).sort(), [r.getFacetedUniqueValues()]),
+		options: t(() => typeof a == "number" ? [] : Array.from(r.getFacetedUniqueValues().keys(), String).toSorted((e, t) => e.localeCompare(t)), [r.getFacetedUniqueValues()]),
 		initialValue: o,
 		onChange: (e) => r.setFilterValue(e),
 		label: `Filter by ${r.columnDef.header} (${r.getFacetedUniqueValues().size})`

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,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"}
+{"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(), String).toSorted(\n            (a, b) => a.localeCompare(b),\n          ),\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;CAWjE,OACE,kBAAC,GAAD;EACE,MAAK;EACL,SAZiC,QAEjC,OAAO,KAAe,WAClB,CAAC,IACD,MAAM,KAAK,EAAO,uBAAuB,EAAE,KAAK,GAAG,MAAM,EAAE,UACxD,GAAG,MAAM,EAAE,cAAc,CAAC,CAC7B,GACN,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/EntityTreeTable/components/EntityNameCell.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EntityNameCell.d.ts","sourceRoot":"","sources":["../../../../src/components/EntityTreeTable/components/EntityNameCell.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AACnD,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAA;AAQpD,eAAO,MAAM,wBAAwB,KAAK,CAAA;AAE1C,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,eAAe,EAAE,OAAO,CAAC,CAgEpE,CAAA"}
+{"version":3,"file":"EntityNameCell.d.ts","sourceRoot":"","sources":["../../../../src/components/EntityTreeTable/components/EntityNameCell.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AACnD,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAA;AASpD,eAAO,MAAM,wBAAwB,KAAK,CAAA;AAE1C,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,eAAe,EAAE,OAAO,CAAC,CAgEpE,CAAA"}

package/dist/components/EntityTreeTable/components/EntityNameCell.js

@@ -3,7 +3,8 @@ import { EntityLink as t } from "../../EntityLink.js";
 import { useEntityTreeTableContext as n } from "./EntityTreeTableContext.js";
 import { IconButton as r } from "@mui/material";
 import { jsx as i, jsxs as a } from "react/jsx-runtime";
-import { ChevronRight as o, ExpandMore as s } from "@mui/icons-material";
+import o from "@mui/icons-material/ChevronRight";
+import s from "@mui/icons-material/ExpandMore";
 import { Box as c } from "@mui/system";
 //#region src/components/EntityTreeTable/components/EntityNameCell.tsx
 var l = 16, u = ({ row: l }) => {

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

@@ -1 +1 @@
-{"version":3,"file":"EntityNameCell.js","names":[],"sources":["../../../../src/components/EntityTreeTable/components/EntityNameCell.tsx"],"sourcesContent":["import { CellContext } from '@tanstack/react-table'\nimport { EntityBundleRow } from '../EntityTreeTable'\nimport { Box } from '@mui/system'\nimport { IconButton } from '@mui/material'\nimport { ChevronRight, ExpandMore } from '@mui/icons-material'\nimport { useEntityTreeTableContext } from './EntityTreeTableContext'\nimport { EntityLink } from '@/components/EntityLink'\nimport { SynapseSpinner } from '@/components/LoadingScreen/LoadingScreen'\n\nexport const depthPaddingMultiplierPx = 16\n\nexport const NameCell: React.FC<CellContext<EntityBundleRow, unknown>> = ({\n  row,\n}) => {\n  const {\n    expanded,\n    loadingIds,\n    handleToggleExpanded,\n    onEntityIdClicked,\n    disableEntityLinks,\n  } = useEntityTreeTableContext()\n  const { entityHeader, depth, isLeaf } = row.original\n  const isExpanded = !!expanded[entityHeader.id]\n  const hasChildren = !isLeaf\n  return (\n    <Box\n      sx={{\n        display: 'flex',\n        alignItems: 'center',\n        pl: `${depth * depthPaddingMultiplierPx}px`,\n      }}\n    >\n      {hasChildren && (\n        <IconButton\n          size=\"small\"\n          loading={loadingIds.has(entityHeader.id)}\n          loadingIndicator={<SynapseSpinner />}\n          onClick={() => handleToggleExpanded(entityHeader.id)}\n          aria-label={isExpanded ? 'Collapse' : 'Expand'}\n        >\n          {isExpanded ? <ExpandMore /> : <ChevronRight />}\n        </IconButton>\n      )}\n      {!hasChildren && <Box sx={{ width: 32 }} />}\n\n      {/*\n        Ensure the name column can shrink and long names are truncated.\n        `minWidth: 0` is required on flex children so `overflow: hidden`\n        can actually clip the content. We target descendant `a` and `p`\n        elements because `EntityLink` renders a MUI Link (anchor) or a p.\n      */}\n      <Box\n        sx={{\n          flex: 1,\n          minWidth: 0,\n          marginLeft: 1,\n          // Style the inner Link or paragraph for truncation\n          '& a, & p': {\n            display: 'block',\n            overflow: 'hidden',\n            textOverflow: 'ellipsis',\n            whiteSpace: 'nowrap',\n          },\n        }}\n      >\n        <EntityLink\n          entity={entityHeader}\n          link={!disableEntityLinks}\n          onEntityIdClicked={onEntityIdClicked}\n          iconColor={'greyV2.800'}\n          iconVariant=\"outlined\"\n        />\n      </Box>\n    </Box>\n  )\n}\n"],"mappings":";;;;;;;;AASA,IAAa,IAA2B,IAE3B,KAA6D,EACxE,aACI;CACJ,IAAM,EACJ,aACA,eACA,yBACA,sBACA,0BACE,EAA0B,GACxB,EAAE,iBAAc,UAAO,cAAW,EAAI,UACtC,IAAa,CAAC,CAAC,EAAS,EAAa,KACrC,IAAc,CAAC;CACrB,OACE,kBAAC,GAAD;EACE,IAAI;GACF,SAAS;GACT,YAAY;GACZ,IAAI,GAAG,IAAA,GAAiC;EAC1C;YALF;GAOG,KACC,kBAAC,GAAD;IACE,MAAK;IACL,SAAS,EAAW,IAAI,EAAa,EAAE;IACvC,kBAAkB,kBAAC,GAAD,CAAiB,CAAA;IACnC,eAAe,EAAqB,EAAa,EAAE;IACnD,cAAY,IAAa,aAAa;cAExB,EAAb,IAAc,IAAiB,GAAlB,CAAa,CAAmB;GACpC,CAAA;GAEb,CAAC,KAAe,kBAAC,GAAD,EAAK,IAAI,EAAE,OAAO,GAAG,EAAI,CAAA;GAQ1C,kBAAC,GAAD;IACE,IAAI;KACF,MAAM;KACN,UAAU;KACV,YAAY;KAEZ,YAAY;MACV,SAAS;MACT,UAAU;MACV,cAAc;MACd,YAAY;KACd;IACF;cAEA,kBAAC,GAAD;KACE,QAAQ;KACR,MAAM,CAAC;KACY;KACnB,WAAW;KACX,aAAY;IACb,CAAA;GACE,CAAA;EACF;;AAET"}
+{"version":3,"file":"EntityNameCell.js","names":[],"sources":["../../../../src/components/EntityTreeTable/components/EntityNameCell.tsx"],"sourcesContent":["import { CellContext } from '@tanstack/react-table'\nimport { EntityBundleRow } from '../EntityTreeTable'\nimport { Box } from '@mui/system'\nimport { IconButton } from '@mui/material'\nimport ChevronRight from '@mui/icons-material/ChevronRight'\nimport ExpandMore from '@mui/icons-material/ExpandMore'\nimport { useEntityTreeTableContext } from './EntityTreeTableContext'\nimport { EntityLink } from '@/components/EntityLink'\nimport { SynapseSpinner } from '@/components/LoadingScreen/LoadingScreen'\n\nexport const depthPaddingMultiplierPx = 16\n\nexport const NameCell: React.FC<CellContext<EntityBundleRow, unknown>> = ({\n  row,\n}) => {\n  const {\n    expanded,\n    loadingIds,\n    handleToggleExpanded,\n    onEntityIdClicked,\n    disableEntityLinks,\n  } = useEntityTreeTableContext()\n  const { entityHeader, depth, isLeaf } = row.original\n  const isExpanded = !!expanded[entityHeader.id]\n  const hasChildren = !isLeaf\n  return (\n    <Box\n      sx={{\n        display: 'flex',\n        alignItems: 'center',\n        pl: `${depth * depthPaddingMultiplierPx}px`,\n      }}\n    >\n      {hasChildren && (\n        <IconButton\n          size=\"small\"\n          loading={loadingIds.has(entityHeader.id)}\n          loadingIndicator={<SynapseSpinner />}\n          onClick={() => handleToggleExpanded(entityHeader.id)}\n          aria-label={isExpanded ? 'Collapse' : 'Expand'}\n        >\n          {isExpanded ? <ExpandMore /> : <ChevronRight />}\n        </IconButton>\n      )}\n      {!hasChildren && <Box sx={{ width: 32 }} />}\n\n      {/*\n        Ensure the name column can shrink and long names are truncated.\n        `minWidth: 0` is required on flex children so `overflow: hidden`\n        can actually clip the content. We target descendant `a` and `p`\n        elements because `EntityLink` renders a MUI Link (anchor) or a p.\n      */}\n      <Box\n        sx={{\n          flex: 1,\n          minWidth: 0,\n          marginLeft: 1,\n          // Style the inner Link or paragraph for truncation\n          '& a, & p': {\n            display: 'block',\n            overflow: 'hidden',\n            textOverflow: 'ellipsis',\n            whiteSpace: 'nowrap',\n          },\n        }}\n      >\n        <EntityLink\n          entity={entityHeader}\n          link={!disableEntityLinks}\n          onEntityIdClicked={onEntityIdClicked}\n          iconColor={'greyV2.800'}\n          iconVariant=\"outlined\"\n        />\n      </Box>\n    </Box>\n  )\n}\n"],"mappings":";;;;;;;;;AAUA,IAAa,IAA2B,IAE3B,KAA6D,EACxE,aACI;CACJ,IAAM,EACJ,aACA,eACA,yBACA,sBACA,0BACE,EAA0B,GACxB,EAAE,iBAAc,UAAO,cAAW,EAAI,UACtC,IAAa,CAAC,CAAC,EAAS,EAAa,KACrC,IAAc,CAAC;CACrB,OACE,kBAAC,GAAD;EACE,IAAI;GACF,SAAS;GACT,YAAY;GACZ,IAAI,GAAG,IAAA,GAAiC;EAC1C;YALF;GAOG,KACC,kBAAC,GAAD;IACE,MAAK;IACL,SAAS,EAAW,IAAI,EAAa,EAAE;IACvC,kBAAkB,kBAAC,GAAD,CAAiB,CAAA;IACnC,eAAe,EAAqB,EAAa,EAAE;IACnD,cAAY,IAAa,aAAa;cAExB,EAAb,IAAc,IAAiB,GAAlB,CAAa,CAAmB;GACpC,CAAA;GAEb,CAAC,KAAe,kBAAC,GAAD,EAAK,IAAI,EAAE,OAAO,GAAG,EAAI,CAAA;GAQ1C,kBAAC,GAAD;IACE,IAAI;KACF,MAAM;KACN,UAAU;KACV,YAAY;KAEZ,YAAY;MACV,SAAS;MACT,UAAU;MACV,cAAc;MACd,YAAY;KACd;IACF;cAEA,kBAAC,GAAD;KACE,QAAQ;KACR,MAAM,CAAC;KACY;KACnB,WAAW;KACX,aAAY;IACb,CAAA;GACE,CAAA;EACF;;AAET"}

package/dist/components/EntityUpload/FileUploadProgress.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FileUploadProgress.d.ts","sourceRoot":"","sources":["../../../src/components/EntityUpload/FileUploadProgress.tsx"],"names":[],"mappings":"AAiBA,MAAM,MAAM,uBAAuB,GAAG;IACpC,gCAAgC;IAChC,MAAM,EACF,WAAW,GACX,WAAW,GACX,QAAQ,GACR,kBAAkB,GAClB,QAAQ,GACR,UAAU,CAAA;IACd,2BAA2B;IAC3B,QAAQ,EAAE,MAAM,CAAA;IAChB,qCAAqC;IACrC,gBAAgB,EAAE,MAAM,CAAA;IACxB,uDAAuD;IACvD,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,4CAA4C;IAC5C,QAAQ,EAAE,MAAM,IAAI,CAAA;IACpB,yCAAyC;IACzC,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,gCAAgC;IAChC,QAAQ,EAAE,MAAM,IAAI,CAAA;IACpB,wDAAwD;IACxD,QAAQ,EAAE,MAAM,IAAI,CAAA;IACpB,0FAA0F;IAC1F,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB,CAAA;AAED,eAAO,MAAM,wCAAwC,KAAK,CAAA;AAE1D;;GAEG;AACH,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,2CA+KhE"}
+{"version":3,"file":"FileUploadProgress.d.ts","sourceRoot":"","sources":["../../../src/components/EntityUpload/FileUploadProgress.tsx"],"names":[],"mappings":"AAeA,MAAM,MAAM,uBAAuB,GAAG;IACpC,gCAAgC;IAChC,MAAM,EACF,WAAW,GACX,WAAW,GACX,QAAQ,GACR,kBAAkB,GAClB,QAAQ,GACR,UAAU,CAAA;IACd,2BAA2B;IAC3B,QAAQ,EAAE,MAAM,CAAA;IAChB,qCAAqC;IACrC,gBAAgB,EAAE,MAAM,CAAA;IACxB,uDAAuD;IACvD,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,4CAA4C;IAC5C,QAAQ,EAAE,MAAM,IAAI,CAAA;IACpB,yCAAyC;IACzC,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,gCAAgC;IAChC,QAAQ,EAAE,MAAM,IAAI,CAAA;IACpB,wDAAwD;IACxD,QAAQ,EAAE,MAAM,IAAI,CAAA;IACpB,0FAA0F;IAC1F,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB,CAAA;AAED,eAAO,MAAM,wCAAwC,KAAK,CAAA;AAE1D;;GAEG;AACH,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,2CA+KhE"}

package/dist/components/EntityUpload/FileUploadProgress.js

@@ -1,8 +1,12 @@
 import { calculateFriendlyFileSize as e } from "../../utils/functions/calculateFriendlyFileSize.js";
 import { Box as t, IconButton as n, LinearProgress as r, Tooltip as i, Typography as a } from "@mui/material";
 import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
-import { CheckCircleTwoTone as l, DeleteTwoTone as u, ErrorTwoTone as d, Pause as f, PlayArrow as p } from "@mui/icons-material";
-import m from "@mui/icons-material/Close";
+import l from "@mui/icons-material/CheckCircleTwoTone";
+import u from "@mui/icons-material/ErrorTwoTone";
+import d from "@mui/icons-material/Close";
+import f from "@mui/icons-material/DeleteTwoTone";
+import p from "@mui/icons-material/Pause";
+import m from "@mui/icons-material/PlayArrow";
 //#region src/components/EntityUpload/FileUploadProgress.tsx
 var h = 92;
 function g(h) {
@@ -40,7 +44,7 @@ function g(h) {
 					children: [
 						O && /* @__PURE__ */ s(i, {
 							title: w,
-							children: /* @__PURE__ */ s(d, { color: "error" })
+							children: /* @__PURE__ */ s(u, { color: "error" })
 						}),
 						!E && /* @__PURE__ */ s(i, {
 							title: "Cancel",
@@ -49,7 +53,7 @@ function g(h) {
 								onClick: () => {
 									v();
 								},
-								children: /* @__PURE__ */ s(m, {})
+								children: /* @__PURE__ */ s(d, {})
 							})
 						}),
 						k && /* @__PURE__ */ s(i, {
@@ -59,7 +63,7 @@ function g(h) {
 								onClick: () => {
 									y();
 								},
-								children: /* @__PURE__ */ s(f, {})
+								children: /* @__PURE__ */ s(p, {})
 							})
 						}),
 						T && /* @__PURE__ */ s(i, {
@@ -69,7 +73,7 @@ function g(h) {
 								onClick: () => {
 									b();
 								},
-								children: /* @__PURE__ */ s(p, {})
+								children: /* @__PURE__ */ s(m, {})
 							})
 						}),
 						E && /* @__PURE__ */ s(i, {
@@ -79,7 +83,7 @@ function g(h) {
 								onClick: () => {
 									x();
 								},
-								children: /* @__PURE__ */ s(u, {})
+								children: /* @__PURE__ */ s(f, {})
 							})
 						})
 					]

package/dist/components/EntityUpload/FileUploadProgress.js.map

@@ -1 +1 @@
-{"version":3,"file":"FileUploadProgress.js","names":[],"sources":["../../../src/components/EntityUpload/FileUploadProgress.tsx"],"sourcesContent":["import { calculateFriendlyFileSize } from '@/utils/functions/calculateFriendlyFileSize'\nimport {\n  CheckCircleTwoTone,\n  DeleteTwoTone,\n  ErrorTwoTone,\n  Pause,\n  PlayArrow,\n} from '@mui/icons-material'\nimport CloseIcon from '@mui/icons-material/Close'\nimport {\n  Box,\n  IconButton,\n  LinearProgress,\n  Tooltip,\n  Typography,\n} from '@mui/material'\n\nexport type FileUploadProgressProps = {\n  /** The status of the upload. */\n  status:\n    | 'PREPARING'\n    | 'UPLOADING'\n    | 'PAUSED'\n    | 'CANCELED_BY_USER'\n    | 'FAILED'\n    | 'COMPLETE'\n  /** The name of the file */\n  fileName: string\n  /** The size of the file, in bytes */\n  totalSizeInBytes: number\n  /** The number of this file's bytes uploaded so far. */\n  uploadedSizeInBytes?: number\n  /** Invoked when the upload is cancelled. */\n  onCancel: () => void\n  /** Invoked when the upload is paused. */\n  onPause: () => void\n  /** Invoked when the resumed. */\n  onResume: () => void\n  /** Invoked when the upload is removed from the list. */\n  onRemove: () => void\n  /** An optional error message to display if the upload has been cancelled due to error. */\n  errorMessage?: string\n}\n\nexport const FILE_UPLOAD_PROGRESS_COMPONENT_HEIGHT_PX = 92\n\n/**\n * Component that displays the upload progress of a file, with controls to pause or cancel the upload.\n */\nexport function FileUploadProgress(props: FileUploadProgressProps) {\n  const {\n    status,\n    fileName,\n    onCancel,\n    onPause,\n    onResume,\n    onRemove,\n    uploadedSizeInBytes = 0,\n    totalSizeInBytes,\n    errorMessage,\n  } = props\n\n  const isPaused = status === 'PAUSED'\n  const isCanceled = status === 'CANCELED_BY_USER' || status === 'FAILED'\n  const isComplete = status === 'COMPLETE'\n  const isFailed = status === 'FAILED'\n  const isUploading = status === 'UPLOADING'\n  const isPreparingUpload = status === 'PREPARING'\n\n  let progress: number | undefined =\n    (uploadedSizeInBytes / totalSizeInBytes) * 100\n\n  if (isPreparingUpload) {\n    progress = undefined\n  } else if (isFailed || isCanceled) {\n    progress = 0\n  }\n\n  return (\n    <Box\n      sx={{\n        py: 2,\n        height: `${FILE_UPLOAD_PROGRESS_COMPONENT_HEIGHT_PX}px`,\n      }}\n    >\n      <Box\n        sx={{\n          display: 'flex',\n          flexWrap: 'nowrap',\n          flexDirection: 'row',\n          justifyContent: 'space-between',\n          alignItems: 'center',\n          height: '35px',\n        }}\n      >\n        <Typography\n          variant={'body1'}\n          sx={{\n            color: 'primary.main',\n            fontWeight: 700,\n          }}\n        >\n          {fileName}\n        </Typography>\n        {!isComplete && (\n          <Box\n            sx={{\n              display: 'flex',\n              alignItems: 'center',\n              gap: 1,\n              my: 1,\n            }}\n          >\n            {isFailed && (\n              <Tooltip title={errorMessage}>\n                <ErrorTwoTone color={'error'} />\n              </Tooltip>\n            )}\n            {!isCanceled && (\n              <Tooltip title={'Cancel'}>\n                <IconButton\n                  size={'small'}\n                  onClick={() => {\n                    onCancel()\n                  }}\n                >\n                  <CloseIcon />\n                </IconButton>\n              </Tooltip>\n            )}\n            {isUploading && (\n              <Tooltip title={'Pause'}>\n                <IconButton\n                  size={'small'}\n                  onClick={() => {\n                    onPause()\n                  }}\n                >\n                  <Pause />\n                </IconButton>\n              </Tooltip>\n            )}\n            {isPaused && (\n              <Tooltip title={'Resume'}>\n                <IconButton\n                  size={'small'}\n                  onClick={() => {\n                    onResume()\n                  }}\n                >\n                  <PlayArrow />\n                </IconButton>\n              </Tooltip>\n            )}\n            {isCanceled && (\n              <Tooltip title={'Remove'}>\n                <IconButton\n                  size={'small'}\n                  onClick={() => {\n                    onRemove()\n                  }}\n                >\n                  <DeleteTwoTone />\n                </IconButton>\n              </Tooltip>\n            )}\n          </Box>\n        )}\n        {isComplete && <CheckCircleTwoTone color={'success'} />}\n      </Box>\n      <Box\n        sx={{\n          display: 'flex',\n          flexWrap: 'nowrap',\n          alignItems: 'center',\n        }}\n      >\n        <LinearProgress\n          color={'secondary'}\n          value={progress}\n          variant={isPreparingUpload ? 'indeterminate' : 'determinate'}\n          sx={{ width: '100%', mr: 2.5 }}\n        />\n        {!isCanceled && (\n          <Typography\n            variant={'body1'}\n            sx={{\n              whiteSpace: 'nowrap',\n              flexShrink: 0,\n            }}\n          >\n            {isPreparingUpload ? (\n              'Preparing to upload...'\n            ) : (\n              <>\n                <span>{calculateFriendlyFileSize(uploadedSizeInBytes, 1)}</span>\n                <Box\n                  component={'span'}\n                  sx={{\n                    color: 'grey.600',\n                    mx: 0.5,\n                  }}\n                >\n                  |\n                </Box>\n                <span>{calculateFriendlyFileSize(totalSizeInBytes, 1)}</span>\n              </>\n            )}\n          </Typography>\n        )}\n        {isCanceled && (\n          <Typography\n            variant={'body1'}\n            sx={{\n              whiteSpace: 'nowrap',\n              flexShrink: 0,\n            }}\n          >\n            {isFailed ? 'Failed' : 'Canceled'}\n          </Typography>\n        )}\n      </Box>\n    </Box>\n  )\n}\n"],"mappings":";;;;;;AA4CA,IAAa,IAA2C;AAKxD,SAAgB,EAAmB,GAAgC;CACjE,IAAM,EACJ,WACA,aACA,aACA,YACA,aACA,aACA,yBAAsB,GACtB,qBACA,oBACE,GAEE,IAAW,MAAW,UACtB,IAAa,MAAW,sBAAsB,MAAW,UACzD,IAAa,MAAW,YACxB,IAAW,MAAW,UACtB,IAAc,MAAW,aACzB,IAAoB,MAAW,aAEjC,IACD,IAAsB,IAAoB;CAQ7C,OANI,IACF,IAAW,KAAA,KACF,KAAY,OACrB,IAAW,IAIX,kBAAC,GAAD;EACE,IAAI;GACF,IAAI;GACJ,QAAQ;EACV;YAJF,CAME,kBAAC,GAAD;GACE,IAAI;IACF,SAAS;IACT,UAAU;IACV,eAAe;IACf,gBAAgB;IAChB,YAAY;IACZ,QAAQ;GACV;aARF;IAUE,kBAAC,GAAD;KACE,SAAS;KACT,IAAI;MACF,OAAO;MACP,YAAY;KACd;eAEC;IACS,CAAA;IACX,CAAC,KACA,kBAAC,GAAD;KACE,IAAI;MACF,SAAS;MACT,YAAY;MACZ,KAAK;MACL,IAAI;KACN;eANF;MAQG,KACC,kBAAC,GAAD;OAAS,OAAO;iBACd,kBAAC,GAAD,EAAc,OAAO,QAAU,CAAA;MACxB,CAAA;MAEV,CAAC,KACA,kBAAC,GAAD;OAAS,OAAO;iBACd,kBAAC,GAAD;QACE,MAAM;QACN,eAAe;SACb,EAAS;QACX;kBAEA,kBAAC,GAAD,CAAY,CAAA;OACF,CAAA;MACL,CAAA;MAEV,KACC,kBAAC,GAAD;OAAS,OAAO;iBACd,kBAAC,GAAD;QACE,MAAM;QACN,eAAe;SACb,EAAQ;QACV;kBAEA,kBAAC,GAAD,CAAQ,CAAA;OACE,CAAA;MACL,CAAA;MAEV,KACC,kBAAC,GAAD;OAAS,OAAO;iBACd,kBAAC,GAAD;QACE,MAAM;QACN,eAAe;SACb,EAAS;QACX;kBAEA,kBAAC,GAAD,CAAY,CAAA;OACF,CAAA;MACL,CAAA;MAEV,KACC,kBAAC,GAAD;OAAS,OAAO;iBACd,kBAAC,GAAD;QACE,MAAM;QACN,eAAe;SACb,EAAS;QACX;kBAEA,kBAAC,GAAD,CAAgB,CAAA;OACN,CAAA;MACL,CAAA;KAER;;IAEN,KAAc,kBAAC,GAAD,EAAoB,OAAO,UAAY,CAAA;GACnD;MACL,kBAAC,GAAD;GACE,IAAI;IACF,SAAS;IACT,UAAU;IACV,YAAY;GACd;aALF;IAOE,kBAAC,GAAD;KACE,OAAO;KACP,OAAO;KACP,SAAS,IAAoB,kBAAkB;KAC/C,IAAI;MAAE,OAAO;MAAQ,IAAI;KAAI;IAC9B,CAAA;IACA,CAAC,KACA,kBAAC,GAAD;KACE,SAAS;KACT,IAAI;MACF,YAAY;MACZ,YAAY;KACd;eAEC,IACC,2BAEA,kBAAA,GAAA,EAAA,UAAA;MACE,kBAAC,QAAD,EAAA,UAAO,EAA0B,GAAqB,CAAC,EAAQ,CAAA;MAC/D,kBAAC,GAAD;OACE,WAAW;OACX,IAAI;QACF,OAAO;QACP,IAAI;OACN;iBACD;MAEI,CAAA;MACL,kBAAC,QAAD,EAAA,UAAO,EAA0B,GAAkB,CAAC,EAAQ,CAAA;KAC5D,EAAA,CAAA;IAEM,CAAA;IAEb,KACC,kBAAC,GAAD;KACE,SAAS;KACT,IAAI;MACF,YAAY;MACZ,YAAY;KACd;eAEC,IAAW,WAAW;IACb,CAAA;GAEX;IACF;;AAET"}
+{"version":3,"file":"FileUploadProgress.js","names":[],"sources":["../../../src/components/EntityUpload/FileUploadProgress.tsx"],"sourcesContent":["import { calculateFriendlyFileSize } from '@/utils/functions/calculateFriendlyFileSize'\nimport CheckCircleTwoTone from '@mui/icons-material/CheckCircleTwoTone'\nimport DeleteTwoTone from '@mui/icons-material/DeleteTwoTone'\nimport ErrorTwoTone from '@mui/icons-material/ErrorTwoTone'\nimport Pause from '@mui/icons-material/Pause'\nimport PlayArrow from '@mui/icons-material/PlayArrow'\nimport CloseIcon from '@mui/icons-material/Close'\nimport {\n  Box,\n  IconButton,\n  LinearProgress,\n  Tooltip,\n  Typography,\n} from '@mui/material'\n\nexport type FileUploadProgressProps = {\n  /** The status of the upload. */\n  status:\n    | 'PREPARING'\n    | 'UPLOADING'\n    | 'PAUSED'\n    | 'CANCELED_BY_USER'\n    | 'FAILED'\n    | 'COMPLETE'\n  /** The name of the file */\n  fileName: string\n  /** The size of the file, in bytes */\n  totalSizeInBytes: number\n  /** The number of this file's bytes uploaded so far. */\n  uploadedSizeInBytes?: number\n  /** Invoked when the upload is cancelled. */\n  onCancel: () => void\n  /** Invoked when the upload is paused. */\n  onPause: () => void\n  /** Invoked when the resumed. */\n  onResume: () => void\n  /** Invoked when the upload is removed from the list. */\n  onRemove: () => void\n  /** An optional error message to display if the upload has been cancelled due to error. */\n  errorMessage?: string\n}\n\nexport const FILE_UPLOAD_PROGRESS_COMPONENT_HEIGHT_PX = 92\n\n/**\n * Component that displays the upload progress of a file, with controls to pause or cancel the upload.\n */\nexport function FileUploadProgress(props: FileUploadProgressProps) {\n  const {\n    status,\n    fileName,\n    onCancel,\n    onPause,\n    onResume,\n    onRemove,\n    uploadedSizeInBytes = 0,\n    totalSizeInBytes,\n    errorMessage,\n  } = props\n\n  const isPaused = status === 'PAUSED'\n  const isCanceled = status === 'CANCELED_BY_USER' || status === 'FAILED'\n  const isComplete = status === 'COMPLETE'\n  const isFailed = status === 'FAILED'\n  const isUploading = status === 'UPLOADING'\n  const isPreparingUpload = status === 'PREPARING'\n\n  let progress: number | undefined =\n    (uploadedSizeInBytes / totalSizeInBytes) * 100\n\n  if (isPreparingUpload) {\n    progress = undefined\n  } else if (isFailed || isCanceled) {\n    progress = 0\n  }\n\n  return (\n    <Box\n      sx={{\n        py: 2,\n        height: `${FILE_UPLOAD_PROGRESS_COMPONENT_HEIGHT_PX}px`,\n      }}\n    >\n      <Box\n        sx={{\n          display: 'flex',\n          flexWrap: 'nowrap',\n          flexDirection: 'row',\n          justifyContent: 'space-between',\n          alignItems: 'center',\n          height: '35px',\n        }}\n      >\n        <Typography\n          variant={'body1'}\n          sx={{\n            color: 'primary.main',\n            fontWeight: 700,\n          }}\n        >\n          {fileName}\n        </Typography>\n        {!isComplete && (\n          <Box\n            sx={{\n              display: 'flex',\n              alignItems: 'center',\n              gap: 1,\n              my: 1,\n            }}\n          >\n            {isFailed && (\n              <Tooltip title={errorMessage}>\n                <ErrorTwoTone color={'error'} />\n              </Tooltip>\n            )}\n            {!isCanceled && (\n              <Tooltip title={'Cancel'}>\n                <IconButton\n                  size={'small'}\n                  onClick={() => {\n                    onCancel()\n                  }}\n                >\n                  <CloseIcon />\n                </IconButton>\n              </Tooltip>\n            )}\n            {isUploading && (\n              <Tooltip title={'Pause'}>\n                <IconButton\n                  size={'small'}\n                  onClick={() => {\n                    onPause()\n                  }}\n                >\n                  <Pause />\n                </IconButton>\n              </Tooltip>\n            )}\n            {isPaused && (\n              <Tooltip title={'Resume'}>\n                <IconButton\n                  size={'small'}\n                  onClick={() => {\n                    onResume()\n                  }}\n                >\n                  <PlayArrow />\n                </IconButton>\n              </Tooltip>\n            )}\n            {isCanceled && (\n              <Tooltip title={'Remove'}>\n                <IconButton\n                  size={'small'}\n                  onClick={() => {\n                    onRemove()\n                  }}\n                >\n                  <DeleteTwoTone />\n                </IconButton>\n              </Tooltip>\n            )}\n          </Box>\n        )}\n        {isComplete && <CheckCircleTwoTone color={'success'} />}\n      </Box>\n      <Box\n        sx={{\n          display: 'flex',\n          flexWrap: 'nowrap',\n          alignItems: 'center',\n        }}\n      >\n        <LinearProgress\n          color={'secondary'}\n          value={progress}\n          variant={isPreparingUpload ? 'indeterminate' : 'determinate'}\n          sx={{ width: '100%', mr: 2.5 }}\n        />\n        {!isCanceled && (\n          <Typography\n            variant={'body1'}\n            sx={{\n              whiteSpace: 'nowrap',\n              flexShrink: 0,\n            }}\n          >\n            {isPreparingUpload ? (\n              'Preparing to upload...'\n            ) : (\n              <>\n                <span>{calculateFriendlyFileSize(uploadedSizeInBytes, 1)}</span>\n                <Box\n                  component={'span'}\n                  sx={{\n                    color: 'grey.600',\n                    mx: 0.5,\n                  }}\n                >\n                  |\n                </Box>\n                <span>{calculateFriendlyFileSize(totalSizeInBytes, 1)}</span>\n              </>\n            )}\n          </Typography>\n        )}\n        {isCanceled && (\n          <Typography\n            variant={'body1'}\n            sx={{\n              whiteSpace: 'nowrap',\n              flexShrink: 0,\n            }}\n          >\n            {isFailed ? 'Failed' : 'Canceled'}\n          </Typography>\n        )}\n      </Box>\n    </Box>\n  )\n}\n"],"mappings":";;;;;;;;;;AA0CA,IAAa,IAA2C;AAKxD,SAAgB,EAAmB,GAAgC;CACjE,IAAM,EACJ,WACA,aACA,aACA,YACA,aACA,aACA,yBAAsB,GACtB,qBACA,oBACE,GAEE,IAAW,MAAW,UACtB,IAAa,MAAW,sBAAsB,MAAW,UACzD,IAAa,MAAW,YACxB,IAAW,MAAW,UACtB,IAAc,MAAW,aACzB,IAAoB,MAAW,aAEjC,IACD,IAAsB,IAAoB;CAQ7C,OANI,IACF,IAAW,KAAA,KACF,KAAY,OACrB,IAAW,IAIX,kBAAC,GAAD;EACE,IAAI;GACF,IAAI;GACJ,QAAQ;EACV;YAJF,CAME,kBAAC,GAAD;GACE,IAAI;IACF,SAAS;IACT,UAAU;IACV,eAAe;IACf,gBAAgB;IAChB,YAAY;IACZ,QAAQ;GACV;aARF;IAUE,kBAAC,GAAD;KACE,SAAS;KACT,IAAI;MACF,OAAO;MACP,YAAY;KACd;eAEC;IACS,CAAA;IACX,CAAC,KACA,kBAAC,GAAD;KACE,IAAI;MACF,SAAS;MACT,YAAY;MACZ,KAAK;MACL,IAAI;KACN;eANF;MAQG,KACC,kBAAC,GAAD;OAAS,OAAO;iBACd,kBAAC,GAAD,EAAc,OAAO,QAAU,CAAA;MACxB,CAAA;MAEV,CAAC,KACA,kBAAC,GAAD;OAAS,OAAO;iBACd,kBAAC,GAAD;QACE,MAAM;QACN,eAAe;SACb,EAAS;QACX;kBAEA,kBAAC,GAAD,CAAY,CAAA;OACF,CAAA;MACL,CAAA;MAEV,KACC,kBAAC,GAAD;OAAS,OAAO;iBACd,kBAAC,GAAD;QACE,MAAM;QACN,eAAe;SACb,EAAQ;QACV;kBAEA,kBAAC,GAAD,CAAQ,CAAA;OACE,CAAA;MACL,CAAA;MAEV,KACC,kBAAC,GAAD;OAAS,OAAO;iBACd,kBAAC,GAAD;QACE,MAAM;QACN,eAAe;SACb,EAAS;QACX;kBAEA,kBAAC,GAAD,CAAY,CAAA;OACF,CAAA;MACL,CAAA;MAEV,KACC,kBAAC,GAAD;OAAS,OAAO;iBACd,kBAAC,GAAD;QACE,MAAM;QACN,eAAe;SACb,EAAS;QACX;kBAEA,kBAAC,GAAD,CAAgB,CAAA;OACN,CAAA;MACL,CAAA;KAER;;IAEN,KAAc,kBAAC,GAAD,EAAoB,OAAO,UAAY,CAAA;GACnD;MACL,kBAAC,GAAD;GACE,IAAI;IACF,SAAS;IACT,UAAU;IACV,YAAY;GACd;aALF;IAOE,kBAAC,GAAD;KACE,OAAO;KACP,OAAO;KACP,SAAS,IAAoB,kBAAkB;KAC/C,IAAI;MAAE,OAAO;MAAQ,IAAI;KAAI;IAC9B,CAAA;IACA,CAAC,KACA,kBAAC,GAAD;KACE,SAAS;KACT,IAAI;MACF,YAAY;MACZ,YAAY;KACd;eAEC,IACC,2BAEA,kBAAA,GAAA,EAAA,UAAA;MACE,kBAAC,QAAD,EAAA,UAAO,EAA0B,GAAqB,CAAC,EAAQ,CAAA;MAC/D,kBAAC,GAAD;OACE,WAAW;OACX,IAAI;QACF,OAAO;QACP,IAAI;OACN;iBACD;MAEI,CAAA;MACL,kBAAC,QAAD,EAAA,UAAO,EAA0B,GAAkB,CAAC,EAAQ,CAAA;KAC5D,EAAA,CAAA;IAEM,CAAA;IAEb,KACC,kBAAC,GAAD;KACE,SAAS;KACT,IAAI;MACF,YAAY;MACZ,YAAY;KACd;eAEC,IAAW,WAAW;IACb,CAAA;GAEX;IACF;;AAET"}

package/dist/components/Evaluation/EvaluationRoundEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"EvaluationRoundEditor.js","names":[],"sources":["../../../src/components/Evaluation/EvaluationRoundEditor.tsx"],"sourcesContent":["import {\n  createEvaluationRound,\n  deleteEvaluationRound,\n  updateEvaluationRound,\n} from '@/synapse-client/SynapseClient'\nimport { useGlobalIsEditingContext } from '@/utils/context/GlobalIsEditingContext'\nimport { useSynapseContext } from '@/utils/context/SynapseContext'\nimport { useListState } from '@/utils/hooks/useListState'\nimport {\n  Alert,\n  Box,\n  Button,\n  Card,\n  CardContent,\n  Grid as Grid2,\n  TextField,\n} from '@mui/material'\nimport { DateTimeValidationError } from '@mui/x-date-pickers'\nimport { SynapseClientError } from '@sage-bionetworks/synapse-client/util/SynapseClientError'\nimport {\n  EvaluationRound,\n  EvaluationRoundLimit,\n} from '@sage-bionetworks/synapse-types'\nimport dayjs, { Dayjs } from 'dayjs'\nimport isSameOrAfter from 'dayjs/plugin/isSameOrAfter'\nimport utc from 'dayjs/plugin/utc'\nimport { upperFirst } from 'lodash-es'\nimport { useEffect, useState } from 'react'\nimport DateTimePicker from '../DateTimePicker/DateTimePicker'\nimport { ErrorBanner } from '../error/ErrorBanner'\nimport IconSvg, { IconSvgProps } from '../IconSvg/IconSvg'\nimport { EvaluationRoundEditorDropdown } from './EvaluationRoundEditorDropdown'\nimport {\n  convertEvaluationRoundToInput,\n  EvaluationRoundInput,\n  EvaluationRoundLimitInput,\n} from './input_models/models'\nimport { EvaluationRoundLimitOptionsList } from './round_limits/EvaluationRoundLimitOptionsList'\n\ndayjs.extend(utc)\ndayjs.extend(isSameOrAfter)\n\nexport type EvaluationRoundEditorProps = {\n  evaluationRoundInput: EvaluationRoundInput\n  onDelete: () => void\n  onSave: (evaluationRound: EvaluationRoundInput) => void\n}\n\nconst disallowCalendarDateBefore = (date: Dayjs) => {\n  const startOfDay = date.startOf('day')\n  return (currentDate: Dayjs) => currentDate.isSameOrAfter(startOfDay)\n}\n\nconst determineRoundStatus = (\n  roundStart: Dayjs | string,\n  roundEnd: Dayjs | string,\n) => {\n  let className: string\n  let iconProps: IconSvgProps | undefined\n  let status: string\n  const now = dayjs()\n  // based off of start/end datetime from props so that users making\n  // unsaved changes to the start/end dates do not change the status\n  if (now.isSameOrAfter(roundStart)) {\n    if (now.isBefore(roundEnd)) {\n      className = 'status-in-progress'\n      iconProps = { icon: 'sync' }\n      status = 'IN PROGRESS'\n    } else {\n      className = 'status-completed'\n      iconProps = { icon: 'clipboardCheck' }\n      status = 'COMPLETED'\n    }\n  } else {\n    className = 'status-not-yet-started'\n    iconProps = undefined\n    status = 'NOT YET STARTED'\n  }\n\n  return (\n    <div className={className}>\n      <div className=\"status\">\n        {iconProps && <IconSvg {...iconProps} />}\n        <span>{status}</span>\n      </div>\n    </div>\n  )\n}\n\nconst convertInputsToEvaluationRound = (\n  evaluationRoundInputProp: EvaluationRoundInput,\n  startDate: string | Dayjs | null,\n  endDate: string | Dayjs | null,\n  totalSubmissionLimit: string,\n  advancedLimits: EvaluationRoundLimitInput[],\n): EvaluationRound => {\n  const limits: EvaluationRoundLimit[] = []\n  if (totalSubmissionLimit) {\n    const totalSubmissionLimitInt = Number(totalSubmissionLimit)\n    if (Number.isNaN(totalSubmissionLimitInt)) {\n      throw TypeError('Total Submission is not an integer')\n    }\n    limits.push({\n      limitType: 'TOTAL',\n      maximumSubmissions: totalSubmissionLimitInt,\n    })\n  }\n  advancedLimits.forEach(limitInput => {\n    if (limitInput.maxSubmissionString) {\n      const maxSubmissionInt = Number(limitInput.maxSubmissionString)\n      if (Number.isNaN(maxSubmissionInt)) {\n        throw TypeError(limitInput.type + ' Limit is not an integer')\n      }\n      limits.push({\n        limitType: limitInput.type,\n        maximumSubmissions: maxSubmissionInt,\n      })\n    }\n  })\n\n  return {\n    id: evaluationRoundInputProp.id,\n    etag: evaluationRoundInputProp.etag,\n    evaluationId: evaluationRoundInputProp.evaluationId,\n    roundStart: dayjs.utc(startDate).toJSON(),\n    roundEnd: dayjs.utc(endDate).toJSON(),\n    limits: limits,\n  }\n}\n\nfunction getDateErrorMessage(\n  dateField: 'start' | 'end',\n  error: DateTimeValidationError | null,\n): string | null {\n  if (error == null) return null\n  switch (error) {\n    case 'disablePast':\n      return `${upperFirst(dateField)} date cannot be in the past`\n    case 'invalidDate':\n    default:\n      return 'Invalid date'\n  }\n}\n\nexport function EvaluationRoundEditor({\n  evaluationRoundInput,\n  onSave,\n  onDelete,\n}: EvaluationRoundEditorProps) {\n  const { accessToken } = useSynapseContext()\n  const { setIsEditing } = useGlobalIsEditingContext()\n  const [isDirty, setIsDirty] = useState(false)\n  const [error, setError] = useState<string | SynapseClientError | undefined>()\n  const [showSaveSuccess, setShowSaveSuccess] = useState<boolean>(false)\n\n  useEffect(() => {\n    setIsEditing(isDirty)\n    return () => {\n      setIsEditing(false)\n    }\n  }, [isDirty, setIsEditing])\n\n  useEffect(() => {\n    if (error) {\n      setShowSaveSuccess(false)\n    }\n  }, [error])\n\n  const [startDate, setStartDate] = useState<Dayjs | null>(\n    evaluationRoundInput.roundStart\n      ? dayjs(evaluationRoundInput.roundStart)\n      : null,\n  )\n  const [endDate, setEndDate] = useState<Dayjs | null>(\n    evaluationRoundInput.roundEnd ? dayjs(evaluationRoundInput.roundEnd) : null,\n  )\n\n  const [totalSubmissionLimit, setTotalSubmissionLimit] = useState<string>(\n    evaluationRoundInput.totalSubmissionLimit,\n  )\n\n  const [advancedMode, setAdvancedMode] = useState<boolean>(false)\n\n  const [startDateError, setStartDateError] =\n    useState<DateTimeValidationError | null>(null)\n  const [endDateError, setEndDateError] =\n    useState<DateTimeValidationError | null>(null)\n\n  const {\n    list: advancedLimits,\n    handleListRemove,\n    handleListChange: handleAdvancedLimitsChangeBase,\n    appendToList: appendAdvancedLimit,\n  } = useListState<EvaluationRoundLimitInput>(evaluationRoundInput.otherLimits)\n\n  const handleAdvancedLimitsChange = (\n    ...args: Parameters<typeof handleAdvancedLimitsChangeBase>\n  ) => {\n    setIsDirty(true)\n    return handleAdvancedLimitsChangeBase(...args)\n  }\n\n  const addAdvancedLimit = (\n    ...args: Parameters<typeof appendAdvancedLimit>\n  ) => {\n    setIsDirty(true)\n    return appendAdvancedLimit(...args)\n  }\n\n  // if we remove the last advanced limit, hide the advanced limits\n  const handleAdvancedLimitsRemove = (index: number) => {\n    const generatedRemoveFunc = handleListRemove(index)\n    return () => {\n      //we are deleting the last advanced limit\n      setIsDirty(true)\n      generatedRemoveFunc()\n      if (advancedLimits.length === 1) {\n        // NOTE: we dont check for length == 0 because we don't modify the original list,\n        // instead the generated function will setState() with a NEW empty list\n        // so the original list we reference still has 1 element\n        setAdvancedMode(false)\n      }\n    }\n  }\n\n  const onSaveButtonClick = () => {\n    setShowSaveSuccess(false)\n    let evaluationRound\n    try {\n      evaluationRound = convertInputsToEvaluationRound(\n        evaluationRoundInput,\n        startDate,\n        endDate,\n        totalSubmissionLimit,\n        advancedLimits,\n      )\n    } catch (err) {\n      // error thrown if number\n      setError(err)\n    }\n    if (evaluationRound) {\n      const promise = evaluationRound.id\n        ? updateEvaluationRound(evaluationRound, accessToken)\n        : createEvaluationRound(evaluationRound, accessToken)\n\n      promise\n        .then(createdOrUpdatedRound => {\n          const newInput = convertEvaluationRoundToInput(\n            createdOrUpdatedRound,\n            evaluationRoundInput.reactListKey,\n          )\n          //clear out previous error if any\n          setError(undefined)\n          setShowSaveSuccess(true)\n          setIsDirty(false)\n          onSave(newInput)\n        })\n        .catch(error => setError(error))\n    }\n  }\n\n  const onDeleteButtonClick = () => {\n    if (evaluationRoundInput.id) {\n      deleteEvaluationRound(\n        evaluationRoundInput.evaluationId,\n        evaluationRoundInput.id,\n        accessToken,\n      )\n        .then(() => onDelete())\n        .catch(error => setError(error))\n    } else {\n      onDelete()\n    }\n  }\n\n  const disableStartInput = dayjs().isSameOrAfter(\n    evaluationRoundInput.roundStart,\n  )\n\n  return (\n    <div className=\"evaluation-round-editor\">\n      <Card>\n        <CardContent sx={{ p: 3 }}>\n          <form aria-label={'Evaluation Round Form'}>\n            <Box sx={{ display: 'flex', justifyContent: 'space-between' }}>\n              <h5>\n                ROUND STATUS\n                {evaluationRoundInput.id &&\n                  ' (' + evaluationRoundInput.id + ')'}\n              </h5>\n              <EvaluationRoundEditorDropdown\n                onDelete={onDeleteButtonClick}\n                onSave={onSaveButtonClick}\n              />\n            </Box>\n            <Box className=\"round-status\" sx={{ mb: 2 }}>\n              {determineRoundStatus(\n                evaluationRoundInput.roundStart,\n                evaluationRoundInput.roundEnd,\n              )}\n            </Box>\n            <h5>DURATION</h5>\n\n            <Grid2 container>\n              <Grid2 size={6}>\n                <DateTimePicker\n                  label=\"Round Start\"\n                  value={startDate}\n                  onChange={date => {\n                    setStartDate(date)\n                    setIsDirty(true)\n                  }}\n                  onError={error => setStartDateError(error)}\n                  disabled={disableStartInput}\n                  // Don't allow the value to be a past date only if the input is not disabled.\n                  // i.e. allow a past date if the round has already started\n                  disablePast={!disableStartInput}\n                  slotProps={{\n                    textField: {\n                      helperText: getDateErrorMessage('start', startDateError),\n                    },\n                  }}\n                />\n              </Grid2>\n              <Grid2 size={6}>\n                <DateTimePicker\n                  label=\"Round End\"\n                  value={endDate}\n                  onChange={date => {\n                    setEndDate(date)\n                    setIsDirty(true)\n                  }}\n                  onError={error => setEndDateError(error)}\n                  disablePast={\n                    !dayjs(endDate).isSame(evaluationRoundInput.roundEnd)\n                  }\n                  slotProps={{\n                    textField: {\n                      helperText: getDateErrorMessage('end', endDateError),\n                    },\n                  }}\n                />\n              </Grid2>\n            </Grid2>\n            <h5 style={{ marginTop: '20px' }}>SUBMISSION LIMITS</h5>\n            <TextField\n              fullWidth\n              label=\"Total Submissions / Round\"\n              value={totalSubmissionLimit}\n              onChange={event => {\n                setTotalSubmissionLimit(event.target.value)\n                setIsDirty(true)\n              }}\n              // Chrome for some reason decides to autofill this input box with email address, so we must disable autofill\n              // this is a hacky, but consistent way to disable autofill because Chrome does not respect the spec :(\n              // https://bugs.chromium.org/p/chromium/issues/detail?id=914451\n              autoComplete=\"new-password\"\n              slotProps={{\n                htmlInput: {\n                  pattern: '[0-9]*',\n                },\n              }}\n            />\n            <Box sx={{ my: 2 }}>\n              <Button\n                variant=\"outlined\"\n                color=\"primary\"\n                size={'small'}\n                onClick={() => setAdvancedMode(!advancedMode)}\n              >\n                Advanced Limits\n              </Button>\n            </Box>\n            {advancedMode && (\n              <EvaluationRoundLimitOptionsList\n                limitInputs={advancedLimits}\n                handleChange={handleAdvancedLimitsChange}\n                handleDeleteLimit={handleAdvancedLimitsRemove}\n                onAddNewLimit={addAdvancedLimit}\n              />\n            )}\n\n            {error && (\n              <Box sx={{ my: 3 }}>\n                <ErrorBanner error={error} />\n              </Box>\n            )}\n\n            {showSaveSuccess && (\n              <Box sx={{ my: 3 }}>\n                <Alert\n                  className=\"save-success-alert\"\n                  severity=\"success\"\n                  onClose={() => setShowSaveSuccess(false)}\n                  sx={{ mb: '20px' }}\n                >\n                  Successfully saved.\n                </Alert>\n              </Box>\n            )}\n\n            <Box sx={{ mt: 3, textAlign: 'right' }}>\n              <Button\n                variant=\"contained\"\n                color=\"primary\"\n                onClick={onSaveButtonClick}\n              >\n                Save\n              </Button>\n            </Box>\n          </form>\n        </CardContent>\n      </Card>\n    </div>\n  )\n}\n\nexport const HelpersToTest = {\n  disallowCalendarDateBefore,\n  determineRoundStatus,\n  convertInputsToEvaluationRound,\n}\n"],"mappings":"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"}
+{"version":3,"file":"EvaluationRoundEditor.js","names":[],"sources":["../../../src/components/Evaluation/EvaluationRoundEditor.tsx"],"sourcesContent":["import {\n  createEvaluationRound,\n  deleteEvaluationRound,\n  updateEvaluationRound,\n} from '@/synapse-client/SynapseClient'\nimport { useGlobalIsEditingContext } from '@/utils/context/GlobalIsEditingContext'\nimport { useSynapseContext } from '@/utils/context/SynapseContext'\nimport { useListState } from '@/utils/hooks/useListState'\nimport {\n  Alert,\n  Box,\n  Button,\n  Card,\n  CardContent,\n  Grid as Grid2,\n  TextField,\n} from '@mui/material'\nimport { DateTimeValidationError } from '@mui/x-date-pickers'\nimport { SynapseClientError } from '@sage-bionetworks/synapse-client/util/SynapseClientError'\nimport {\n  EvaluationRound,\n  EvaluationRoundLimit,\n} from '@sage-bionetworks/synapse-types'\nimport dayjs, { Dayjs } from 'dayjs'\nimport isSameOrAfter from 'dayjs/plugin/isSameOrAfter'\nimport utc from 'dayjs/plugin/utc'\nimport { upperFirst } from 'lodash-es'\nimport { useEffect, useState } from 'react'\nimport DateTimePicker from '../DateTimePicker/DateTimePicker'\nimport { ErrorBanner } from '../error/ErrorBanner'\nimport IconSvg, { IconSvgProps } from '../IconSvg/IconSvg'\nimport { EvaluationRoundEditorDropdown } from './EvaluationRoundEditorDropdown'\nimport {\n  convertEvaluationRoundToInput,\n  EvaluationRoundInput,\n  EvaluationRoundLimitInput,\n} from './input_models/models'\nimport { EvaluationRoundLimitOptionsList } from './round_limits/EvaluationRoundLimitOptionsList'\n\ndayjs.extend(utc)\ndayjs.extend(isSameOrAfter)\n\nexport type EvaluationRoundEditorProps = {\n  evaluationRoundInput: EvaluationRoundInput\n  onDelete: () => void\n  onSave: (evaluationRound: EvaluationRoundInput) => void\n}\n\nconst disallowCalendarDateBefore = (date: Dayjs) => {\n  const startOfDay = date.startOf('day')\n  return (currentDate: Dayjs) => currentDate.isSameOrAfter(startOfDay)\n}\n\nconst determineRoundStatus = (\n  roundStart: Dayjs | string,\n  roundEnd: Dayjs | string,\n) => {\n  let className: string\n  let iconProps: IconSvgProps | undefined\n  let status: string\n  const now = dayjs()\n  // based off of start/end datetime from props so that users making\n  // unsaved changes to the start/end dates do not change the status\n  if (now.isSameOrAfter(roundStart)) {\n    if (now.isBefore(roundEnd)) {\n      className = 'status-in-progress'\n      iconProps = { icon: 'sync' }\n      status = 'IN PROGRESS'\n    } else {\n      className = 'status-completed'\n      iconProps = { icon: 'clipboardCheck' }\n      status = 'COMPLETED'\n    }\n  } else {\n    className = 'status-not-yet-started'\n    iconProps = undefined\n    status = 'NOT YET STARTED'\n  }\n\n  return (\n    <div className={className}>\n      <div className=\"status\">\n        {iconProps && <IconSvg {...iconProps} />}\n        <span>{status}</span>\n      </div>\n    </div>\n  )\n}\n\nconst convertInputsToEvaluationRound = (\n  evaluationRoundInputProp: EvaluationRoundInput,\n  startDate: string | Dayjs | null,\n  endDate: string | Dayjs | null,\n  totalSubmissionLimit: string,\n  advancedLimits: EvaluationRoundLimitInput[],\n): EvaluationRound => {\n  const limits: EvaluationRoundLimit[] = []\n  if (totalSubmissionLimit) {\n    const totalSubmissionLimitInt = Number(totalSubmissionLimit)\n    if (Number.isNaN(totalSubmissionLimitInt)) {\n      throw new TypeError('Total Submission is not an integer')\n    }\n    limits.push({\n      limitType: 'TOTAL',\n      maximumSubmissions: totalSubmissionLimitInt,\n    })\n  }\n  advancedLimits.forEach(limitInput => {\n    if (limitInput.maxSubmissionString) {\n      const maxSubmissionInt = Number(limitInput.maxSubmissionString)\n      if (Number.isNaN(maxSubmissionInt)) {\n        throw new TypeError(limitInput.type + ' Limit is not an integer')\n      }\n      limits.push({\n        limitType: limitInput.type,\n        maximumSubmissions: maxSubmissionInt,\n      })\n    }\n  })\n\n  return {\n    id: evaluationRoundInputProp.id,\n    etag: evaluationRoundInputProp.etag,\n    evaluationId: evaluationRoundInputProp.evaluationId,\n    roundStart: dayjs.utc(startDate).toJSON(),\n    roundEnd: dayjs.utc(endDate).toJSON(),\n    limits: limits,\n  }\n}\n\nfunction getDateErrorMessage(\n  dateField: 'start' | 'end',\n  error: DateTimeValidationError | null,\n): string | null {\n  if (error == null) return null\n  switch (error) {\n    case 'disablePast':\n      return `${upperFirst(dateField)} date cannot be in the past`\n    case 'invalidDate':\n    default:\n      return 'Invalid date'\n  }\n}\n\nexport function EvaluationRoundEditor({\n  evaluationRoundInput,\n  onSave,\n  onDelete,\n}: EvaluationRoundEditorProps) {\n  const { accessToken } = useSynapseContext()\n  const { setIsEditing } = useGlobalIsEditingContext()\n  const [isDirty, setIsDirty] = useState(false)\n  const [error, setError] = useState<string | SynapseClientError | undefined>()\n  const [showSaveSuccess, setShowSaveSuccess] = useState<boolean>(false)\n\n  useEffect(() => {\n    setIsEditing(isDirty)\n    return () => {\n      setIsEditing(false)\n    }\n  }, [isDirty, setIsEditing])\n\n  useEffect(() => {\n    if (error) {\n      setShowSaveSuccess(false)\n    }\n  }, [error])\n\n  const [startDate, setStartDate] = useState<Dayjs | null>(\n    evaluationRoundInput.roundStart\n      ? dayjs(evaluationRoundInput.roundStart)\n      : null,\n  )\n  const [endDate, setEndDate] = useState<Dayjs | null>(\n    evaluationRoundInput.roundEnd ? dayjs(evaluationRoundInput.roundEnd) : null,\n  )\n\n  const [totalSubmissionLimit, setTotalSubmissionLimit] = useState<string>(\n    evaluationRoundInput.totalSubmissionLimit,\n  )\n\n  const [advancedMode, setAdvancedMode] = useState<boolean>(false)\n\n  const [startDateError, setStartDateError] =\n    useState<DateTimeValidationError | null>(null)\n  const [endDateError, setEndDateError] =\n    useState<DateTimeValidationError | null>(null)\n\n  const {\n    list: advancedLimits,\n    handleListRemove,\n    handleListChange: handleAdvancedLimitsChangeBase,\n    appendToList: appendAdvancedLimit,\n  } = useListState<EvaluationRoundLimitInput>(evaluationRoundInput.otherLimits)\n\n  const handleAdvancedLimitsChange = (\n    ...args: Parameters<typeof handleAdvancedLimitsChangeBase>\n  ) => {\n    setIsDirty(true)\n    return handleAdvancedLimitsChangeBase(...args)\n  }\n\n  const addAdvancedLimit = (\n    ...args: Parameters<typeof appendAdvancedLimit>\n  ) => {\n    setIsDirty(true)\n    return appendAdvancedLimit(...args)\n  }\n\n  // if we remove the last advanced limit, hide the advanced limits\n  const handleAdvancedLimitsRemove = (index: number) => {\n    const generatedRemoveFunc = handleListRemove(index)\n    return () => {\n      //we are deleting the last advanced limit\n      setIsDirty(true)\n      generatedRemoveFunc()\n      if (advancedLimits.length === 1) {\n        // NOTE: we dont check for length == 0 because we don't modify the original list,\n        // instead the generated function will setState() with a NEW empty list\n        // so the original list we reference still has 1 element\n        setAdvancedMode(false)\n      }\n    }\n  }\n\n  const onSaveButtonClick = () => {\n    setShowSaveSuccess(false)\n    let evaluationRound\n    try {\n      evaluationRound = convertInputsToEvaluationRound(\n        evaluationRoundInput,\n        startDate,\n        endDate,\n        totalSubmissionLimit,\n        advancedLimits,\n      )\n    } catch (err) {\n      // error thrown if number\n      setError(err)\n    }\n    if (evaluationRound) {\n      const promise = evaluationRound.id\n        ? updateEvaluationRound(evaluationRound, accessToken)\n        : createEvaluationRound(evaluationRound, accessToken)\n\n      promise\n        .then(createdOrUpdatedRound => {\n          const newInput = convertEvaluationRoundToInput(\n            createdOrUpdatedRound,\n            evaluationRoundInput.reactListKey,\n          )\n          //clear out previous error if any\n          setError(undefined)\n          setShowSaveSuccess(true)\n          setIsDirty(false)\n          onSave(newInput)\n        })\n        .catch(error => setError(error))\n    }\n  }\n\n  const onDeleteButtonClick = () => {\n    if (evaluationRoundInput.id) {\n      deleteEvaluationRound(\n        evaluationRoundInput.evaluationId,\n        evaluationRoundInput.id,\n        accessToken,\n      )\n        .then(() => onDelete())\n        .catch(error => setError(error))\n    } else {\n      onDelete()\n    }\n  }\n\n  const disableStartInput = dayjs().isSameOrAfter(\n    evaluationRoundInput.roundStart,\n  )\n\n  return (\n    <div className=\"evaluation-round-editor\">\n      <Card>\n        <CardContent sx={{ p: 3 }}>\n          <form aria-label={'Evaluation Round Form'}>\n            <Box sx={{ display: 'flex', justifyContent: 'space-between' }}>\n              <h5>\n                ROUND STATUS\n                {evaluationRoundInput.id &&\n                  ' (' + evaluationRoundInput.id + ')'}\n              </h5>\n              <EvaluationRoundEditorDropdown\n                onDelete={onDeleteButtonClick}\n                onSave={onSaveButtonClick}\n              />\n            </Box>\n            <Box className=\"round-status\" sx={{ mb: 2 }}>\n              {determineRoundStatus(\n                evaluationRoundInput.roundStart,\n                evaluationRoundInput.roundEnd,\n              )}\n            </Box>\n            <h5>DURATION</h5>\n\n            <Grid2 container>\n              <Grid2 size={6}>\n                <DateTimePicker\n                  label=\"Round Start\"\n                  value={startDate}\n                  onChange={date => {\n                    setStartDate(date)\n                    setIsDirty(true)\n                  }}\n                  onError={error => setStartDateError(error)}\n                  disabled={disableStartInput}\n                  // Don't allow the value to be a past date only if the input is not disabled.\n                  // i.e. allow a past date if the round has already started\n                  disablePast={!disableStartInput}\n                  slotProps={{\n                    textField: {\n                      helperText: getDateErrorMessage('start', startDateError),\n                    },\n                  }}\n                />\n              </Grid2>\n              <Grid2 size={6}>\n                <DateTimePicker\n                  label=\"Round End\"\n                  value={endDate}\n                  onChange={date => {\n                    setEndDate(date)\n                    setIsDirty(true)\n                  }}\n                  onError={error => setEndDateError(error)}\n                  disablePast={\n                    !dayjs(endDate).isSame(evaluationRoundInput.roundEnd)\n                  }\n                  slotProps={{\n                    textField: {\n                      helperText: getDateErrorMessage('end', endDateError),\n                    },\n                  }}\n                />\n              </Grid2>\n            </Grid2>\n            <h5 style={{ marginTop: '20px' }}>SUBMISSION LIMITS</h5>\n            <TextField\n              fullWidth\n              label=\"Total Submissions / Round\"\n              value={totalSubmissionLimit}\n              onChange={event => {\n                setTotalSubmissionLimit(event.target.value)\n                setIsDirty(true)\n              }}\n              // Chrome for some reason decides to autofill this input box with email address, so we must disable autofill\n              // this is a hacky, but consistent way to disable autofill because Chrome does not respect the spec :(\n              // https://bugs.chromium.org/p/chromium/issues/detail?id=914451\n              autoComplete=\"new-password\"\n              slotProps={{\n                htmlInput: {\n                  pattern: '[0-9]*',\n                },\n              }}\n            />\n            <Box sx={{ my: 2 }}>\n              <Button\n                variant=\"outlined\"\n                color=\"primary\"\n                size={'small'}\n                onClick={() => setAdvancedMode(!advancedMode)}\n              >\n                Advanced Limits\n              </Button>\n            </Box>\n            {advancedMode && (\n              <EvaluationRoundLimitOptionsList\n                limitInputs={advancedLimits}\n                handleChange={handleAdvancedLimitsChange}\n                handleDeleteLimit={handleAdvancedLimitsRemove}\n                onAddNewLimit={addAdvancedLimit}\n              />\n            )}\n\n            {error && (\n              <Box sx={{ my: 3 }}>\n                <ErrorBanner error={error} />\n              </Box>\n            )}\n\n            {showSaveSuccess && (\n              <Box sx={{ my: 3 }}>\n                <Alert\n                  className=\"save-success-alert\"\n                  severity=\"success\"\n                  onClose={() => setShowSaveSuccess(false)}\n                  sx={{ mb: '20px' }}\n                >\n                  Successfully saved.\n                </Alert>\n              </Box>\n            )}\n\n            <Box sx={{ mt: 3, textAlign: 'right' }}>\n              <Button\n                variant=\"contained\"\n                color=\"primary\"\n                onClick={onSaveButtonClick}\n              >\n                Save\n              </Button>\n            </Box>\n          </form>\n        </CardContent>\n      </Card>\n    </div>\n  )\n}\n\nexport const HelpersToTest = {\n  disallowCalendarDateBefore,\n  determineRoundStatus,\n  convertInputsToEvaluationRound,\n}\n"],"mappings":"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"}

package/dist/components/Evaluation/round_limits/EvaluationRoundLimitOptionsList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EvaluationRoundLimitOptionsList.d.ts","sourceRoot":"","sources":["../../../../src/components/Evaluation/round_limits/EvaluationRoundLimitOptionsList.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,yBAAyB,EAAE,MAAM,wBAAwB,CAAA;AAQlE,MAAM,MAAM,oCAAoC,GAAG;IACjD,WAAW,EAAE,yBAAyB,EAAE,CAAA;IACxC,YAAY,EAAE,CACZ,KAAK,EAAE,MAAM,KACV,CAAC,UAAU,EAAE,yBAAyB,KAAK,IAAI,CAAA;IAEpD,iBAAiB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,IAAI,CAAA;IAEhD,aAAa,EAAE,CAAC,KAAK,EAAE,yBAAyB,KAAK,IAAI,CAAA;CAC1D,CAAA;AAUD,wBAAgB,+BAA+B,CAAC,EAC9C,WAAW,EACX,YAAY,EACZ,iBAAiB,EACjB,aAAa,GACd,EAAE,oCAAoC,2CAqEtC"}
+{"version":3,"file":"EvaluationRoundLimitOptionsList.d.ts","sourceRoot":"","sources":["../../../../src/components/Evaluation/round_limits/EvaluationRoundLimitOptionsList.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,yBAAyB,EAAE,MAAM,wBAAwB,CAAA;AAQlE,MAAM,MAAM,oCAAoC,GAAG;IACjD,WAAW,EAAE,yBAAyB,EAAE,CAAA;IACxC,YAAY,EAAE,CACZ,KAAK,EAAE,MAAM,KACV,CAAC,UAAU,EAAE,yBAAyB,KAAK,IAAI,CAAA;IAEpD,iBAAiB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,IAAI,CAAA;IAEhD,aAAa,EAAE,CAAC,KAAK,EAAE,yBAAyB,KAAK,IAAI,CAAA;CAC1D,CAAA;AAUD,wBAAgB,+BAA+B,CAAC,EAC9C,WAAW,EACX,YAAY,EACZ,iBAAiB,EACjB,aAAa,GACd,EAAE,oCAAoC,2CAqEtC"}