npm - synapse-react-client - Versions diffs - 4.0.24 → 4.0.26 - Mend

synapse-react-client 4.0.24 → 4.0.26

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (119) hide show

package/dist/components/CannedRejectionDialog/CannedRejectionDialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CannedRejectionDialog.js","names":[],"sources":["../../../src/components/CannedRejectionDialog/CannedRejectionDialog.tsx"],"sourcesContent":["import { useGetFullTableQueryResults } from '@/synapse-queries'\nimport { BUNDLE_MASK_QUERY_RESULTS } from '@/utils/SynapseConstants'\nimport {\n Checkbox,\n Collapse,\n FormControl,\n FormControlLabel,\n Stack,\n TextField,\n Typography,\n} from '@mui/material'\nimport { SynapseClientError } from '@sage-bionetworks/synapse-client/util/SynapseClientError'\nimport { QueryResultBundle, Row } from '@sage-bionetworks/synapse-types'\nimport { UseQueryResult } from '@tanstack/react-query'\nimport { Set } from 'immutable'\nimport { Dispatch, ReactNode, SetStateAction, useEffect, useState } from 'react'\nimport ConfirmationDialog from '../ConfirmationDialog'\nimport { ErrorBanner } from '../error/ErrorBanner'\nimport FullWidthAlert from '../FullWidthAlert/FullWidthAlert'\nimport IconSvg from '../IconSvg/IconSvg'\nimport { SynapseSpinner } from '../LoadingScreen/LoadingScreen'\n\nconst CATEGORY_COLUMN_NAME = 'category'\nconst CATEGORY_SECTION_EMAIL_TEXT_COLUMN_NAME = 'category email prompt'\nconst REJECTION_REASON_FORM_TEXT_COLUMN_NAME = 'rejection reason'\nconst REJECTION_REASON_EMAIL_TEXT_COLUMN_NAME = 'email text'\n\nexport type CannedRejectionDialogProps = {\n open: boolean\n /* SynID of the table which contains the email responses which should populate this modal /\n tableId: string\n / Callback invoked when the rejection is confirmed /\n onConfirm: (message: string) => void\n onClose: () => void\n /* Text injected into the beginning of the email template /\n defaultMessagePrefix?: string\n /* Text appended onto the end of the email template /\n defaultMessageAppend?: string\n /* Text to display above the canned rejection reasons /\n rejectionFormPromptCopy?: string\n /* Error to display, in case one occurred in the callback to `onReject` /\n error: SynapseClientError \| null\n /* Optional children, can be used to extend the form as needed on step 2 /\n children?: ReactNode\n}\n\ntype RejectionCategoryProps = {\n category: string\n rows: Row[]\n rejectionReasonFormTextIndex: number\n selectedRowIds: Set<number>\n setSelectedRowIds: Dispatch<SetStateAction<Set<number>>>\n initialIsExpanded?: boolean\n}\n\ntype SelectRejectionReasonsFormProps = {\n tableQuery: UseQueryResult<QueryResultBundle, SynapseClientError>\n selectedRowIds: Set<number>\n setSelectedRowIds: Dispatch<SetStateAction<Set<number>>>\n rejectionFormPromptCopy?: string\n}\n\n/\n Renders a rejection reason category and checkboxes for each reason in the category\n /\nfunction RejectionCategory(props: RejectionCategoryProps) {\n const {\n category,\n rows,\n selectedRowIds,\n setSelectedRowIds,\n rejectionReasonFormTextIndex,\n initialIsExpanded = false,\n } = props\n const [isExpanded, setIsExpanded] = useState(initialIsExpanded)\n\n return (\n <>\n <Typography\n variant=\"body1\"\n onClick={() => setIsExpanded(!isExpanded)}\n sx={{ fontWeight: 700, cursor: 'pointer', my: 1 }}\n >\n <IconSvg\n icon={isExpanded ? 'expandMore' : 'chevronRight'}\n sx={{ color: 'grey.700' }}\n wrap={false}\n />\n {category}\n </Typography>\n <Collapse in={isExpanded}>\n <Stack sx={{ ml: 3 }}>\n {(rows ?? []).map(row => (\n <FormControlLabel\n key={row.rowId}\n control={\n <Checkbox\n checked={selectedRowIds.has(row.rowId!)}\n size={'small'}\n onChange={event => {\n if (event.target.checked) {\n setSelectedRowIds(selectedRowIds.add(row.rowId!))\n } else {\n setSelectedRowIds(selectedRowIds.remove(row.rowId!))\n }\n }}\n />\n }\n label={\n <Typography variant={'smallText1'}>\n {row.values[rejectionReasonFormTextIndex]}\n </Typography>\n }\n />\n ))}\n </Stack>\n </Collapse>\n </>\n )\n}\n\n/\n Renders a form for selecting individual rejection reasons grouped by category.\n * The rejection reason data comes from the table whose data is fetched in the tableQuery prop.\n /\nfunction SelectRejectionReasonsForm(props: SelectRejectionReasonsFormProps) {\n const {\n tableQuery,\n selectedRowIds,\n setSelectedRowIds,\n rejectionFormPromptCopy,\n } = props\n const { data: tableData, isLoading, error } = tableQuery\n const categoryIndex = tableData?.queryResult?.queryResults.headers.findIndex(\n header => header.name.toLowerCase() === CATEGORY_COLUMN_NAME,\n )\n const rejectionReasonFormTextIndex =\n tableData?.queryResult?.queryResults.headers.findIndex(\n header =>\n header.name.toLowerCase() === REJECTION_REASON_FORM_TEXT_COLUMN_NAME,\n )\n\n const rowsGroupedByCategory =\n tableData &&\n tableData.queryResult &&\n tableData.queryResult.queryResults.rows.reduce(\n (acc: Record<string, Row[]>, row) => {\n const category: string = row.values[categoryIndex!]!\n acc[category] = [...(acc[category] \|\| []), row]\n return acc\n },\n {},\n )\n return (\n <>\n <Typography variant=\"headline3\" gutterBottom>\n Reasons for rejecting\n </Typography>\n {rejectionFormPromptCopy && (\n <Typography variant=\"body1\" gutterBottom>\n {rejectionFormPromptCopy}\n </Typography>\n )}\n {isLoading && (\n <Stack sx={{ my: 2 }}>\n <SynapseSpinner size={30} />\n </Stack>\n )}\n {error && <ErrorBanner error={error} />}\n {rowsGroupedByCategory && (\n <FormControl>\n {Object.keys(rowsGroupedByCategory).map(category => (\n <RejectionCategory\n key={category}\n category={category}\n rows={rowsGroupedByCategory[category]}\n selectedRowIds={selectedRowIds}\n setSelectedRowIds={setSelectedRowIds}\n rejectionReasonFormTextIndex={rejectionReasonFormTextIndex!}\n initialIsExpanded={\n Object.keys(rowsGroupedByCategory).length === 1\n }\n />\n ))}\n </FormControl>\n )}\n <Typography variant=\"headline3\" sx={{ mt: 1 }} gutterBottom>\n We’ll generate a response email message based on your selections.\n </Typography>\n <Typography variant=\"body1\" gutterBottom>\n If your reasons for rejecting are not shown here, that’s okay! You can\n edit the complete text of the message on the next screen before sending\n it.\n </Typography>\n </>\n )\n}\n\ntype DraftRejectionMessageProps = {\n emailText: string\n setEmailText: Dispatch<SetStateAction<string>>\n}\n\n/\n Presents a text field form that can be used to directly modify the rejection message.\n /\nfunction DraftRejectionMessage(props: DraftRejectionMessageProps) {\n const { emailText, setEmailText } = props\n return (\n <>\n <Typography variant=\"headline3\" gutterBottom>\n Edit the text of the rejection message\n </Typography>\n <Typography variant=\"body1\" gutterBottom>\n This message will be sent to the requester. You may edit it, or add\n custom text to the message.\n </Typography>\n <TextField\n multiline\n fullWidth\n rows={15}\n value={emailText}\n onChange={event => {\n setEmailText(event.target.value)\n }}\n />\n </>\n )\n}\ntype RejectionMessageObject = {\n [category: string]: {\n sectionText: string\n reasons: string[]\n }\n}\n\n/\n Modal component presented to a data access submission reviewer when they decide to reject a request.\n * The modal contains a form for selecting rejection reasons and a text field for editing the rejection message.\n * After crafting a message, the user can reject the submission and send the message to the requester.\n /\nexport function CannedRejectionDialog(props: CannedRejectionDialogProps) {\n const {\n open,\n tableId,\n onClose,\n onConfirm: onReject,\n defaultMessagePrefix = '',\n defaultMessageAppend = '',\n rejectionFormPromptCopy,\n children,\n error,\n } = props\n\n const [step, setStep] = useState<1 \| 2>(1)\n // selectedRowIds are the row IDs of the canned responses the user selected:\n const [emailText, setEmailText] = useState('')\n const [selectedRowIds, setSelectedRowIds] = useState(Set<number>())\n\n // Fetch the table data\n const tableQuery = useGetFullTableQueryResults({\n entityId: tableId,\n query: {\n sql: `SELECT FROM ${tableId}`,\n },\n partMask: BUNDLE_MASK_QUERY_RESULTS,\n concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n })\n\n const { data } = tableQuery\n\n const categoryIndex = data?.queryResult?.queryResults.headers.findIndex(\n header => header.name.toLowerCase() === CATEGORY_COLUMN_NAME,\n )\n const categorySectionEmailTextIndex =\n data?.queryResult?.queryResults.headers.findIndex(\n header =>\n header.name.toLowerCase() === CATEGORY_SECTION_EMAIL_TEXT_COLUMN_NAME,\n )\n\n const reasonEmailTextIndex =\n data?.queryResult?.queryResults.headers.findIndex(\n header =>\n header.name.toLowerCase() === REJECTION_REASON_EMAIL_TEXT_COLUMN_NAME,\n )\n\n // Transform the selected rejection reasons into an object that can be easily transformed into an email\n const defaultEmailMessageObject: RejectionMessageObject \| undefined =\n data &&\n data.queryResult &&\n selectedRowIds.reduce((messageObject: RejectionMessageObject, rowId) => {\n const row = data.queryResult!.queryResults.rows.find(\n row => row.rowId === rowId,\n )!\n const category = row.values[categoryIndex!]!\n const sectionText = row.values[categorySectionEmailTextIndex!]!\n const reasonText = row.values[reasonEmailTextIndex!]!\n if (messageObject[category]) {\n messageObject[category].reasons = [\n ...messageObject[category].reasons,\n reasonText,\n ]\n } else {\n messageObject[category] = {\n sectionText: sectionText,\n reasons: [reasonText],\n }\n }\n return messageObject\n }, {})\n\n // Using the rejection message object, create the email template.\n const defaultEmailMessage =\n defaultEmailMessageObject &&\n defaultMessagePrefix +\n Object.keys(defaultEmailMessageObject).reduce((message, key) => {\n message += '\\n'\n const sectionText = defaultEmailMessageObject[key].sectionText\n if (sectionText) {\n message += sectionText + '\\n'\n }\n\n for (const reason of defaultEmailMessageObject[key].reasons) {\n if (reason != null) {\n message += '\\n* ' + reason.replaceAll('\\\\n', '\\n') + '\\n'\n }\n }\n return message\n }, '') +\n defaultMessageAppend\n\n /* If the selected rows change, then reset the email text. */\n useEffect(() => {\n if (defaultEmailMessage) {\n setEmailText(defaultEmailMessage)\n }\n // Specifically fire on update to just selectedRowIds\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [selectedRowIds])\n\n // If fetching/processing the table fails, gracefully fall back to just show the email template\n return (\n <ConfirmationDialog\n open={open}\n onCancel={() => {\n if (step === 1) {\n onClose()\n }\n if (step === 2) {\n setStep(1)\n }\n }}\n maxWidth={'md'}\n fullWidth\n title=\"Reject Request?\"\n content={\n <>\n {step === 1 && (\n <SelectRejectionReasonsForm\n tableQuery={tableQuery}\n selectedRowIds={selectedRowIds}\n setSelectedRowIds={setSelectedRowIds}\n rejectionFormPromptCopy={rejectionFormPromptCopy}\n />\n )}\n {step === 2 && (\n <>\n <DraftRejectionMessage\n emailText={emailText}\n setEmailText={setEmailText}\n />\n {children}\n </>\n )}\n {error && (\n <FullWidthAlert\n variant={'danger'}\n description={error.reason}\n isGlobal={false}\n />\n )}\n </>\n }\n onConfirm={() => {\n if (step === 1) {\n setStep(2)\n }\n if (step === 2) {\n onReject(emailText)\n }\n }}\n confirmButtonProps={{\n children: step === 1 ? 'Generate Email' : 'Reject and Notify Requester',\n }}\n cancelButtonProps={{\n children: step === 1 ? 'Cancel' : 'Back',\n }}\n />\n )\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"CannedRejectionDialog.js","names":[],"sources":["../../../src/components/CannedRejectionDialog/CannedRejectionDialog.tsx"],"sourcesContent":["import { useGetFullTableQueryResults } from '@/synapse-queries'\nimport { BUNDLE_MASK_QUERY_RESULTS } from '@/utils/SynapseConstants'\nimport {\n Checkbox,\n Collapse,\n FormControl,\n FormControlLabel,\n Stack,\n TextField,\n Typography,\n} from '@mui/material'\nimport { SynapseClientError } from '@sage-bionetworks/synapse-client/util/SynapseClientError'\nimport { QueryResultBundle, Row } from '@sage-bionetworks/synapse-types'\nimport { UseQueryResult } from '@tanstack/react-query'\nimport { Set } from 'immutable'\nimport { Dispatch, ReactNode, SetStateAction, useEffect, useState } from 'react'\nimport ConfirmationDialog from '../ConfirmationDialog'\nimport { ErrorBanner } from '../error/ErrorBanner'\nimport FullWidthAlert from '../FullWidthAlert/FullWidthAlert'\nimport IconSvg from '../IconSvg/IconSvg'\nimport { SynapseSpinner } from '../LoadingScreen/LoadingScreen'\n\nconst CATEGORY_COLUMN_NAME = 'category'\nconst CATEGORY_SECTION_EMAIL_TEXT_COLUMN_NAME = 'category email prompt'\nconst REJECTION_REASON_FORM_TEXT_COLUMN_NAME = 'rejection reason'\nconst REJECTION_REASON_EMAIL_TEXT_COLUMN_NAME = 'email text'\n\nexport type CannedRejectionDialogProps = {\n open: boolean\n /* SynID of the table which contains the email responses which should populate this modal /\n tableId: string\n / Callback invoked when the rejection is confirmed /\n onConfirm: (message: string) => void\n onClose: () => void\n /* Text injected into the beginning of the email template /\n defaultMessagePrefix?: string\n /* Text appended onto the end of the email template /\n defaultMessageAppend?: string\n /* Text to display above the canned rejection reasons /\n rejectionFormPromptCopy?: string\n /* Error to display, in case one occurred in the callback to `onReject` /\n error: SynapseClientError \| null\n /* Optional children, can be used to extend the form as needed on step 2 /\n children?: ReactNode\n}\n\ntype RejectionCategoryProps = {\n category: string\n rows: Row[]\n rejectionReasonFormTextIndex: number\n selectedRowIds: Set<number>\n setSelectedRowIds: Dispatch<SetStateAction<Set<number>>>\n initialIsExpanded?: boolean\n}\n\ntype SelectRejectionReasonsFormProps = {\n tableQuery: UseQueryResult<QueryResultBundle, SynapseClientError>\n selectedRowIds: Set<number>\n setSelectedRowIds: Dispatch<SetStateAction<Set<number>>>\n rejectionFormPromptCopy?: string\n}\n\n/\n Renders a rejection reason category and checkboxes for each reason in the category\n /\nfunction RejectionCategory(props: RejectionCategoryProps) {\n const {\n category,\n rows,\n selectedRowIds,\n setSelectedRowIds,\n rejectionReasonFormTextIndex,\n initialIsExpanded = false,\n } = props\n const [isExpanded, setIsExpanded] = useState(initialIsExpanded)\n\n return (\n <>\n <Typography\n variant=\"body1\"\n onClick={() => setIsExpanded(!isExpanded)}\n sx={{ fontWeight: 700, cursor: 'pointer', my: 1 }}\n >\n <IconSvg\n icon={isExpanded ? 'expandMore' : 'chevronRight'}\n sx={{ color: 'grey.700' }}\n wrap={false}\n />\n {category}\n </Typography>\n <Collapse in={isExpanded}>\n <Stack sx={{ ml: 3 }}>\n {(rows ?? []).map(row => (\n <FormControlLabel\n key={row.rowId}\n control={\n <Checkbox\n checked={selectedRowIds.has(row.rowId!)}\n size={'small'}\n onChange={event => {\n if (event.target.checked) {\n setSelectedRowIds(selectedRowIds.add(row.rowId!))\n } else {\n setSelectedRowIds(selectedRowIds.remove(row.rowId!))\n }\n }}\n />\n }\n label={\n <Typography variant={'smallText1'}>\n {row.values[rejectionReasonFormTextIndex]}\n </Typography>\n }\n />\n ))}\n </Stack>\n </Collapse>\n </>\n )\n}\n\n/\n Renders a form for selecting individual rejection reasons grouped by category.\n * The rejection reason data comes from the table whose data is fetched in the tableQuery prop.\n /\nfunction SelectRejectionReasonsForm(props: SelectRejectionReasonsFormProps) {\n const {\n tableQuery,\n selectedRowIds,\n setSelectedRowIds,\n rejectionFormPromptCopy,\n } = props\n const { data: tableData, isLoading, error } = tableQuery\n const categoryIndex = tableData?.queryResult?.queryResults.headers.findIndex(\n header => header.name.toLowerCase() === CATEGORY_COLUMN_NAME,\n )\n const rejectionReasonFormTextIndex =\n tableData?.queryResult?.queryResults.headers.findIndex(\n header =>\n header.name.toLowerCase() === REJECTION_REASON_FORM_TEXT_COLUMN_NAME,\n )\n\n const rowsGroupedByCategory =\n tableData &&\n tableData.queryResult &&\n tableData.queryResult.queryResults.rows.reduce(\n (acc: Record<string, Row[]>, row) => {\n const category: string = row.values[categoryIndex!]!\n acc[category] = [...(acc[category] \|\| []), row]\n return acc\n },\n {},\n )\n return (\n <>\n <Typography variant=\"headline3\" gutterBottom>\n Reasons for rejecting\n </Typography>\n {rejectionFormPromptCopy && (\n <Typography variant=\"body1\" gutterBottom>\n {rejectionFormPromptCopy}\n </Typography>\n )}\n {isLoading && (\n <Stack sx={{ my: 2 }}>\n <SynapseSpinner size={30} />\n </Stack>\n )}\n {error && <ErrorBanner error={error} />}\n {rowsGroupedByCategory && (\n <FormControl>\n {Object.keys(rowsGroupedByCategory).map(category => (\n <RejectionCategory\n key={category}\n category={category}\n rows={rowsGroupedByCategory[category]}\n selectedRowIds={selectedRowIds}\n setSelectedRowIds={setSelectedRowIds}\n rejectionReasonFormTextIndex={rejectionReasonFormTextIndex!}\n initialIsExpanded={\n Object.keys(rowsGroupedByCategory).length === 1\n }\n />\n ))}\n </FormControl>\n )}\n <Typography variant=\"headline3\" sx={{ mt: 1 }} gutterBottom>\n We’ll generate a response email message based on your selections.\n </Typography>\n <Typography variant=\"body1\" gutterBottom>\n If your reasons for rejecting are not shown here, that’s okay! You can\n edit the complete text of the message on the next screen before sending\n it.\n </Typography>\n </>\n )\n}\n\ntype DraftRejectionMessageProps = {\n emailText: string\n setEmailText: Dispatch<SetStateAction<string>>\n}\n\n/\n Presents a text field form that can be used to directly modify the rejection message.\n /\nfunction DraftRejectionMessage(props: DraftRejectionMessageProps) {\n const { emailText, setEmailText } = props\n return (\n <>\n <Typography variant=\"headline3\" gutterBottom>\n Edit the text of the rejection message\n </Typography>\n <Typography variant=\"body1\" gutterBottom>\n This message will be sent to the requester. You may edit it, or add\n custom text to the message.\n </Typography>\n <TextField\n multiline\n fullWidth\n rows={15}\n value={emailText}\n onChange={event => {\n setEmailText(event.target.value)\n }}\n />\n </>\n )\n}\ntype RejectionMessageObject = {\n [category: string]: {\n sectionText: string\n reasons: string[]\n }\n}\n\n/\n Modal component presented to a data access submission reviewer when they decide to reject a request.\n * The modal contains a form for selecting rejection reasons and a text field for editing the rejection message.\n * After crafting a message, the user can reject the submission and send the message to the requester.\n /\nexport function CannedRejectionDialog(props: CannedRejectionDialogProps) {\n const {\n open,\n tableId,\n onClose,\n onConfirm: onReject,\n defaultMessagePrefix = '',\n defaultMessageAppend = '',\n rejectionFormPromptCopy,\n children,\n error,\n } = props\n\n const [step, setStep] = useState<1 \| 2>(1)\n // selectedRowIds are the row IDs of the canned responses the user selected:\n const [emailText, setEmailText] = useState('')\n const [selectedRowIds, setSelectedRowIds] = useState(Set<number>())\n\n // Fetch the table data\n const tableQuery = useGetFullTableQueryResults({\n entityId: tableId,\n query: {\n sql: `SELECT FROM ${tableId}`,\n },\n partMask: BUNDLE_MASK_QUERY_RESULTS,\n concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n })\n\n const { data } = tableQuery\n\n const categoryIndex = data?.queryResult?.queryResults.headers.findIndex(\n header => header.name.toLowerCase() === CATEGORY_COLUMN_NAME,\n )\n const categorySectionEmailTextIndex =\n data?.queryResult?.queryResults.headers.findIndex(\n header =>\n header.name.toLowerCase() === CATEGORY_SECTION_EMAIL_TEXT_COLUMN_NAME,\n )\n\n const reasonEmailTextIndex =\n data?.queryResult?.queryResults.headers.findIndex(\n header =>\n header.name.toLowerCase() === REJECTION_REASON_EMAIL_TEXT_COLUMN_NAME,\n )\n\n // Transform the selected rejection reasons into an object that can be easily transformed into an email\n const defaultEmailMessageObject: RejectionMessageObject \| undefined =\n data &&\n data.queryResult &&\n selectedRowIds.reduce((messageObject: RejectionMessageObject, rowId) => {\n const row = data.queryResult!.queryResults.rows.find(\n row => row.rowId === rowId,\n )!\n const category = row.values[categoryIndex!]!\n const sectionText = row.values[categorySectionEmailTextIndex!]!\n const reasonText = row.values[reasonEmailTextIndex!]!\n if (messageObject[category]) {\n messageObject[category].reasons = [\n ...messageObject[category].reasons,\n reasonText,\n ]\n } else {\n messageObject[category] = {\n sectionText: sectionText,\n reasons: [reasonText],\n }\n }\n return messageObject\n }, {})\n\n // Using the rejection message object, create the email template.\n const defaultEmailMessage =\n defaultEmailMessageObject &&\n defaultMessagePrefix +\n Object.keys(defaultEmailMessageObject).reduce((message, key) => {\n message += '\\n'\n const sectionText = defaultEmailMessageObject[key].sectionText\n if (sectionText) {\n message += sectionText + '\\n'\n }\n\n for (const reason of defaultEmailMessageObject[key].reasons) {\n if (reason != null) {\n message += '\\n* ' + reason.replaceAll('\\\\n', '\\n') + '\\n'\n }\n }\n return message\n }, '') +\n defaultMessageAppend\n\n /* If the selected rows change, then reset the email text. */\n useEffect(() => {\n if (defaultEmailMessage) {\n setEmailText(defaultEmailMessage)\n }\n // Specifically fire on update to just selectedRowIds\n // oxlint-disable-next-line react-hooks/exhaustive-deps\n }, [selectedRowIds])\n\n // If fetching/processing the table fails, gracefully fall back to just show the email template\n return (\n <ConfirmationDialog\n open={open}\n onCancel={() => {\n if (step === 1) {\n onClose()\n }\n if (step === 2) {\n setStep(1)\n }\n }}\n maxWidth={'md'}\n fullWidth\n title=\"Reject Request?\"\n content={\n <>\n {step === 1 && (\n <SelectRejectionReasonsForm\n tableQuery={tableQuery}\n selectedRowIds={selectedRowIds}\n setSelectedRowIds={setSelectedRowIds}\n rejectionFormPromptCopy={rejectionFormPromptCopy}\n />\n )}\n {step === 2 && (\n <>\n <DraftRejectionMessage\n emailText={emailText}\n setEmailText={setEmailText}\n />\n {children}\n </>\n )}\n {error && (\n <FullWidthAlert\n variant={'danger'}\n description={error.reason}\n isGlobal={false}\n />\n )}\n </>\n }\n onConfirm={() => {\n if (step === 1) {\n setStep(2)\n }\n if (step === 2) {\n onReject(emailText)\n }\n }}\n confirmButtonProps={{\n children: step === 1 ? 'Generate Email' : 'Reject and Notify Requester',\n }}\n cancelButtonProps={{\n children: step === 1 ? 'Cancel' : 'Back',\n }}\n />\n )\n}\n"],"mappings":"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"}

package/dist/components/ChallengeSubmission/SubmissionDirectoryList.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SubmissionDirectoryList.js","names":[],"sources":["../../../src/components/ChallengeSubmission/SubmissionDirectoryList.tsx"],"sourcesContent":["import SynapseClient from '@/synapse-client'\nimport {\n invalidateAllQueriesForEntity,\n useGetEntities,\n useGetEntityChildren,\n} from '@/synapse-queries'\nimport { useSynapseContext } from '@/utils'\nimport { formatDate } from '@/utils/functions/DateFormatter'\nimport {\n BackendDestinationEnum,\n getEndpoint,\n} from '@/utils/functions/getEndpoint'\nimport { NotesTwoTone } from '@mui/icons-material'\nimport { Box, Button, Radio, Typography } from '@mui/material'\nimport { DataGrid, GridCellParams, GridColDef } from '@mui/x-data-grid'\nimport { EntityType } from '@sage-bionetworks/synapse-client'\nimport { SynapseClientError } from '@sage-bionetworks/synapse-client/util/SynapseClientError'\nimport {\n Direction,\n Entity,\n EntityChildrenRequest,\n EntityHeader,\n EntityLookupRequest,\n FILE_ENTITY_CONCRETE_TYPE_VALUE,\n FileEntity,\n FileUploadComplete,\n SortBy,\n UploadCallbackResp,\n} from '@sage-bionetworks/synapse-types'\nimport { useQueryClient } from '@tanstack/react-query'\nimport dayjs from 'dayjs'\nimport { useEffect, useMemo, useState } from 'react'\nimport { Link } from 'react-router'\nimport ConfirmationDialog from '../ConfirmationDialog'\nimport CopyToClipboardIcon from '../CopyToClipboardIcon'\nimport { ErrorBanner } from '../error/ErrorBanner'\nimport FileUpload from '../FileUpload'\nimport IconSvg from '../IconSvg'\nimport { EntityItem } from './ChallengeSubmission'\n\ntype SubmissionDirectoryRow = {\n id: string\n name: string\n modifiedOn: string\n}\n\ntype SubmissionDirectoryListProps = {\n pageSize: number\n challengeProjectId: string\n entityType: typeof EntityType.dockerrepo \| typeof EntityType.file\n onItemSelected: (selected: EntityItem) => void\n}\n\ntype FileUploadAttempt = FileUploadComplete & {\n entityId?: string\n}\n\nfunction SubmissionDirectoryList({\n pageSize,\n challengeProjectId,\n entityType,\n onItemSelected,\n}: SubmissionDirectoryListProps) {\n const queryClient = useQueryClient()\n const { accessToken, keyFactory } = useSynapseContext()\n const [page, setPage] = useState<number>(0)\n const [selectedItem, setSelectedItem] = useState<EntityItem \| undefined>()\n const [errorMessage, setErrorMessage] = useState<string>()\n const [canSubmit, setCanSubmit] = useState<boolean>()\n const [fetchedHeaders, setFetchedHeaders] = useState<EntityHeader[]>([])\n const [nextPageToken, setNextPageToken] = useState<string \| undefined>()\n const [fetchNextPage, setFetchNextPage] = useState<boolean>(false)\n const [confirmOpen, setConfirmOpen] = useState<boolean>(false)\n const [uploadAttempt, setUploadAttempt] = useState<FileUploadAttempt>()\n\n const PER_PAGE = pageSize\n const HEADERS_PER_PAGE = 50\n const PROJECT_URL = `${getEndpoint(\n BackendDestinationEnum.PORTAL_ENDPOINT,\n )}Synapse:${challengeProjectId}`\n\n const request: EntityChildrenRequest = {\n parentId: challengeProjectId,\n nextPageToken: fetchNextPage ? nextPageToken : null,\n includeTypes: [entityType],\n includeTotalChildCount: true,\n sortBy: SortBy.MODIFIED_ON,\n sortDirection: Direction.DESC,\n }\n\n const { data: headerResults, refetch } = useGetEntityChildren(request, {\n enabled: !!challengeProjectId,\n throwOnError: true,\n })\n\n useEffect(() => {\n if (headerResults) {\n const newHeaders = [...fetchedHeaders]\n const headerPage = Math.floor(((page + 1) * PER_PAGE) / HEADERS_PER_PAGE)\n const start = headerPage * HEADERS_PER_PAGE\n newHeaders.splice(start, start + HEADERS_PER_PAGE, ...headerResults.page)\n setFetchedHeaders(newHeaders)\n setFetchNextPage(false)\n setNextPageToken(headerResults.nextPageToken)\n }\n // TODO: Temporary useEffect hook to remove onSuccess QueryOption for @tanstack/react-query v5\n // Refactor this component to remove this effect.\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [headerResults])\n\n function getPageHeaders() {\n const pageStart = page * PER_PAGE\n const pageHeaders = fetchedHeaders.slice(pageStart, pageStart + PER_PAGE)\n return pageHeaders\n }\n\n function reset() {\n setErrorMessage(undefined)\n setCanSubmit(undefined)\n setFetchedHeaders([])\n setNextPageToken(undefined)\n setFetchNextPage(false)\n refetch()\n }\n\n useEffect(() => {\n reset()\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [entityType, pageSize])\n\n const queries = useGetEntities(getPageHeaders())\n const entities = useMemo(\n () =>\n queries\n .filter(q => q.status === 'success')\n .map(q => q.data) as EntityItem[],\n [queries],\n )\n const areEntitiesLoading = queries.some(q => q.isLoading)\n\n const entityChangeHandler = async (value: string) => {\n setCanSubmit(false)\n const entity = entities.find(entity => entity?.id === value)\n if (entity) {\n setSelectedItem(entity)\n if (entityType === EntityType.dockerrepo) {\n let commits\n try {\n commits = await SynapseClient.getDockerTag(\n entity.id!,\n accessToken,\n 0,\n 1,\n )\n } catch (e) {\n return setErrorMessage(e.message)\n }\n if (commits.totalNumberOfResults === 0) {\n return setErrorMessage(\n 'No commits have been made to this repository. Please select a repository with at least one commit.',\n )\n }\n }\n setCanSubmit(true)\n setErrorMessage(undefined)\n }\n }\n\n const columns: GridColDef[] = [\n {\n field: 'radiobutton',\n headerName: '',\n width: 25,\n sortable: false,\n filterable: false,\n hideable: false,\n disableColumnMenu: true,\n renderCell: params => {\n return (\n <Radio\n value={params.id}\n checked={params.id === selectedItem?.id}\n onChange={event => {\n entityChangeHandler(event.target.value)\n }}\n />\n )\n },\n },\n {\n field: 'name',\n headerName:\n entityType === EntityType.dockerrepo\n ? 'Docker Repository'\n : 'File Name',\n flex: 1,\n filterable: false,\n hideable: false,\n disableColumnMenu: true,\n renderCell: (params: GridCellParams<Entity, SubmissionDirectoryRow>) => (\n <Link\n to={{\n pathname: `${getEndpoint(\n BackendDestinationEnum.PORTAL_ENDPOINT,\n )}Synapse:${params.row.id}`,\n }}\n target=\"_blank\"\n >\n {params.row.name}\n </Link>\n ),\n },\n {\n field: 'modifiedOn',\n headerName: 'Updated On',\n width: 100,\n filterable: false,\n hideable: false,\n disableColumnMenu: true,\n },\n {\n field: 'id',\n headerName: 'ID',\n width: 200,\n filterable: false,\n hideable: false,\n disableColumnMenu: true,\n },\n ]\n\n const getRows = (entities: EntityItem[]) => {\n const newRows: SubmissionDirectoryRow[] = []\n entities.forEach(entity => {\n newRows.push({\n id: entity.id!,\n name:\n entityType === EntityType.dockerrepo\n ? (entity.repositoryName ?? entity.name)\n : entity.name,\n modifiedOn: formatDate(dayjs(entity.modifiedOn), 'MM/DD/YY'),\n })\n })\n return newRows\n }\n\n const handlePageChange = (newPageNum: number) => {\n const lastIndexNeeded = Math.min(\n headerResults?.totalChildCount ?? 0,\n (newPageNum + 1) * PER_PAGE,\n )\n if (lastIndexNeeded > fetchedHeaders.length) {\n setFetchNextPage(true)\n }\n setPage(newPageNum)\n }\n\n const itemSelectedHandler = () => {\n onItemSelected(selectedItem!)\n }\n\n function createEntity(file: FileUploadAttempt) {\n // Create Entity\n if (!file) return\n const { fileHandleId, fileName } = file\n const newFileEntity: FileEntity = {\n parentId: challengeProjectId,\n name: fileName,\n concreteType: FILE_ENTITY_CONCRETE_TYPE_VALUE,\n dataFileHandleId: fileHandleId,\n }\n SynapseClient.createEntity(newFileEntity, accessToken)\n .then(() => {\n reset()\n })\n .catch((err: SynapseClientError) => {\n setErrorMessage(err.reason)\n })\n }\n\n async function updateEntity() {\n if (!uploadAttempt) return\n const { fileHandleId, entityId } = uploadAttempt\n if (!entityId)\n return setErrorMessage('Error: missing entityId. Please try again.')\n // Get the entity\n let entity: FileEntity\n try {\n entity = await SynapseClient.getEntity(accessToken, entityId)\n } catch (err) {\n return setErrorMessage(`The entity ${entityId} could not be retrieved.`)\n }\n\n const updateRequest: FileEntity = {\n id: entity.id,\n name: entity.name,\n dataFileHandleId: fileHandleId,\n concreteType: FILE_ENTITY_CONCRETE_TYPE_VALUE,\n parentId: entity.parentId,\n etag: entity.etag,\n modifiedOn: entity.modifiedOn,\n }\n\n try {\n const updatedEntity = await SynapseClient.updateEntity(\n updateRequest,\n accessToken,\n true,\n )\n await invalidateAllQueriesForEntity(\n queryClient,\n keyFactory,\n updatedEntity.id!,\n )\n queryClient.setQueryData(\n keyFactory.getEntityQueryKey(updatedEntity.id!),\n updatedEntity,\n )\n reset()\n } catch (err) {\n setErrorMessage(err.reason)\n }\n }\n\n const handleUpload = async (response: UploadCallbackResp) => {\n if (response.success && response.resp) {\n const { fileName } = response.resp\n\n // Lookup entity\n const entityLookupRequest: EntityLookupRequest = {\n entityName: fileName,\n parentId: challengeProjectId,\n }\n try {\n const entityId = await SynapseClient.lookupChildEntity(\n entityLookupRequest,\n accessToken,\n )\n // Entity exists, prompt user to update it\n if (entityId) {\n setUploadAttempt({ ...response.resp, entityId: entityId.id })\n setConfirmOpen(true)\n }\n } catch (err) {\n // An existing entity was not found for this file, create it\n setUploadAttempt(undefined)\n createEntity(response.resp)\n }\n } else if (!response.success && response.error) {\n setErrorMessage(response.error.reason as string)\n } else {\n setErrorMessage('An unknown error occurred. Please try again.')\n }\n }\n\n return (\n <Box>\n <Box\n sx={{\n display: 'flex',\n backgroundColor: '#FBFBFC',\n padding: '10px',\n justifyContent: 'space-between',\n }}\n >\n <Typography\n variant=\"h6\"\n sx={{ fontSize: '18px', lineHeight: '20px', fontWeight: 700 }}\n >\n {entityType === EntityType.file\n ? 'Submit File'\n : 'Submit Docker Image'}\n </Typography>\n <Box sx={{ display: 'flex' }}>\n <Typography\n variant=\"body1\"\n sx={{ fontSize: '14px', color: '#71767F' }}\n >\n Your Project SynID:{' '}\n <Link to={{ pathname: PROJECT_URL }} target=\"_blank\">\n {challengeProjectId}\n </Link>\n </Typography>\n <CopyToClipboardIcon value={PROJECT_URL} sx={{ marginTop: '-4px' }} />\n </Box>\n </Box>\n <Box\n sx={{\n my: 3,\n display: 'flex',\n }}\n >\n <NotesTwoTone\n sx={{\n width: '16px',\n height: '16px',\n verticalAlign: 'text-bottom',\n }}\n />\n <Box\n sx={{\n ml: 1,\n }}\n >\n {entityType === EntityType.file && (\n <>\n Choose a prediction file from your submission directory below and\n click \"Submit Selection\" to pick an evaluation queue. If you need\n to add a new file, click \"Upload File\" first.\n </>\n )}\n {entityType === EntityType.dockerrepo && (\n <>\n Choose a Docker image from your submission directory below and\n click \"Submit Selection\" to pick an image version and evaluation\n queue. If you need to upload a new image to your project (\n <code>{challengeProjectId}</code>), see our{' '}\n <Link\n to=\"https://github.com/Sage-Bionetworks-Challenges/sample-model-templates#build-your-model\"\n target=\"_blank\"\n >\n Docker model submission guide\n </Link>{' '}\n for command-line instructions on how to build and upload.\n </>\n )}\n </Box>\n </Box>\n <Box>\n <DataGrid\n loading={areEntitiesLoading}\n columns={columns}\n rows={getRows(entities)}\n rowCount={headerResults?.totalChildCount ?? 0}\n pagination\n paginationMode=\"server\"\n paginationModel={{ page, pageSize: PER_PAGE }}\n pageSizeOptions={[PER_PAGE]}\n onPaginationModelChange={({ page }) => {\n handlePageChange(page)\n }}\n density=\"compact\"\n autoHeight\n sx={{\n fontSize: '14px',\n border: 'none',\n height: '100%',\n '& .MuiDataGrid-columnHeader': {\n backgroundColor: '#F1F3F5',\n },\n '& .Mui-odd': {\n backgroundColor: '#FBFBFC',\n },\n '.MuiDataGrid-columnHeaderTitleContainer': {\n justifyContent: 'space-between',\n },\n '.radio': {\n display: 'flex',\n alignItems: 'center',\n height: '100%',\n },\n }}\n getRowClassName={params =>\n params.indexRelativeToCurrentPage % 2 === 0 ? 'Mui-even' : 'Mui-odd'\n }\n />\n </Box>\n {errorMessage && <ErrorBanner error={errorMessage}></ErrorBanner>}\n <Box\n sx={{\n display: 'flex',\n justifyContent: 'space-between',\n }}\n >\n {entityType === EntityType.file && (\n <FileUpload\n label=\"Upload File\"\n buttonProps={{\n variant: 'outlined',\n endIcon: <IconSvg icon=\"upload\" />,\n sx: { lineHeight: 1 },\n }}\n onComplete={resp => {\n handleUpload(resp)\n }}\n />\n )}\n <Button\n color=\"primary\"\n variant=\"contained\"\n onClick={itemSelectedHandler}\n disabled={!canSubmit}\n >\n Submit Selection\n </Button>\n </Box>\n <ConfirmationDialog\n open={confirmOpen}\n title=\"File exists\"\n content={\n <Typography variant=\"body1\" sx={{ fontSize: '16px' }}>\n A file named "{uploadAttempt?.fileName}" (\n {uploadAttempt?.entityId}) already exists in this location. Do you\n want to update the existing file and create a new version?\n </Typography>\n }\n onCancel={() => setConfirmOpen(false)}\n onConfirm={() => {\n updateEntity()\n setConfirmOpen(false)\n }}\n />\n </Box>\n )\n}\n\nexport default SubmissionDirectoryList\n"],"mappings":"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"}
1	+ {"version":3,"file":"SubmissionDirectoryList.js","names":[],"sources":["../../../src/components/ChallengeSubmission/SubmissionDirectoryList.tsx"],"sourcesContent":["import SynapseClient from '@/synapse-client'\nimport {\n invalidateAllQueriesForEntity,\n useGetEntities,\n useGetEntityChildren,\n} from '@/synapse-queries'\nimport { useSynapseContext } from '@/utils'\nimport { formatDate } from '@/utils/functions/DateFormatter'\nimport {\n BackendDestinationEnum,\n getEndpoint,\n} from '@/utils/functions/getEndpoint'\nimport { NotesTwoTone } from '@mui/icons-material'\nimport { Box, Button, Radio, Typography } from '@mui/material'\nimport { DataGrid, GridCellParams, GridColDef } from '@mui/x-data-grid'\nimport { EntityType } from '@sage-bionetworks/synapse-client'\nimport { SynapseClientError } from '@sage-bionetworks/synapse-client/util/SynapseClientError'\nimport {\n Direction,\n Entity,\n EntityChildrenRequest,\n EntityHeader,\n EntityLookupRequest,\n FILE_ENTITY_CONCRETE_TYPE_VALUE,\n FileEntity,\n FileUploadComplete,\n SortBy,\n UploadCallbackResp,\n} from '@sage-bionetworks/synapse-types'\nimport { useQueryClient } from '@tanstack/react-query'\nimport dayjs from 'dayjs'\nimport { useEffect, useMemo, useState } from 'react'\nimport { Link } from 'react-router'\nimport ConfirmationDialog from '../ConfirmationDialog'\nimport CopyToClipboardIcon from '../CopyToClipboardIcon'\nimport { ErrorBanner } from '../error/ErrorBanner'\nimport FileUpload from '../FileUpload'\nimport IconSvg from '../IconSvg'\nimport { EntityItem } from './ChallengeSubmission'\n\ntype SubmissionDirectoryRow = {\n id: string\n name: string\n modifiedOn: string\n}\n\ntype SubmissionDirectoryListProps = {\n pageSize: number\n challengeProjectId: string\n entityType: typeof EntityType.dockerrepo \| typeof EntityType.file\n onItemSelected: (selected: EntityItem) => void\n}\n\ntype FileUploadAttempt = FileUploadComplete & {\n entityId?: string\n}\n\nfunction SubmissionDirectoryList({\n pageSize,\n challengeProjectId,\n entityType,\n onItemSelected,\n}: SubmissionDirectoryListProps) {\n const queryClient = useQueryClient()\n const { accessToken, keyFactory } = useSynapseContext()\n const [page, setPage] = useState<number>(0)\n const [selectedItem, setSelectedItem] = useState<EntityItem \| undefined>()\n const [errorMessage, setErrorMessage] = useState<string>()\n const [canSubmit, setCanSubmit] = useState<boolean>()\n const [fetchedHeaders, setFetchedHeaders] = useState<EntityHeader[]>([])\n const [nextPageToken, setNextPageToken] = useState<string \| undefined>()\n const [fetchNextPage, setFetchNextPage] = useState<boolean>(false)\n const [confirmOpen, setConfirmOpen] = useState<boolean>(false)\n const [uploadAttempt, setUploadAttempt] = useState<FileUploadAttempt>()\n\n const PER_PAGE = pageSize\n const HEADERS_PER_PAGE = 50\n const PROJECT_URL = `${getEndpoint(\n BackendDestinationEnum.PORTAL_ENDPOINT,\n )}Synapse:${challengeProjectId}`\n\n const request: EntityChildrenRequest = {\n parentId: challengeProjectId,\n nextPageToken: fetchNextPage ? nextPageToken : null,\n includeTypes: [entityType],\n includeTotalChildCount: true,\n sortBy: SortBy.MODIFIED_ON,\n sortDirection: Direction.DESC,\n }\n\n const { data: headerResults, refetch } = useGetEntityChildren(request, {\n enabled: !!challengeProjectId,\n throwOnError: true,\n })\n\n useEffect(() => {\n if (headerResults) {\n const newHeaders = [...fetchedHeaders]\n const headerPage = Math.floor(((page + 1) * PER_PAGE) / HEADERS_PER_PAGE)\n const start = headerPage * HEADERS_PER_PAGE\n newHeaders.splice(start, start + HEADERS_PER_PAGE, ...headerResults.page)\n setFetchedHeaders(newHeaders)\n setFetchNextPage(false)\n setNextPageToken(headerResults.nextPageToken)\n }\n // TODO: Temporary useEffect hook to remove onSuccess QueryOption for @tanstack/react-query v5\n // Refactor this component to remove this effect.\n // oxlint-disable-next-line react-hooks/exhaustive-deps\n }, [headerResults])\n\n function getPageHeaders() {\n const pageStart = page * PER_PAGE\n const pageHeaders = fetchedHeaders.slice(pageStart, pageStart + PER_PAGE)\n return pageHeaders\n }\n\n function reset() {\n setErrorMessage(undefined)\n setCanSubmit(undefined)\n setFetchedHeaders([])\n setNextPageToken(undefined)\n setFetchNextPage(false)\n refetch()\n }\n\n useEffect(() => {\n reset()\n // oxlint-disable-next-line react-hooks/exhaustive-deps\n }, [entityType, pageSize])\n\n const queries = useGetEntities(getPageHeaders())\n const entities = useMemo(\n () =>\n queries\n .filter(q => q.status === 'success')\n .map(q => q.data) as EntityItem[],\n [queries],\n )\n const areEntitiesLoading = queries.some(q => q.isLoading)\n\n const entityChangeHandler = async (value: string) => {\n setCanSubmit(false)\n const entity = entities.find(entity => entity?.id === value)\n if (entity) {\n setSelectedItem(entity)\n if (entityType === EntityType.dockerrepo) {\n let commits\n try {\n commits = await SynapseClient.getDockerTag(\n entity.id!,\n accessToken,\n 0,\n 1,\n )\n } catch (e) {\n return setErrorMessage(e.message)\n }\n if (commits.totalNumberOfResults === 0) {\n return setErrorMessage(\n 'No commits have been made to this repository. Please select a repository with at least one commit.',\n )\n }\n }\n setCanSubmit(true)\n setErrorMessage(undefined)\n }\n }\n\n const columns: GridColDef[] = [\n {\n field: 'radiobutton',\n headerName: '',\n width: 25,\n sortable: false,\n filterable: false,\n hideable: false,\n disableColumnMenu: true,\n renderCell: params => {\n return (\n <Radio\n value={params.id}\n checked={params.id === selectedItem?.id}\n onChange={event => {\n entityChangeHandler(event.target.value)\n }}\n />\n )\n },\n },\n {\n field: 'name',\n headerName:\n entityType === EntityType.dockerrepo\n ? 'Docker Repository'\n : 'File Name',\n flex: 1,\n filterable: false,\n hideable: false,\n disableColumnMenu: true,\n renderCell: (params: GridCellParams<Entity, SubmissionDirectoryRow>) => (\n <Link\n to={{\n pathname: `${getEndpoint(\n BackendDestinationEnum.PORTAL_ENDPOINT,\n )}Synapse:${params.row.id}`,\n }}\n target=\"_blank\"\n >\n {params.row.name}\n </Link>\n ),\n },\n {\n field: 'modifiedOn',\n headerName: 'Updated On',\n width: 100,\n filterable: false,\n hideable: false,\n disableColumnMenu: true,\n },\n {\n field: 'id',\n headerName: 'ID',\n width: 200,\n filterable: false,\n hideable: false,\n disableColumnMenu: true,\n },\n ]\n\n const getRows = (entities: EntityItem[]) => {\n const newRows: SubmissionDirectoryRow[] = []\n entities.forEach(entity => {\n newRows.push({\n id: entity.id!,\n name:\n entityType === EntityType.dockerrepo\n ? (entity.repositoryName ?? entity.name)\n : entity.name,\n modifiedOn: formatDate(dayjs(entity.modifiedOn), 'MM/DD/YY'),\n })\n })\n return newRows\n }\n\n const handlePageChange = (newPageNum: number) => {\n const lastIndexNeeded = Math.min(\n headerResults?.totalChildCount ?? 0,\n (newPageNum + 1) * PER_PAGE,\n )\n if (lastIndexNeeded > fetchedHeaders.length) {\n setFetchNextPage(true)\n }\n setPage(newPageNum)\n }\n\n const itemSelectedHandler = () => {\n onItemSelected(selectedItem!)\n }\n\n function createEntity(file: FileUploadAttempt) {\n // Create Entity\n if (!file) return\n const { fileHandleId, fileName } = file\n const newFileEntity: FileEntity = {\n parentId: challengeProjectId,\n name: fileName,\n concreteType: FILE_ENTITY_CONCRETE_TYPE_VALUE,\n dataFileHandleId: fileHandleId,\n }\n SynapseClient.createEntity(newFileEntity, accessToken)\n .then(() => {\n reset()\n })\n .catch((err: SynapseClientError) => {\n setErrorMessage(err.reason)\n })\n }\n\n async function updateEntity() {\n if (!uploadAttempt) return\n const { fileHandleId, entityId } = uploadAttempt\n if (!entityId)\n return setErrorMessage('Error: missing entityId. Please try again.')\n // Get the entity\n let entity: FileEntity\n try {\n entity = await SynapseClient.getEntity(accessToken, entityId)\n } catch (err) {\n return setErrorMessage(`The entity ${entityId} could not be retrieved.`)\n }\n\n const updateRequest: FileEntity = {\n id: entity.id,\n name: entity.name,\n dataFileHandleId: fileHandleId,\n concreteType: FILE_ENTITY_CONCRETE_TYPE_VALUE,\n parentId: entity.parentId,\n etag: entity.etag,\n modifiedOn: entity.modifiedOn,\n }\n\n try {\n const updatedEntity = await SynapseClient.updateEntity(\n updateRequest,\n accessToken,\n true,\n )\n await invalidateAllQueriesForEntity(\n queryClient,\n keyFactory,\n updatedEntity.id!,\n )\n queryClient.setQueryData(\n keyFactory.getEntityQueryKey(updatedEntity.id!),\n updatedEntity,\n )\n reset()\n } catch (err) {\n setErrorMessage(err.reason)\n }\n }\n\n const handleUpload = async (response: UploadCallbackResp) => {\n if (response.success && response.resp) {\n const { fileName } = response.resp\n\n // Lookup entity\n const entityLookupRequest: EntityLookupRequest = {\n entityName: fileName,\n parentId: challengeProjectId,\n }\n try {\n const entityId = await SynapseClient.lookupChildEntity(\n entityLookupRequest,\n accessToken,\n )\n // Entity exists, prompt user to update it\n if (entityId) {\n setUploadAttempt({ ...response.resp, entityId: entityId.id })\n setConfirmOpen(true)\n }\n } catch (err) {\n // An existing entity was not found for this file, create it\n setUploadAttempt(undefined)\n createEntity(response.resp)\n }\n } else if (!response.success && response.error) {\n setErrorMessage(response.error.reason as string)\n } else {\n setErrorMessage('An unknown error occurred. Please try again.')\n }\n }\n\n return (\n <Box>\n <Box\n sx={{\n display: 'flex',\n backgroundColor: '#FBFBFC',\n padding: '10px',\n justifyContent: 'space-between',\n }}\n >\n <Typography\n variant=\"h6\"\n sx={{ fontSize: '18px', lineHeight: '20px', fontWeight: 700 }}\n >\n {entityType === EntityType.file\n ? 'Submit File'\n : 'Submit Docker Image'}\n </Typography>\n <Box sx={{ display: 'flex' }}>\n <Typography\n variant=\"body1\"\n sx={{ fontSize: '14px', color: '#71767F' }}\n >\n Your Project SynID:{' '}\n <Link to={{ pathname: PROJECT_URL }} target=\"_blank\">\n {challengeProjectId}\n </Link>\n </Typography>\n <CopyToClipboardIcon value={PROJECT_URL} sx={{ marginTop: '-4px' }} />\n </Box>\n </Box>\n <Box\n sx={{\n my: 3,\n display: 'flex',\n }}\n >\n <NotesTwoTone\n sx={{\n width: '16px',\n height: '16px',\n verticalAlign: 'text-bottom',\n }}\n />\n <Box\n sx={{\n ml: 1,\n }}\n >\n {entityType === EntityType.file && (\n <>\n Choose a prediction file from your submission directory below and\n click \"Submit Selection\" to pick an evaluation queue. If you need\n to add a new file, click \"Upload File\" first.\n </>\n )}\n {entityType === EntityType.dockerrepo && (\n <>\n Choose a Docker image from your submission directory below and\n click \"Submit Selection\" to pick an image version and evaluation\n queue. If you need to upload a new image to your project (\n <code>{challengeProjectId}</code>), see our{' '}\n <Link\n to=\"https://github.com/Sage-Bionetworks-Challenges/sample-model-templates#build-your-model\"\n target=\"_blank\"\n >\n Docker model submission guide\n </Link>{' '}\n for command-line instructions on how to build and upload.\n </>\n )}\n </Box>\n </Box>\n <Box>\n <DataGrid\n loading={areEntitiesLoading}\n columns={columns}\n rows={getRows(entities)}\n rowCount={headerResults?.totalChildCount ?? 0}\n pagination\n paginationMode=\"server\"\n paginationModel={{ page, pageSize: PER_PAGE }}\n pageSizeOptions={[PER_PAGE]}\n onPaginationModelChange={({ page }) => {\n handlePageChange(page)\n }}\n density=\"compact\"\n autoHeight\n sx={{\n fontSize: '14px',\n border: 'none',\n height: '100%',\n '& .MuiDataGrid-columnHeader': {\n backgroundColor: '#F1F3F5',\n },\n '& .Mui-odd': {\n backgroundColor: '#FBFBFC',\n },\n '.MuiDataGrid-columnHeaderTitleContainer': {\n justifyContent: 'space-between',\n },\n '.radio': {\n display: 'flex',\n alignItems: 'center',\n height: '100%',\n },\n }}\n getRowClassName={params =>\n params.indexRelativeToCurrentPage % 2 === 0 ? 'Mui-even' : 'Mui-odd'\n }\n />\n </Box>\n {errorMessage && <ErrorBanner error={errorMessage}></ErrorBanner>}\n <Box\n sx={{\n display: 'flex',\n justifyContent: 'space-between',\n }}\n >\n {entityType === EntityType.file && (\n <FileUpload\n label=\"Upload File\"\n buttonProps={{\n variant: 'outlined',\n endIcon: <IconSvg icon=\"upload\" />,\n sx: { lineHeight: 1 },\n }}\n onComplete={resp => {\n handleUpload(resp)\n }}\n />\n )}\n <Button\n color=\"primary\"\n variant=\"contained\"\n onClick={itemSelectedHandler}\n disabled={!canSubmit}\n >\n Submit Selection\n </Button>\n </Box>\n <ConfirmationDialog\n open={confirmOpen}\n title=\"File exists\"\n content={\n <Typography variant=\"body1\" sx={{ fontSize: '16px' }}>\n A file named "{uploadAttempt?.fileName}" (\n {uploadAttempt?.entityId}) already exists in this location. Do you\n want to update the existing file and create a new version?\n </Typography>\n }\n onCancel={() => setConfirmOpen(false)}\n onConfirm={() => {\n updateEntity()\n setConfirmOpen(false)\n }}\n />\n </Box>\n )\n}\n\nexport default SubmissionDirectoryList\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAyDA,SAAS,EAAwB,EAC/B,aACA,uBACA,eACA,qBAC+B;CAC/B,IAAM,IAAc,EAAe,GAC7B,EAAE,gBAAa,kBAAe,EAAkB,GAChD,CAAC,GAAM,MAAW,EAAiB,CAAC,GACpC,CAAC,GAAc,KAAmB,EAAiC,GACnE,CAAC,GAAc,KAAmB,EAAiB,GACnD,CAAC,GAAW,KAAgB,EAAkB,GAC9C,CAAC,GAAgB,KAAqB,EAAyB,CAAC,CAAC,GACjE,CAAC,GAAe,KAAoB,EAA6B,GACjE,CAAC,GAAe,KAAoB,EAAkB,EAAK,GAC3D,CAAC,GAAa,KAAkB,EAAkB,EAAK,GACvD,CAAC,GAAe,KAAoB,EAA4B,GAEhE,IAAW,GAEX,IAAc,GAAG,EACrB,EAAuB,eACzB,EAAE,UAAU,KAWN,EAAE,MAAM,GAAe,gBAAY,EAAqB;EAR5D,UAAU;EACV,eAAe,IAAgB,IAAgB;EAC/C,cAAc,CAAC,CAAU;EACzB,wBAAwB;EACxB,QAAQ,GAAO;EACf,eAAe,GAAU;CAGmC,GAAS;EACrE,SAAS,CAAC,CAAC;EACX,cAAc;CAChB,CAAC;CAED,QAAgB;EACd,IAAI,GAAe;GACjB,IAAM,IAAa,CAAC,GAAG,CAAc,GAE/B,IADa,KAAK,OAAQ,IAAO,KAAK,IAAY,EAC1C,IAAa;GAI3B,AAHA,EAAW,OAAO,GAAO,IAAQ,IAAkB,GAAG,EAAc,IAAI,GACxE,EAAkB,CAAU,GAC5B,EAAiB,EAAK,GACtB,EAAiB,EAAc,aAAa;EAC9C;CAIF,GAAG,CAAC,CAAa,CAAC;CAElB,SAAS,KAAiB;EACxB,IAAM,IAAY,IAAO;EAEzB,OADoB,EAAe,MAAM,GAAW,IAAY,CACzD;CACT;CAEA,SAAS,IAAQ;EAMf,AALA,EAAgB,KAAA,CAAS,GACzB,EAAa,KAAA,CAAS,GACtB,EAAkB,CAAC,CAAC,GACpB,EAAiB,KAAA,CAAS,GAC1B,EAAiB,EAAK,GACtB,GAAQ;CACV;CAEA,QAAgB;EACd,EAAM;CAER,GAAG,CAAC,GAAY,CAAQ,CAAC;CAEzB,IAAM,IAAU,GAAe,GAAe,CAAC,GACzC,IAAW,QAEb,EACG,QAAO,MAAK,EAAE,WAAW,SAAS,EAClC,KAAI,MAAK,EAAE,IAAI,GACpB,CAAC,CAAO,CACV,GACM,KAAqB,EAAQ,MAAK,MAAK,EAAE,SAAS,GAElD,KAAsB,OAAO,MAAkB;EACnD,EAAa,EAAK;EAClB,IAAM,IAAS,EAAS,MAAK,MAAU,GAAQ,OAAO,CAAK;EAC3D,IAAI,GAAQ;GAEV,IADA,EAAgB,CAAM,GAClB,MAAe,EAAW,YAAY;IACxC,IAAI;IACJ,IAAI;KACF,IAAU,MAAM,EAAc,aAC5B,EAAO,IACP,GACA,GACA,CACF;IACF,SAAS,GAAG;KACV,OAAO,EAAgB,EAAE,OAAO;IAClC;IACA,IAAI,EAAQ,yBAAyB,GACnC,OAAO,EACL,oGACF;GAEJ;GAEA,AADA,EAAa,EAAI,GACjB,EAAgB,KAAA,CAAS;EAC3B;CACF,GAEM,KAAwB;EAC5B;GACE,OAAO;GACP,YAAY;GACZ,OAAO;GACP,UAAU;GACV,YAAY;GACZ,UAAU;GACV,mBAAmB;GACnB,aAAY,MAER,kBAAC,GAAD;IACE,OAAO,EAAO;IACd,SAAS,EAAO,OAAO,GAAc;IACrC,WAAU,MAAS;KACjB,GAAoB,EAAM,OAAO,KAAK;IACxC;GACD,CAAA;EAGP;EACA;GACE,OAAO;GACP,YACE,MAAe,EAAW,aACtB,sBACA;GACN,MAAM;GACN,YAAY;GACZ,UAAU;GACV,mBAAmB;GACnB,aAAa,MACX,kBAAC,GAAD;IACE,IAAI,EACF,UAAU,GAAG,EACX,EAAuB,eACzB,EAAE,UAAU,EAAO,IAAI,KACzB;IACA,QAAO;cAEN,EAAO,IAAI;GACR,CAAA;EAEV;EACA;GACE,OAAO;GACP,YAAY;GACZ,OAAO;GACP,YAAY;GACZ,UAAU;GACV,mBAAmB;EACrB;EACA;GACE,OAAO;GACP,YAAY;GACZ,OAAO;GACP,YAAY;GACZ,UAAU;GACV,mBAAmB;EACrB;CACF,GAEM,MAAW,MAA2B;EAC1C,IAAM,IAAoC,CAAC;EAW3C,OAVA,EAAS,SAAQ,MAAU;GACzB,EAAQ,KAAK;IACX,IAAI,EAAO;IACX,MACE,MAAe,EAAW,aACrB,EAAO,kBAAkB,EAAO,OACjC,EAAO;IACb,YAAY,EAAW,EAAM,EAAO,UAAU,GAAG,UAAU;GAC7D,CAAC;EACH,CAAC,GACM;CACT,GAEM,MAAoB,MAAuB;EAQ/C,AAPwB,KAAK,IAC3B,GAAe,mBAAmB,IACjC,IAAa,KAAK,CAEjB,IAAkB,EAAe,UACnC,EAAiB,EAAI,GAEvB,GAAQ,CAAU;CACpB,GAEM,WAA4B;EAChC,EAAe,CAAa;CAC9B;CAEA,SAAS,GAAa,GAAyB;EAE7C,IAAI,CAAC,GAAM;EACX,IAAM,EAAE,iBAAc,gBAAa,GAC7B,IAA4B;GAChC,UAAU;GACV,MAAM;GACN,cAAc;GACd,kBAAkB;EACpB;EACA,EAAc,aAAa,GAAe,CAAW,EAClD,WAAW;GACV,EAAM;EACR,CAAC,EACA,OAAO,MAA4B;GAClC,EAAgB,EAAI,MAAM;EAC5B,CAAC;CACL;CAEA,eAAe,KAAe;EAC5B,IAAI,CAAC,GAAe;EACpB,IAAM,EAAE,iBAAc,gBAAa;EACnC,IAAI,CAAC,GACH,OAAO,EAAgB,4CAA4C;EAErE,IAAI;EACJ,IAAI;GACF,IAAS,MAAM,EAAc,UAAU,GAAa,CAAQ;EAC9D,QAAc;GACZ,OAAO,EAAgB,cAAc,EAAS,yBAAyB;EACzE;EAEA,IAAM,IAA4B;GAChC,IAAI,EAAO;GACX,MAAM,EAAO;GACb,kBAAkB;GAClB,cAAc;GACd,UAAU,EAAO;GACjB,MAAM,EAAO;GACb,YAAY,EAAO;EACrB;EAEA,IAAI;GACF,IAAM,IAAgB,MAAM,EAAc,aACxC,GACA,GACA,EACF;GAUA,AATA,MAAM,EACJ,GACA,GACA,EAAc,EAChB,GACA,EAAY,aACV,EAAW,kBAAkB,EAAc,EAAG,GAC9C,CACF,GACA,EAAM;EACR,SAAS,GAAK;GACZ,EAAgB,EAAI,MAAM;EAC5B;CACF;CAEA,IAAM,KAAe,OAAO,MAAiC;EAC3D,IAAI,EAAS,WAAW,EAAS,MAAM;GACrC,IAAM,EAAE,gBAAa,EAAS,MAGxB,IAA2C;IAC/C,YAAY;IACZ,UAAU;GACZ;GACA,IAAI;IACF,IAAM,IAAW,MAAM,EAAc,kBACnC,GACA,CACF;IAEA,AAAI,MACF,EAAiB;KAAE,GAAG,EAAS;KAAM,UAAU,EAAS;IAAG,CAAC,GAC5D,EAAe,EAAI;GAEvB,QAAc;IAGZ,AADA,EAAiB,KAAA,CAAS,GAC1B,GAAa,EAAS,IAAI;GAC5B;EACF,OAAO,AAAI,CAAC,EAAS,WAAW,EAAS,QACvC,EAAgB,EAAS,MAAM,MAAgB,IAE/C,EAAgB,8CAA8C;CAElE;CAEA,OACE,kBAAC,GAAD,EAAA,UAAA;EACE,kBAAC,GAAD;GACE,IAAI;IACF,SAAS;IACT,iBAAiB;IACjB,SAAS;IACT,gBAAgB;GAClB;aANF,CAQE,kBAAC,GAAD;IACE,SAAQ;IACR,IAAI;KAAE,UAAU;KAAQ,YAAY;KAAQ,YAAY;IAAI;cAE3D,MAAe,EAAW,OACvB,gBACA;GACM,CAAA,GACZ,kBAAC,GAAD;IAAK,IAAI,EAAE,SAAS,OAAO;cAA3B,CACE,kBAAC,GAAD;KACE,SAAQ;KACR,IAAI;MAAE,UAAU;MAAQ,OAAO;KAAU;eAF3C;MAGC;MACqB;MACpB,kBAAC,GAAD;OAAM,IAAI,EAAE,UAAU,EAAY;OAAG,QAAO;iBACzC;MACG,CAAA;KACI;QACZ,kBAAC,IAAD;KAAqB,OAAO;KAAa,IAAI,EAAE,WAAW,OAAO;IAAI,CAAA,CAClE;KACF;;EACL,kBAAC,GAAD;GACE,IAAI;IACF,IAAI;IACJ,SAAS;GACX;aAJF,CAME,kBAAC,IAAD,EACE,IAAI;IACF,OAAO;IACP,QAAQ;IACR,eAAe;GACjB,EACD,CAAA,GACD,kBAAC,GAAD;IACE,IAAI,EACF,IAAI,EACN;cAHF,CAKG,MAAe,EAAW,QACzB,kBAAA,GAAA,EAAA,UAAE,wLAIA,CAAA,GAEH,MAAe,EAAW,cACzB,kBAAA,GAAA,EAAA,UAAA;KAAE;KAIA,kBAAC,QAAD,EAAA,UAAO,EAAyB,CAAA;KAAC;KAAW;KAC5C,kBAAC,GAAD;MACE,IAAG;MACH,QAAO;gBACR;KAEK,CAAA;KAAE;KAAI;IAEZ,EAAA,CAAA,CAED;KACF;;EACL,kBAAC,GAAD,EAAA,UACE,kBAAC,IAAD;GACE,SAAS;GACA;GACT,MAAM,GAAQ,CAAQ;GACtB,UAAU,GAAe,mBAAmB;GAC5C,YAAA;GACA,gBAAe;GACf,iBAAiB;IAAE;IAAM,UAAU;GAAS;GAC5C,iBAAiB,CAAC,CAAQ;GAC1B,0BAA0B,EAAE,cAAW;IACrC,GAAiB,CAAI;GACvB;GACA,SAAQ;GACR,YAAA;GACA,IAAI;IACF,UAAU;IACV,QAAQ;IACR,QAAQ;IACR,+BAA+B,EAC7B,iBAAiB,UACnB;IACA,cAAc,EACZ,iBAAiB,UACnB;IACA,2CAA2C,EACzC,gBAAgB,gBAClB;IACA,UAAU;KACR,SAAS;KACT,YAAY;KACZ,QAAQ;IACV;GACF;GACA,kBAAiB,MACf,EAAO,6BAA6B,KAAM,IAAI,aAAa;EAE9D,CAAA,EACE,CAAA;EACJ,KAAgB,kBAAC,GAAD,EAAa,OAAO,EAA2B,CAAA;EAChE,kBAAC,GAAD;GACE,IAAI;IACF,SAAS;IACT,gBAAgB;GAClB;aAJF,CAMG,MAAe,EAAW,QACzB,kBAAC,GAAD;IACE,OAAM;IACN,aAAa;KACX,SAAS;KACT,SAAS,kBAAC,IAAD,EAAS,MAAK,SAAU,CAAA;KACjC,IAAI,EAAE,YAAY,EAAE;IACtB;IACA,aAAY,MAAQ;KAClB,GAAa,CAAI;IACnB;GACD,CAAA,GAEH,kBAAC,IAAD;IACE,OAAM;IACN,SAAQ;IACR,SAAS;IACT,UAAU,CAAC;cACZ;GAEO,CAAA,CACL;;EACL,kBAAC,GAAD;GACE,MAAM;GACN,OAAM;GACN,SACE,kBAAC,GAAD;IAAY,SAAQ;IAAQ,IAAI,EAAE,UAAU,OAAO;cAAnD;KAAsD;KAChC,GAAe;KAAS;KAC3C,GAAe;KAAS;IAEf;;GAEd,gBAAgB,EAAe,EAAK;GACpC,iBAAiB;IAEf,AADA,GAAa,GACb,EAAe,EAAK;GACtB;EACD,CAAA;CACE,EAAA,CAAA;AAET"}

package/dist/components/CopyToClipboardString/CopyToClipboardString.d.ts CHANGED Viewed

@@ -2,9 +2,15 @@ import { TypographyProps } from '@mui/material';
 export type CopyToClipboardStringProps = {
     value: string;
     typographyVariant?: TypographyProps['variant'];
+    /**
+     * When provided, the value is rendered as an external link to this URL in
+     * addition to the copy icon. Defaults to rendering the value as plain text.
+     */
+    href?: string;
+    useRoundedIcon?: boolean;
 };
 /**
- * Displays a string and a "Copy to Clipboard" icon, that, when clicked, will copy the contents of the string to the clipboard.
+ * Displays a string or link and a "Copy to Clipboard" icon, that, when clicked, will copy the contents of the string to the clipboard.
  */
 export declare function CopyToClipboardString(props: CopyToClipboardStringProps): import("react/jsx-runtime").JSX.Element;
 export default CopyToClipboardString;

package/dist/components/CopyToClipboardString/CopyToClipboardString.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CopyToClipboardString.d.ts","sourceRoot":"","sources":["../../../src/components/CopyToClipboardString/CopyToClipboardString.tsx"],"names":[],"mappings":"AAAA,OAAO,~~EAA8B~~,eAAe,~~EAAE~~,MAAM,eAAe,CAAA;~~AAK3E~~,MAAM,MAAM,0BAA0B,GAAG;IACvC,KAAK,EAAE,MAAM,CAAA;IACb,iBAAiB,CAAC,EAAE,eAAe,CAAC,SAAS,CAAC,CAAA;~~CAC/C~~,CAAA;AAED;;GAEG;AACH,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,0BAA0B,~~2CAmCtE~~;AAED,eAAe,qBAAqB,CAAA"}
1	+ {"version":3,"file":"CopyToClipboardString.d.ts","sourceRoot":"","sources":["../../../src/components/CopyToClipboardString/CopyToClipboardString.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,eAAe,EAChB,MAAM,eAAe,CAAA;AAKtB,MAAM,MAAM,0BAA0B,GAAG;IACvC,KAAK,EAAE,MAAM,CAAA;IACb,iBAAiB,CAAC,EAAE,eAAe,CAAC,SAAS,CAAC,CAAA;IAC9C;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,cAAc,CAAC,EAAE,OAAO,CAAA;CACzB,CAAA;AAED;;GAEG;AACH,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,0BAA0B,2CAuDtE;AAED,eAAe,qBAAqB,CAAA"}

package/dist/components/CopyToClipboardString/CopyToClipboardString.js CHANGED Viewed

@@ -1,35 +1,41 @@
 import { copyStringToClipboard as e } from "../../utils/functions/StringUtils.js";
 import t from "../IconSvg/IconSvg.js";
 import { useState as n } from "react";
-import { Stack as r, Tooltip as i, Typography as a } from "@mui/material";
-import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { Link as r, Stack as i, Tooltip as a, Typography as o } from "@mui/material";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
 //#region src/components/CopyToClipboardString/CopyToClipboardString.tsx
-function c(c) {
-	let { value: l, typographyVariant: u = "smallText1" } = c, [d, f] = n("Copy to clipboard");
-	return /* @__PURE__ */ s(r, {
+function l(l) {
+	let { value: u, typographyVariant: d = "smallText1", href: f, useRoundedIcon: p = !1 } = l, [m, h] = n("Copy to clipboard");
+	return /* @__PURE__ */ c(i, {
 		direction: "row",
 		spacing: .5,
 		sx: {
 			alignItems: "center",
 			display: "inline-flex"
 		},
-		children: [/* @__PURE__ */ o(a, {
+		children: [f ? /* @__PURE__ */ s(r, {
+			href: f,
+			rel: "noopener noreferrer",
+			target: "_blank",
+			variant: d,
+			children: u
+		}) : /* @__PURE__ */ s(o, {
 			component: "span",
-			variant: u,
-			children: l
-		}), /* @__PURE__ */ o(i, {
-			title: d,
+			variant: d,
+			children: u
+		}), /* @__PURE__ */ s(a, {
+			title: m,
 			placement: "top",
-			children: /* @__PURE__ */ o("span", {
+			children: /* @__PURE__ */ s("span", {
 				role: "button",
 				style: { cursor: "pointer" },
 				onClick: (t) => {
-					t.preventDefault(), e(l).then(() => {
-						f("Copied to clipboard");
+					t.preventDefault(), e(u).then(() => {
+						h("Copied to clipboard");
 					});
 				},
-				children: /* @__PURE__ */ o(t, {
-					icon: "contentCopy",
+				children: /* @__PURE__ */ s(t, {
+					icon: p ? "contentCopyRounded" : "contentCopy",
 					wrap: !1,
 					sx: { width: "16px" }
 				})
@@ -38,6 +44,6 @@ function c(c) {
 	});
 }
 //#endregion
-export { c as CopyToClipboardString, c as default };
+export { l as CopyToClipboardString, l as default };
 //# sourceMappingURL=CopyToClipboardString.js.map

package/dist/components/CopyToClipboardString/CopyToClipboardString.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CopyToClipboardString.js","names":[],"sources":["../../../src/components/CopyToClipboardString/CopyToClipboardString.tsx"],"sourcesContent":["import { Stack, Tooltip, Typography, TypographyProps } from '@mui/material'\nimport { SyntheticEvent, useState } from 'react'\nimport IconSvg from '../IconSvg/IconSvg'\nimport { copyStringToClipboard } from '@/utils/functions/StringUtils'\n\nexport type CopyToClipboardStringProps = {\n value: string\n typographyVariant?: TypographyProps['variant']\n}\n\n/*\n Displays a string and a \"Copy to Clipboard\" icon, that, when clicked, will copy the contents of the string to the clipboard.\n */\nexport function CopyToClipboardString(props: CopyToClipboardStringProps) {\n const { value, typographyVariant = 'smallText1' } = props\n const [tooltipText, setTooltipText] = useState('Copy to clipboard')\n\n const copyToClipboard = (event: SyntheticEvent) => {\n event.preventDefault()\n\n copyStringToClipboard(value).then(() => {\n setTooltipText('Copied to clipboard')\n })\n }\n\n return (\n <Stack\n direction={'row'}\n spacing={0.5}\n sx={{\n alignItems: 'center',\n display: 'inline-flex',\n }}\n >\n <Typography component={'span'} variant={typographyVariant}>\n {value}\n </Typography>\n <Tooltip title={tooltipText} placement={'top'}>\n <span\n role=\"button\"\n style={{ cursor: 'pointer' }}\n onClick={copyToClipboard}\n >\n <IconSvg ~~icon=\"~~contentCopy\" wrap={false} sx={{ width: '16px' }} />\n </span>\n </Tooltip>\n </Stack>\n )\n}\n\nexport default CopyToClipboardString\n"],"mappings":";;;;;;~~AAaA~~,SAAgB,EAAsB,GAAmC;CACvE,IAAM,~~EAAE~~,~~UAAO~~,uBAAoB,~~iBAAiB~~,~~GAC9C~~,CAAC,GAAa,KAAkB,EAAS,mBAAmB;CAUlE,OACE,kBAAC,GAAD;EACE,WAAW;EACX,SAAS;EACT,IAAI;GACF,YAAY;GACZ,SAAS;EACX;YANF,~~CAQE~~,kBAAC,GAAD;GAAY,WAAW;GAAQ,SAAS;aACrC;EACS,CAAA,~~GACZ~~,kBAAC,GAAD;GAAS,OAAO;GAAa,WAAW;aACtC,kBAAC,QAAD;IACE,MAAK;IACL,OAAO,EAAE,QAAQ,UAAU;IAC3B,~~UAxBiB~~,MAA0B;KAGjD,AAFA,EAAM,eAAe,GAErB,EAAsB,CAAK,EAAE,WAAW;MACtC,EAAe,qBAAqB;KACtC,CAAC;IACH;~~cAoBQ~~,kBAAC,GAAD;~~KAAS~~,~~MAAK~~;~~KAAc~~,MAAM;~~KAAO~~,IAAI,EAAE,OAAO,OAAO;~~IAAI~~,CAAA;~~GAC7D~~,CAAA;EACC,CAAA,CACJ;;AAEX"}
1	+ {"version":3,"file":"CopyToClipboardString.js","names":[],"sources":["../../../src/components/CopyToClipboardString/CopyToClipboardString.tsx"],"sourcesContent":["import {\n Link,\n Stack,\n Tooltip,\n Typography,\n TypographyProps,\n} from '@mui/material'\nimport { SyntheticEvent, useState } from 'react'\nimport IconSvg from '../IconSvg/IconSvg'\nimport { copyStringToClipboard } from '@/utils/functions/StringUtils'\n\nexport type CopyToClipboardStringProps = {\n value: string\n typographyVariant?: TypographyProps['variant']\n /*\n When provided, the value is rendered as an external link to this URL in\n * addition to the copy icon. Defaults to rendering the value as plain text.\n /\n href?: string\n useRoundedIcon?: boolean\n}\n\n/\n Displays a string or link and a \"Copy to Clipboard\" icon, that, when clicked, will copy the contents of the string to the clipboard.\n */\nexport function CopyToClipboardString(props: CopyToClipboardStringProps) {\n const {\n value,\n typographyVariant = 'smallText1',\n href,\n useRoundedIcon = false,\n } = props\n const [tooltipText, setTooltipText] = useState('Copy to clipboard')\n\n const copyToClipboard = (event: SyntheticEvent) => {\n event.preventDefault()\n\n copyStringToClipboard(value).then(() => {\n setTooltipText('Copied to clipboard')\n })\n }\n\n return (\n <Stack\n direction={'row'}\n spacing={0.5}\n sx={{\n alignItems: 'center',\n display: 'inline-flex',\n }}\n >\n {href ? (\n <Link\n href={href}\n rel={'noopener noreferrer'}\n target={'_blank'}\n variant={typographyVariant}\n >\n {value}\n </Link>\n ) : (\n <Typography component={'span'} variant={typographyVariant}>\n {value}\n </Typography>\n )}\n <Tooltip title={tooltipText} placement={'top'}>\n <span\n role=\"button\"\n style={{ cursor: 'pointer' }}\n onClick={copyToClipboard}\n >\n <IconSvg\n icon={useRoundedIcon ? 'contentCopyRounded' : 'contentCopy'}\n wrap={false}\n sx={{ width: '16px' }}\n />\n </span>\n </Tooltip>\n </Stack>\n )\n}\n\nexport default CopyToClipboardString\n"],"mappings":";;;;;;AAyBA,SAAgB,EAAsB,GAAmC;CACvE,IAAM,EACJ,UACA,uBAAoB,cACpB,SACA,oBAAiB,OACf,GACE,CAAC,GAAa,KAAkB,EAAS,mBAAmB;CAUlE,OACE,kBAAC,GAAD;EACE,WAAW;EACX,SAAS;EACT,IAAI;GACF,YAAY;GACZ,SAAS;EACX;YANF,CAQG,IACC,kBAAC,GAAD;GACQ;GACN,KAAK;GACL,QAAQ;GACR,SAAS;aAER;EACG,CAAA,IAEN,kBAAC,GAAD;GAAY,WAAW;GAAQ,SAAS;aACrC;EACS,CAAA,GAEd,kBAAC,GAAD;GAAS,OAAO;GAAa,WAAW;aACtC,kBAAC,QAAD;IACE,MAAK;IACL,OAAO,EAAE,QAAQ,UAAU;IAC3B,UAnCiB,MAA0B;KAGjD,AAFA,EAAM,eAAe,GAErB,EAAsB,CAAK,EAAE,WAAW;MACtC,EAAe,qBAAqB;KACtC,CAAC;IACH;cA+BQ,kBAAC,GAAD;KACE,MAAM,IAAiB,uBAAuB;KAC9C,MAAM;KACN,IAAI,EAAE,OAAO,OAAO;IACrB,CAAA;GACG,CAAA;EACC,CAAA,CACJ;;AAEX"}

package/dist/components/DataExplorer/DataExplorer.css CHANGED Viewed

	@@ -1 +1 @@
1	- .~~_dataExplorerTitle_pjkyv_1~~.MuiTypography-root{color:var(--data-explorer-title-color,var(--synapse-primary-action-color));font-size:36px;line-height:40px}.~~_dataExplorerSubtitle_pjkyv_7~~.MuiTypography-root{line-height:140%}@media (width>=1024px){.~~_dataExplorerButton_pjkyv_12~~{width:fit-content}}.~~_dataExplorerTextContainer_pjkyv_17~~{gap:16px}@media (width>=1024px){.~~_dataExplorerTextContainer_pjkyv_17~~{flex:0 0 30%;max-width:30%}}.~~_dataExplorerContainer_pjkyv_27~~{flex-direction:column;flex:1 0 0;align-items:flex-start;gap:60px;padding:40px 0;display:flex}@media (width>=1024px){.~~_dataExplorerContainer_pjkyv_27~~{flex-direction:row}}.~~_dataContainer_pjkyv_41~~{flex:60%;grid-template-rows:repeat(9,fit-content(100%));grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;min-width:0;display:inline-grid}.~~_dataRowTitle_pjkyv_51~~{color:var(--synapse-primary-action-color,#4d558d);overflow-wrap:break-word;word-break:break-word;flex:0 auto;min-width:0;font-size:16px;font-weight:400;line-height:26.4px}@media (width>=1024px){.~~_dataRowTitle_pjkyv_51~~{font-size:19.8px}}.~~_dataRowInner_pjkyv_67~~{flex:1;justify-content:space-between;align-items:center;min-width:0;display:flex}.~~_dataRow_pjkyv_51~~{border:1px solid #0000;border-radius:3.3px;justify-content:space-between;justify-self:stretch;align-items:center;gap:17.6px;min-height:66.6px;padding:8.8px 26.4px;transition:background-color .2s,border-color .2s,box-shadow .2s,transform .2s;display:flex;position:relative;text-decoration:none!important}.~~_dataRow_pjkyv_51~~:hover{z-index:1;background-color:#fff;border-color:#e1e1e1;transform:scale(1.1);box-shadow:0 4px 8px #0000001a}.~~_dataRow_pjkyv_51~~:hover .~~_viewCta_pjkyv_96~~{opacity:1;pointer-events:auto}.~~_dataRowLeft_pjkyv_101~~{flex:1;align-items:center;gap:16px;min-width:0;display:inline-flex}.~~_iconContainer_pjkyv_109~~{border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:49px;height:49px;display:flex}.~~_dataRowNamePill_pjkyv_119~~{flex:1 1 0;align-items:center;gap:8px;min-width:0;display:flex}.~~_fileCount_pjkyv_127~~{color:#787090;border:1px solid #d8d5e0;border-radius:80px;flex-shrink:0;justify-content:center;align-items:center;gap:10px;padding:4px 8px;font-size:14px;font-weight:400;line-height:24px;display:flex}.~~_viewCta_pjkyv_96~~{opacity:0;white-space:nowrap;color:var(--synapse-primary-action-color,#4d558d);background:linear-gradient(90deg,#0000,#fff 25% 100%);border-radius:0 2px 2px 0;align-items:center;gap:4px;padding-left:40px;padding-right:26.4px;transition:opacity .2s;display:inline-flex;position:absolute;top:0;bottom:0;right:0}.~~_viewCtaText_pjkyv_160~~{color:var(--synapse-primary-action-color,#4d558d);font-size:16px;font-weight:400;line-height:26.4px}.~~_viewCtaIcon_pjkyv_167~~.MuiSvgIcon-root{color:var(--synapse-primary-action-color,#5a488f);font-size:24px}
1	+ ._dataExplorerTitle_1ezpn_1.MuiTypography-root{color:var(--data-explorer-title-color,var(--synapse-primary-action-color));font-size:36px;line-height:40px}._dataExplorerSubtitle_1ezpn_7.MuiTypography-root{line-height:140%}@media (width>=1024px){._dataExplorerButton_1ezpn_12{width:fit-content}}._dataExplorerTextContainer_1ezpn_17{gap:16px}@media (width>=1024px){._dataExplorerTextContainer_1ezpn_17{flex:0 0 30%;max-width:30%}}._dataExplorerContainer_1ezpn_27{flex-direction:column;flex:1 0 0;align-items:flex-start;gap:60px;padding:40px 0;display:flex}@media (width>=1024px){._dataExplorerContainer_1ezpn_27{flex-direction:row}}._dataContainer_1ezpn_41{flex:60%;grid-template-rows:repeat(9,fit-content(100%));grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;min-width:0;display:inline-grid}._dataRowTitle_1ezpn_51{color:var(--synapse-primary-action-color,#4d558d);overflow-wrap:break-word;word-break:break-word;flex:0 auto;min-width:0;font-size:16px;font-weight:400;line-height:26.4px}@media (width>=1024px){._dataRowTitle_1ezpn_51{font-size:19.8px}}._dataRowInner_1ezpn_67{flex:1;justify-content:space-between;align-items:center;min-width:0;display:flex}._dataRow_1ezpn_51{border:1px solid #0000;border-radius:3.3px;justify-content:space-between;justify-self:stretch;align-items:center;gap:17.6px;min-height:66.6px;padding:8.8px 26.4px;transition:background-color .2s,border-color .2s,box-shadow .2s,transform .2s;display:flex;position:relative;text-decoration:none!important}._dataRow_1ezpn_51:hover{z-index:1;background-color:#fff;border-color:#e1e1e1;transform:scale(1.1);box-shadow:0 4px 8px #0000001a}._dataRow_1ezpn_51:hover ._viewCta_1ezpn_96{opacity:1;pointer-events:auto}._dataRowLeft_1ezpn_101{flex:1;align-items:center;gap:16px;min-width:0;display:inline-flex}._iconContainer_1ezpn_109{border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:49px;height:49px;display:flex}._dataRowNamePill_1ezpn_119{flex:1 1 0;align-items:center;gap:8px;min-width:0;display:flex}._facetCount_1ezpn_127{color:#787090;border:1px solid #d8d5e0;border-radius:80px;flex-shrink:0;justify-content:center;align-items:center;gap:10px;padding:4px 8px;font-size:14px;font-weight:400;line-height:24px;display:flex}._viewCta_1ezpn_96{opacity:0;white-space:nowrap;color:var(--synapse-primary-action-color,#4d558d);background:linear-gradient(90deg,#0000,#fff 25% 100%);border-radius:0 2px 2px 0;align-items:center;gap:4px;padding-left:40px;padding-right:26.4px;transition:opacity .2s;display:inline-flex;position:absolute;top:0;bottom:0;right:0}._viewCtaText_1ezpn_160{color:var(--synapse-primary-action-color,#4d558d);font-size:16px;font-weight:400;line-height:26.4px}._viewCtaIcon_1ezpn_167.MuiSvgIcon-root{color:var(--synapse-primary-action-color,#5a488f);font-size:24px}

package/dist/components/DataExplorer/DataExplorer.d.ts CHANGED Viewed

@@ -6,8 +6,22 @@ type DataExplorerProps = {
     sql: string;
     explorePath?: string;
     exploreQuerySql?: string;
-    filterColumnName?: string;
+    facetSql?: string;
 };
-export default function DataExplorer({ sql, title, subtitle, buttonText, buttonLink, explorePath, exploreQuerySql, filterColumnName, }: DataExplorerProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * DataExplorer
+ *
+ * A reusable component that renders a list of data types/categories with associated icons.
+ * It drives navigation by linking each row to a pre-filtered exploration view.
+ *
+ * How it works:
+ * 1. `sql`: Fetches a configuration table defining the display categories,
+ *    their display order, hex colors, and icons.
+ * 2. `facetSql`: Fetches real-time counts for these categories from the actual
+ *    underlying data table.
+ * 3. Links are dynamically built to point to a target path (`explorePath`) pre-filtered to the
+ *    clicked category.
+ */
+export default function DataExplorer({ sql, title, subtitle, buttonText, buttonLink, explorePath, exploreQuerySql, facetSql, }: DataExplorerProps): import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=DataExplorer.d.ts.map

package/dist/components/DataExplorer/DataExplorer.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DataExplorer.d.ts","sourceRoot":"","sources":["../../../src/components/DataExplorer/DataExplorer.tsx"],"names":[],"mappings":"~~AAaA~~,KAAK,iBAAiB,GAAG;IACvB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,GAAG,EAAE,MAAM,CAAA;IACX,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,~~gBAAgB~~,CAAC,EAAE,MAAM,CAAA;~~CAC1B~~,CAAA;~~AASD~~,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EACnC,GAAG,EACH,KAAK,EACL,QAAQ,EACR,UAAU,EACV,UAAU,EACV,WAAW,EACX,eAAe,EACf,~~gBAAgB~~,~~GACjB~~,EAAE,iBAAiB,~~2CA8InB~~"}
1	+ {"version":3,"file":"DataExplorer.d.ts","sourceRoot":"","sources":["../../../src/components/DataExplorer/DataExplorer.tsx"],"names":[],"mappings":"AAkBA,KAAK,iBAAiB,GAAG;IACvB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,GAAG,EAAE,MAAM,CAAA;IACX,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB,CAAA;AAUD;;;;;;;;;;;;;GAaG;AACH,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EACnC,GAAG,EACH,KAAK,EACL,QAAQ,EACR,UAAU,EACV,UAAU,EACV,WAAW,EACX,eAAe,EACf,QAAQ,GACT,EAAE,iBAAiB,2CAyMnB"}

package/dist/components/DataExplorer/DataExplorer.js CHANGED Viewed

@@ -7,110 +7,117 @@ import n from "../../synapse-queries/entity/useGetQueryResultBundle.js";
 import { useSmartLink as r } from "../SmartLink/useSmartLink.js";
 import { generateEncodedPathAndQueryForSelectedFacetURL as i } from "../QueryWrapper/generateEncodedPathAndQueryForSelectedFacetURL.js";
 import "../QueryWrapper/index.js";
-import a from "../ImageFromSynapseTable.js";
-import o from "./DataExplorer.module.js";
-import { useEffect as s, useMemo as c, useState as l } from "react";
-import { Button as u, Stack as d, Typography as f } from "@mui/material";
-import { jsx as p, jsxs as m } from "react/jsx-runtime";
-import h from "@mui/icons-material/ArrowForward";
+import { getFacets as a } from "../widgets/facet-nav/useFacetPlots.js";
+import o from "../ImageFromSynapseTable.js";
+import s from "./DataExplorer.module.js";
+import { useEffect as c, useMemo as l, useState as u } from "react";
+import { orderBy as d } from "lodash-es";
+import { Button as f, Stack as p, Typography as m } from "@mui/material";
+import { jsx as h, jsxs as g } from "react/jsx-runtime";
+import _ from "@mui/icons-material/ArrowForward";
 //#region src/components/DataExplorer/DataExplorer.tsx
-function g({ sql: g, title: _, subtitle: v, buttonText: y, buttonLink: b, explorePath: x, exploreQuerySql: S, filterColumnName: C }) {
-	let w = _ || v || y, T = r(b), E = e(g), { data: D } = n({
+function v({ sql: v, title: y, subtitle: b, buttonText: x, buttonLink: S, explorePath: C, exploreQuerySql: w, facetSql: T }) {
+	let E = y || b || x, D = r(S), O = e(v), k = e(T ?? ""), A = {
 		partMask: 5,
 		concreteType: "org.sagebionetworks.repo.model.table.QueryBundleRequest",
-		entityId: E,
-		query: {
-			sql: g,
-			sort: [{
-				column: "order",
-				direction: "ASC"
-			}]
-		}
-	}), O = c(() => D?.queryResult?.queryResults.rows ?? [], [D]), k = t("datatype", D), A = t("icon", D), j = t("hexColor", D), M = t("fileCount", D), [N, P] = l([]);
-	return s(() => {
-		!x || !C || !S || Promise.all(O.map((e) => {
-			let t = e.values[k]?.trim();
-			return t ? i(x, S, [{
-				facet: C,
+		entityId: O,
+		query: { sql: v }
+	}, j = {
+		partMask: 32,
+		concreteType: "org.sagebionetworks.repo.model.table.QueryBundleRequest",
+		entityId: k,
+		query: { sql: T ?? "" }
+	}, { data: M } = n(A), N = l(() => M?.queryResult?.queryResults.rows ?? [], [M]), { data: P } = n(j, { enabled: !!T }), F = t("datatype", M), I = t("icon", M), L = t("hexColor", M), R = t("order", M), z = t("columnName", M), B = (e, t) => t ? `${t}::${e}` : e, [V, H] = u({});
+	c(() => {
+		!C || !w || Promise.all(N.map((e) => {
+			let t = e.values[F]?.trim() ?? "", n = e.values[z]?.trim() ?? "", r = B(t, n);
+			return !t || !n ? Promise.resolve([r, C]) : i(C, w, [{
+				facet: n,
 				facetValue: t
-			}]) : Promise.resolve(x);
-		})).then(P);
+			}]).then((e) => [r, e]);
+		})).then((e) => H(Object.fromEntries(e)));
 	}, [
-		O,
-		k,
-		x,
-		S,
-		C
-	]), /* @__PURE__ */ m("div", {
-		className: o.dataExplorerContainer,
-		children: [w && /* @__PURE__ */ m(d, {
-			className: o.dataExplorerTextContainer,
+		N,
+		F,
+		z,
+		C,
+		w
+	]);
+	let U = l(() => {
+		let e = a(P), t = /* @__PURE__ */ new Map();
+		for (let n of e) t.set(n.columnName, new Map(n.facetValues.map((e) => [e.value, e.count])));
+		return t;
+	}, [P]), W = (e, t) => t ? U.get(t)?.get(e) : void 0, G = d(N, [(e) => Number(e.values[R] ?? 2 ** 53 - 1), (e) => W(e.values[F]?.trim() ?? "", e.values[z]?.trim() ?? "") ?? 0], ["asc", "desc"]);
+	return /* @__PURE__ */ g("div", {
+		className: s.dataExplorerContainer,
+		children: [E && /* @__PURE__ */ g(p, {
+			className: s.dataExplorerTextContainer,
 			children: [
-				_ && /* @__PURE__ */ p(f, {
+				y && /* @__PURE__ */ h(m, {
 					variant: "headline1",
-					className: o.dataExplorerTitle,
-					children: _
+					className: s.dataExplorerTitle,
+					children: y
 				}),
-				v && /* @__PURE__ */ p(f, {
+				b && /* @__PURE__ */ h(m, {
 					variant: "body1",
 					component: "div",
-					className: o.dataExplorerSubtitle,
-					children: v
+					className: s.dataExplorerSubtitle,
+					children: b
 				}),
-				y && /* @__PURE__ */ p(u, {
+				x && /* @__PURE__ */ h(f, {
 					variant: "contained",
-					className: o.dataExplorerButton,
-					...T,
-					children: y
+					className: s.dataExplorerButton,
+					...D,
+					children: x
 				})
 			]
-		}), /* @__PURE__ */ p("div", {
-			className: o.dataContainer,
-			children: O.map((e, t) => {
-				let n = e.values[k] ?? "", r = e.values[j] ?? void 0, i = N[t], s = e.values[M] ?? "";
-				return /* @__PURE__ */ p("a", {
-					className: o.dataRow,
+		}), /* @__PURE__ */ h("div", {
+			className: s.dataContainer,
+			children: G.map((e) => {
+				let t = e.values[F]?.trim() ?? "", n = e.values[L] ?? void 0, r = e.values[z]?.trim() ?? "", i = V[B(t, r)], a = W(t, r);
+				return /* @__PURE__ */ h("a", {
+					className: s.dataRow,
 					href: i,
-					children: /* @__PURE__ */ m("div", {
-						className: o.dataRowInner,
-						children: [/* @__PURE__ */ m("div", {
-							className: o.dataRowLeft,
-							children: [/* @__PURE__ */ p("div", {
-								className: o.iconContainer,
-								style: r ? { backgroundColor: r } : void 0,
-								children: /* @__PURE__ */ p(a, {
-									tableId: E,
-									fileHandleId: e.values[A],
-									alt: e.values[k] ?? "",
+					children: /* @__PURE__ */ g("div", {
+						className: s.dataRowInner,
+						children: [/* @__PURE__ */ g("div", {
+							className: s.dataRowLeft,
+							children: [/* @__PURE__ */ h("div", {
+								className: s.iconContainer,
+								style: n ? { backgroundColor: n } : void 0,
+								children: /* @__PURE__ */ h(o, {
+									tableId: O,
+									fileHandleId: e.values[I],
+									alt: t,
 									style: {
 										width: 49,
 										height: 49
 									}
 								})
-							}), /* @__PURE__ */ m("div", {
-								className: o.dataRowNamePill,
-								children: [/* @__PURE__ */ p(f, {
-									className: o.dataRowTitle,
-									children: n
-								}), s && /* @__PURE__ */ p("div", {
-									className: o.fileCount,
-									children: s
+							}), /* @__PURE__ */ g("div", {
+								className: s.dataRowNamePill,
+								children: [/* @__PURE__ */ h(m, {
+									className: s.dataRowTitle,
+									children: t
+								}), a && /* @__PURE__ */ h("div", {
+									className: s.facetCount,
+									children: a
 								})]
 							})]
-						}), i && /* @__PURE__ */ m("div", {
-							className: o.viewCta,
-							children: [/* @__PURE__ */ p("span", {
-								className: o.viewCtaText,
+						}), i && /* @__PURE__ */ g("div", {
+							className: s.viewCta,
+							children: [/* @__PURE__ */ h("span", {
+								className: s.viewCtaText,
 								children: "View"
-							}), /* @__PURE__ */ p(h, { className: o.viewCtaIcon })]
+							}), /* @__PURE__ */ h(_, { className: s.viewCtaIcon })]
 						})]
 					})
-				}, e.rowId);
+				}, B(t, r));
 			})
 		})]
 	});
 }
 //#endregion
-export { g as default };
+export { v as default };
 //# sourceMappingURL=DataExplorer.js.map

package/dist/components/DataExplorer/DataExplorer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DataExplorer.js","names":[],"sources":["../../../src/components/DataExplorer/DataExplorer.tsx"],"sourcesContent":["import { Button, Typography, Stack } from '@mui/material'\nimport { useEffect, useMemo, useState } from 'react'\nimport styles from './DataExplorer.module.scss'\nimport { useSmartLink } from '../SmartLink/useSmartLink'\nimport { parseEntityIdFromSqlStatement } from '@/utils/functions'\nimport { QueryBundleRequest } from '@sage-bionetworks/synapse-types'\nimport { SynapseConstants } from '@/utils'\nimport useGetQueryResultBundle from '@/synapse-queries/entity/useGetQueryResultBundle'\nimport { getFieldIndex } from '@/utils/functions/queryUtils'\nimport { generateEncodedPathAndQueryForSelectedFacetURL } from '../QueryWrapper'\nimport ImageFromSynapseTable from '../ImageFromSynapseTable'\nimport ArrowForwardIcon from '@mui/icons-material/ArrowForward'\n\ntype DataExplorerProps = {\n title?: React.ReactNode\n subtitle?: React.ReactNode\n buttonText?: string\n buttonLink?: string\n sql: string\n explorePath?: string\n exploreQuerySql?: string\n filterColumnName?: string\n}\n\nenum ExpectedColumns {\n DATATYPE = 'datatype',\n ICON = 'icon',\n HEX_COLOR = 'hexColor',\n FILE_COUNT = 'fileCount',\n}\n\nexport default function DataExplorer({\n sql,\n title,\n subtitle,\n buttonText,\n buttonLink,\n explorePath,\n exploreQuerySql,\n filterColumnName,\n}: DataExplorerProps) {\n const hasTextSection = title \|\| subtitle \|\| buttonText\n const smartLinkProps = useSmartLink(buttonLink)\n\n const entityId = parseEntityIdFromSqlStatement(sql)\n\n const queryBundleRequest: QueryBundleRequest = {\n partMask:\n SynapseConstants.BUNDLE_MASK_QUERY_SELECT_COLUMNS \|\n SynapseConstants.BUNDLE_MASK_QUERY_RESULTS,\n concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n entityId,\n query: {\n sql,\n sort: [{ column: 'order', direction: 'ASC' }],\n },\n }\n\n const { data: queryResultBundle } =\n useGetQueryResultBundle(queryBundleRequest)\n\n const dataRows = useMemo(\n () => queryResultBundle?.queryResult?.queryResults.rows ?? [],\n [queryResultBundle],\n )\n\n const datatypeColIndex = getFieldIndex(\n ExpectedColumns.DATATYPE,\n queryResultBundle,\n )\n\n const iconColIndex = getFieldIndex(ExpectedColumns.ICON, queryResultBundle)\n\n const hexColorColIndex = getFieldIndex(\n ExpectedColumns.HEX_COLOR,\n queryResultBundle,\n )\n\n const fileCountColIndex = getFieldIndex(\n ExpectedColumns.FILE_COUNT,\n queryResultBundle,\n )\n\n const [rowUrls, setRowUrls] = useState<string[]>([])\n\n useEffect(() => {\n if (!explorePath \|\| !filterColumnName \|\| !exploreQuerySql) return\n\n Promise.all(\n dataRows.map(row => {\n const dataType = row.values[datatypeColIndex]?.trim()\n if (!dataType) return Promise.resolve(explorePath)\n return generateEncodedPathAndQueryForSelectedFacetURL(\n explorePath,\n exploreQuerySql,\n [{ facet: filterColumnName, facetValue: dataType }],\n )\n }),\n ).then(setRowUrls)\n }, [\n dataRows,\n datatypeColIndex,\n explorePath,\n exploreQuerySql,\n filterColumnName,\n ])\n\n return (\n <div className={styles.dataExplorerContainer}>\n {hasTextSection && (\n <Stack className={styles.dataExplorerTextContainer}>\n {title && (\n <Typography\n variant=\"headline1\"\n className={styles.dataExplorerTitle}\n >\n {title}\n </Typography>\n )}\n {subtitle && (\n <Typography\n variant=\"body1\"\n component=\"div\"\n className={styles.dataExplorerSubtitle}\n >\n {subtitle}\n </Typography>\n )}\n {buttonText && (\n <Button\n variant=\"contained\"\n className={styles.dataExplorerButton}\n {...smartLinkProps}\n >\n {buttonText}\n </Button>\n )}\n </Stack>\n )}\n <div className={styles.dataContainer}>\n {dataRows.map((row, index) => {\n const dataType = row.values[datatypeColIndex] ?? ''\n const hexColor = row.values[hexColorColIndex] ?? undefined\n const rowUrl = rowUrls[index]\n const fileCount = row.values[fileCountColIndex] ?? ''\n return (\n <a key={row.rowId} className={styles.dataRow} href={rowUrl}>\n <div className={styles.dataRowInner}>\n <div className={styles.dataRowLeft}>\n <div\n className={styles.iconContainer}\n style={hexColor ? { backgroundColor: hexColor } : undefined}\n >\n <ImageFromSynapseTable\n tableId={entityId}\n fileHandleId={row.values[iconColIndex]}\n alt={row.values[datatypeColIndex] ?? ''}\n style={{ width: 49, height: 49 }}\n />\n </div>\n <div className={styles.dataRowNamePill}>\n <Typography className={styles.dataRowTitle}>\n {dataType}\n </Typography>\n {fileCount && (\n <div className={styles.fileCount}>{fileCount}</div>\n )}\n </div>\n </div>\n {rowUrl && (\n <div className={styles.viewCta}>\n <span className={styles.viewCtaText}>View</span>\n <ArrowForwardIcon className={styles.viewCtaIcon} />\n </div>\n )}\n </div>\n </a>\n )\n })}\n </div>\n </div>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;AA+BA,SAAwB,EAAa,EACnC,QACA,UACA,aACA,eACA,eACA,gBACA,oBACA,uBACoB;CACpB,IAAM,IAAiB,KAAS,KAAY,GACtC,IAAiB,EAAa,CAAU,GAExC,IAAW,EAA8B,CAAG,GAc5C,EAAE,MAAM,MACZ,EAAwB;EAZxB,UACE;EAEF,cAAc;EACd;EACA,OAAO;GACL;GACA,MAAM,CAAC;IAAE,QAAQ;IAAS,WAAW;GAAM,CAAC;EAC9C;CAIwB,CAAkB,GAEtC,IAAW,QACT,GAAmB,aAAa,aAAa,QAAQ,CAAC,GAC5D,CAAC,CAAiB,CACpB,GAEM,IAAmB,EAAA,YAEvB,CACF,GAEM,IAAe,EAAA,QAAoC,CAAiB,GAEpE,IAAmB,EAAA,YAEvB,CACF,GAEM,IAAoB,EAAA,aAExB,CACF,GAEM,CAAC,GAAS,KAAc,EAAmB,CAAC,CAAC;CAwBnD,OAtBA,QAAgB;EACV,CAAC,KAAe,CAAC,KAAoB,CAAC,KAE1C,QAAQ,IACN,EAAS,KAAI,MAAO;GAClB,IAAM,IAAW,EAAI,OAAO,IAAmB,KAAK;GAEpD,OADK,IACE,EACL,GACA,GACA,CAAC;IAAE,OAAO;IAAkB,YAAY;GAAS,CAAC,CACpD,IALsB,QAAQ,QAAQ,CAAW;EAMnD,CAAC,CACH,EAAE,KAAK,CAAU;CACnB,GAAG;EACD;EACA;EACA;EACA;EACA;CACF,CAAC,GAGC,kBAAC,OAAD;EAAK,WAAW,EAAO;YAAvB,CACG,KACC,kBAAC,GAAD;GAAO,WAAW,EAAO;aAAzB;IACG,KACC,kBAAC,GAAD;KACE,SAAQ;KACR,WAAW,EAAO;eAEjB;IACS,CAAA;IAEb,KACC,kBAAC,GAAD;KACE,SAAQ;KACR,WAAU;KACV,WAAW,EAAO;eAEjB;IACS,CAAA;IAEb,KACC,kBAAC,GAAD;KACE,SAAQ;KACR,WAAW,EAAO;KAClB,GAAI;eAEH;IACK,CAAA;GAEL;MAET,kBAAC,OAAD;GAAK,WAAW,EAAO;aACpB,EAAS,KAAK,GAAK,MAAU;IAC5B,IAAM,IAAW,EAAI,OAAO,MAAqB,IAC3C,IAAW,EAAI,OAAO,MAAqB,KAAA,GAC3C,IAAS,EAAQ,IACjB,IAAY,EAAI,OAAO,MAAsB;IACnD,OACE,kBAAC,KAAD;KAAmB,WAAW,EAAO;KAAS,MAAM;eAClD,kBAAC,OAAD;MAAK,WAAW,EAAO;gBAAvB,CACE,kBAAC,OAAD;OAAK,WAAW,EAAO;iBAAvB,CACE,kBAAC,OAAD;QACE,WAAW,EAAO;QAClB,OAAO,IAAW,EAAE,iBAAiB,EAAS,IAAI,KAAA;kBAElD,kBAAC,GAAD;SACE,SAAS;SACT,cAAc,EAAI,OAAO;SACzB,KAAK,EAAI,OAAO,MAAqB;SACrC,OAAO;UAAE,OAAO;UAAI,QAAQ;SAAG;QAChC,CAAA;OACE,CAAA,GACL,kBAAC,OAAD;QAAK,WAAW,EAAO;kBAAvB,CACE,kBAAC,GAAD;SAAY,WAAW,EAAO;mBAC3B;QACS,CAAA,GACX,KACC,kBAAC,OAAD;SAAK,WAAW,EAAO;mBAAY;QAAe,CAAA,CAEjD;SACF;UACJ,KACC,kBAAC,OAAD;OAAK,WAAW,EAAO;iBAAvB,CACE,kBAAC,QAAD;QAAM,WAAW,EAAO;kBAAa;OAAU,CAAA,GAC/C,kBAAC,GAAD,EAAkB,WAAW,EAAO,YAAc,CAAA,CAC/C;QAEJ;;IACJ,GA9BK,EAAI,KA8BT;GAEP,CAAC;EACE,CAAA,CACF;;AAET"}
1	+ {"version":3,"file":"DataExplorer.js","names":[],"sources":["../../../src/components/DataExplorer/DataExplorer.tsx"],"sourcesContent":["import { Button, Typography, Stack } from '@mui/material'\nimport { useEffect, useMemo, useState } from 'react'\nimport styles from './DataExplorer.module.scss'\nimport { useSmartLink } from '../SmartLink/useSmartLink'\nimport { parseEntityIdFromSqlStatement } from '@/utils/functions'\nimport {\n QueryBundleRequest,\n FacetColumnResultValues,\n} from '@sage-bionetworks/synapse-types'\nimport { SynapseConstants } from '@/utils'\nimport useGetQueryResultBundle from '@/synapse-queries/entity/useGetQueryResultBundle'\nimport { getFieldIndex } from '@/utils/functions/queryUtils'\nimport { generateEncodedPathAndQueryForSelectedFacetURL } from '../QueryWrapper'\nimport ImageFromSynapseTable from '../ImageFromSynapseTable'\nimport ArrowForwardIcon from '@mui/icons-material/ArrowForward'\nimport { getFacets } from '../widgets/facet-nav/useFacetPlots'\nimport { orderBy } from 'lodash-es'\n\ntype DataExplorerProps = {\n title?: React.ReactNode\n subtitle?: React.ReactNode\n buttonText?: string\n buttonLink?: string\n sql: string\n explorePath?: string\n exploreQuerySql?: string\n facetSql?: string\n}\n\nenum ExpectedColumns {\n DATATYPE = 'datatype',\n ICON = 'icon',\n HEX_COLOR = 'hexColor',\n ORDER = 'order',\n COLUMN_NAME = 'columnName',\n}\n\n/*\n DataExplorer\n \n A reusable component that renders a list of data types/categories with associated icons.\n * It drives navigation by linking each row to a pre-filtered exploration view.\n \n How it works:\n * 1. `sql`: Fetches a configuration table defining the display categories,\n * their display order, hex colors, and icons.\n * 2. `facetSql`: Fetches real-time counts for these categories from the actual\n * underlying data table.\n * 3. Links are dynamically built to point to a target path (`explorePath`) pre-filtered to the\n * clicked category.\n */\nexport default function DataExplorer({\n sql,\n title,\n subtitle,\n buttonText,\n buttonLink,\n explorePath,\n exploreQuerySql,\n facetSql,\n}: DataExplorerProps) {\n const hasTextSection = title \|\| subtitle \|\| buttonText\n const smartLinkProps = useSmartLink(buttonLink)\n\n const entityId = parseEntityIdFromSqlStatement(sql)\n const facetEntityId = parseEntityIdFromSqlStatement(facetSql ?? '')\n\n const queryBundleRequest: QueryBundleRequest = {\n partMask:\n SynapseConstants.BUNDLE_MASK_QUERY_SELECT_COLUMNS \|\n SynapseConstants.BUNDLE_MASK_QUERY_RESULTS,\n concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n entityId,\n query: {\n sql,\n },\n }\n\n const facetQueryRequest: QueryBundleRequest = {\n partMask: SynapseConstants.BUNDLE_MASK_QUERY_FACETS,\n concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n entityId: facetEntityId,\n query: {\n sql: facetSql ?? '',\n },\n }\n\n const { data: queryResultBundle } =\n useGetQueryResultBundle(queryBundleRequest)\n\n const dataRows = useMemo(\n () => queryResultBundle?.queryResult?.queryResults.rows ?? [],\n [queryResultBundle],\n )\n\n const { data: facetQueryResultBundle } = useGetQueryResultBundle(\n facetQueryRequest,\n { enabled: Boolean(facetSql) },\n )\n\n const datatypeColIndex = getFieldIndex(\n ExpectedColumns.DATATYPE,\n queryResultBundle,\n )\n\n const iconColIndex = getFieldIndex(ExpectedColumns.ICON, queryResultBundle)\n\n const hexColorColIndex = getFieldIndex(\n ExpectedColumns.HEX_COLOR,\n queryResultBundle,\n )\n\n const orderColIndex = getFieldIndex(ExpectedColumns.ORDER, queryResultBundle)\n\n const columnNameColIndex = getFieldIndex(\n ExpectedColumns.COLUMN_NAME,\n queryResultBundle,\n )\n\n // Key rows by columnName + dataType to prevent collisions when the same dataType appears in multiple columns.\n const getRowKey = (dataType: string, columnName: string) =>\n columnName ? `${columnName}::${dataType}` : dataType\n\n const [rowUrls, setRowUrls] = useState<Record<string, string>>({})\n\n useEffect(() => {\n if (!explorePath \|\| !exploreQuerySql) return\n Promise.all(\n dataRows.map(row => {\n const dataType = row.values[datatypeColIndex]?.trim() ?? ''\n const columnName = row.values[columnNameColIndex]?.trim() ?? ''\n const rowKey = getRowKey(dataType, columnName)\n if (!dataType \|\| !columnName)\n return Promise.resolve([rowKey, explorePath] as const)\n return generateEncodedPathAndQueryForSelectedFacetURL(\n explorePath,\n exploreQuerySql,\n [{ facet: columnName, facetValue: dataType }],\n ).then(url => [rowKey, url] as const)\n }),\n ).then(entries => setRowUrls(Object.fromEntries(entries)))\n }, [\n dataRows,\n datatypeColIndex,\n columnNameColIndex,\n explorePath,\n exploreQuerySql,\n ])\n\n // Create a map of facet counts by column name and data type for quick lookup\n const facetCountsByColumn = useMemo(() => {\n const facets = getFacets(\n facetQueryResultBundle,\n ) as FacetColumnResultValues[]\n const map = new Map<string, Map<string, number>>()\n for (const facet of facets) {\n map.set(\n facet.columnName,\n new Map(facet.facetValues.map(fv => [fv.value, fv.count])),\n )\n }\n return map\n }, [facetQueryResultBundle])\n\n const getFacetCount = (dataType: string, columnName?: string) =>\n columnName ? facetCountsByColumn.get(columnName)?.get(dataType) : undefined\n\n // Sort by order column ascending, then by facet count descending\n const sortedRows = orderBy(\n dataRows,\n [\n row => Number(row.values[orderColIndex] ?? Number.MAX_SAFE_INTEGER),\n row =>\n getFacetCount(\n row.values[datatypeColIndex]?.trim() ?? '',\n row.values[columnNameColIndex]?.trim() ?? '',\n ) ?? 0,\n ],\n ['asc', 'desc'],\n )\n\n return (\n <div className={styles.dataExplorerContainer}>\n {hasTextSection && (\n <Stack className={styles.dataExplorerTextContainer}>\n {title && (\n <Typography\n variant=\"headline1\"\n className={styles.dataExplorerTitle}\n >\n {title}\n </Typography>\n )}\n {subtitle && (\n <Typography\n variant=\"body1\"\n component=\"div\"\n className={styles.dataExplorerSubtitle}\n >\n {subtitle}\n </Typography>\n )}\n {buttonText && (\n <Button\n variant=\"contained\"\n className={styles.dataExplorerButton}\n {...smartLinkProps}\n >\n {buttonText}\n </Button>\n )}\n </Stack>\n )}\n <div className={styles.dataContainer}>\n {sortedRows.map(row => {\n const dataType = row.values[datatypeColIndex]?.trim() ?? ''\n const hexColor = row.values[hexColorColIndex] ?? undefined\n const columnName = row.values[columnNameColIndex]?.trim() ?? ''\n const rowUrl = rowUrls[getRowKey(dataType, columnName)]\n const facetCount = getFacetCount(dataType, columnName)\n return (\n <a\n key={getRowKey(dataType, columnName)}\n className={styles.dataRow}\n href={rowUrl}\n >\n <div className={styles.dataRowInner}>\n <div className={styles.dataRowLeft}>\n <div\n className={styles.iconContainer}\n style={hexColor ? { backgroundColor: hexColor } : undefined}\n >\n <ImageFromSynapseTable\n tableId={entityId}\n fileHandleId={row.values[iconColIndex]}\n alt={dataType}\n style={{ width: 49, height: 49 }}\n />\n </div>\n <div className={styles.dataRowNamePill}>\n <Typography className={styles.dataRowTitle}>\n {dataType}\n </Typography>\n {facetCount && (\n <div className={styles.facetCount}>{facetCount}</div>\n )}\n </div>\n </div>\n {rowUrl && (\n <div className={styles.viewCta}>\n <span className={styles.viewCtaText}>View</span>\n <ArrowForwardIcon className={styles.viewCtaIcon} />\n </div>\n )}\n </div>\n </a>\n )\n })}\n </div>\n </div>\n )\n}\n"],"mappings":"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"}