synapse-react-client 4.0.9 → 4.0.10

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

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

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

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

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

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

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"IdColumnHeader.js","names":[],"sources":["../../../../src/components/EntityTreeTable/components/IdColumnHeader.tsx"],"sourcesContent":["import React, { useMemo } from 'react'\nimport { HeaderContext } from '@tanstack/react-table'\nimport { EntityBundleRow } from '../EntityTreeTable'\nimport ColumnHeader from '../../TanStackTable/ColumnHeader'\nimport { CopyToClipboardIcon } from '../../CopyToClipboardIcon'\n\nexport const IdColumnHeader: React.FC<\n  HeaderContext<EntityBundleRow, unknown>\n> = props => {\n  const { table } = props\n\n  // Get all visible rows and extract their entity IDs\n  const visibleIds = useMemo(() => {\n    const visibleRows = table.getRowModel().rows\n    return visibleRows\n      .filter(row => !row.original.isLoadMore && row.original.entityId) // Exclude \"Load More\" rows and rows without entityId\n      .map(row => row.original.entityId)\n      .join('\\n')\n  }, [table.getRowModel().rows])\n\n  const copyButton = <CopyToClipboardIcon value={visibleIds} sizePx={16} />\n\n  return <ColumnHeader {...props} title=\"ID\" additionalButtons={copyButton} />\n}\n"],"mappings":";;;;;AAMA,IAAa,KAET,MAAS;CACX,IAAM,EAAE,aAAU,GAWZ,IAAa,kBAAC,GAAD;EAAqB,OARrB,QACG,EAAM,aAAa,CAAC,KAErC,QAAO,MAAO,CAAC,EAAI,SAAS,cAAc,EAAI,SAAS,SAAS,CAChE,KAAI,MAAO,EAAI,SAAS,SAAS,CACjC,KAAK,KAAK,EACZ,CAAC,EAAM,aAAa,CAAC,KAAK,CAAC;EAE6B,QAAQ;EAAM,CAAA;AAEzE,QAAO,kBAAC,GAAD;EAAc,GAAI;EAAO,OAAM;EAAK,mBAAmB;EAAc,CAAA"}
+{"version":3,"file":"IdColumnHeader.js","names":[],"sources":["../../../../src/components/EntityTreeTable/components/IdColumnHeader.tsx"],"sourcesContent":["import React, { useMemo } from 'react'\nimport { HeaderContext } from '@tanstack/react-table'\nimport { EntityBundleRow } from '../EntityTreeTable'\nimport ColumnHeader from '../../TanStackTable/ColumnHeader'\nimport { CopyToClipboardIcon } from '../../CopyToClipboardIcon'\n\nexport const IdColumnHeader: React.FC<\n  HeaderContext<EntityBundleRow, unknown>\n> = props => {\n  const { table } = props\n\n  // Get all visible rows and extract their entity IDs\n  const visibleIds = useMemo(() => {\n    const visibleRows = table.getRowModel().rows\n    return visibleRows\n      .filter(row => !row.original.isLoadMore && row.original.entityId) // Exclude \"Load More\" rows and rows without entityId\n      .map(row => row.original.entityId)\n      .join('\\n')\n  }, [table.getRowModel().rows])\n\n  const copyButton = <CopyToClipboardIcon value={visibleIds} sizePx={16} />\n\n  return <ColumnHeader {...props} title=\"ID\" additionalButtons={copyButton} />\n}\n"],"mappings":";;;;;AAMA,IAAa,KAET,MAAS;CACX,IAAM,EAAE,aAAU,GAWZ,IAAa,kBAAC,GAAD;EAAqB,OARrB,QACG,EAAM,aAAa,CAAC,KAErC,QAAO,MAAO,CAAC,EAAI,SAAS,cAAc,EAAI,SAAS,SAAS,CAChE,KAAI,MAAO,EAAI,SAAS,SAAS,CACjC,KAAK,KAAK,EACZ,CAAC,EAAM,aAAa,CAAC,KAAK,CAEkB;EAAY,QAAQ;EAAM,CAAA;AAEzE,QAAO,kBAAC,GAAD;EAAc,GAAI;EAAO,OAAM;EAAK,mBAAmB;EAAc,CAAA"}

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

@@ -1 +1 @@
-{"version":3,"file":"useEntityTreeState.js","names":[],"sources":["../../../../src/components/EntityTreeTable/hooks/useEntityTreeState.ts"],"sourcesContent":["import { useState, useCallback, useEffect, useMemo } from 'react'\nimport { SortingState } from '@tanstack/react-table'\nimport { useQueryClient } from '@tanstack/react-query'\nimport { matchQuery } from '@tanstack/query-core'\nimport {\n  EntityChildrenRequest,\n  EntityHeader,\n  SortBy,\n  Direction,\n} from '@sage-bionetworks/synapse-types'\nimport { EntityType } from '@sage-bionetworks/synapse-client'\nimport { useGetEntityHeader } from '@/synapse-queries'\nimport { useGetEntityChildren } from '@/synapse-queries/entity/useGetEntityChildren'\nimport { convertToEntityType } from '@/utils/functions/EntityTypeUtils'\nimport { useSynapseContext } from '@/utils/context/SynapseContext'\n\nexport type TreeNode = {\n  entityHeader: EntityHeader\n  parentId?: string\n  depth: number\n  isLeaf: boolean\n  children?: TreeNode[]\n}\n\nconst includeTypes: EntityType[] = [\n  EntityType.folder,\n  EntityType.file,\n  EntityType.link,\n  EntityType.recordset,\n]\n\n/**\n * Hook that manages all tree state and data initialization.\n */\nexport const useEntityTreeState = (\n  rootId: string,\n  expandRootByDefault: boolean,\n  showRootNode: boolean,\n) => {\n  // Core state\n  const [expanded, setExpanded] = useState<Record<string, boolean>>({})\n  const [tree, setTree] = useState<Record<string, TreeNode>>({})\n  const [loadingIds, setLoadingIds] = useState<Set<string>>(new Set())\n  const [loadedChildren, setLoadedChildren] = useState<Set<string>>(new Set())\n  const [nextPageTokens, setNextPageTokens] = useState<\n    Record<string, string | undefined>\n  >({})\n  const [loadingPageTokens, setLoadingPageTokens] = useState<\n    Record<string, string | undefined>\n  >({})\n  const [sorting, setSorting] = useState<SortingState>([])\n  const queryClient = useQueryClient()\n  const { keyFactory } = useSynapseContext()\n  const rootEntityQueryKey = useMemo(\n    () => keyFactory.getEntityQueryKey(rootId),\n    [keyFactory, rootId],\n  )\n\n  // Derive sorting parameters from state\n  const { sortBy, sortDirection } = useMemo(() => {\n    if (!sorting.length) return {}\n\n    const firstSort = sorting[0]\n    let sortBy: SortBy | undefined\n\n    switch (firstSort.id) {\n      case 'name':\n        sortBy = SortBy.NAME\n        break\n      case 'createdOn':\n        sortBy = SortBy.CREATED_ON\n        break\n      case 'modifiedOn':\n        sortBy = SortBy.MODIFIED_ON\n        break\n      default:\n        return {}\n    }\n\n    return {\n      sortBy,\n      sortDirection: firstSort.desc ? Direction.DESC : Direction.ASC,\n    }\n  }, [sorting])\n\n  const rootChildrenRequest: EntityChildrenRequest = useMemo(() => {\n    const baseRequest: EntityChildrenRequest = {\n      parentId: rootId,\n      includeTypes,\n      sortBy,\n      sortDirection,\n    }\n\n    return baseRequest\n  }, [rootId, sortBy, sortDirection])\n\n  const rootChildrenQueryKey = useMemo(\n    () => keyFactory.getEntityChildrenQueryKey(rootChildrenRequest, false),\n    [keyFactory, rootChildrenRequest],\n  )\n\n  // Reset tree data when sorting changes\n  const resetTreeData = useCallback(() => {\n    void queryClient.removeQueries({\n      queryKey: rootChildrenQueryKey,\n      exact: true,\n    })\n\n    setTree({})\n    setLoadedChildren(new Set())\n    setExpanded({})\n    setNextPageTokens({})\n    setLoadingPageTokens({})\n    setLoadingIds(new Set())\n  }, [queryClient, rootChildrenQueryKey])\n\n  // Get root entity header\n  const { data: rootHeader } = useGetEntityHeader(rootId)\n  // Get root children - only fetch when we have header and haven't loaded children yet\n  const shouldFetchChildren = !!rootHeader && !loadedChildren.has(rootId)\n  const { data: rootChildren } = useGetEntityChildren(rootChildrenRequest, {\n    enabled: shouldFetchChildren,\n  })\n\n  // Effect to reset data when sorting changes\n  useEffect(() => {\n    resetTreeData()\n  }, [resetTreeData, sorting])\n\n  useEffect(() => {\n    const unsubscribe = queryClient.getQueryCache().subscribe(event => {\n      if (event?.type === 'updated' && event.action?.type === 'invalidate') {\n        // Check if any entity in the tree was invalidated\n        const entityIds = Object.keys(tree)\n        for (const entityId of entityIds) {\n          const entityQueryKey = keyFactory.getEntityQueryKey(entityId)\n          if (\n            matchQuery({ queryKey: entityQueryKey, exact: false }, event.query)\n          ) {\n            resetTreeData()\n            return\n          }\n        }\n      }\n    })\n\n    return () => {\n      unsubscribe()\n    }\n  }, [queryClient, rootEntityQueryKey, resetTreeData, tree, keyFactory])\n\n  // Effect to initialize root node and its children\n  useEffect(() => {\n    if (rootHeader && rootChildren && !tree[rootId]) {\n      // Build the children nodes from the response\n      const children: TreeNode[] = rootChildren.page.map(\n        (eh: EntityHeader) => ({\n          entityHeader: eh,\n          parentId: rootId,\n          depth: showRootNode ? 1 : 0,\n          isLeaf: !(\n            convertToEntityType(eh.type) === EntityType.project ||\n            convertToEntityType(eh.type) === EntityType.folder\n          ),\n        }),\n      )\n\n      // Create child entries for the tree\n      const childEntries = Object.fromEntries(\n        children.map(child => [child.entityHeader.id, child]),\n      )\n\n      // Set up the complete tree state in one go\n      setTree({\n        [rootId]: {\n          entityHeader: rootHeader,\n          depth: showRootNode ? 0 : -1,\n          isLeaf: false,\n          children,\n        },\n        ...childEntries,\n      })\n\n      // Set up pagination token\n      const rootNext = rootChildren.nextPageToken\n      setNextPageTokens({ [rootId]: rootNext })\n\n      // Mark as loaded if there's no next page token\n      if (!rootNext) {\n        setLoadedChildren(new Set([rootId]))\n      }\n\n      // Expand root node by default if the flag is set\n      if (expandRootByDefault) {\n        setExpanded(prev => ({ ...prev, [rootId]: true }))\n      }\n    }\n  }, [\n    rootHeader,\n    rootChildren,\n    rootId,\n    expandRootByDefault,\n    showRootNode,\n    tree,\n  ])\n\n  return {\n    // State\n    expanded,\n    setExpanded,\n    tree,\n    setTree,\n    loadingIds,\n    setLoadingIds,\n    loadedChildren,\n    setLoadedChildren,\n    nextPageTokens,\n    setNextPageTokens,\n    loadingPageTokens,\n    setLoadingPageTokens,\n    sorting,\n    setSorting,\n\n    // Derived values\n    sortBy,\n    sortDirection,\n\n    // Data\n    rootHeader,\n    rootChildren,\n\n    // Actions\n    resetTreeData,\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"useEntityTreeState.js","names":[],"sources":["../../../../src/components/EntityTreeTable/hooks/useEntityTreeState.ts"],"sourcesContent":["import { useState, useCallback, useEffect, useMemo } from 'react'\nimport { SortingState } from '@tanstack/react-table'\nimport { useQueryClient } from '@tanstack/react-query'\nimport { matchQuery } from '@tanstack/query-core'\nimport {\n  EntityChildrenRequest,\n  EntityHeader,\n  SortBy,\n  Direction,\n} from '@sage-bionetworks/synapse-types'\nimport { EntityType } from '@sage-bionetworks/synapse-client'\nimport { useGetEntityHeader } from '@/synapse-queries'\nimport { useGetEntityChildren } from '@/synapse-queries/entity/useGetEntityChildren'\nimport { convertToEntityType } from '@/utils/functions/EntityTypeUtils'\nimport { useSynapseContext } from '@/utils/context/SynapseContext'\n\nexport type TreeNode = {\n  entityHeader: EntityHeader\n  parentId?: string\n  depth: number\n  isLeaf: boolean\n  children?: TreeNode[]\n}\n\nconst includeTypes: EntityType[] = [\n  EntityType.folder,\n  EntityType.file,\n  EntityType.link,\n  EntityType.recordset,\n]\n\n/**\n * Hook that manages all tree state and data initialization.\n */\nexport const useEntityTreeState = (\n  rootId: string,\n  expandRootByDefault: boolean,\n  showRootNode: boolean,\n) => {\n  // Core state\n  const [expanded, setExpanded] = useState<Record<string, boolean>>({})\n  const [tree, setTree] = useState<Record<string, TreeNode>>({})\n  const [loadingIds, setLoadingIds] = useState<Set<string>>(new Set())\n  const [loadedChildren, setLoadedChildren] = useState<Set<string>>(new Set())\n  const [nextPageTokens, setNextPageTokens] = useState<\n    Record<string, string | undefined>\n  >({})\n  const [loadingPageTokens, setLoadingPageTokens] = useState<\n    Record<string, string | undefined>\n  >({})\n  const [sorting, setSorting] = useState<SortingState>([])\n  const queryClient = useQueryClient()\n  const { keyFactory } = useSynapseContext()\n  const rootEntityQueryKey = useMemo(\n    () => keyFactory.getEntityQueryKey(rootId),\n    [keyFactory, rootId],\n  )\n\n  // Derive sorting parameters from state\n  const { sortBy, sortDirection } = useMemo(() => {\n    if (!sorting.length) return {}\n\n    const firstSort = sorting[0]\n    let sortBy: SortBy | undefined\n\n    switch (firstSort.id) {\n      case 'name':\n        sortBy = SortBy.NAME\n        break\n      case 'createdOn':\n        sortBy = SortBy.CREATED_ON\n        break\n      case 'modifiedOn':\n        sortBy = SortBy.MODIFIED_ON\n        break\n      default:\n        return {}\n    }\n\n    return {\n      sortBy,\n      sortDirection: firstSort.desc ? Direction.DESC : Direction.ASC,\n    }\n  }, [sorting])\n\n  const rootChildrenRequest: EntityChildrenRequest = useMemo(() => {\n    const baseRequest: EntityChildrenRequest = {\n      parentId: rootId,\n      includeTypes,\n      sortBy,\n      sortDirection,\n    }\n\n    return baseRequest\n  }, [rootId, sortBy, sortDirection])\n\n  const rootChildrenQueryKey = useMemo(\n    () => keyFactory.getEntityChildrenQueryKey(rootChildrenRequest, false),\n    [keyFactory, rootChildrenRequest],\n  )\n\n  // Reset tree data when sorting changes\n  const resetTreeData = useCallback(() => {\n    void queryClient.removeQueries({\n      queryKey: rootChildrenQueryKey,\n      exact: true,\n    })\n\n    setTree({})\n    setLoadedChildren(new Set())\n    setExpanded({})\n    setNextPageTokens({})\n    setLoadingPageTokens({})\n    setLoadingIds(new Set())\n  }, [queryClient, rootChildrenQueryKey])\n\n  // Get root entity header\n  const { data: rootHeader } = useGetEntityHeader(rootId)\n  // Get root children - only fetch when we have header and haven't loaded children yet\n  const shouldFetchChildren = !!rootHeader && !loadedChildren.has(rootId)\n  const { data: rootChildren } = useGetEntityChildren(rootChildrenRequest, {\n    enabled: shouldFetchChildren,\n  })\n\n  // Effect to reset data when sorting changes\n  useEffect(() => {\n    resetTreeData()\n  }, [resetTreeData, sorting])\n\n  useEffect(() => {\n    const unsubscribe = queryClient.getQueryCache().subscribe(event => {\n      if (event?.type === 'updated' && event.action?.type === 'invalidate') {\n        // Check if any entity in the tree was invalidated\n        const entityIds = Object.keys(tree)\n        for (const entityId of entityIds) {\n          const entityQueryKey = keyFactory.getEntityQueryKey(entityId)\n          if (\n            matchQuery({ queryKey: entityQueryKey, exact: false }, event.query)\n          ) {\n            resetTreeData()\n            return\n          }\n        }\n      }\n    })\n\n    return () => {\n      unsubscribe()\n    }\n  }, [queryClient, rootEntityQueryKey, resetTreeData, tree, keyFactory])\n\n  // Effect to initialize root node and its children\n  useEffect(() => {\n    if (rootHeader && rootChildren && !tree[rootId]) {\n      // Build the children nodes from the response\n      const children: TreeNode[] = rootChildren.page.map(\n        (eh: EntityHeader) => ({\n          entityHeader: eh,\n          parentId: rootId,\n          depth: showRootNode ? 1 : 0,\n          isLeaf: !(\n            convertToEntityType(eh.type) === EntityType.project ||\n            convertToEntityType(eh.type) === EntityType.folder\n          ),\n        }),\n      )\n\n      // Create child entries for the tree\n      const childEntries = Object.fromEntries(\n        children.map(child => [child.entityHeader.id, child]),\n      )\n\n      // Set up the complete tree state in one go\n      setTree({\n        [rootId]: {\n          entityHeader: rootHeader,\n          depth: showRootNode ? 0 : -1,\n          isLeaf: false,\n          children,\n        },\n        ...childEntries,\n      })\n\n      // Set up pagination token\n      const rootNext = rootChildren.nextPageToken\n      setNextPageTokens({ [rootId]: rootNext })\n\n      // Mark as loaded if there's no next page token\n      if (!rootNext) {\n        setLoadedChildren(new Set([rootId]))\n      }\n\n      // Expand root node by default if the flag is set\n      if (expandRootByDefault) {\n        setExpanded(prev => ({ ...prev, [rootId]: true }))\n      }\n    }\n  }, [\n    rootHeader,\n    rootChildren,\n    rootId,\n    expandRootByDefault,\n    showRootNode,\n    tree,\n  ])\n\n  return {\n    // State\n    expanded,\n    setExpanded,\n    tree,\n    setTree,\n    loadingIds,\n    setLoadingIds,\n    loadedChildren,\n    setLoadedChildren,\n    nextPageTokens,\n    setNextPageTokens,\n    loadingPageTokens,\n    setLoadingPageTokens,\n    sorting,\n    setSorting,\n\n    // Derived values\n    sortBy,\n    sortDirection,\n\n    // Data\n    rootHeader,\n    rootChildren,\n\n    // Actions\n    resetTreeData,\n  }\n}\n"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"useTableColumns.js","names":[],"sources":["../../../../src/components/EntityTreeTable/hooks/useTableColumns.ts"],"sourcesContent":["import { useMemo } from 'react'\nimport { ColumnDef } from '@tanstack/react-table'\nimport { useTheme, useMediaQuery } from '@mui/material'\nimport { EntityBundleRow } from '../EntityTreeTable'\nimport { NameCell } from '../components/EntityNameCell'\nimport { IdCell } from '../components/IdCell'\nimport { IdColumnHeader } from '../components/IdColumnHeader'\nimport { ModifiedOnCell } from '../../EntityFinder/details/view/table/ModifiedOnCell'\nimport { ModifiedByCell } from '../../EntityFinder/details/view/table/ModifiedByCell'\nimport { CreatedOnCell } from '../../EntityFinder/details/view/table/CreatedOnCell'\nimport { FileEntitySizeCell } from '../../EntityFinder/details/view/table/FileEntitySizeCell'\nimport { FileEntityMD5Cell } from '../../EntityFinder/details/view/table/FileEntityMD5Cell'\nimport { AddFileToDownloadListCell } from '../../EntityFinder/details/view/table/AddToDownloadListCell'\nimport {\n  NameColumnHeader,\n  CreatedOnColumnHeader,\n  ModifiedOnColumnHeader,\n} from '../components/ColumnHeaders'\nimport { EntityBadgeIconsCell } from '../components/EntityBadgeIconsCell'\n\nexport const useTableColumns = (enableSorting: boolean) => {\n  // Responsive design hooks\n  const theme = useTheme()\n  const isXtraLarge = useMediaQuery(theme.breakpoints.up('xl'))\n  const isMediumAndUp = useMediaQuery(theme.breakpoints.up('md'))\n\n  // Table columns\n  const columns = useMemo<ColumnDef<EntityBundleRow>[]>(() => {\n    const baseColumns: ColumnDef<EntityBundleRow>[] = [\n      {\n        accessorKey: 'entityHeader.name',\n        id: 'name',\n        header: NameColumnHeader,\n        cell: NameCell,\n        enableSorting: enableSorting,\n        size: 450, // Default width for Name column\n      },\n    ]\n    if (isMediumAndUp) {\n      baseColumns.push({\n        id: 'badges',\n        header: '',\n        cell: EntityBadgeIconsCell,\n        enableSorting: false,\n        size: 120, // Default width for Badges column\n      })\n      baseColumns.push({\n        id: 'id',\n        header: IdColumnHeader,\n        cell: IdCell,\n        enableSorting: false,\n      })\n    }\n    if (isXtraLarge) {\n      baseColumns.push({\n        accessorKey: 'entityHeader.createdOn',\n        id: 'createdOn',\n        header: CreatedOnColumnHeader,\n        cell: CreatedOnCell,\n        enableSorting: enableSorting,\n      })\n    }\n\n    if (isMediumAndUp) {\n      baseColumns.push({\n        accessorKey: 'entityHeader.modifiedOn',\n        id: 'modifiedOn',\n        header: ModifiedOnColumnHeader,\n        cell: ModifiedOnCell,\n        enableSorting: enableSorting,\n      })\n    }\n\n    if (isXtraLarge) {\n      baseColumns.push({\n        id: 'modifiedBy',\n        header: 'Modified By',\n        cell: ModifiedByCell,\n        enableSorting: false,\n      })\n    }\n\n    if (isMediumAndUp) {\n      baseColumns.push({\n        id: 'size',\n        header: 'Size',\n        cell: FileEntitySizeCell,\n        enableSorting: false,\n      })\n    }\n    if (isXtraLarge) {\n      baseColumns.push({\n        id: 'md5',\n        header: 'MD5',\n        cell: FileEntityMD5Cell,\n        enableSorting: false,\n      })\n    }\n\n    baseColumns.push({\n      id: 'download',\n      header: 'Download',\n      cell: AddFileToDownloadListCell,\n      enableSorting: false,\n      size: 90,\n    })\n\n    return baseColumns\n  }, [enableSorting, isXtraLarge, isMediumAndUp])\n\n  return columns\n}\n"],"mappings":";;;;;;;;;;;;;;AAoBA,IAAa,KAAmB,MAA2B;CAEzD,IAAM,IAAQ,GAAU,EAClB,IAAc,EAAc,EAAM,YAAY,GAAG,KAAK,CAAC,EACvD,IAAgB,EAAc,EAAM,YAAY,GAAG,KAAK,CAAC;AAsF/D,QAnFgB,QAA4C;EAC1D,IAAM,IAA4C,CAChD;GACE,aAAa;GACb,IAAI;GACJ,QAAQ;GACR,MAAM;GACS;GACf,MAAM;GACP,CACF;AAsED,SArEI,MACF,EAAY,KAAK;GACf,IAAI;GACJ,QAAQ;GACR,MAAM;GACN,eAAe;GACf,MAAM;GACP,CAAC,EACF,EAAY,KAAK;GACf,IAAI;GACJ,QAAQ;GACR,MAAM;GACN,eAAe;GAChB,CAAC,GAEA,KACF,EAAY,KAAK;GACf,aAAa;GACb,IAAI;GACJ,QAAQ;GACR,MAAM;GACS;GAChB,CAAC,EAGA,KACF,EAAY,KAAK;GACf,aAAa;GACb,IAAI;GACJ,QAAQ;GACR,MAAM;GACS;GAChB,CAAC,EAGA,KACF,EAAY,KAAK;GACf,IAAI;GACJ,QAAQ;GACR,MAAM;GACN,eAAe;GAChB,CAAC,EAGA,KACF,EAAY,KAAK;GACf,IAAI;GACJ,QAAQ;GACR,MAAM;GACN,eAAe;GAChB,CAAC,EAEA,KACF,EAAY,KAAK;GACf,IAAI;GACJ,QAAQ;GACR,MAAM;GACN,eAAe;GAChB,CAAC,EAGJ,EAAY,KAAK;GACf,IAAI;GACJ,QAAQ;GACR,MAAM;GACN,eAAe;GACf,MAAM;GACP,CAAC,EAEK;IACN;EAAC;EAAe;EAAa;EAAc,CAAC"}
+{"version":3,"file":"useTableColumns.js","names":[],"sources":["../../../../src/components/EntityTreeTable/hooks/useTableColumns.ts"],"sourcesContent":["import { useMemo } from 'react'\nimport { ColumnDef } from '@tanstack/react-table'\nimport { useTheme, useMediaQuery } from '@mui/material'\nimport { EntityBundleRow } from '../EntityTreeTable'\nimport { NameCell } from '../components/EntityNameCell'\nimport { IdCell } from '../components/IdCell'\nimport { IdColumnHeader } from '../components/IdColumnHeader'\nimport { ModifiedOnCell } from '../../EntityFinder/details/view/table/ModifiedOnCell'\nimport { ModifiedByCell } from '../../EntityFinder/details/view/table/ModifiedByCell'\nimport { CreatedOnCell } from '../../EntityFinder/details/view/table/CreatedOnCell'\nimport { FileEntitySizeCell } from '../../EntityFinder/details/view/table/FileEntitySizeCell'\nimport { FileEntityMD5Cell } from '../../EntityFinder/details/view/table/FileEntityMD5Cell'\nimport { AddFileToDownloadListCell } from '../../EntityFinder/details/view/table/AddToDownloadListCell'\nimport {\n  NameColumnHeader,\n  CreatedOnColumnHeader,\n  ModifiedOnColumnHeader,\n} from '../components/ColumnHeaders'\nimport { EntityBadgeIconsCell } from '../components/EntityBadgeIconsCell'\n\nexport const useTableColumns = (enableSorting: boolean) => {\n  // Responsive design hooks\n  const theme = useTheme()\n  const isXtraLarge = useMediaQuery(theme.breakpoints.up('xl'))\n  const isMediumAndUp = useMediaQuery(theme.breakpoints.up('md'))\n\n  // Table columns\n  const columns = useMemo<ColumnDef<EntityBundleRow>[]>(() => {\n    const baseColumns: ColumnDef<EntityBundleRow>[] = [\n      {\n        accessorKey: 'entityHeader.name',\n        id: 'name',\n        header: NameColumnHeader,\n        cell: NameCell,\n        enableSorting: enableSorting,\n        size: 450, // Default width for Name column\n      },\n    ]\n    if (isMediumAndUp) {\n      baseColumns.push({\n        id: 'badges',\n        header: '',\n        cell: EntityBadgeIconsCell,\n        enableSorting: false,\n        size: 120, // Default width for Badges column\n      })\n      baseColumns.push({\n        id: 'id',\n        header: IdColumnHeader,\n        cell: IdCell,\n        enableSorting: false,\n      })\n    }\n    if (isXtraLarge) {\n      baseColumns.push({\n        accessorKey: 'entityHeader.createdOn',\n        id: 'createdOn',\n        header: CreatedOnColumnHeader,\n        cell: CreatedOnCell,\n        enableSorting: enableSorting,\n      })\n    }\n\n    if (isMediumAndUp) {\n      baseColumns.push({\n        accessorKey: 'entityHeader.modifiedOn',\n        id: 'modifiedOn',\n        header: ModifiedOnColumnHeader,\n        cell: ModifiedOnCell,\n        enableSorting: enableSorting,\n      })\n    }\n\n    if (isXtraLarge) {\n      baseColumns.push({\n        id: 'modifiedBy',\n        header: 'Modified By',\n        cell: ModifiedByCell,\n        enableSorting: false,\n      })\n    }\n\n    if (isMediumAndUp) {\n      baseColumns.push({\n        id: 'size',\n        header: 'Size',\n        cell: FileEntitySizeCell,\n        enableSorting: false,\n      })\n    }\n    if (isXtraLarge) {\n      baseColumns.push({\n        id: 'md5',\n        header: 'MD5',\n        cell: FileEntityMD5Cell,\n        enableSorting: false,\n      })\n    }\n\n    baseColumns.push({\n      id: 'download',\n      header: 'Download',\n      cell: AddFileToDownloadListCell,\n      enableSorting: false,\n      size: 90,\n    })\n\n    return baseColumns\n  }, [enableSorting, isXtraLarge, isMediumAndUp])\n\n  return columns\n}\n"],"mappings":";;;;;;;;;;;;;;AAoBA,IAAa,KAAmB,MAA2B;CAEzD,IAAM,IAAQ,GAAU,EAClB,IAAc,EAAc,EAAM,YAAY,GAAG,KAAK,CAAC,EACvD,IAAgB,EAAc,EAAM,YAAY,GAAG,KAAK,CAAC;AAsF/D,QAnFgB,QAA4C;EAC1D,IAAM,IAA4C,CAChD;GACE,aAAa;GACb,IAAI;GACJ,QAAQ;GACR,MAAM;GACS;GACf,MAAM;GACP,CACF;AAsED,SArEI,MACF,EAAY,KAAK;GACf,IAAI;GACJ,QAAQ;GACR,MAAM;GACN,eAAe;GACf,MAAM;GACP,CAAC,EACF,EAAY,KAAK;GACf,IAAI;GACJ,QAAQ;GACR,MAAM;GACN,eAAe;GAChB,CAAC,GAEA,KACF,EAAY,KAAK;GACf,aAAa;GACb,IAAI;GACJ,QAAQ;GACR,MAAM;GACS;GAChB,CAAC,EAGA,KACF,EAAY,KAAK;GACf,aAAa;GACb,IAAI;GACJ,QAAQ;GACR,MAAM;GACS;GAChB,CAAC,EAGA,KACF,EAAY,KAAK;GACf,IAAI;GACJ,QAAQ;GACR,MAAM;GACN,eAAe;GAChB,CAAC,EAGA,KACF,EAAY,KAAK;GACf,IAAI;GACJ,QAAQ;GACR,MAAM;GACN,eAAe;GAChB,CAAC,EAEA,KACF,EAAY,KAAK;GACf,IAAI;GACJ,QAAQ;GACR,MAAM;GACN,eAAe;GAChB,CAAC,EAGJ,EAAY,KAAK;GACf,IAAI;GACJ,QAAQ;GACR,MAAM;GACN,eAAe;GACf,MAAM;GACP,CAAC,EAEK;IACN;EAAC;EAAe;EAAa;EAAc,CAEvC"}

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

@@ -1 +1 @@
-{"version":3,"file":"useTableData.js","names":[],"sources":["../../../../src/components/EntityTreeTable/hooks/useTableData.ts"],"sourcesContent":["import { useMemo } from 'react'\nimport { EntityBundleRow } from '../EntityTreeTable'\nimport { TreeNode } from './useEntityTreeState'\n\nexport const useTableData = (\n  tree: Record<string, TreeNode>,\n  rootId: string,\n  showRootNode: boolean,\n  expanded: Record<string, boolean>,\n  nextPageTokens: Record<string, string | undefined>,\n  flattenTree: (nodeId: string, visited?: Set<string>) => EntityBundleRow[],\n) => {\n  const rows: EntityBundleRow[] = useMemo(() => {\n    const rootNode = tree[rootId]\n    if (!rootNode) return []\n\n    if (showRootNode) {\n      return flattenTree(rootId, new Set<string>())\n    } else {\n      // If root node is not shown, start with its children\n      const rows: EntityBundleRow[] = []\n      if (expanded[rootId] && rootNode.children) {\n        rootNode.children.forEach(child => {\n          const childRows = flattenTree(\n            child.entityHeader.id,\n            new Set<string>(),\n          )\n          rows.push(...childRows)\n        })\n        // If there is a next page token for the root, add a synthetic 'Load more' row\n        const nextToken = nextPageTokens[rootId]\n        if (nextToken) {\n          rows.push({\n            entityId: '', // Empty placeholder for load more rows\n            entityHeader: rootNode.entityHeader,\n            depth: 0,\n            isLeaf: true,\n            parentId: rootId,\n            versionNumber: rootNode.entityHeader.versionNumber,\n            isLoadMore: true,\n            pageToken: nextToken,\n          })\n        }\n      }\n      return rows\n    }\n  }, [tree, rootId, flattenTree, showRootNode, expanded, nextPageTokens])\n\n  return rows\n}\n"],"mappings":";;AAIA,IAAa,KACX,GACA,GACA,GACA,GACA,GACA,MAEgC,QAAc;CAC5C,IAAM,IAAW,EAAK;AACtB,KAAI,CAAC,EAAU,QAAO,EAAE;AAExB,KAAI,EACF,QAAO,EAAY,mBAAQ,IAAI,KAAa,CAAC;CACxC;EAEL,IAAM,IAA0B,EAAE;AAClC,MAAI,EAAS,MAAW,EAAS,UAAU;AACzC,KAAS,SAAS,SAAQ,MAAS;IACjC,IAAM,IAAY,EAChB,EAAM,aAAa,oBACnB,IAAI,KAAa,CAClB;AACD,MAAK,KAAK,GAAG,EAAU;KACvB;GAEF,IAAM,IAAY,EAAe;AACjC,GAAI,KACF,EAAK,KAAK;IACR,UAAU;IACV,cAAc,EAAS;IACvB,OAAO;IACP,QAAQ;IACR,UAAU;IACV,eAAe,EAAS,aAAa;IACrC,YAAY;IACZ,WAAW;IACZ,CAAC;;AAGN,SAAO;;GAER;CAAC;CAAM;CAAQ;CAAa;CAAc;CAAU;CAAe,CAAC"}
+{"version":3,"file":"useTableData.js","names":[],"sources":["../../../../src/components/EntityTreeTable/hooks/useTableData.ts"],"sourcesContent":["import { useMemo } from 'react'\nimport { EntityBundleRow } from '../EntityTreeTable'\nimport { TreeNode } from './useEntityTreeState'\n\nexport const useTableData = (\n  tree: Record<string, TreeNode>,\n  rootId: string,\n  showRootNode: boolean,\n  expanded: Record<string, boolean>,\n  nextPageTokens: Record<string, string | undefined>,\n  flattenTree: (nodeId: string, visited?: Set<string>) => EntityBundleRow[],\n) => {\n  const rows: EntityBundleRow[] = useMemo(() => {\n    const rootNode = tree[rootId]\n    if (!rootNode) return []\n\n    if (showRootNode) {\n      return flattenTree(rootId, new Set<string>())\n    } else {\n      // If root node is not shown, start with its children\n      const rows: EntityBundleRow[] = []\n      if (expanded[rootId] && rootNode.children) {\n        rootNode.children.forEach(child => {\n          const childRows = flattenTree(\n            child.entityHeader.id,\n            new Set<string>(),\n          )\n          rows.push(...childRows)\n        })\n        // If there is a next page token for the root, add a synthetic 'Load more' row\n        const nextToken = nextPageTokens[rootId]\n        if (nextToken) {\n          rows.push({\n            entityId: '', // Empty placeholder for load more rows\n            entityHeader: rootNode.entityHeader,\n            depth: 0,\n            isLeaf: true,\n            parentId: rootId,\n            versionNumber: rootNode.entityHeader.versionNumber,\n            isLoadMore: true,\n            pageToken: nextToken,\n          })\n        }\n      }\n      return rows\n    }\n  }, [tree, rootId, flattenTree, showRootNode, expanded, nextPageTokens])\n\n  return rows\n}\n"],"mappings":";;AAIA,IAAa,KACX,GACA,GACA,GACA,GACA,GACA,MAEgC,QAAc;CAC5C,IAAM,IAAW,EAAK;AACtB,KAAI,CAAC,EAAU,QAAO,EAAE;AAExB,KAAI,EACF,QAAO,EAAY,mBAAQ,IAAI,KAAa,CAAC;CACxC;EAEL,IAAM,IAA0B,EAAE;AAClC,MAAI,EAAS,MAAW,EAAS,UAAU;AACzC,KAAS,SAAS,SAAQ,MAAS;IACjC,IAAM,IAAY,EAChB,EAAM,aAAa,oBACnB,IAAI,KAAa,CAClB;AACD,MAAK,KAAK,GAAG,EAAU;KACvB;GAEF,IAAM,IAAY,EAAe;AACjC,GAAI,KACF,EAAK,KAAK;IACR,UAAU;IACV,cAAc,EAAS;IACvB,OAAO;IACP,QAAQ;IACR,UAAU;IACV,eAAe,EAAS,aAAa;IACrC,YAAY;IACZ,WAAW;IACZ,CAAC;;AAGN,SAAO;;GAER;CAAC;CAAM;CAAQ;CAAa;CAAc;CAAU;CAAe,CAE/D"}

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

@@ -1 +1 @@
-{"version":3,"file":"useTreeOperationsWithDirectFetch.js","names":[],"sources":["../../../../src/components/EntityTreeTable/hooks/useTreeOperationsWithDirectFetch.ts"],"sourcesContent":["import { useCallback } from 'react'\nimport { EntityBundleRow } from '../EntityTreeTable'\nimport { TreeNode } from './useEntityTreeState'\nimport { useQueryClient } from '@tanstack/react-query'\nimport { useSynapseContext } from '@/utils/context/SynapseContext'\nimport SynapseClient from '@/synapse-client'\nimport { EntityType } from '@sage-bionetworks/synapse-client'\nimport {\n  EntityHeader,\n  SortBy,\n  Direction,\n} from '@sage-bionetworks/synapse-types'\nimport {\n  convertToEntityType,\n  isContainerType,\n} from '@/utils/functions/EntityTypeUtils'\nimport { omit } from 'lodash-es'\n\nconst includeTypes: EntityType[] = [\n  EntityType.folder,\n  EntityType.file,\n  EntityType.link,\n  EntityType.recordset,\n]\n\nexport const useTreeOperationsWithDirectFetch = (\n  expanded: Record<string, boolean>,\n  setExpanded: (value: React.SetStateAction<Record<string, boolean>>) => void,\n  tree: Record<string, TreeNode>,\n  setTree: (value: React.SetStateAction<Record<string, TreeNode>>) => void,\n  loadedChildren: Set<string>,\n  setLoadedChildren: (value: React.SetStateAction<Set<string>>) => void,\n  loadingIds: Set<string>,\n  setLoadingIds: (value: React.SetStateAction<Set<string>>) => void,\n  setNextPageTokens: (\n    value: React.SetStateAction<Record<string, string | undefined>>,\n  ) => void,\n  setLoadingPageTokens: (\n    value: React.SetStateAction<Record<string, string | undefined>>,\n  ) => void,\n  loadingPageTokens: Record<string, string | undefined>,\n  nextPageTokens: Record<string, string | undefined>,\n  sortBy?: SortBy,\n  sortDirection?: Direction,\n) => {\n  const queryClient = useQueryClient()\n  const { accessToken, keyFactory } = useSynapseContext()\n\n  // Helper function to convert EntityHeaders to TreeNodes\n  const createTreeNodes = useCallback(\n    (\n      entityHeaders: EntityHeader[],\n      parentId: string,\n      parentDepth: number,\n    ): TreeNode[] => {\n      return entityHeaders.map((eh: EntityHeader) => ({\n        entityHeader: eh,\n        parentId,\n        depth: parentDepth + 1,\n        isLeaf: !isContainerType(convertToEntityType(eh.type)),\n      }))\n    },\n    [],\n  )\n\n  // Helper function to clean up loading state on error\n  const cleanupLoadingState = useCallback(\n    (entityId: string, pageToken?: string) => {\n      setLoadingIds(prev => {\n        const next = new Set(prev)\n        next.delete(entityId)\n        return next\n      })\n\n      if (pageToken !== undefined) {\n        setLoadingPageTokens(prev => {\n          return omit(prev, [entityId])\n        })\n      }\n    },\n    [setLoadingIds, setLoadingPageTokens],\n  )\n\n  // Helper function to fetch entity children\n  const fetchEntityChildren = useCallback(\n    async (entityId: string, pageToken?: string) => {\n      const entityChildrenRequest = {\n        parentId: entityId,\n        includeTypes,\n        ...(pageToken && { nextPageToken: pageToken }),\n        sortBy,\n        sortDirection,\n      }\n\n      return await queryClient.fetchQuery({\n        queryKey: keyFactory.getEntityChildrenQueryKey(\n          entityChildrenRequest,\n          false,\n        ),\n        queryFn: () =>\n          SynapseClient.getEntityChildren(entityChildrenRequest, accessToken),\n      })\n    },\n    [queryClient, keyFactory, accessToken, sortBy, sortDirection],\n  )\n\n  // Callback to handle when children are loaded - moved before handleToggleExpanded to fix dependency order\n  const handleChildrenLoaded = useCallback(\n    (entityId: string, children: TreeNode[], nextPageToken?: string) => {\n      setTree(prev => {\n        const node = prev[entityId]\n        if (node) {\n          // Set correct depth for child nodes\n          const childNodesWithDepth = children.map(child => ({\n            ...child,\n            depth: node.depth + 1,\n          }))\n\n          const mergedChildren = [\n            ...(node.children || []),\n            ...childNodesWithDepth,\n          ]\n\n          // Merge children into the tree mapping while preserving existing\n          // subtree entries for those children (so expanding deeper nodes\n          // isn't lost when siblings are added).\n          const mergedChildEntries = Object.fromEntries(\n            mergedChildren.map(child => {\n              const existing = prev[child.entityHeader.id]\n              const merged = {\n                ...existing,\n                ...child,\n                depth: child.depth,\n                parentId: child.parentId,\n                isLeaf: child.isLeaf,\n              }\n\n              return [child.entityHeader.id, merged]\n            }),\n          )\n\n          return {\n            ...prev,\n            [entityId]: {\n              ...node,\n              children: mergedChildren,\n            },\n            ...mergedChildEntries,\n          }\n        }\n        return prev\n      })\n\n      // store nextPageToken for this parent (if any)\n      setNextPageTokens(prev => ({ ...prev, [entityId]: nextPageToken }))\n      // clear the loading page token entry for this parent since the\n      // requested page has completed (this prevents any remaining loading state)\n      setLoadingPageTokens(prev => {\n        return omit(prev, [entityId])\n      })\n\n      setLoadingIds(prev => {\n        const next = new Set(prev)\n        next.delete(entityId)\n        return next\n      })\n\n      // mark as loaded only if there is no next page token (i.e., fully loaded)\n      if (!nextPageToken) {\n        setLoadedChildren(prev => new Set(prev).add(entityId))\n      }\n    },\n    [\n      loadingPageTokens,\n      setTree,\n      setNextPageTokens,\n      setLoadingPageTokens,\n      setLoadingIds,\n      setLoadedChildren,\n    ],\n  )\n\n  // Handler for expanding nodes - handles fetching children\n  const handleToggleExpanded = useCallback(\n    async (entityId: string) => {\n      const isCurrentlyExpanded = expanded[entityId]\n\n      setExpanded(prev => ({\n        ...prev,\n        [entityId]: !prev[entityId],\n      }))\n\n      // If expanding and children haven't been loaded yet, fetch them directly\n      if (\n        !isCurrentlyExpanded &&\n        !loadedChildren.has(entityId) &&\n        !loadingIds.has(entityId)\n      ) {\n        const node = tree[entityId]\n        if (node && !node.isLeaf) {\n          setLoadingIds(prev => new Set(prev).add(entityId))\n\n          try {\n            const children = await fetchEntityChildren(entityId)\n            const childNodes = createTreeNodes(\n              children.page,\n              entityId,\n              node.depth,\n            )\n            handleChildrenLoaded(entityId, childNodes, children.nextPageToken)\n          } catch (error) {\n            console.error(\n              'Failed to fetch children for entity:',\n              entityId,\n              error,\n            )\n            cleanupLoadingState(entityId)\n          }\n        }\n      }\n    },\n    [\n      expanded,\n      loadedChildren,\n      tree,\n      setExpanded,\n      setLoadingIds,\n      fetchEntityChildren,\n      createTreeNodes,\n      handleChildrenLoaded,\n      cleanupLoadingState,\n    ],\n  )\n\n  const loadMoreChildren = useCallback(\n    async (entityId: string, pageToken?: string) => {\n      // set which page token is being requested for this parent and mark loading\n      setLoadingPageTokens(prev => ({ ...prev, [entityId]: pageToken }))\n      setLoadingIds(prev => new Set(prev).add(entityId))\n\n      try {\n        const children = await fetchEntityChildren(entityId, pageToken)\n        const node = tree[entityId]\n        const childNodes = createTreeNodes(\n          children.page,\n          entityId,\n          node ? node.depth : -1,\n        )\n        handleChildrenLoaded(entityId, childNodes, children.nextPageToken)\n      } catch (error) {\n        console.error(\n          'Failed to load more children for entity:',\n          entityId,\n          error,\n        )\n        cleanupLoadingState(entityId, pageToken)\n      }\n    },\n    [\n      setLoadingPageTokens,\n      setLoadingIds,\n      fetchEntityChildren,\n      createTreeNodes,\n      tree,\n      handleChildrenLoaded,\n      cleanupLoadingState,\n    ],\n  )\n\n  // Flatten tree for table rows. Track visited node ids to avoid cycles and\n  // duplicate rows when the same entity appears multiple times in the\n  // traversal (links, cycles, or bad/multiple parent relationships).\n  const flattenTree = useCallback(\n    (nodeId: string, visited = new Set<string>()): EntityBundleRow[] => {\n      // Prevent revisiting the same node and producing duplicate rows\n      if (visited.has(nodeId)) return []\n      visited.add(nodeId)\n\n      const node = tree[nodeId]\n      if (!node) return []\n\n      const rows: EntityBundleRow[] = [\n        {\n          entityId: node.entityHeader.id,\n          entityHeader: node.entityHeader,\n          depth: node.depth,\n          isLeaf: node.isLeaf,\n          parentId: node.parentId,\n          versionNumber: node.entityHeader.versionNumber,\n        },\n      ]\n\n      if (expanded[node.entityHeader.id] && node.children) {\n        node.children.forEach(child => {\n          rows.push(...flattenTree(child.entityHeader.id, visited))\n        })\n        // If there is a next page token for this node, add a synthetic 'Load more' row\n        const nextToken = nextPageTokens[node.entityHeader.id]\n\n        if (nextToken) {\n          rows.push({\n            entityId: '', // Empty placeholder for load more rows\n            entityHeader: node.entityHeader,\n            depth: node.depth + 1,\n            isLeaf: true,\n            parentId: node.entityHeader.id,\n            versionNumber: node.entityHeader.versionNumber,\n            isLoadMore: true,\n            pageToken: nextToken,\n          })\n        }\n      }\n      return rows\n    },\n    [expanded, tree, nextPageTokens],\n  )\n\n  return {\n    handleToggleExpanded,\n    handleChildrenLoaded,\n    loadMoreChildren,\n    flattenTree,\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"useTreeOperationsWithDirectFetch.js","names":[],"sources":["../../../../src/components/EntityTreeTable/hooks/useTreeOperationsWithDirectFetch.ts"],"sourcesContent":["import { useCallback } from 'react'\nimport { EntityBundleRow } from '../EntityTreeTable'\nimport { TreeNode } from './useEntityTreeState'\nimport { useQueryClient } from '@tanstack/react-query'\nimport { useSynapseContext } from '@/utils/context/SynapseContext'\nimport SynapseClient from '@/synapse-client'\nimport { EntityType } from '@sage-bionetworks/synapse-client'\nimport {\n  EntityHeader,\n  SortBy,\n  Direction,\n} from '@sage-bionetworks/synapse-types'\nimport {\n  convertToEntityType,\n  isContainerType,\n} from '@/utils/functions/EntityTypeUtils'\nimport { omit } from 'lodash-es'\n\nconst includeTypes: EntityType[] = [\n  EntityType.folder,\n  EntityType.file,\n  EntityType.link,\n  EntityType.recordset,\n]\n\nexport const useTreeOperationsWithDirectFetch = (\n  expanded: Record<string, boolean>,\n  setExpanded: (value: React.SetStateAction<Record<string, boolean>>) => void,\n  tree: Record<string, TreeNode>,\n  setTree: (value: React.SetStateAction<Record<string, TreeNode>>) => void,\n  loadedChildren: Set<string>,\n  setLoadedChildren: (value: React.SetStateAction<Set<string>>) => void,\n  loadingIds: Set<string>,\n  setLoadingIds: (value: React.SetStateAction<Set<string>>) => void,\n  setNextPageTokens: (\n    value: React.SetStateAction<Record<string, string | undefined>>,\n  ) => void,\n  setLoadingPageTokens: (\n    value: React.SetStateAction<Record<string, string | undefined>>,\n  ) => void,\n  loadingPageTokens: Record<string, string | undefined>,\n  nextPageTokens: Record<string, string | undefined>,\n  sortBy?: SortBy,\n  sortDirection?: Direction,\n) => {\n  const queryClient = useQueryClient()\n  const { accessToken, keyFactory } = useSynapseContext()\n\n  // Helper function to convert EntityHeaders to TreeNodes\n  const createTreeNodes = useCallback(\n    (\n      entityHeaders: EntityHeader[],\n      parentId: string,\n      parentDepth: number,\n    ): TreeNode[] => {\n      return entityHeaders.map((eh: EntityHeader) => ({\n        entityHeader: eh,\n        parentId,\n        depth: parentDepth + 1,\n        isLeaf: !isContainerType(convertToEntityType(eh.type)),\n      }))\n    },\n    [],\n  )\n\n  // Helper function to clean up loading state on error\n  const cleanupLoadingState = useCallback(\n    (entityId: string, pageToken?: string) => {\n      setLoadingIds(prev => {\n        const next = new Set(prev)\n        next.delete(entityId)\n        return next\n      })\n\n      if (pageToken !== undefined) {\n        setLoadingPageTokens(prev => {\n          return omit(prev, [entityId])\n        })\n      }\n    },\n    [setLoadingIds, setLoadingPageTokens],\n  )\n\n  // Helper function to fetch entity children\n  const fetchEntityChildren = useCallback(\n    async (entityId: string, pageToken?: string) => {\n      const entityChildrenRequest = {\n        parentId: entityId,\n        includeTypes,\n        ...(pageToken && { nextPageToken: pageToken }),\n        sortBy,\n        sortDirection,\n      }\n\n      return await queryClient.fetchQuery({\n        queryKey: keyFactory.getEntityChildrenQueryKey(\n          entityChildrenRequest,\n          false,\n        ),\n        queryFn: () =>\n          SynapseClient.getEntityChildren(entityChildrenRequest, accessToken),\n      })\n    },\n    [queryClient, keyFactory, accessToken, sortBy, sortDirection],\n  )\n\n  // Callback to handle when children are loaded - moved before handleToggleExpanded to fix dependency order\n  const handleChildrenLoaded = useCallback(\n    (entityId: string, children: TreeNode[], nextPageToken?: string) => {\n      setTree(prev => {\n        const node = prev[entityId]\n        if (node) {\n          // Set correct depth for child nodes\n          const childNodesWithDepth = children.map(child => ({\n            ...child,\n            depth: node.depth + 1,\n          }))\n\n          const mergedChildren = [\n            ...(node.children || []),\n            ...childNodesWithDepth,\n          ]\n\n          // Merge children into the tree mapping while preserving existing\n          // subtree entries for those children (so expanding deeper nodes\n          // isn't lost when siblings are added).\n          const mergedChildEntries = Object.fromEntries(\n            mergedChildren.map(child => {\n              const existing = prev[child.entityHeader.id]\n              const merged = {\n                ...existing,\n                ...child,\n                depth: child.depth,\n                parentId: child.parentId,\n                isLeaf: child.isLeaf,\n              }\n\n              return [child.entityHeader.id, merged]\n            }),\n          )\n\n          return {\n            ...prev,\n            [entityId]: {\n              ...node,\n              children: mergedChildren,\n            },\n            ...mergedChildEntries,\n          }\n        }\n        return prev\n      })\n\n      // store nextPageToken for this parent (if any)\n      setNextPageTokens(prev => ({ ...prev, [entityId]: nextPageToken }))\n      // clear the loading page token entry for this parent since the\n      // requested page has completed (this prevents any remaining loading state)\n      setLoadingPageTokens(prev => {\n        return omit(prev, [entityId])\n      })\n\n      setLoadingIds(prev => {\n        const next = new Set(prev)\n        next.delete(entityId)\n        return next\n      })\n\n      // mark as loaded only if there is no next page token (i.e., fully loaded)\n      if (!nextPageToken) {\n        setLoadedChildren(prev => new Set(prev).add(entityId))\n      }\n    },\n    [\n      loadingPageTokens,\n      setTree,\n      setNextPageTokens,\n      setLoadingPageTokens,\n      setLoadingIds,\n      setLoadedChildren,\n    ],\n  )\n\n  // Handler for expanding nodes - handles fetching children\n  const handleToggleExpanded = useCallback(\n    async (entityId: string) => {\n      const isCurrentlyExpanded = expanded[entityId]\n\n      setExpanded(prev => ({\n        ...prev,\n        [entityId]: !prev[entityId],\n      }))\n\n      // If expanding and children haven't been loaded yet, fetch them directly\n      if (\n        !isCurrentlyExpanded &&\n        !loadedChildren.has(entityId) &&\n        !loadingIds.has(entityId)\n      ) {\n        const node = tree[entityId]\n        if (node && !node.isLeaf) {\n          setLoadingIds(prev => new Set(prev).add(entityId))\n\n          try {\n            const children = await fetchEntityChildren(entityId)\n            const childNodes = createTreeNodes(\n              children.page,\n              entityId,\n              node.depth,\n            )\n            handleChildrenLoaded(entityId, childNodes, children.nextPageToken)\n          } catch (error) {\n            console.error(\n              'Failed to fetch children for entity:',\n              entityId,\n              error,\n            )\n            cleanupLoadingState(entityId)\n          }\n        }\n      }\n    },\n    [\n      expanded,\n      loadedChildren,\n      tree,\n      setExpanded,\n      setLoadingIds,\n      fetchEntityChildren,\n      createTreeNodes,\n      handleChildrenLoaded,\n      cleanupLoadingState,\n    ],\n  )\n\n  const loadMoreChildren = useCallback(\n    async (entityId: string, pageToken?: string) => {\n      // set which page token is being requested for this parent and mark loading\n      setLoadingPageTokens(prev => ({ ...prev, [entityId]: pageToken }))\n      setLoadingIds(prev => new Set(prev).add(entityId))\n\n      try {\n        const children = await fetchEntityChildren(entityId, pageToken)\n        const node = tree[entityId]\n        const childNodes = createTreeNodes(\n          children.page,\n          entityId,\n          node ? node.depth : -1,\n        )\n        handleChildrenLoaded(entityId, childNodes, children.nextPageToken)\n      } catch (error) {\n        console.error(\n          'Failed to load more children for entity:',\n          entityId,\n          error,\n        )\n        cleanupLoadingState(entityId, pageToken)\n      }\n    },\n    [\n      setLoadingPageTokens,\n      setLoadingIds,\n      fetchEntityChildren,\n      createTreeNodes,\n      tree,\n      handleChildrenLoaded,\n      cleanupLoadingState,\n    ],\n  )\n\n  // Flatten tree for table rows. Track visited node ids to avoid cycles and\n  // duplicate rows when the same entity appears multiple times in the\n  // traversal (links, cycles, or bad/multiple parent relationships).\n  const flattenTree = useCallback(\n    (nodeId: string, visited = new Set<string>()): EntityBundleRow[] => {\n      // Prevent revisiting the same node and producing duplicate rows\n      if (visited.has(nodeId)) return []\n      visited.add(nodeId)\n\n      const node = tree[nodeId]\n      if (!node) return []\n\n      const rows: EntityBundleRow[] = [\n        {\n          entityId: node.entityHeader.id,\n          entityHeader: node.entityHeader,\n          depth: node.depth,\n          isLeaf: node.isLeaf,\n          parentId: node.parentId,\n          versionNumber: node.entityHeader.versionNumber,\n        },\n      ]\n\n      if (expanded[node.entityHeader.id] && node.children) {\n        node.children.forEach(child => {\n          rows.push(...flattenTree(child.entityHeader.id, visited))\n        })\n        // If there is a next page token for this node, add a synthetic 'Load more' row\n        const nextToken = nextPageTokens[node.entityHeader.id]\n\n        if (nextToken) {\n          rows.push({\n            entityId: '', // Empty placeholder for load more rows\n            entityHeader: node.entityHeader,\n            depth: node.depth + 1,\n            isLeaf: true,\n            parentId: node.entityHeader.id,\n            versionNumber: node.entityHeader.versionNumber,\n            isLoadMore: true,\n            pageToken: nextToken,\n          })\n        }\n      }\n      return rows\n    },\n    [expanded, tree, nextPageTokens],\n  )\n\n  return {\n    handleToggleExpanded,\n    handleChildrenLoaded,\n    loadMoreChildren,\n    flattenTree,\n  }\n}\n"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"EntityUpload.js","names":[],"sources":["../../../src/components/EntityUpload/EntityUpload.tsx"],"sourcesContent":["import MultiFileUploadProgress from '@/components/file/upload/MultiFileUploadProgress'\nimport UploadFilePanel from '@/components/file/upload/UploadFilePanel'\nimport { SYNAPSE_STORAGE_LOCATION_ID } from '@/synapse-client/index'\nimport { useGetDefaultUploadDestination, useGetEntity } from '@/synapse-queries'\nimport { getUploadDestinationString } from '@/utils/functions/FileHandleUtils'\nimport {\n  EntityUploaderState,\n  useUploadFileEntities,\n} from '@/utils/hooks/useUploadFileEntity/useUploadFileEntities'\nimport { Typography } from '@mui/material'\nimport { noop } from 'lodash-es'\nimport {\n  ForwardedRef,\n  forwardRef,\n  useEffect,\n  useImperativeHandle,\n  useState,\n} from 'react'\nimport FullWidthAlert from '../FullWidthAlert/FullWidthAlert'\nimport { displayToast } from '../ToastMessage/ToastMessage'\nimport { EntityUploadPromptDialog } from './EntityUploadPromptDialog'\nimport { ExternalObjectStoreCredentialsForm } from './ExternalObjectStoreCredentialsForm'\nimport { ProjectStorageLimitAlert } from './ProjectStorageLimitAlert'\n\nexport type EntityUploadProps = {\n  /** The ID of the entity to upload to. If this is a container, file(s) will be added as children. If this is a\n   * FileEntity, then a file may be uploaded as a new version */\n  entityId: string\n  /** Callback that is invoked when the state of the uploader changes */\n  onStateChange?: (state: EntityUploaderState) => void\n  /** Callback that is invoked when component is ready to upload */\n  onUploadReady?: () => void\n}\n\nexport type EntityUploadHandle = {\n  /** Programmatically add files to the upload (e.g. on drag & drop) */\n  handleUploads: (fileList: ArrayLike<File>) => void\n}\n\nexport const EntityUpload = forwardRef(function EntityUpload(\n  props: EntityUploadProps,\n  ref: ForwardedRef<EntityUploadHandle>,\n) {\n  const { entityId, onStateChange = noop, onUploadReady = noop } = props\n\n  const { data: entity, isLoading: isLoadingEntity } = useGetEntity(entityId)\n\n  const isFileEntity =\n    entity?.concreteType === 'org.sagebionetworks.repo.model.FileEntity'\n\n  const { data: uploadDestination, isLoading: isLoadingUploadDestination } =\n    useGetDefaultUploadDestination(entityId)\n  const isLoading = isLoadingEntity || isLoadingUploadDestination\n\n  const [accessKey, setAccessKey] = useState('')\n  const [secretKey, setSecretKey] = useState('')\n\n  const [didUploadsExceedStorageLimit, setDidUploadsExceedStorageLimit] =\n    useState(false)\n\n  const {\n    initiateUpload,\n    state,\n    uploadProgress,\n    activePrompts,\n    isPrecheckingUpload,\n    isUploadReady,\n  } = useUploadFileEntities(entityId, accessKey, secretKey, () =>\n    setDidUploadsExceedStorageLimit(true),\n  )\n\n  useEffect(() => {\n    onStateChange(state)\n  }, [state, onStateChange])\n\n  useEffect(() => {\n    if (isUploadReady) {\n      onUploadReady()\n    }\n  }, [isUploadReady, onUploadReady])\n\n  function uploadFileList(fileList: ArrayLike<File>) {\n    if (uploadDestination?.projectStorageLocationUsage?.isOverLimit) {\n      displayToast(\n        'Cannot upload files because the storage limit has been exceeded.',\n        'danger',\n      )\n      return\n    }\n    const args = Array.from(fileList).map(file => {\n      if (isFileEntity) {\n        return { file, existingEntityId: entityId }\n      }\n      return {\n        file,\n        rootContainerId: entityId,\n      }\n    })\n    initiateUpload(args)\n  }\n\n  useImperativeHandle(ref, () => ({\n    handleUploads: uploadFileList,\n  }))\n\n  const showLoading = isPrecheckingUpload || isLoading\n  const loadingText = isPrecheckingUpload\n    ? 'Preparing files for upload...'\n    : 'Loading...'\n\n  return (\n    <div>\n      <EntityUploadPromptDialog activePrompts={activePrompts} />\n      {uploadDestination?.projectStorageLocationUsage && (\n        <ProjectStorageLimitAlert\n          usage={uploadDestination.projectStorageLocationUsage}\n          didUploadsExceedLimit={didUploadsExceedStorageLimit}\n        />\n      )}\n      <ExternalObjectStoreCredentialsForm\n        uploadDestination={uploadDestination}\n        accessKey={accessKey}\n        setAccessKey={setAccessKey}\n        secretKey={secretKey}\n        setSecretKey={setSecretKey}\n      />\n      <UploadFilePanel\n        onUploadFileList={uploadFileList}\n        allowMultipleFiles={!isFileEntity}\n        isLoading={showLoading}\n        loadingText={loadingText}\n        disabled={uploadDestination?.projectStorageLocationUsage?.isOverLimit}\n        message={\n          <>\n            <Typography variant={'smallText1'}>\n              All uploaded files will be stored in\n              {uploadDestination?.storageLocationId ===\n                SYNAPSE_STORAGE_LOCATION_ID && ' Synapse storage'}\n              {uploadDestination &&\n                uploadDestination?.storageLocationId !==\n                  SYNAPSE_STORAGE_LOCATION_ID && (\n                  <>\n                    :<br />\n                    {getUploadDestinationString(uploadDestination)}\n                  </>\n                )}\n            </Typography>\n            {uploadDestination && uploadDestination.banner && (\n              <FullWidthAlert\n                sx={{\n                  textAlign: 'left',\n                }}\n                isGlobal={false}\n                title={'Storage Location Message'}\n                description={uploadDestination.banner}\n                variant={'info'}\n              />\n            )}\n          </>\n        }\n      />\n      <MultiFileUploadProgress\n        uploaderState={state}\n        uploadProgress={uploadProgress}\n      />\n    </div>\n  )\n})\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAuCA,IAAa,IAAe,EAAW,SACrC,GACA,GACA;CACA,IAAM,EAAE,aAAU,mBAAgB,GAAM,mBAAgB,MAAS,GAE3D,EAAE,MAAM,GAAQ,WAAW,MAAoB,EAAa,EAAS,EAErE,IACJ,GAAQ,iBAAiB,6CAErB,EAAE,MAAM,GAAmB,WAAW,MAC1C,EAA+B,EAAS,EACpC,IAAY,KAAmB,GAE/B,CAAC,GAAW,KAAgB,EAAS,GAAG,EACxC,CAAC,GAAW,KAAgB,EAAS,GAAG,EAExC,CAAC,GAA8B,KACnC,EAAS,GAAM,EAEX,EACJ,mBACA,UACA,mBACA,kBACA,wBACA,qBACE,EAAsB,GAAU,GAAW,SAC7C,EAAgC,GAAK,CACtC;AAMD,CAJA,QAAgB;AACd,IAAc,EAAM;IACnB,CAAC,GAAO,EAAc,CAAC,EAE1B,QAAgB;AACd,EAAI,KACF,GAAe;IAEhB,CAAC,GAAe,EAAc,CAAC;CAElC,SAAS,EAAe,GAA2B;AACjD,MAAI,GAAmB,6BAA6B,aAAa;AAC/D,KACE,oEACA,SACD;AACD;;AAWF,IATa,MAAM,KAAK,EAAS,CAAC,KAAI,MAChC,IACK;GAAE;GAAM,kBAAkB;GAAU,GAEtC;GACL;GACA,iBAAiB;GAClB,CACD,CACkB;;AAGtB,GAAoB,UAAY,EAC9B,eAAe,GAChB,EAAE;CAEH,IAAM,IAAc,KAAuB,GACrC,IAAc,IAChB,kCACA;AAEJ,QACE,kBAAC,OAAD,EAAA,UAAA;EACE,kBAAC,GAAD,EAAyC,kBAAiB,CAAA;EACzD,GAAmB,+BAClB,kBAAC,GAAD;GACE,OAAO,EAAkB;GACzB,uBAAuB;GACvB,CAAA;EAEJ,kBAAC,GAAD;GACqB;GACR;GACG;GACH;GACG;GACd,CAAA;EACF,kBAAC,GAAD;GACE,kBAAkB;GAClB,oBAAoB,CAAC;GACrB,WAAW;GACE;GACb,UAAU,GAAmB,6BAA6B;GAC1D,SACE,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;IAAY,SAAS;cAArB;KAAmC;KAEhC,GAAmB,sBAAA,KACa;KAChC,KACC,GAAmB,sBAAA,KAEjB,kBAAA,GAAA,EAAA,UAAA;MAAE;MACC,kBAAC,MAAD,EAAM,CAAA;MACN,EAA2B,EAAkB;MAC7C,EAAA,CAAA;KAEI;OACZ,KAAqB,EAAkB,UACtC,kBAAC,GAAD;IACE,IAAI,EACF,WAAW,QACZ;IACD,UAAU;IACV,OAAO;IACP,aAAa,EAAkB;IAC/B,SAAS;IACT,CAAA,CAEH,EAAA,CAAA;GAEL,CAAA;EACF,kBAAC,GAAD;GACE,eAAe;GACC;GAChB,CAAA;EACE,EAAA,CAAA;EAER"}
+{"version":3,"file":"EntityUpload.js","names":[],"sources":["../../../src/components/EntityUpload/EntityUpload.tsx"],"sourcesContent":["import MultiFileUploadProgress from '@/components/file/upload/MultiFileUploadProgress'\nimport UploadFilePanel from '@/components/file/upload/UploadFilePanel'\nimport { SYNAPSE_STORAGE_LOCATION_ID } from '@/synapse-client/index'\nimport { useGetDefaultUploadDestination, useGetEntity } from '@/synapse-queries'\nimport { getUploadDestinationString } from '@/utils/functions/FileHandleUtils'\nimport {\n  EntityUploaderState,\n  useUploadFileEntities,\n} from '@/utils/hooks/useUploadFileEntity/useUploadFileEntities'\nimport { Typography } from '@mui/material'\nimport { noop } from 'lodash-es'\nimport {\n  ForwardedRef,\n  forwardRef,\n  useEffect,\n  useImperativeHandle,\n  useState,\n} from 'react'\nimport FullWidthAlert from '../FullWidthAlert/FullWidthAlert'\nimport { displayToast } from '../ToastMessage/ToastMessage'\nimport { EntityUploadPromptDialog } from './EntityUploadPromptDialog'\nimport { ExternalObjectStoreCredentialsForm } from './ExternalObjectStoreCredentialsForm'\nimport { ProjectStorageLimitAlert } from './ProjectStorageLimitAlert'\n\nexport type EntityUploadProps = {\n  /** The ID of the entity to upload to. If this is a container, file(s) will be added as children. If this is a\n   * FileEntity, then a file may be uploaded as a new version */\n  entityId: string\n  /** Callback that is invoked when the state of the uploader changes */\n  onStateChange?: (state: EntityUploaderState) => void\n  /** Callback that is invoked when component is ready to upload */\n  onUploadReady?: () => void\n}\n\nexport type EntityUploadHandle = {\n  /** Programmatically add files to the upload (e.g. on drag & drop) */\n  handleUploads: (fileList: ArrayLike<File>) => void\n}\n\nexport const EntityUpload = forwardRef(function EntityUpload(\n  props: EntityUploadProps,\n  ref: ForwardedRef<EntityUploadHandle>,\n) {\n  const { entityId, onStateChange = noop, onUploadReady = noop } = props\n\n  const { data: entity, isLoading: isLoadingEntity } = useGetEntity(entityId)\n\n  const isFileEntity =\n    entity?.concreteType === 'org.sagebionetworks.repo.model.FileEntity'\n\n  const { data: uploadDestination, isLoading: isLoadingUploadDestination } =\n    useGetDefaultUploadDestination(entityId)\n  const isLoading = isLoadingEntity || isLoadingUploadDestination\n\n  const [accessKey, setAccessKey] = useState('')\n  const [secretKey, setSecretKey] = useState('')\n\n  const [didUploadsExceedStorageLimit, setDidUploadsExceedStorageLimit] =\n    useState(false)\n\n  const {\n    initiateUpload,\n    state,\n    uploadProgress,\n    activePrompts,\n    isPrecheckingUpload,\n    isUploadReady,\n  } = useUploadFileEntities(entityId, accessKey, secretKey, () =>\n    setDidUploadsExceedStorageLimit(true),\n  )\n\n  useEffect(() => {\n    onStateChange(state)\n  }, [state, onStateChange])\n\n  useEffect(() => {\n    if (isUploadReady) {\n      onUploadReady()\n    }\n  }, [isUploadReady, onUploadReady])\n\n  function uploadFileList(fileList: ArrayLike<File>) {\n    if (uploadDestination?.projectStorageLocationUsage?.isOverLimit) {\n      displayToast(\n        'Cannot upload files because the storage limit has been exceeded.',\n        'danger',\n      )\n      return\n    }\n    const args = Array.from(fileList).map(file => {\n      if (isFileEntity) {\n        return { file, existingEntityId: entityId }\n      }\n      return {\n        file,\n        rootContainerId: entityId,\n      }\n    })\n    initiateUpload(args)\n  }\n\n  useImperativeHandle(ref, () => ({\n    handleUploads: uploadFileList,\n  }))\n\n  const showLoading = isPrecheckingUpload || isLoading\n  const loadingText = isPrecheckingUpload\n    ? 'Preparing files for upload...'\n    : 'Loading...'\n\n  return (\n    <div>\n      <EntityUploadPromptDialog activePrompts={activePrompts} />\n      {uploadDestination?.projectStorageLocationUsage && (\n        <ProjectStorageLimitAlert\n          usage={uploadDestination.projectStorageLocationUsage}\n          didUploadsExceedLimit={didUploadsExceedStorageLimit}\n        />\n      )}\n      <ExternalObjectStoreCredentialsForm\n        uploadDestination={uploadDestination}\n        accessKey={accessKey}\n        setAccessKey={setAccessKey}\n        secretKey={secretKey}\n        setSecretKey={setSecretKey}\n      />\n      <UploadFilePanel\n        onUploadFileList={uploadFileList}\n        allowMultipleFiles={!isFileEntity}\n        isLoading={showLoading}\n        loadingText={loadingText}\n        disabled={uploadDestination?.projectStorageLocationUsage?.isOverLimit}\n        message={\n          <>\n            <Typography variant={'smallText1'}>\n              All uploaded files will be stored in\n              {uploadDestination?.storageLocationId ===\n                SYNAPSE_STORAGE_LOCATION_ID && ' Synapse storage'}\n              {uploadDestination &&\n                uploadDestination?.storageLocationId !==\n                  SYNAPSE_STORAGE_LOCATION_ID && (\n                  <>\n                    :<br />\n                    {getUploadDestinationString(uploadDestination)}\n                  </>\n                )}\n            </Typography>\n            {uploadDestination && uploadDestination.banner && (\n              <FullWidthAlert\n                sx={{\n                  textAlign: 'left',\n                }}\n                isGlobal={false}\n                title={'Storage Location Message'}\n                description={uploadDestination.banner}\n                variant={'info'}\n              />\n            )}\n          </>\n        }\n      />\n      <MultiFileUploadProgress\n        uploaderState={state}\n        uploadProgress={uploadProgress}\n      />\n    </div>\n  )\n})\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAuCA,IAAa,IAAe,EAAW,SACrC,GACA,GACA;CACA,IAAM,EAAE,aAAU,mBAAgB,GAAM,mBAAgB,MAAS,GAE3D,EAAE,MAAM,GAAQ,WAAW,MAAoB,EAAa,EAAS,EAErE,IACJ,GAAQ,iBAAiB,6CAErB,EAAE,MAAM,GAAmB,WAAW,MAC1C,EAA+B,EAAS,EACpC,IAAY,KAAmB,GAE/B,CAAC,GAAW,KAAgB,EAAS,GAAG,EACxC,CAAC,GAAW,KAAgB,EAAS,GAAG,EAExC,CAAC,GAA8B,KACnC,EAAS,GAAM,EAEX,EACJ,mBACA,UACA,mBACA,kBACA,wBACA,qBACE,EAAsB,GAAU,GAAW,SAC7C,EAAgC,GAAK,CACtC;AAMD,CAJA,QAAgB;AACd,IAAc,EAAM;IACnB,CAAC,GAAO,EAAc,CAAC,EAE1B,QAAgB;AACd,EAAI,KACF,GAAe;IAEhB,CAAC,GAAe,EAAc,CAAC;CAElC,SAAS,EAAe,GAA2B;AACjD,MAAI,GAAmB,6BAA6B,aAAa;AAC/D,KACE,oEACA,SACD;AACD;;AAWF,IATa,MAAM,KAAK,EAAS,CAAC,KAAI,MAChC,IACK;GAAE;GAAM,kBAAkB;GAAU,GAEtC;GACL;GACA,iBAAiB;GAClB,CAEY,CAAK;;AAGtB,GAAoB,UAAY,EAC9B,eAAe,GAChB,EAAE;CAEH,IAAM,IAAc,KAAuB,GACrC,IAAc,IAChB,kCACA;AAEJ,QACE,kBAAC,OAAD,EAAA,UAAA;EACE,kBAAC,GAAD,EAAyC,kBAAiB,CAAA;EACzD,GAAmB,+BAClB,kBAAC,GAAD;GACE,OAAO,EAAkB;GACzB,uBAAuB;GACvB,CAAA;EAEJ,kBAAC,GAAD;GACqB;GACR;GACG;GACH;GACG;GACd,CAAA;EACF,kBAAC,GAAD;GACE,kBAAkB;GAClB,oBAAoB,CAAC;GACrB,WAAW;GACE;GACb,UAAU,GAAmB,6BAA6B;GAC1D,SACE,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;IAAY,SAAS;cAArB;KAAmC;KAEhC,GAAmB,sBAAA,KACa;KAChC,KACC,GAAmB,sBAAA,KAEjB,kBAAA,GAAA,EAAA,UAAA;MAAE;MACC,kBAAC,MAAD,EAAM,CAAA;MACN,EAA2B,EAAkB;MAC7C,EAAA,CAAA;KAEI;OACZ,KAAqB,EAAkB,UACtC,kBAAC,GAAD;IACE,IAAI,EACF,WAAW,QACZ;IACD,UAAU;IACV,OAAO;IACP,aAAa,EAAkB;IAC/B,SAAS;IACT,CAAA,CAEH,EAAA,CAAA;GAEL,CAAA;EACF,kBAAC,GAAD;GACE,eAAe;GACC;GAChB,CAAA;EACE,EAAA,CAAA;EAER"}

package/dist/components/ExperimentalMode/ExperimentalMode.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExperimentalMode.js","names":[],"sources":["../../../src/components/ExperimentalMode/ExperimentalMode.tsx"],"sourcesContent":["import { isInSynapseExperimentalMode } from '@/synapse-client/SynapseClient'\nimport { EXPERIMENTAL_MODE_COOKIE } from '@/utils/SynapseConstants'\nimport { InfoOutlined } from '@mui/icons-material'\nimport { Box, IconButton, Tooltip, Typography, useTheme } from '@mui/material'\nimport { useEffect, useState } from 'react'\nimport Switch from 'react-switch'\nimport UniversalCookies from 'universal-cookie'\n\nconst EXPERIMENTAL_MODE_SWITCH_ID = 'experimental-mode'\nconst experimentalModeText =\n  'This mode gives you early access to features that are still in development. Please note that we do not guarantee an absence of errors, and that the data created using these features may be lost during product upgrade.'\n\nexport type ExperimentalModeProps = {\n  onExperimentalModeToggle?: (newValue: boolean) => void\n}\nfunction ExperimentalMode({ onExperimentalModeToggle }: ExperimentalModeProps) {\n  const [isExperimentalModeOn, setIsExperimentalModeOn] =\n    useState<boolean>(false)\n  let mounted = true\n  const theme = useTheme()\n  useEffect(() => {\n    if (mounted) {\n      if (isInSynapseExperimentalMode()) {\n        setIsExperimentalModeOn(true)\n      }\n    }\n    return () => {\n      mounted = false\n    }\n  }, [])\n\n  const getExperimentalModeCookieOptions = () => {\n    const hostname = window.location.hostname.toLowerCase()\n    return {\n      path: '/',\n      domain: hostname.endsWith('.synapse.org') ? 'synapse.org' : undefined,\n    }\n  }\n\n  const createExperimentalModeCookie = () => {\n    const cookies = new UniversalCookies()\n    cookies.set(\n      EXPERIMENTAL_MODE_COOKIE,\n      'true',\n      getExperimentalModeCookieOptions(),\n    )\n    setIsExperimentalModeOn(true)\n    if (onExperimentalModeToggle) {\n      onExperimentalModeToggle(true)\n    }\n  }\n\n  const deleteExperimentalModeCookie = () => {\n    const cookies = new UniversalCookies()\n    cookies.remove(EXPERIMENTAL_MODE_COOKIE, getExperimentalModeCookieOptions())\n    setIsExperimentalModeOn(false)\n    if (onExperimentalModeToggle) {\n      onExperimentalModeToggle(false)\n    }\n  }\n\n  return (\n    <Box sx={{ display: 'flex', alignItems: 'center' }}>\n      <Typography\n        component={'label'}\n        variant=\"body1\"\n        htmlFor={EXPERIMENTAL_MODE_SWITCH_ID}\n      >\n        Experimental Mode\n      </Typography>\n      <Tooltip title={experimentalModeText} arrow placement=\"top\">\n        <IconButton\n          aria-label=\"info\"\n          color=\"inherit\"\n          sx={{ '&:hover': { backgroundColor: 'transparent' } }}\n        >\n          <InfoOutlined sx={{ verticalAlign: 'middle' }} />\n        </IconButton>\n      </Tooltip>\n      <Switch\n        id={EXPERIMENTAL_MODE_SWITCH_ID}\n        width={35}\n        height={20}\n        onColor={theme.palette.secondary.main}\n        checkedIcon={false}\n        uncheckedIcon={false}\n        checked={isExperimentalModeOn}\n        onChange={\n          isExperimentalModeOn\n            ? deleteExperimentalModeCookie\n            : createExperimentalModeCookie\n        }\n      />\n    </Box>\n  )\n}\n\nexport default ExperimentalMode\n"],"mappings":";;;;;;;;;AAQA,IAAM,IAA8B,qBAC9B,IACJ;AAKF,SAAS,EAAiB,EAAE,+BAAmD;CAC7E,IAAM,CAAC,GAAsB,KAC3B,EAAkB,GAAM,EACtB,IAAU,IACR,IAAQ,GAAU;AACxB,UACM,KACE,GAA6B,IAC/B,EAAwB,GAAK,QAGpB;AACX,MAAU;KAEX,EAAE,CAAC;CAEN,IAAM,WAEG;EACL,MAAM;EACN,QAHe,OAAO,SAAS,SAAS,aAAa,CAGpC,SAAS,eAAe,GAAG,gBAAgB,KAAA;EAC7D;AAyBH,QACE,kBAAC,GAAD;EAAK,IAAI;GAAE,SAAS;GAAQ,YAAY;GAAU;YAAlD;GACE,kBAAC,GAAD;IACE,WAAW;IACX,SAAQ;IACR,SAAS;cACV;IAEY,CAAA;GACb,kBAAC,GAAD;IAAS,OAAO;IAAsB,OAAA;IAAM,WAAU;cACpD,kBAAC,GAAD;KACE,cAAW;KACX,OAAM;KACN,IAAI,EAAE,WAAW,EAAE,iBAAiB,eAAe,EAAE;eAErD,kBAAC,GAAD,EAAc,IAAI,EAAE,eAAe,UAAU,EAAI,CAAA;KACtC,CAAA;IACL,CAAA;GACV,kBAAC,GAAD;IACE,IAAI;IACJ,OAAO;IACP,QAAQ;IACR,SAAS,EAAM,QAAQ,UAAU;IACjC,aAAa;IACb,eAAe;IACf,SAAS;IACT,UACE,UApCmC;AAIzC,KAHgB,IAAI,GAAkB,CAC9B,OAAO,GAA0B,GAAkC,CAAC,EAC5E,EAAwB,GAAM,EAC1B,KACF,EAAyB,GAAM;cAlBQ;AAQzC,KAPgB,IAAI,GAAkB,CAC9B,IACN,GACA,QACA,GAAkC,CACnC,EACD,EAAwB,GAAK,EACzB,KACF,EAAyB,GAAK;;IA4C5B,CAAA;GACE"}
+{"version":3,"file":"ExperimentalMode.js","names":[],"sources":["../../../src/components/ExperimentalMode/ExperimentalMode.tsx"],"sourcesContent":["import { isInSynapseExperimentalMode } from '@/synapse-client/SynapseClient'\nimport { EXPERIMENTAL_MODE_COOKIE } from '@/utils/SynapseConstants'\nimport { InfoOutlined } from '@mui/icons-material'\nimport { Box, IconButton, Tooltip, Typography, useTheme } from '@mui/material'\nimport { useEffect, useState } from 'react'\nimport Switch from 'react-switch'\nimport UniversalCookies from 'universal-cookie'\n\nconst EXPERIMENTAL_MODE_SWITCH_ID = 'experimental-mode'\nconst experimentalModeText =\n  'This mode gives you early access to features that are still in development. Please note that we do not guarantee an absence of errors, and that the data created using these features may be lost during product upgrade.'\n\nexport type ExperimentalModeProps = {\n  onExperimentalModeToggle?: (newValue: boolean) => void\n}\nfunction ExperimentalMode({ onExperimentalModeToggle }: ExperimentalModeProps) {\n  const [isExperimentalModeOn, setIsExperimentalModeOn] =\n    useState<boolean>(false)\n  let mounted = true\n  const theme = useTheme()\n  useEffect(() => {\n    if (mounted) {\n      if (isInSynapseExperimentalMode()) {\n        setIsExperimentalModeOn(true)\n      }\n    }\n    return () => {\n      mounted = false\n    }\n  }, [])\n\n  const getExperimentalModeCookieOptions = () => {\n    const hostname = window.location.hostname.toLowerCase()\n    return {\n      path: '/',\n      domain: hostname.endsWith('.synapse.org') ? 'synapse.org' : undefined,\n    }\n  }\n\n  const createExperimentalModeCookie = () => {\n    const cookies = new UniversalCookies()\n    cookies.set(\n      EXPERIMENTAL_MODE_COOKIE,\n      'true',\n      getExperimentalModeCookieOptions(),\n    )\n    setIsExperimentalModeOn(true)\n    if (onExperimentalModeToggle) {\n      onExperimentalModeToggle(true)\n    }\n  }\n\n  const deleteExperimentalModeCookie = () => {\n    const cookies = new UniversalCookies()\n    cookies.remove(EXPERIMENTAL_MODE_COOKIE, getExperimentalModeCookieOptions())\n    setIsExperimentalModeOn(false)\n    if (onExperimentalModeToggle) {\n      onExperimentalModeToggle(false)\n    }\n  }\n\n  return (\n    <Box sx={{ display: 'flex', alignItems: 'center' }}>\n      <Typography\n        component={'label'}\n        variant=\"body1\"\n        htmlFor={EXPERIMENTAL_MODE_SWITCH_ID}\n      >\n        Experimental Mode\n      </Typography>\n      <Tooltip title={experimentalModeText} arrow placement=\"top\">\n        <IconButton\n          aria-label=\"info\"\n          color=\"inherit\"\n          sx={{ '&:hover': { backgroundColor: 'transparent' } }}\n        >\n          <InfoOutlined sx={{ verticalAlign: 'middle' }} />\n        </IconButton>\n      </Tooltip>\n      <Switch\n        id={EXPERIMENTAL_MODE_SWITCH_ID}\n        width={35}\n        height={20}\n        onColor={theme.palette.secondary.main}\n        checkedIcon={false}\n        uncheckedIcon={false}\n        checked={isExperimentalModeOn}\n        onChange={\n          isExperimentalModeOn\n            ? deleteExperimentalModeCookie\n            : createExperimentalModeCookie\n        }\n      />\n    </Box>\n  )\n}\n\nexport default ExperimentalMode\n"],"mappings":";;;;;;;;;AAQA,IAAM,IAA8B,qBAC9B,IACJ;AAKF,SAAS,EAAiB,EAAE,+BAAmD;CAC7E,IAAM,CAAC,GAAsB,KAC3B,EAAkB,GAAM,EACtB,IAAU,IACR,IAAQ,GAAU;AACxB,UACM,KACE,GAA6B,IAC/B,EAAwB,GAAK,QAGpB;AACX,MAAU;KAEX,EAAE,CAAC;CAEN,IAAM,WAEG;EACL,MAAM;EACN,QAHe,OAAO,SAAS,SAAS,aAGhC,CAAS,SAAS,eAAe,GAAG,gBAAgB,KAAA;EAC7D;AAyBH,QACE,kBAAC,GAAD;EAAK,IAAI;GAAE,SAAS;GAAQ,YAAY;GAAU;YAAlD;GACE,kBAAC,GAAD;IACE,WAAW;IACX,SAAQ;IACR,SAAS;cACV;IAEY,CAAA;GACb,kBAAC,GAAD;IAAS,OAAO;IAAsB,OAAA;IAAM,WAAU;cACpD,kBAAC,GAAD;KACE,cAAW;KACX,OAAM;KACN,IAAI,EAAE,WAAW,EAAE,iBAAiB,eAAe,EAAE;eAErD,kBAAC,GAAD,EAAc,IAAI,EAAE,eAAe,UAAU,EAAI,CAAA;KACtC,CAAA;IACL,CAAA;GACV,kBAAC,GAAD;IACE,IAAI;IACJ,OAAO;IACP,QAAQ;IACR,SAAS,EAAM,QAAQ,UAAU;IACjC,aAAa;IACb,eAAe;IACf,SAAS;IACT,UACE,UApCmC;AAIzC,KAFA,IADoB,GACpB,CAAQ,OAAO,GAA0B,GAAkC,CAAC,EAC5E,EAAwB,GAAM,EAC1B,KACF,EAAyB,GAAM;cAlBQ;AAQzC,KANA,IADoB,GACpB,CAAQ,IACN,GACA,QACA,GAAkC,CACnC,EACD,EAAwB,GAAK,EACzB,KACF,EAAyB,GAAK;;IA4C5B,CAAA;GACE"}

package/dist/components/ExternalFileHandleLink/ExternalFileHandleLink.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExternalFileHandleLink.js","names":[],"sources":["../../../src/components/ExternalFileHandleLink/ExternalFileHandleLink.tsx"],"sourcesContent":["import React from 'react'\nimport SynapseClient from '@/synapse-client'\nimport { useSynapseContext } from '@/utils/context/SynapseContext'\nimport { isExternalFileHandle, isFileEntity } from '@/utils/types/IsType'\nimport { OpenInNewTwoTone } from '@mui/icons-material'\nimport {\n  BatchFileRequest,\n  ExternalFileHandle,\n  FileEntity,\n  FileHandleAssociateType,\n} from '@sage-bionetworks/synapse-types'\nimport { useEffect, useState } from 'react'\n\nexport type ExternalFileHandleLinkProps = {\n  synId: string\n  className?: string\n}\n\nexport const ExternalFileHandleLink = (\n  props: ExternalFileHandleLinkProps,\n): React.ReactNode => {\n  const { accessToken } = useSynapseContext()\n  const { synId, className } = props\n  const [data, setData] = useState<\n    | { fileEntity: FileEntity; externalFileHandle: ExternalFileHandle }\n    | undefined\n  >(undefined)\n  useEffect(() => {\n    const getEntity = async () => {\n      try {\n        const fileEntity = await SynapseClient.getEntity<FileEntity>(\n          accessToken,\n          synId,\n        )\n        if (!isFileEntity(fileEntity)) {\n          throw new Error(`File Entity expected but found ${fileEntity}`)\n        }\n        const batchFileRequest: BatchFileRequest = {\n          requestedFiles: [\n            {\n              associateObjectId: synId,\n              associateObjectType: FileHandleAssociateType.FileEntity,\n              fileHandleId: fileEntity.dataFileHandleId,\n            },\n          ],\n          includeFileHandles: true,\n          includePreSignedURLs: false,\n          includePreviewPreSignedURLs: false,\n        }\n        const file = await SynapseClient.getFiles(batchFileRequest, accessToken)\n        const externalFileHandle = file.requestedFiles[0].fileHandle\n        if (externalFileHandle && isExternalFileHandle(externalFileHandle)) {\n          setData({\n            externalFileHandle,\n            fileEntity,\n          })\n        } else {\n          throw new Error(\n            `Not an external file handle: ${externalFileHandle?.id}`,\n          )\n        }\n      } catch (e) {\n        console.error('Error on getting external file handle = ', e)\n      }\n    }\n    getEntity()\n  }, [synId, accessToken])\n\n  const externalFileHandle = data?.externalFileHandle\n  const fileEntity = data?.fileEntity\n\n  return externalFileHandle ? (\n    <a\n      href={externalFileHandle.externalURL}\n      className={className}\n      target=\"_blank\"\n      rel=\"noopener noreferrer\"\n    >\n      <span>\n        {fileEntity?.name}\n        <OpenInNewTwoTone style={{ marginLeft: 5 }} />\n      </span>\n    </a>\n  ) : (\n    <></>\n  )\n}\n"],"mappings":";;;;;;;;AAkBA,IAAa,KACX,MACoB;CACpB,IAAM,EAAE,mBAAgB,GAAmB,EACrC,EAAE,UAAO,iBAAc,GACvB,CAAC,GAAM,KAAW,EAGtB,KAAA,EAAU;AACZ,SAAgB;AAsCd,GArCkB,YAAY;AAC5B,OAAI;IACF,IAAM,IAAa,MAAM,EAAc,UACrC,GACA,EACD;AACD,QAAI,CAAC,EAAa,EAAW,CAC3B,OAAU,MAAM,kCAAkC,IAAa;IAEjE,IAAM,IAAqC;KACzC,gBAAgB,CACd;MACE,mBAAmB;MACnB,qBAAqB,EAAwB;MAC7C,cAAc,EAAW;MAC1B,CACF;KACD,oBAAoB;KACpB,sBAAsB;KACtB,6BAA6B;KAC9B,EAEK,KADO,MAAM,EAAc,SAAS,GAAkB,EAAY,EACxC,eAAe,GAAG;AAClD,QAAI,KAAsB,EAAqB,EAAmB,CAChE,GAAQ;KACN;KACA;KACD,CAAC;QAEF,OAAU,MACR,gCAAgC,GAAoB,KACrD;YAEI,GAAG;AACV,YAAQ,MAAM,4CAA4C,EAAE;;MAGrD;IACV,CAAC,GAAO,EAAY,CAAC;CAExB,IAAM,IAAqB,GAAM,oBAC3B,IAAa,GAAM;AAEzB,QAAO,IACL,kBAAC,KAAD;EACE,MAAM,EAAmB;EACd;EACX,QAAO;EACP,KAAI;YAEJ,kBAAC,QAAD,EAAA,UAAA,CACG,GAAY,MACb,kBAAC,GAAD,EAAkB,OAAO,EAAE,YAAY,GAAG,EAAI,CAAA,CACzC,EAAA,CAAA;EACL,CAAA,GAEJ,kBAAA,GAAA,EAAK,CAAA"}
+{"version":3,"file":"ExternalFileHandleLink.js","names":[],"sources":["../../../src/components/ExternalFileHandleLink/ExternalFileHandleLink.tsx"],"sourcesContent":["import React from 'react'\nimport SynapseClient from '@/synapse-client'\nimport { useSynapseContext } from '@/utils/context/SynapseContext'\nimport { isExternalFileHandle, isFileEntity } from '@/utils/types/IsType'\nimport { OpenInNewTwoTone } from '@mui/icons-material'\nimport {\n  BatchFileRequest,\n  ExternalFileHandle,\n  FileEntity,\n  FileHandleAssociateType,\n} from '@sage-bionetworks/synapse-types'\nimport { useEffect, useState } from 'react'\n\nexport type ExternalFileHandleLinkProps = {\n  synId: string\n  className?: string\n}\n\nexport const ExternalFileHandleLink = (\n  props: ExternalFileHandleLinkProps,\n): React.ReactNode => {\n  const { accessToken } = useSynapseContext()\n  const { synId, className } = props\n  const [data, setData] = useState<\n    | { fileEntity: FileEntity; externalFileHandle: ExternalFileHandle }\n    | undefined\n  >(undefined)\n  useEffect(() => {\n    const getEntity = async () => {\n      try {\n        const fileEntity = await SynapseClient.getEntity<FileEntity>(\n          accessToken,\n          synId,\n        )\n        if (!isFileEntity(fileEntity)) {\n          throw new Error(`File Entity expected but found ${fileEntity}`)\n        }\n        const batchFileRequest: BatchFileRequest = {\n          requestedFiles: [\n            {\n              associateObjectId: synId,\n              associateObjectType: FileHandleAssociateType.FileEntity,\n              fileHandleId: fileEntity.dataFileHandleId,\n            },\n          ],\n          includeFileHandles: true,\n          includePreSignedURLs: false,\n          includePreviewPreSignedURLs: false,\n        }\n        const file = await SynapseClient.getFiles(batchFileRequest, accessToken)\n        const externalFileHandle = file.requestedFiles[0].fileHandle\n        if (externalFileHandle && isExternalFileHandle(externalFileHandle)) {\n          setData({\n            externalFileHandle,\n            fileEntity,\n          })\n        } else {\n          throw new Error(\n            `Not an external file handle: ${externalFileHandle?.id}`,\n          )\n        }\n      } catch (e) {\n        console.error('Error on getting external file handle = ', e)\n      }\n    }\n    getEntity()\n  }, [synId, accessToken])\n\n  const externalFileHandle = data?.externalFileHandle\n  const fileEntity = data?.fileEntity\n\n  return externalFileHandle ? (\n    <a\n      href={externalFileHandle.externalURL}\n      className={className}\n      target=\"_blank\"\n      rel=\"noopener noreferrer\"\n    >\n      <span>\n        {fileEntity?.name}\n        <OpenInNewTwoTone style={{ marginLeft: 5 }} />\n      </span>\n    </a>\n  ) : (\n    <></>\n  )\n}\n"],"mappings":";;;;;;;;AAkBA,IAAa,KACX,MACoB;CACpB,IAAM,EAAE,mBAAgB,GAAmB,EACrC,EAAE,UAAO,iBAAc,GACvB,CAAC,GAAM,KAAW,EAGtB,KAAA,EAAU;AACZ,SAAgB;AAsCd,eArC8B;AAC5B,OAAI;IACF,IAAM,IAAa,MAAM,EAAc,UACrC,GACA,EACD;AACD,QAAI,CAAC,EAAa,EAAW,CAC3B,OAAU,MAAM,kCAAkC,IAAa;IAEjE,IAAM,IAAqC;KACzC,gBAAgB,CACd;MACE,mBAAmB;MACnB,qBAAqB,EAAwB;MAC7C,cAAc,EAAW;MAC1B,CACF;KACD,oBAAoB;KACpB,sBAAsB;KACtB,6BAA6B;KAC9B,EAEK,KAAqB,MADR,EAAc,SAAS,GAAkB,EAAY,EACxC,eAAe,GAAG;AAClD,QAAI,KAAsB,EAAqB,EAAmB,CAChE,GAAQ;KACN;KACA;KACD,CAAC;QAEF,OAAU,MACR,gCAAgC,GAAoB,KACrD;YAEI,GAAG;AACV,YAAQ,MAAM,4CAA4C,EAAE;;MAGrD;IACV,CAAC,GAAO,EAAY,CAAC;CAExB,IAAM,IAAqB,GAAM,oBAC3B,IAAa,GAAM;AAEzB,QAAO,IACL,kBAAC,KAAD;EACE,MAAM,EAAmB;EACd;EACX,QAAO;EACP,KAAI;YAEJ,kBAAC,QAAD,EAAA,UAAA,CACG,GAAY,MACb,kBAAC,GAAD,EAAkB,OAAO,EAAE,YAAY,GAAG,EAAI,CAAA,CACzC,EAAA,CAAA;EACL,CAAA,GAEJ,kBAAA,GAAA,EAAK,CAAA"}

package/dist/components/FeaturedDataTabs/FacetPlotsCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"FacetPlotsCard.js","names":[],"sources":["../../../src/components/FeaturedDataTabs/FacetPlotsCard.tsx"],"sourcesContent":["import { useSynapseContext } from '@/utils/context/SynapseContext'\nimport {\n  Box,\n  Button,\n  Divider,\n  Paper,\n  Skeleton,\n  Typography,\n} from '@mui/material'\nimport {\n  ColumnTypeEnum,\n  FacetColumnResult,\n  FacetColumnResultValueCount,\n  FacetColumnResultValues,\n} from '@sage-bionetworks/synapse-types'\nimport { useSuspenseQuery } from '@tanstack/react-query'\nimport { times } from 'lodash-es'\nimport Plotly from 'plotly.js-basic-dist'\nimport { Fragment, Suspense, useMemo } from 'react'\nimport Plot from '../Plot/Plot'\nimport { useQueryVisualizationContext } from '../QueryVisualizationWrapper'\nimport { useSuspenseGetQueryMetadata } from '../QueryWrapper/useGetQueryMetadata'\nimport { ShowMore } from '../row_renderers/utils'\nimport { SkeletonParagraph, SkeletonTable } from '../Skeleton'\nimport {\n  extractPlotDataArray,\n  getPlotStyle,\n  PlotType,\n} from '../widgets/facet-nav/FacetNavPanel'\nimport { FacetPlotLegendTable } from '../widgets/facet-nav/FacetPlotLegendTable'\nimport { getFacets } from '../widgets/facet-nav/useFacetPlots'\nimport {\n  FACET_PLOTS_CARD_CLASSNAME,\n  FACET_PLOTS_CARD_PLOT_CONTAINER_CLASSNAME,\n  FACET_PLOTS_CARD_TITLE_CONTAINER_CLASSNAME,\n  FacetPlotsCardPlotContainer,\n  FacetPlotsCardTitleContainer,\n} from './FacetPlotsCardGrid'\nimport { useMeasure } from '@react-hookz/web'\n\nexport type FacetPlotsCardProps = {\n  title?: string\n  description?: string\n  facetsToPlot?: string[]\n  detailsPagePath?: string\n  plotType?: PlotType\n}\n\nconst layout: Partial<Plotly.Layout> = {\n  showlegend: false,\n  annotations: [],\n  margin: { l: 0, r: 0, b: 0, t: 0, pad: 0 },\n  yaxis: {\n    visible: false,\n    showgrid: false,\n  },\n  xaxis: {\n    visible: false,\n    showgrid: false,\n  },\n}\n\nfunction LoadingCard(props: { numPlots: number }) {\n  const { numPlots } = props\n  return (\n    <Paper className={FACET_PLOTS_CARD_CLASSNAME}>\n      <FacetPlotsCardTitleContainer\n        className={FACET_PLOTS_CARD_TITLE_CONTAINER_CLASSNAME}\n      >\n        <Skeleton width={'60%'} height={'24px'} />\n\n        <SkeletonParagraph numRows={5} />\n\n        <Skeleton width={'40%'}>\n          <Button variant={'contained'}>Explore</Button>\n        </Skeleton>\n      </FacetPlotsCardTitleContainer>\n      {times(numPlots).map(index => (\n        <FacetPlotsCardPlotContainer\n          key={index}\n          className={FACET_PLOTS_CARD_PLOT_CONTAINER_CLASSNAME}\n          sx={{\n            py: 3,\n            gridRow: `plot${index}`,\n          }}\n        >\n          <Skeleton width={'100%'} height={'300px'} />\n          <SkeletonTable numRows={4} numCols={2} />\n        </FacetPlotsCardPlotContainer>\n      ))}\n    </Paper>\n  )\n}\n\nfunction FacetPlotsCard(props: FacetPlotsCardProps) {\n  const {\n    title,\n    description,\n    facetsToPlot,\n    detailsPagePath,\n    plotType = 'PIE',\n  } = props\n  const { accessToken } = useSynapseContext()\n  const { data: queryMetadata } = useSuspenseGetQueryMetadata()\n  const { getColumnDisplayName } = useQueryVisualizationContext()\n  const [plotContainerMeasurements, plotContainerRef] = useMeasure()\n\n  const facetDataArray = useMemo(() => {\n    if (!facetsToPlot) {\n      return []\n    }\n\n    return getFacets(queryMetadata, facetsToPlot)\n  }, [facetsToPlot, queryMetadata])\n\n  const currentLayout: Partial<Plotly.Layout> = useMemo(() => {\n    return {\n      ...layout,\n      barmode: plotType === 'STACKED_HORIZONTAL_BAR' ? 'stack' : undefined,\n    }\n  }, [plotType])\n  const maxPlotHeight = plotType === 'STACKED_HORIZONTAL_BAR' ? 50 : 150\n  const { data: facetPlotDataArray } = useSuspenseQuery({\n    queryKey: ['facetPlotDataArray', facetsToPlot, facetDataArray],\n    queryFn: async () => {\n      if (!facetsToPlot) {\n        return []\n      }\n\n      const getColumnType = (\n        facetToPlot: FacetColumnResult,\n      ): ColumnTypeEnum | undefined =>\n        queryMetadata.columnModels!.find(\n          columnModel => columnModel.name === facetToPlot.columnName,\n        )?.columnType as ColumnTypeEnum\n\n      return Promise.all(\n        facetDataArray.map(async (item, index) => {\n          const plotData = await extractPlotDataArray(\n            item as FacetColumnResultValues,\n            getColumnType(item),\n            index + 1, //individual plot rgbIndex\n            plotType,\n            accessToken,\n          )\n          return plotData\n        }),\n      )\n    },\n  })\n\n  const selectedFacetValue = useMemo(() => {\n    if (!facetsToPlot) {\n      return ''\n    }\n\n    // If we are showing a facet selection based card, then set the selectedFacetValue.  For example, facet column \"study\" with value \"ROSMAP\"\n    const selectedFacet: FacetColumnResultValueCount | undefined = queryMetadata\n      ?.facets!.map(item => {\n        const facetValues: FacetColumnResultValueCount[] = (\n          item as FacetColumnResultValues\n        ).facetValues\n        if (facetValues) {\n          const filteredFacetValues: FacetColumnResultValueCount[] =\n            facetValues.filter(facetValue => {\n              return facetValue.isSelected\n            })\n          return filteredFacetValues.length > 0\n            ? filteredFacetValues[0]\n            : undefined\n        } else {\n          return undefined\n        }\n      })\n      .filter(x => x !== undefined)[0]\n\n    if (selectedFacet && selectedFacet.value) {\n      return selectedFacet?.value\n    }\n    return ''\n  }, [facetsToPlot, queryMetadata?.facets])\n\n  const isShowingMultiplePlots = facetPlotDataArray.length > 1\n  const cardTitle =\n    title ??\n    (isShowingMultiplePlots\n      ? selectedFacetValue\n      : getColumnDisplayName(facetDataArray[0].columnName))\n  return (\n    <Paper className={FACET_PLOTS_CARD_CLASSNAME} sx={{ overflow: 'hidden' }}>\n      <FacetPlotsCardTitleContainer\n        className={FACET_PLOTS_CARD_TITLE_CONTAINER_CLASSNAME}\n      >\n        <Typography variant={'headline1'}>{cardTitle}</Typography>\n        {description && (\n          <Typography variant={'body1'} sx={{ color: 'grey.700', my: 2 }}>\n            <ShowMore summary={description} maxCharacterCount={200} />\n          </Typography>\n        )}\n\n        {detailsPagePath && selectedFacetValue && (\n          <Box sx={{ my: 2 }}>\n            <Button\n              variant={'contained'}\n              href={detailsPagePath}\n              color={'secondary'}\n              sx={theme => ({\n                [theme.breakpoints.down('sm')]: { width: '100%' },\n              })}\n            >\n              Explore {selectedFacetValue}\n            </Button>\n          </Box>\n        )}\n      </FacetPlotsCardTitleContainer>\n\n      {/* create a plot for every facet to be plotted */}\n      {facetPlotDataArray.map((plotData, index) => {\n        return (\n          <Fragment key={index}>\n            <FacetPlotsCardPlotContainer\n              className={FACET_PLOTS_CARD_PLOT_CONTAINER_CLASSNAME}\n              sx={{\n                pt: index === 0 ? 5 : 0,\n                gridRow: `plot${index}`,\n              }}\n              key={index}\n            >\n              {index != 0 && <Divider sx={{ mt: 2, mb: 4 }} />}\n              <Box sx={{ minHeight: '130px' }}>\n                <Box\n                  ref={plotContainerRef}\n                  sx={{\n                    display: 'flex',\n                    justifyContent: 'center',\n                    alignItems: 'center',\n                  }}\n                >\n                  <Plot\n                    key={`${facetsToPlot![index]}-${\n                      plotContainerMeasurements?.width\n                    }`}\n                    layout={currentLayout}\n                    data={plotData?.data ?? []}\n                    style={getPlotStyle(\n                      plotContainerMeasurements?.width,\n                      plotType,\n                      maxPlotHeight,\n                    )}\n                    config={{ displayModeBar: false }}\n                  />\n                </Box>\n                <Box sx={{ mt: 4, width: '100%' }}>\n                  <FacetPlotLegendTable\n                    facetName={getColumnDisplayName(\n                      facetDataArray[index].columnName,\n                    )}\n                    labels={plotData?.labels}\n                    colors={plotData?.colors}\n                    isExpanded={false}\n                    linkToFullQuery={detailsPagePath}\n                  />\n                </Box>\n              </Box>\n            </FacetPlotsCardPlotContainer>\n          </Fragment>\n        )\n      })}\n    </Paper>\n  )\n}\n\nexport default function FacetPlotsCardWithSuspense(props: FacetPlotsCardProps) {\n  return (\n    <Suspense\n      fallback={<LoadingCard numPlots={(props.facetsToPlot ?? []).length} />}\n    >\n      <FacetPlotsCard {...props} />\n    </Suspense>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"FacetPlotsCard.js","names":[],"sources":["../../../src/components/FeaturedDataTabs/FacetPlotsCard.tsx"],"sourcesContent":["import { useSynapseContext } from '@/utils/context/SynapseContext'\nimport {\n  Box,\n  Button,\n  Divider,\n  Paper,\n  Skeleton,\n  Typography,\n} from '@mui/material'\nimport {\n  ColumnTypeEnum,\n  FacetColumnResult,\n  FacetColumnResultValueCount,\n  FacetColumnResultValues,\n} from '@sage-bionetworks/synapse-types'\nimport { useSuspenseQuery } from '@tanstack/react-query'\nimport { times } from 'lodash-es'\nimport Plotly from 'plotly.js-basic-dist'\nimport { Fragment, Suspense, useMemo } from 'react'\nimport Plot from '../Plot/Plot'\nimport { useQueryVisualizationContext } from '../QueryVisualizationWrapper'\nimport { useSuspenseGetQueryMetadata } from '../QueryWrapper/useGetQueryMetadata'\nimport { ShowMore } from '../row_renderers/utils'\nimport { SkeletonParagraph, SkeletonTable } from '../Skeleton'\nimport {\n  extractPlotDataArray,\n  getPlotStyle,\n  PlotType,\n} from '../widgets/facet-nav/FacetNavPanel'\nimport { FacetPlotLegendTable } from '../widgets/facet-nav/FacetPlotLegendTable'\nimport { getFacets } from '../widgets/facet-nav/useFacetPlots'\nimport {\n  FACET_PLOTS_CARD_CLASSNAME,\n  FACET_PLOTS_CARD_PLOT_CONTAINER_CLASSNAME,\n  FACET_PLOTS_CARD_TITLE_CONTAINER_CLASSNAME,\n  FacetPlotsCardPlotContainer,\n  FacetPlotsCardTitleContainer,\n} from './FacetPlotsCardGrid'\nimport { useMeasure } from '@react-hookz/web'\n\nexport type FacetPlotsCardProps = {\n  title?: string\n  description?: string\n  facetsToPlot?: string[]\n  detailsPagePath?: string\n  plotType?: PlotType\n}\n\nconst layout: Partial<Plotly.Layout> = {\n  showlegend: false,\n  annotations: [],\n  margin: { l: 0, r: 0, b: 0, t: 0, pad: 0 },\n  yaxis: {\n    visible: false,\n    showgrid: false,\n  },\n  xaxis: {\n    visible: false,\n    showgrid: false,\n  },\n}\n\nfunction LoadingCard(props: { numPlots: number }) {\n  const { numPlots } = props\n  return (\n    <Paper className={FACET_PLOTS_CARD_CLASSNAME}>\n      <FacetPlotsCardTitleContainer\n        className={FACET_PLOTS_CARD_TITLE_CONTAINER_CLASSNAME}\n      >\n        <Skeleton width={'60%'} height={'24px'} />\n\n        <SkeletonParagraph numRows={5} />\n\n        <Skeleton width={'40%'}>\n          <Button variant={'contained'}>Explore</Button>\n        </Skeleton>\n      </FacetPlotsCardTitleContainer>\n      {times(numPlots).map(index => (\n        <FacetPlotsCardPlotContainer\n          key={index}\n          className={FACET_PLOTS_CARD_PLOT_CONTAINER_CLASSNAME}\n          sx={{\n            py: 3,\n            gridRow: `plot${index}`,\n          }}\n        >\n          <Skeleton width={'100%'} height={'300px'} />\n          <SkeletonTable numRows={4} numCols={2} />\n        </FacetPlotsCardPlotContainer>\n      ))}\n    </Paper>\n  )\n}\n\nfunction FacetPlotsCard(props: FacetPlotsCardProps) {\n  const {\n    title,\n    description,\n    facetsToPlot,\n    detailsPagePath,\n    plotType = 'PIE',\n  } = props\n  const { accessToken } = useSynapseContext()\n  const { data: queryMetadata } = useSuspenseGetQueryMetadata()\n  const { getColumnDisplayName } = useQueryVisualizationContext()\n  const [plotContainerMeasurements, plotContainerRef] = useMeasure()\n\n  const facetDataArray = useMemo(() => {\n    if (!facetsToPlot) {\n      return []\n    }\n\n    return getFacets(queryMetadata, facetsToPlot)\n  }, [facetsToPlot, queryMetadata])\n\n  const currentLayout: Partial<Plotly.Layout> = useMemo(() => {\n    return {\n      ...layout,\n      barmode: plotType === 'STACKED_HORIZONTAL_BAR' ? 'stack' : undefined,\n    }\n  }, [plotType])\n  const maxPlotHeight = plotType === 'STACKED_HORIZONTAL_BAR' ? 50 : 150\n  const { data: facetPlotDataArray } = useSuspenseQuery({\n    queryKey: ['facetPlotDataArray', facetsToPlot, facetDataArray],\n    queryFn: async () => {\n      if (!facetsToPlot) {\n        return []\n      }\n\n      const getColumnType = (\n        facetToPlot: FacetColumnResult,\n      ): ColumnTypeEnum | undefined =>\n        queryMetadata.columnModels!.find(\n          columnModel => columnModel.name === facetToPlot.columnName,\n        )?.columnType as ColumnTypeEnum\n\n      return Promise.all(\n        facetDataArray.map(async (item, index) => {\n          const plotData = await extractPlotDataArray(\n            item as FacetColumnResultValues,\n            getColumnType(item),\n            index + 1, //individual plot rgbIndex\n            plotType,\n            accessToken,\n          )\n          return plotData\n        }),\n      )\n    },\n  })\n\n  const selectedFacetValue = useMemo(() => {\n    if (!facetsToPlot) {\n      return ''\n    }\n\n    // If we are showing a facet selection based card, then set the selectedFacetValue.  For example, facet column \"study\" with value \"ROSMAP\"\n    const selectedFacet: FacetColumnResultValueCount | undefined = queryMetadata\n      ?.facets!.map(item => {\n        const facetValues: FacetColumnResultValueCount[] = (\n          item as FacetColumnResultValues\n        ).facetValues\n        if (facetValues) {\n          const filteredFacetValues: FacetColumnResultValueCount[] =\n            facetValues.filter(facetValue => {\n              return facetValue.isSelected\n            })\n          return filteredFacetValues.length > 0\n            ? filteredFacetValues[0]\n            : undefined\n        } else {\n          return undefined\n        }\n      })\n      .filter(x => x !== undefined)[0]\n\n    if (selectedFacet && selectedFacet.value) {\n      return selectedFacet?.value\n    }\n    return ''\n  }, [facetsToPlot, queryMetadata?.facets])\n\n  const isShowingMultiplePlots = facetPlotDataArray.length > 1\n  const cardTitle =\n    title ??\n    (isShowingMultiplePlots\n      ? selectedFacetValue\n      : getColumnDisplayName(facetDataArray[0].columnName))\n  return (\n    <Paper className={FACET_PLOTS_CARD_CLASSNAME} sx={{ overflow: 'hidden' }}>\n      <FacetPlotsCardTitleContainer\n        className={FACET_PLOTS_CARD_TITLE_CONTAINER_CLASSNAME}\n      >\n        <Typography variant={'headline1'}>{cardTitle}</Typography>\n        {description && (\n          <Typography variant={'body1'} sx={{ color: 'grey.700', my: 2 }}>\n            <ShowMore summary={description} maxCharacterCount={200} />\n          </Typography>\n        )}\n\n        {detailsPagePath && selectedFacetValue && (\n          <Box sx={{ my: 2 }}>\n            <Button\n              variant={'contained'}\n              href={detailsPagePath}\n              color={'secondary'}\n              sx={theme => ({\n                [theme.breakpoints.down('sm')]: { width: '100%' },\n              })}\n            >\n              Explore {selectedFacetValue}\n            </Button>\n          </Box>\n        )}\n      </FacetPlotsCardTitleContainer>\n\n      {/* create a plot for every facet to be plotted */}\n      {facetPlotDataArray.map((plotData, index) => {\n        return (\n          <Fragment key={index}>\n            <FacetPlotsCardPlotContainer\n              className={FACET_PLOTS_CARD_PLOT_CONTAINER_CLASSNAME}\n              sx={{\n                pt: index === 0 ? 5 : 0,\n                gridRow: `plot${index}`,\n              }}\n              key={index}\n            >\n              {index != 0 && <Divider sx={{ mt: 2, mb: 4 }} />}\n              <Box sx={{ minHeight: '130px' }}>\n                <Box\n                  ref={plotContainerRef}\n                  sx={{\n                    display: 'flex',\n                    justifyContent: 'center',\n                    alignItems: 'center',\n                  }}\n                >\n                  <Plot\n                    key={`${facetsToPlot![index]}-${\n                      plotContainerMeasurements?.width\n                    }`}\n                    layout={currentLayout}\n                    data={plotData?.data ?? []}\n                    style={getPlotStyle(\n                      plotContainerMeasurements?.width,\n                      plotType,\n                      maxPlotHeight,\n                    )}\n                    config={{ displayModeBar: false }}\n                  />\n                </Box>\n                <Box sx={{ mt: 4, width: '100%' }}>\n                  <FacetPlotLegendTable\n                    facetName={getColumnDisplayName(\n                      facetDataArray[index].columnName,\n                    )}\n                    labels={plotData?.labels}\n                    colors={plotData?.colors}\n                    isExpanded={false}\n                    linkToFullQuery={detailsPagePath}\n                  />\n                </Box>\n              </Box>\n            </FacetPlotsCardPlotContainer>\n          </Fragment>\n        )\n      })}\n    </Paper>\n  )\n}\n\nexport default function FacetPlotsCardWithSuspense(props: FacetPlotsCardProps) {\n  return (\n    <Suspense\n      fallback={<LoadingCard numPlots={(props.facetsToPlot ?? []).length} />}\n    >\n      <FacetPlotsCard {...props} />\n    </Suspense>\n  )\n}\n"],"mappings":"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"}

package/dist/components/FeaturedDataTabs/QueryPerFacetPlotsCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"QueryPerFacetPlotsCard.js","names":[],"sources":["../../../src/components/FeaturedDataTabs/QueryPerFacetPlotsCard.tsx"],"sourcesContent":["import { SynapseConstants } from '@/utils'\nimport { parseEntityIdFromSqlStatement } from '@/utils/functions'\nimport { DEFAULT_PAGE_SIZE } from '@/utils/SynapseConstants'\nimport { QueryBundleRequest } from '@sage-bionetworks/synapse-types'\nimport {\n  QueryVisualizationContextType,\n  QueryVisualizationWrapper,\n} from '../QueryVisualizationWrapper'\nimport { QueryWrapper } from '../QueryWrapper'\nimport { QueryWrapperErrorBoundary } from '../QueryWrapperErrorBoundary'\nimport FacetPlotsCard, { FacetPlotsCardProps } from './FacetPlotsCard'\n\nexport type QueryPerFacetPlotsCardProps = {\n  title?: string\n  description?: string\n  rgbIndex?: number\n  facetsToPlot?: string[]\n  selectFacetColumnName: string\n  selectFacetColumnValue: string\n  sql?: string\n  detailsPagePath: string\n} & Pick<QueryVisualizationContextType, 'unitDescription'> &\n  Pick<FacetPlotsCardProps, 'plotType'>\n\nfunction getQueryRequest(\n  sql: string,\n  selectFacetColumnName: string,\n  selectFacetColumnValue: string,\n): QueryBundleRequest {\n  const entityId = parseEntityIdFromSqlStatement(sql)\n  return {\n    entityId,\n    concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n    partMask:\n      SynapseConstants.BUNDLE_MASK_QUERY_COLUMN_MODELS |\n      SynapseConstants.BUNDLE_MASK_QUERY_FACETS,\n    query: {\n      sql,\n      offset: 0,\n      limit: DEFAULT_PAGE_SIZE,\n      selectedFacets: [\n        {\n          columnName: selectFacetColumnName,\n          facetValues: [selectFacetColumnValue],\n          concreteType:\n            'org.sagebionetworks.repo.model.table.FacetColumnValuesRequest',\n        },\n      ],\n    },\n  }\n}\nfunction QueryPerFacetPlotsCard(props: QueryPerFacetPlotsCardProps) {\n  const {\n    title,\n    description,\n    sql,\n    facetsToPlot,\n    rgbIndex,\n    selectFacetColumnName,\n    selectFacetColumnValue,\n    detailsPagePath,\n    plotType,\n    ...rest\n  } = props\n  const initQueryRequest: QueryBundleRequest = getQueryRequest(\n    sql!,\n    selectFacetColumnName,\n    selectFacetColumnValue,\n  )\n\n  /**\n   * Fully re-render the uncontrolled QueryWrapper component when the initial query changes. This eliminates a class of\n   * bugs where our 'derived' state (the current query), which should be reset, is out of sync with props.\n   *\n   * See https://legacy.reactjs.org/blog/2018/06/07/you-probably-dont-need-derived-state.html#recommendation-fully-uncontrolled-component-with-a-key\n   */\n  const queryWrapperKey = JSON.stringify(initQueryRequest)\n  return (\n    <QueryWrapper\n      {...rest}\n      initQueryRequest={initQueryRequest}\n      key={queryWrapperKey}\n    >\n      <QueryVisualizationWrapper rgbIndex={rgbIndex} {...rest}>\n        <QueryWrapperErrorBoundary>\n          <FacetPlotsCard\n            title={title}\n            description={description}\n            facetsToPlot={facetsToPlot}\n            detailsPagePath={detailsPagePath}\n            plotType={plotType}\n          />\n        </QueryWrapperErrorBoundary>\n      </QueryVisualizationWrapper>\n    </QueryWrapper>\n  )\n}\n\nexport default QueryPerFacetPlotsCard\n"],"mappings":";;;;;;;;;;;;;AAwBA,SAAS,EACP,GACA,GACA,GACoB;AAEpB,QAAO;EACL,UAFe,EAA8B,EAAI;EAGjD,cAAc;EACd,UACE;EAEF,OAAO;GACL;GACA,QAAQ;GACR,OAAA;GACA,gBAAgB,CACd;IACE,YAAY;IACZ,aAAa,CAAC,EAAuB;IACrC,cACE;IACH,CACF;GACF;EACF;;AAEH,SAAS,EAAuB,GAAoC;CAClE,IAAM,EACJ,UACA,gBACA,QACA,iBACA,aACA,0BACA,2BACA,oBACA,aACA,GAAG,MACD,GACE,IAAuC,EAC3C,GACA,GACA,EACD,EAQK,IAAkB,KAAK,UAAU,EAAiB;AACxD,QACE,kBAAC,GAAD;EACE,GAAI;EACc;EAClB,KAAK;EAaQ,EAXb,kBAAC,GAAD;EAAqC;EAAU,GAAI;YACjD,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD;GACS;GACM;GACC;GACG;GACP;GACV,CAAA,EACwB,CAAA;EACF,CAAA,CACf"}
+{"version":3,"file":"QueryPerFacetPlotsCard.js","names":[],"sources":["../../../src/components/FeaturedDataTabs/QueryPerFacetPlotsCard.tsx"],"sourcesContent":["import { SynapseConstants } from '@/utils'\nimport { parseEntityIdFromSqlStatement } from '@/utils/functions'\nimport { DEFAULT_PAGE_SIZE } from '@/utils/SynapseConstants'\nimport { QueryBundleRequest } from '@sage-bionetworks/synapse-types'\nimport {\n  QueryVisualizationContextType,\n  QueryVisualizationWrapper,\n} from '../QueryVisualizationWrapper'\nimport { QueryWrapper } from '../QueryWrapper'\nimport { QueryWrapperErrorBoundary } from '../QueryWrapperErrorBoundary'\nimport FacetPlotsCard, { FacetPlotsCardProps } from './FacetPlotsCard'\n\nexport type QueryPerFacetPlotsCardProps = {\n  title?: string\n  description?: string\n  rgbIndex?: number\n  facetsToPlot?: string[]\n  selectFacetColumnName: string\n  selectFacetColumnValue: string\n  sql?: string\n  detailsPagePath: string\n} & Pick<QueryVisualizationContextType, 'unitDescription'> &\n  Pick<FacetPlotsCardProps, 'plotType'>\n\nfunction getQueryRequest(\n  sql: string,\n  selectFacetColumnName: string,\n  selectFacetColumnValue: string,\n): QueryBundleRequest {\n  const entityId = parseEntityIdFromSqlStatement(sql)\n  return {\n    entityId,\n    concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n    partMask:\n      SynapseConstants.BUNDLE_MASK_QUERY_COLUMN_MODELS |\n      SynapseConstants.BUNDLE_MASK_QUERY_FACETS,\n    query: {\n      sql,\n      offset: 0,\n      limit: DEFAULT_PAGE_SIZE,\n      selectedFacets: [\n        {\n          columnName: selectFacetColumnName,\n          facetValues: [selectFacetColumnValue],\n          concreteType:\n            'org.sagebionetworks.repo.model.table.FacetColumnValuesRequest',\n        },\n      ],\n    },\n  }\n}\nfunction QueryPerFacetPlotsCard(props: QueryPerFacetPlotsCardProps) {\n  const {\n    title,\n    description,\n    sql,\n    facetsToPlot,\n    rgbIndex,\n    selectFacetColumnName,\n    selectFacetColumnValue,\n    detailsPagePath,\n    plotType,\n    ...rest\n  } = props\n  const initQueryRequest: QueryBundleRequest = getQueryRequest(\n    sql!,\n    selectFacetColumnName,\n    selectFacetColumnValue,\n  )\n\n  /**\n   * Fully re-render the uncontrolled QueryWrapper component when the initial query changes. This eliminates a class of\n   * bugs where our 'derived' state (the current query), which should be reset, is out of sync with props.\n   *\n   * See https://legacy.reactjs.org/blog/2018/06/07/you-probably-dont-need-derived-state.html#recommendation-fully-uncontrolled-component-with-a-key\n   */\n  const queryWrapperKey = JSON.stringify(initQueryRequest)\n  return (\n    <QueryWrapper\n      {...rest}\n      initQueryRequest={initQueryRequest}\n      key={queryWrapperKey}\n    >\n      <QueryVisualizationWrapper rgbIndex={rgbIndex} {...rest}>\n        <QueryWrapperErrorBoundary>\n          <FacetPlotsCard\n            title={title}\n            description={description}\n            facetsToPlot={facetsToPlot}\n            detailsPagePath={detailsPagePath}\n            plotType={plotType}\n          />\n        </QueryWrapperErrorBoundary>\n      </QueryVisualizationWrapper>\n    </QueryWrapper>\n  )\n}\n\nexport default QueryPerFacetPlotsCard\n"],"mappings":";;;;;;;;;;;;;AAwBA,SAAS,EACP,GACA,GACA,GACoB;AAEpB,QAAO;EACL,UAFe,EAA8B,EAE7C;EACA,cAAc;EACd,UACE;EAEF,OAAO;GACL;GACA,QAAQ;GACR,OAAA;GACA,gBAAgB,CACd;IACE,YAAY;IACZ,aAAa,CAAC,EAAuB;IACrC,cACE;IACH,CACF;GACF;EACF;;AAEH,SAAS,EAAuB,GAAoC;CAClE,IAAM,EACJ,UACA,gBACA,QACA,iBACA,aACA,0BACA,2BACA,oBACA,aACA,GAAG,MACD,GACE,IAAuC,EAC3C,GACA,GACA,EACD,EAQK,IAAkB,KAAK,UAAU,EAAiB;AACxD,QACE,kBAAC,GAAD;EACE,GAAI;EACc;EAClB,KAAK;EAaQ,EAXb,kBAAC,GAAD;EAAqC;EAAU,GAAI;YACjD,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD;GACS;GACM;GACC;GACG;GACP;GACV,CAAA,EACwB,CAAA;EACF,CAAA,CACf"}

package/dist/components/FeaturedDataTabs/SingleQueryFacetPlotsCards.js.map

@@ -1 +1 @@
-{"version":3,"file":"SingleQueryFacetPlotsCards.js","names":[],"sources":["../../../src/components/FeaturedDataTabs/SingleQueryFacetPlotsCards.tsx"],"sourcesContent":["import { SynapseConstants } from '@/utils'\nimport { parseEntityIdFromSqlStatement } from '@/utils/functions'\nimport { QueryBundleRequest } from '@sage-bionetworks/synapse-types'\nimport { chunk } from 'lodash-es'\nimport {\n  QueryVisualizationContextType,\n  QueryVisualizationWrapper,\n} from '../QueryVisualizationWrapper'\nimport { QueryWrapper } from '../QueryWrapper'\nimport { QueryWrapperErrorBoundary } from '../QueryWrapperErrorBoundary'\nimport FacetPlotsCard, { FacetPlotsCardProps } from './FacetPlotsCard'\nimport { FacetPlotsCardGridContainer } from './FacetPlotsCardGrid'\nimport { CARDS_PER_ROW } from './FeaturedDataTabsUtils'\n\nexport type SingleQueryFacetPlotsCardsProps = {\n  rgbIndex?: number\n  facetsToPlot?: string[]\n  columnAliases?: Record<string, string>\n  sql?: string\n} & Pick<QueryVisualizationContextType, 'unitDescription'> &\n  Pick<FacetPlotsCardProps, 'plotType'>\n\nfunction getQueryRequest(sql: string): QueryBundleRequest {\n  const entityId = parseEntityIdFromSqlStatement(sql)\n  return {\n    entityId,\n    concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n    partMask:\n      SynapseConstants.BUNDLE_MASK_QUERY_COLUMN_MODELS |\n      SynapseConstants.BUNDLE_MASK_QUERY_FACETS,\n    query: {\n      sql,\n      offset: 0,\n      limit: 1,\n    },\n  }\n}\n\nfunction SingleQueryFacetPlotsCards(props: SingleQueryFacetPlotsCardsProps) {\n  const {\n    sql,\n    facetsToPlot,\n    rgbIndex,\n    columnAliases,\n    unitDescription,\n    plotType,\n  } = props\n  const initQueryRequest: QueryBundleRequest = getQueryRequest(sql!)\n\n  /**\n   * Fully re-render the uncontrolled QueryWrapper component when the initial query changes. This eliminates a class of\n   * bugs where our 'derived' state (the current query), which should be reset, is out of sync with props.\n   *\n   * See https://legacy.reactjs.org/blog/2018/06/07/you-probably-dont-need-derived-state.html#recommendation-fully-uncontrolled-component-with-a-key\n   */\n  const queryWrapperKey = JSON.stringify(initQueryRequest)\n\n  return (\n    <QueryWrapper initQueryRequest={initQueryRequest} key={queryWrapperKey}>\n      <QueryVisualizationWrapper\n        rgbIndex={rgbIndex}\n        columnAliases={columnAliases}\n        unitDescription={unitDescription}\n      >\n        <QueryWrapperErrorBoundary>\n          {chunk(facetsToPlot, CARDS_PER_ROW).map((facets, rowIndex) => {\n            return (\n              <FacetPlotsCardGridContainer\n                key={rowIndex}\n                className={`FeaturedDataPlots__queryPerCard`}\n                sx={{\n                  my: 4,\n                }}\n              >\n                {facets?.map(facetName => {\n                  return (\n                    <FacetPlotsCard\n                      key={facetName}\n                      facetsToPlot={[facetName]}\n                      plotType={plotType}\n                    />\n                  )\n                })}\n              </FacetPlotsCardGridContainer>\n            )\n          })}\n        </QueryWrapperErrorBoundary>\n      </QueryVisualizationWrapper>\n    </QueryWrapper>\n  )\n}\n\nexport default SingleQueryFacetPlotsCards\n"],"mappings":";;;;;;;;;;;;;;;AAsBA,SAAS,EAAgB,GAAiC;AAExD,QAAO;EACL,UAFe,EAA8B,EAAI;EAGjD,cAAc;EACd,UACE;EAEF,OAAO;GACL;GACA,QAAQ;GACR,OAAO;GACR;EACF;;AAGH,SAAS,EAA2B,GAAwC;CAC1E,IAAM,EACJ,QACA,iBACA,aACA,kBACA,oBACA,gBACE,GACE,IAAuC,EAAgB,EAAK,EAQ5D,IAAkB,KAAK,UAAU,EAAiB;AAExD,QACE,kBAAC,GAAD;EAAgC;YAC9B,kBAAC,GAAD;GACY;GACK;GACE;aAEjB,kBAAC,GAAD,EAAA,UACG,EAAM,GAAA,EAA4B,CAAC,KAAK,GAAQ,MAE7C,kBAAC,GAAD;IAEE,WAAW;IACX,IAAI,EACF,IAAI,GACL;cAEA,GAAQ,KAAI,MAET,kBAAC,GAAD;KAEE,cAAc,CAAC,EAAU;KACf;KACV,EAHK,EAGL,CAEJ;IAC0B,EAfvB,EAeuB,CAEhC,EACwB,CAAA;GACF,CAAA;EACf,EA9BwC,EA8BxC"}
+{"version":3,"file":"SingleQueryFacetPlotsCards.js","names":[],"sources":["../../../src/components/FeaturedDataTabs/SingleQueryFacetPlotsCards.tsx"],"sourcesContent":["import { SynapseConstants } from '@/utils'\nimport { parseEntityIdFromSqlStatement } from '@/utils/functions'\nimport { QueryBundleRequest } from '@sage-bionetworks/synapse-types'\nimport { chunk } from 'lodash-es'\nimport {\n  QueryVisualizationContextType,\n  QueryVisualizationWrapper,\n} from '../QueryVisualizationWrapper'\nimport { QueryWrapper } from '../QueryWrapper'\nimport { QueryWrapperErrorBoundary } from '../QueryWrapperErrorBoundary'\nimport FacetPlotsCard, { FacetPlotsCardProps } from './FacetPlotsCard'\nimport { FacetPlotsCardGridContainer } from './FacetPlotsCardGrid'\nimport { CARDS_PER_ROW } from './FeaturedDataTabsUtils'\n\nexport type SingleQueryFacetPlotsCardsProps = {\n  rgbIndex?: number\n  facetsToPlot?: string[]\n  columnAliases?: Record<string, string>\n  sql?: string\n} & Pick<QueryVisualizationContextType, 'unitDescription'> &\n  Pick<FacetPlotsCardProps, 'plotType'>\n\nfunction getQueryRequest(sql: string): QueryBundleRequest {\n  const entityId = parseEntityIdFromSqlStatement(sql)\n  return {\n    entityId,\n    concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n    partMask:\n      SynapseConstants.BUNDLE_MASK_QUERY_COLUMN_MODELS |\n      SynapseConstants.BUNDLE_MASK_QUERY_FACETS,\n    query: {\n      sql,\n      offset: 0,\n      limit: 1,\n    },\n  }\n}\n\nfunction SingleQueryFacetPlotsCards(props: SingleQueryFacetPlotsCardsProps) {\n  const {\n    sql,\n    facetsToPlot,\n    rgbIndex,\n    columnAliases,\n    unitDescription,\n    plotType,\n  } = props\n  const initQueryRequest: QueryBundleRequest = getQueryRequest(sql!)\n\n  /**\n   * Fully re-render the uncontrolled QueryWrapper component when the initial query changes. This eliminates a class of\n   * bugs where our 'derived' state (the current query), which should be reset, is out of sync with props.\n   *\n   * See https://legacy.reactjs.org/blog/2018/06/07/you-probably-dont-need-derived-state.html#recommendation-fully-uncontrolled-component-with-a-key\n   */\n  const queryWrapperKey = JSON.stringify(initQueryRequest)\n\n  return (\n    <QueryWrapper initQueryRequest={initQueryRequest} key={queryWrapperKey}>\n      <QueryVisualizationWrapper\n        rgbIndex={rgbIndex}\n        columnAliases={columnAliases}\n        unitDescription={unitDescription}\n      >\n        <QueryWrapperErrorBoundary>\n          {chunk(facetsToPlot, CARDS_PER_ROW).map((facets, rowIndex) => {\n            return (\n              <FacetPlotsCardGridContainer\n                key={rowIndex}\n                className={`FeaturedDataPlots__queryPerCard`}\n                sx={{\n                  my: 4,\n                }}\n              >\n                {facets?.map(facetName => {\n                  return (\n                    <FacetPlotsCard\n                      key={facetName}\n                      facetsToPlot={[facetName]}\n                      plotType={plotType}\n                    />\n                  )\n                })}\n              </FacetPlotsCardGridContainer>\n            )\n          })}\n        </QueryWrapperErrorBoundary>\n      </QueryVisualizationWrapper>\n    </QueryWrapper>\n  )\n}\n\nexport default SingleQueryFacetPlotsCards\n"],"mappings":";;;;;;;;;;;;;;;AAsBA,SAAS,EAAgB,GAAiC;AAExD,QAAO;EACL,UAFe,EAA8B,EAE7C;EACA,cAAc;EACd,UACE;EAEF,OAAO;GACL;GACA,QAAQ;GACR,OAAO;GACR;EACF;;AAGH,SAAS,EAA2B,GAAwC;CAC1E,IAAM,EACJ,QACA,iBACA,aACA,kBACA,oBACA,gBACE,GACE,IAAuC,EAAgB,EAAK,EAQ5D,IAAkB,KAAK,UAAU,EAAiB;AAExD,QACE,kBAAC,GAAD;EAAgC;YAC9B,kBAAC,GAAD;GACY;GACK;GACE;aAEjB,kBAAC,GAAD,EAAA,UACG,EAAM,GAAA,EAA4B,CAAC,KAAK,GAAQ,MAE7C,kBAAC,GAAD;IAEE,WAAW;IACX,IAAI,EACF,IAAI,GACL;cAEA,GAAQ,KAAI,MAET,kBAAC,GAAD;KAEE,cAAc,CAAC,EAAU;KACf;KACV,EAHK,EAGL,CAEJ;IAC0B,EAfvB,EAeuB,CAEhC,EACwB,CAAA;GACF,CAAA;EACf,EA9BwC,EA8BxC"}