synapse-react-client 4.0.31 → 4.0.33

package/dist/components/styled/StyledTableContainer.js

@@ -1,12 +1,12 @@
 import { Box as e, styled as t } from "@mui/material";
 //#region src/components/styled/StyledTableContainer.tsx
-var n = t(e, { shouldForwardProp: (e) => e !== "density" && e !== "noStripedRows" })(({ theme: e, density: t = "default", noStripedRows: n = !1 }) => ({
+var n = t(e, { shouldForwardProp: (e) => e !== "density" && e !== "noStripedRows" && e !== "noBackgroundColor" })(({ theme: e, density: t = "default", noStripedRows: n = !1, noBackgroundColor: r = !1 }) => ({
 	overflow: "auto",
 	paddingLeft: "2px",
-	"thead > tr": { backgroundColor: e.palette.grey[200] },
+	"thead > tr": r ? void 0 : { backgroundColor: e.palette.grey[200] },
 	th: {
 		height: "38px",
-		backgroundColor: e.palette.grey[200],
+		backgroundColor: r ? "transparent" : e.palette.grey[200],
 		borderRight: "1px solid",
 		borderColor: e.palette.grey[400]
 	},

package/dist/components/styled/StyledTableContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"StyledTableContainer.js","names":[],"sources":["../../../src/components/styled/StyledTableContainer.tsx"],"sourcesContent":["import { StyledComponent } from '@emotion/styled'\nimport { Box, BoxProps, styled } from '@mui/material'\n\nexport type StyledTableContainerProps = BoxProps & {\n  /**\n   * Controls the padding of the table cells\n   * @default 'default'\n   */\n  density?: 'default' | 'compact'\n  /**\n   * Controls whether the rows of the table are striped using CSS. For virtualized tables, this should be set to false, since the\n   * row even/oddness is not guaranteed to be consistent as DOM nodes are loaded and unloaded.\n   * @default false\n   */\n  noStripedRows?: boolean\n  ['data-testid']?: string\n}\n\nexport const StyledTableContainer: StyledComponent<StyledTableContainerProps> =\n  styled(Box, {\n    shouldForwardProp: prop => prop !== 'density' && prop !== 'noStripedRows',\n  })<StyledTableContainerProps>(\n    ({ theme, density = 'default', noStripedRows = false }) => ({\n      overflow: 'auto',\n      paddingLeft: '2px',\n      ['thead > tr']: {\n        backgroundColor: theme.palette.grey[200],\n      },\n      th: {\n        height: '38px',\n        backgroundColor: theme.palette.grey[200],\n        borderRight: '1px solid',\n        borderColor: theme.palette.grey[400],\n      },\n      ['th:first-of-type']: {\n        paddingLeft: '10px',\n      },\n      ['td:first-of-type']: {\n        paddingLeft: '10px',\n      },\n      ['tr:nth-of-type(2n)']: noStripedRows\n        ? undefined\n        : {\n            backgroundColor: theme.palette.grey[100],\n          },\n      ['tr']: {\n        backgroundColor: theme.palette.background.default,\n      },\n      ['tr:nth-of-type(even)']: noStripedRows\n        ? undefined\n        : {\n            backgroundColor: theme.palette.grey[100],\n          },\n      ['th,td']: {\n        position: 'relative',\n        paddingLeft: theme.spacing(density === 'compact' ? 0 : 1),\n        paddingRight: theme.spacing(density === 'compact' ? 0 : 1),\n      },\n      td: {\n        paddingTop: theme.spacing(density === 'compact' ? 0 : 1),\n        paddingBottom: theme.spacing(density === 'compact' ? 0 : 1),\n        textOverflow: 'ellipsis',\n        overflow: 'hidden',\n      },\n      '.resizer': {\n        position: 'absolute',\n        right: 0,\n        top: 0,\n        height: '100%',\n        width: '3px',\n        padding: 0,\n        background: 'rgba(0,0,0,0.25)',\n        cursor: 'col-resize',\n        userSelect: 'none',\n        touchAction: 'none',\n      },\n      '.resizer.isResizing': {\n        background: theme.palette.primary.main,\n        opacity: 1,\n      },\n      '@media (hover: hover)': {\n        '.resizer': {\n          opacity: 0,\n        },\n        '*:hover > .resizer': {\n          opacity: 0.75,\n        },\n      },\n      '.MuiButton-root': {\n        whiteSpace: 'nowrap',\n      },\n    }),\n  )\n"],"mappings":";;AAkBA,IAAa,IACX,EAAO,GAAK,EACV,oBAAmB,MAAQ,MAAS,aAAa,MAAS,gBAC5D,CAAC,GACE,EAAE,UAAO,aAAU,WAAW,mBAAgB,UAAa;CAC1D,UAAU;CACV,aAAa;CACZ,cAAe,EACd,iBAAiB,EAAM,QAAQ,KAAK,KACtC;CACA,IAAI;EACF,QAAQ;EACR,iBAAiB,EAAM,QAAQ,KAAK;EACpC,aAAa;EACb,aAAa,EAAM,QAAQ,KAAK;CAClC;CACC,oBAAqB,EACpB,aAAa,OACf;CACC,oBAAqB,EACpB,aAAa,OACf;CACC,sBAAuB,IACpB,KAAA,IACA,EACE,iBAAiB,EAAM,QAAQ,KAAK,KACtC;CACH,IAAO,EACN,iBAAiB,EAAM,QAAQ,WAAW,QAC5C;CACC,wBAAyB,IACtB,KAAA,IACA,EACE,iBAAiB,EAAM,QAAQ,KAAK,KACtC;CACH,SAAU;EACT,UAAU;EACV,aAAa,EAAM,QAAQ,MAAY,YAAY,IAAI,CAAC;EACxD,cAAc,EAAM,QAAQ,MAAY,YAAY,IAAI,CAAC;CAC3D;CACA,IAAI;EACF,YAAY,EAAM,QAAQ,MAAY,YAAY,IAAI,CAAC;EACvD,eAAe,EAAM,QAAQ,MAAY,YAAY,IAAI,CAAC;EAC1D,cAAc;EACd,UAAU;CACZ;CACA,YAAY;EACV,UAAU;EACV,OAAO;EACP,KAAK;EACL,QAAQ;EACR,OAAO;EACP,SAAS;EACT,YAAY;EACZ,QAAQ;EACR,YAAY;EACZ,aAAa;CACf;CACA,uBAAuB;EACrB,YAAY,EAAM,QAAQ,QAAQ;EAClC,SAAS;CACX;CACA,yBAAyB;EACvB,YAAY,EACV,SAAS,EACX;EACA,sBAAsB,EACpB,SAAS,IACX;CACF;CACA,mBAAmB,EACjB,YAAY,SACd;AACF,EACF"}
+{"version":3,"file":"StyledTableContainer.js","names":[],"sources":["../../../src/components/styled/StyledTableContainer.tsx"],"sourcesContent":["import { StyledComponent } from '@emotion/styled'\nimport { Box, BoxProps, styled } from '@mui/material'\n\nexport type StyledTableContainerProps = BoxProps & {\n  /**\n   * Controls the padding of the table cells\n   * @default 'default'\n   */\n  density?: 'default' | 'compact'\n  /**\n   * Controls whether the rows of the table are striped using CSS. For virtualized tables, this should be set to false, since the\n   * row even/oddness is not guaranteed to be consistent as DOM nodes are loaded and unloaded.\n   * @default false\n   */\n  noStripedRows?: boolean\n  noBackgroundColor?: boolean\n  ['data-testid']?: string\n}\n\nexport const StyledTableContainer: StyledComponent<StyledTableContainerProps> =\n  styled(Box, {\n    shouldForwardProp: prop =>\n      prop !== 'density' &&\n      prop !== 'noStripedRows' &&\n      prop !== 'noBackgroundColor',\n  })<StyledTableContainerProps>(\n    ({\n      theme,\n      density = 'default',\n      noStripedRows = false,\n      noBackgroundColor = false,\n    }) => ({\n      overflow: 'auto',\n      paddingLeft: '2px',\n      ['thead > tr']: noBackgroundColor\n        ? undefined\n        : {\n            backgroundColor: theme.palette.grey[200],\n          },\n      th: {\n        height: '38px',\n        backgroundColor: noBackgroundColor\n          ? 'transparent'\n          : theme.palette.grey[200],\n        borderRight: '1px solid',\n        borderColor: theme.palette.grey[400],\n      },\n      ['th:first-of-type']: {\n        paddingLeft: '10px',\n      },\n      ['td:first-of-type']: {\n        paddingLeft: '10px',\n      },\n      ['tr:nth-of-type(2n)']: noStripedRows\n        ? undefined\n        : {\n            backgroundColor: theme.palette.grey[100],\n          },\n      ['tr']: {\n        backgroundColor: theme.palette.background.default,\n      },\n      ['tr:nth-of-type(even)']: noStripedRows\n        ? undefined\n        : {\n            backgroundColor: theme.palette.grey[100],\n          },\n      ['th,td']: {\n        position: 'relative',\n        paddingLeft: theme.spacing(density === 'compact' ? 0 : 1),\n        paddingRight: theme.spacing(density === 'compact' ? 0 : 1),\n      },\n      td: {\n        paddingTop: theme.spacing(density === 'compact' ? 0 : 1),\n        paddingBottom: theme.spacing(density === 'compact' ? 0 : 1),\n        textOverflow: 'ellipsis',\n        overflow: 'hidden',\n      },\n      '.resizer': {\n        position: 'absolute',\n        right: 0,\n        top: 0,\n        height: '100%',\n        width: '3px',\n        padding: 0,\n        background: 'rgba(0,0,0,0.25)',\n        cursor: 'col-resize',\n        userSelect: 'none',\n        touchAction: 'none',\n      },\n      '.resizer.isResizing': {\n        background: theme.palette.primary.main,\n        opacity: 1,\n      },\n      '@media (hover: hover)': {\n        '.resizer': {\n          opacity: 0,\n        },\n        '*:hover > .resizer': {\n          opacity: 0.75,\n        },\n      },\n      '.MuiButton-root': {\n        whiteSpace: 'nowrap',\n      },\n    }),\n  )\n"],"mappings":";;AAmBA,IAAa,IACX,EAAO,GAAK,EACV,oBAAmB,MACjB,MAAS,aACT,MAAS,mBACT,MAAS,oBACb,CAAC,GACE,EACC,UACA,aAAU,WACV,mBAAgB,IAChB,uBAAoB,UACf;CACL,UAAU;CACV,aAAa;CACZ,cAAe,IACZ,KAAA,IACA,EACE,iBAAiB,EAAM,QAAQ,KAAK,KACtC;CACJ,IAAI;EACF,QAAQ;EACR,iBAAiB,IACb,gBACA,EAAM,QAAQ,KAAK;EACvB,aAAa;EACb,aAAa,EAAM,QAAQ,KAAK;CAClC;CACC,oBAAqB,EACpB,aAAa,OACf;CACC,oBAAqB,EACpB,aAAa,OACf;CACC,sBAAuB,IACpB,KAAA,IACA,EACE,iBAAiB,EAAM,QAAQ,KAAK,KACtC;CACH,IAAO,EACN,iBAAiB,EAAM,QAAQ,WAAW,QAC5C;CACC,wBAAyB,IACtB,KAAA,IACA,EACE,iBAAiB,EAAM,QAAQ,KAAK,KACtC;CACH,SAAU;EACT,UAAU;EACV,aAAa,EAAM,QAAQ,MAAY,YAAY,IAAI,CAAC;EACxD,cAAc,EAAM,QAAQ,MAAY,YAAY,IAAI,CAAC;CAC3D;CACA,IAAI;EACF,YAAY,EAAM,QAAQ,MAAY,YAAY,IAAI,CAAC;EACvD,eAAe,EAAM,QAAQ,MAAY,YAAY,IAAI,CAAC;EAC1D,cAAc;EACd,UAAU;CACZ;CACA,YAAY;EACV,UAAU;EACV,OAAO;EACP,KAAK;EACL,QAAQ;EACR,OAAO;EACP,SAAS;EACT,YAAY;EACZ,QAAQ;EACR,YAAY;EACZ,aAAa;CACf;CACA,uBAAuB;EACrB,YAAY,EAAM,QAAQ,QAAQ;EAClC,SAAS;CACX;CACA,yBAAyB;EACvB,YAAY,EACV,SAAS,EACX;EACA,sBAAsB,EACpB,SAAS,IACX;CACF;CACA,mBAAmB,EACjB,YAAY,SACd;AACF,EACF"}

package/dist/features/curator/dashboard/components/CurationTaskCardLayout.js

@@ -112,7 +112,7 @@ function k(t) {
 				/* @__PURE__ */ _("div", {
 					className: r.statusContainer,
 					children: [/* @__PURE__ */ g(E, { state: n.status?.state }), /* @__PURE__ */ g(D, {
-						dueDate: n.status?.dueDate,
+						dueDate: n.task?.dueDate,
 						taskState: n.status?.state
 					})]
 				}),

package/dist/features/curator/dashboard/components/CurationTaskCardLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"CurationTaskCardLayout.js","names":[],"sources":["../../../../../src/features/curator/dashboard/components/CurationTaskCardLayout.tsx"],"sourcesContent":["import {\n  Card,\n  Chip,\n  Collapse,\n  Divider,\n  IconButton,\n  Link,\n  Skeleton,\n  Typography,\n} from '@mui/material'\nimport HelpOutline from '@mui/icons-material/HelpOutline'\nimport {\n  TaskBundle,\n  TaskStatusStateEnum,\n} from '@sage-bionetworks/synapse-client'\nimport classNames from 'classnames'\nimport { ReactNode, useState } from 'react'\nimport { useNavigate } from 'react-router'\nimport dayjs from 'dayjs'\nimport utc from 'dayjs/plugin/utc'\nimport SettingsOutlinedIcon from '@mui/icons-material/SettingsOutlined'\nimport useGetEntityBundle from '@/synapse-queries/entity/useEntityBundle'\nimport { TASK_STATUS_CONFIG } from '@/features/entity/metadata-task/utils/constants'\nimport { parseDueDate } from '@/features/entity/metadata-task/utils/dueDate'\nimport styles from './CurationTaskCard.module.scss'\nimport sharedStyles from './shared.module.scss'\nimport UserOrTeamChip from './UserOrTeamChip'\n\ndayjs.extend(utc)\n\nfunction TaskTypeChip(props: { label: string }) {\n  const { label } = props\n  return (\n    <Chip sx={{ fontWeight: 600, backgroundColor: '#BFD3ED' }} label={label} />\n  )\n}\n\n/**\n * A chip to display CurationTask status.\n *\n * See {@link https://www.figma.com/design/0oPm5lLSUva8kyfVNMS6FA/Sage-Style---Component-Library--SDS-?node-id=4942-1129&m=dev}\n */\nfunction TaskStatusChip(props: { state: TaskStatusStateEnum | undefined }) {\n  const { state } = props\n  if (!state) return null\n  const { label, backgroundColor } = TASK_STATUS_CONFIG[state]\n  return (\n    <Chip\n      size=\"small\"\n      sx={{ fontWeight: 600, backgroundColor }}\n      label={label}\n    />\n  )\n}\n\nfunction DueDateChip(props: {\n  dueDate: string | undefined\n  taskState: TaskStatusStateEnum | undefined\n}) {\n  const { dueDate, taskState } = props\n  const dueDateObj = parseDueDate(dueDate)\n  if (!dueDateObj) return null\n\n  const formattedDate = dueDateObj.format('MM/DD/YY')\n  const isTerminal =\n    taskState === TaskStatusStateEnum.COMPLETED ||\n    taskState === TaskStatusStateEnum.CANCELED\n\n  let backgroundColor = '#E0E0E0'\n  if (!isTerminal) {\n    const daysUntilDue = dueDateObj.diff(dayjs.utc().startOf('day'), 'day')\n    if (daysUntilDue < 0) {\n      backgroundColor = '#FFCDD2'\n    } else if (daysUntilDue < 30) {\n      backgroundColor = '#FFF9C4'\n    }\n  }\n\n  return (\n    <Chip\n      size=\"small\"\n      sx={{ fontWeight: 600, backgroundColor }}\n      label={`Due ${formattedDate}`}\n    />\n  )\n}\n\nexport type CurationTaskCardLayoutProps = {\n  taskBundle: TaskBundle\n  title: string\n  description: string\n  taskType: string\n  principalIds: string[]\n  /** Renders the action button. `expanded` reflects whether the card is in its expanded layout. */\n  renderActionButton: (props: { expanded: boolean }) => ReactNode\n}\n\n/** Derives the fields shared by every card variant from a task's common properties. */\nexport function deriveCardFields(task: TaskBundle['task']) {\n  return {\n    title: task?.dataType ?? '',\n    description: task?.instructions ?? '',\n    principalIds: task?.assigneePrincipalId ? [task.assigneePrincipalId] : [],\n  }\n}\n\n/**\n * Shared presentational chrome for a curation task card: title, chips, entity info, assignees,\n * status/due date, and an action button slot. Both the grid and executable task cards compose this.\n */\nexport default function CurationTaskCardLayout(\n  props: CurationTaskCardLayoutProps,\n) {\n  const {\n    taskBundle,\n    title,\n    description,\n    taskType,\n    principalIds,\n    renderActionButton,\n  } = props\n\n  const navigate = useNavigate()\n  const [isExpanded, setIsExpanded] = useState(false)\n\n  const taskId = taskBundle.task?.taskId\n  const projectId = taskBundle.task?.projectId\n  const { data: bundle } = useGetEntityBundle(projectId, undefined, {\n    includeEntity: true,\n    includePermissions: true,\n  })\n  const canEdit = bundle?.permissions?.canEdit ?? false\n\n  return (\n    <Card className={classNames(sharedStyles.card, styles.card)}>\n      <div className={styles.cardContent}>\n        <div className={styles.mainContent}>\n          <div className={styles.titleChipContainer}>\n            <Typography\n              variant=\"headline3\"\n              className={styles.title}\n              onClick={() => setIsExpanded(!isExpanded)}\n            >\n              {title}\n            </Typography>\n            {taskType && <TaskTypeChip label={taskType} />}\n            {canEdit && (\n              <IconButton\n                onClick={() => void navigate(`edit/${taskId}`)}\n                aria-label=\"Task settings\"\n              >\n                <SettingsOutlinedIcon />\n              </IconButton>\n            )}\n          </div>\n          <div className={styles.entityInfo}>\n            {bundle?.entity?.name ? (\n              <Typography variant=\"body1\">{bundle.entity.name}</Typography>\n            ) : (\n              <Skeleton width={100} />\n            )}\n            {taskId && (\n              <Typography variant=\"body1\">Task ID: {taskId}</Typography>\n            )}\n          </div>\n          <div className={styles.userChipContainer}>\n            {principalIds.map(principalId => (\n              <UserOrTeamChip key={principalId} principalId={principalId} />\n            ))}\n          </div>\n        </div>\n        <div className={styles.statusContainer}>\n          <TaskStatusChip state={taskBundle.status?.state} />\n          <DueDateChip\n            dueDate={taskBundle.status?.dueDate}\n            taskState={taskBundle.status?.state}\n          />\n        </div>\n        {!isExpanded && (\n          <>\n            <Divider\n              orientation=\"vertical\"\n              flexItem\n              sx={{ display: { xs: 'none', md: 'block' } }}\n            />\n            {renderActionButton({ expanded: false })}\n          </>\n        )}\n      </div>\n      <Collapse in={isExpanded}>\n        <div className={styles.expandedContent}>\n          <div className={styles.expandedTopRow}>\n            {description && (\n              <Typography variant=\"body1\">{description}</Typography>\n            )}\n            <Link\n              href=\"https://docs.synapse.org/synapse-docs/managing-metadata-with-curator\"\n              target=\"_blank\"\n              rel=\"noopener noreferrer\"\n              color=\"text.primary\"\n              underline=\"hover\"\n              className={styles.helpLink}\n              sx={{ fontWeight: 400 }}\n            >\n              <HelpOutline className={styles.helpIcon} />\n              Have questions or need help?\n            </Link>\n          </div>\n          {renderActionButton({ expanded: true })}\n        </div>\n      </Collapse>\n    </Card>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"CurationTaskCardLayout.js","names":[],"sources":["../../../../../src/features/curator/dashboard/components/CurationTaskCardLayout.tsx"],"sourcesContent":["import {\n  Card,\n  Chip,\n  Collapse,\n  Divider,\n  IconButton,\n  Link,\n  Skeleton,\n  Typography,\n} from '@mui/material'\nimport HelpOutline from '@mui/icons-material/HelpOutline'\nimport {\n  TaskBundle,\n  TaskStatusStateEnum,\n} from '@sage-bionetworks/synapse-client'\nimport classNames from 'classnames'\nimport { ReactNode, useState } from 'react'\nimport { useNavigate } from 'react-router'\nimport dayjs from 'dayjs'\nimport utc from 'dayjs/plugin/utc'\nimport SettingsOutlinedIcon from '@mui/icons-material/SettingsOutlined'\nimport useGetEntityBundle from '@/synapse-queries/entity/useEntityBundle'\nimport { TASK_STATUS_CONFIG } from '@/features/entity/metadata-task/utils/constants'\nimport { parseDueDate } from '@/features/entity/metadata-task/utils/dueDate'\nimport styles from './CurationTaskCard.module.scss'\nimport sharedStyles from './shared.module.scss'\nimport UserOrTeamChip from './UserOrTeamChip'\n\ndayjs.extend(utc)\n\nfunction TaskTypeChip(props: { label: string }) {\n  const { label } = props\n  return (\n    <Chip sx={{ fontWeight: 600, backgroundColor: '#BFD3ED' }} label={label} />\n  )\n}\n\n/**\n * A chip to display CurationTask status.\n *\n * See {@link https://www.figma.com/design/0oPm5lLSUva8kyfVNMS6FA/Sage-Style---Component-Library--SDS-?node-id=4942-1129&m=dev}\n */\nfunction TaskStatusChip(props: { state: TaskStatusStateEnum | undefined }) {\n  const { state } = props\n  if (!state) return null\n  const { label, backgroundColor } = TASK_STATUS_CONFIG[state]\n  return (\n    <Chip\n      size=\"small\"\n      sx={{ fontWeight: 600, backgroundColor }}\n      label={label}\n    />\n  )\n}\n\nfunction DueDateChip(props: {\n  dueDate: string | undefined\n  taskState: TaskStatusStateEnum | undefined\n}) {\n  const { dueDate, taskState } = props\n  const dueDateObj = parseDueDate(dueDate)\n  if (!dueDateObj) return null\n\n  const formattedDate = dueDateObj.format('MM/DD/YY')\n  const isTerminal =\n    taskState === TaskStatusStateEnum.COMPLETED ||\n    taskState === TaskStatusStateEnum.CANCELED\n\n  let backgroundColor = '#E0E0E0'\n  if (!isTerminal) {\n    const daysUntilDue = dueDateObj.diff(dayjs.utc().startOf('day'), 'day')\n    if (daysUntilDue < 0) {\n      backgroundColor = '#FFCDD2'\n    } else if (daysUntilDue < 30) {\n      backgroundColor = '#FFF9C4'\n    }\n  }\n\n  return (\n    <Chip\n      size=\"small\"\n      sx={{ fontWeight: 600, backgroundColor }}\n      label={`Due ${formattedDate}`}\n    />\n  )\n}\n\nexport type CurationTaskCardLayoutProps = {\n  taskBundle: TaskBundle\n  title: string\n  description: string\n  taskType: string\n  principalIds: string[]\n  /** Renders the action button. `expanded` reflects whether the card is in its expanded layout. */\n  renderActionButton: (props: { expanded: boolean }) => ReactNode\n}\n\n/** Derives the fields shared by every card variant from a task's common properties. */\nexport function deriveCardFields(task: TaskBundle['task']) {\n  return {\n    title: task?.dataType ?? '',\n    description: task?.instructions ?? '',\n    principalIds: task?.assigneePrincipalId ? [task.assigneePrincipalId] : [],\n  }\n}\n\n/**\n * Shared presentational chrome for a curation task card: title, chips, entity info, assignees,\n * status/due date, and an action button slot. Both the grid and executable task cards compose this.\n */\nexport default function CurationTaskCardLayout(\n  props: CurationTaskCardLayoutProps,\n) {\n  const {\n    taskBundle,\n    title,\n    description,\n    taskType,\n    principalIds,\n    renderActionButton,\n  } = props\n\n  const navigate = useNavigate()\n  const [isExpanded, setIsExpanded] = useState(false)\n\n  const taskId = taskBundle.task?.taskId\n  const projectId = taskBundle.task?.projectId\n  const { data: bundle } = useGetEntityBundle(projectId, undefined, {\n    includeEntity: true,\n    includePermissions: true,\n  })\n  const canEdit = bundle?.permissions?.canEdit ?? false\n\n  return (\n    <Card className={classNames(sharedStyles.card, styles.card)}>\n      <div className={styles.cardContent}>\n        <div className={styles.mainContent}>\n          <div className={styles.titleChipContainer}>\n            <Typography\n              variant=\"headline3\"\n              className={styles.title}\n              onClick={() => setIsExpanded(!isExpanded)}\n            >\n              {title}\n            </Typography>\n            {taskType && <TaskTypeChip label={taskType} />}\n            {canEdit && (\n              <IconButton\n                onClick={() => void navigate(`edit/${taskId}`)}\n                aria-label=\"Task settings\"\n              >\n                <SettingsOutlinedIcon />\n              </IconButton>\n            )}\n          </div>\n          <div className={styles.entityInfo}>\n            {bundle?.entity?.name ? (\n              <Typography variant=\"body1\">{bundle.entity.name}</Typography>\n            ) : (\n              <Skeleton width={100} />\n            )}\n            {taskId && (\n              <Typography variant=\"body1\">Task ID: {taskId}</Typography>\n            )}\n          </div>\n          <div className={styles.userChipContainer}>\n            {principalIds.map(principalId => (\n              <UserOrTeamChip key={principalId} principalId={principalId} />\n            ))}\n          </div>\n        </div>\n        <div className={styles.statusContainer}>\n          <TaskStatusChip state={taskBundle.status?.state} />\n          <DueDateChip\n            dueDate={taskBundle.task?.dueDate}\n            taskState={taskBundle.status?.state}\n          />\n        </div>\n        {!isExpanded && (\n          <>\n            <Divider\n              orientation=\"vertical\"\n              flexItem\n              sx={{ display: { xs: 'none', md: 'block' } }}\n            />\n            {renderActionButton({ expanded: false })}\n          </>\n        )}\n      </div>\n      <Collapse in={isExpanded}>\n        <div className={styles.expandedContent}>\n          <div className={styles.expandedTopRow}>\n            {description && (\n              <Typography variant=\"body1\">{description}</Typography>\n            )}\n            <Link\n              href=\"https://docs.synapse.org/synapse-docs/managing-metadata-with-curator\"\n              target=\"_blank\"\n              rel=\"noopener noreferrer\"\n              color=\"text.primary\"\n              underline=\"hover\"\n              className={styles.helpLink}\n              sx={{ fontWeight: 400 }}\n            >\n              <HelpOutline className={styles.helpIcon} />\n              Have questions or need help?\n            </Link>\n          </div>\n          {renderActionButton({ expanded: true })}\n        </div>\n      </Collapse>\n    </Card>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AA4BA,EAAM,OAAO,CAAG;AAEhB,SAAS,EAAa,GAA0B;CAC9C,IAAM,EAAE,aAAU;CAClB,OACE,kBAAC,GAAD;EAAM,IAAI;GAAE,YAAY;GAAK,iBAAiB;EAAU;EAAU;CAAQ,CAAA;AAE9E;AAOA,SAAS,EAAe,GAAmD;CACzE,IAAM,EAAE,aAAU;CAClB,IAAI,CAAC,GAAO,OAAO;CACnB,IAAM,EAAE,UAAO,uBAAoB,EAAmB;CACtD,OACE,kBAAC,GAAD;EACE,MAAK;EACL,IAAI;GAAE,YAAY;GAAK;EAAgB;EAChC;CACR,CAAA;AAEL;AAEA,SAAS,EAAY,GAGlB;CACD,IAAM,EAAE,YAAS,iBAAc,GACzB,IAAa,EAAa,CAAO;CACvC,IAAI,CAAC,GAAY,OAAO;CAExB,IAAM,IAAgB,EAAW,OAAO,UAAU,GAC5C,IACJ,MAAc,EAAoB,aAClC,MAAc,EAAoB,UAEhC,IAAkB;CACtB,IAAI,CAAC,GAAY;EACf,IAAM,IAAe,EAAW,KAAK,EAAM,IAAI,EAAE,QAAQ,KAAK,GAAG,KAAK;EACtE,AAAI,IAAe,IACjB,IAAkB,YACT,IAAe,OACxB,IAAkB;CAEtB;CAEA,OACE,kBAAC,GAAD;EACE,MAAK;EACL,IAAI;GAAE,YAAY;GAAK;EAAgB;EACvC,OAAO,OAAO;CACf,CAAA;AAEL;AAaA,SAAgB,EAAiB,GAA0B;CACzD,OAAO;EACL,OAAO,GAAM,YAAY;EACzB,aAAa,GAAM,gBAAgB;EACnC,cAAc,GAAM,sBAAsB,CAAC,EAAK,mBAAmB,IAAI,CAAC;CAC1E;AACF;AAMA,SAAwB,EACtB,GACA;CACA,IAAM,EACJ,eACA,UACA,gBACA,aACA,iBACA,0BACE,GAEE,IAAW,EAAY,GACvB,CAAC,GAAY,KAAiB,EAAS,EAAK,GAE5C,IAAS,EAAW,MAAM,QAC1B,IAAY,EAAW,MAAM,WAC7B,EAAE,MAAM,MAAW,EAAmB,GAAW,KAAA,GAAW;EAChE,eAAe;EACf,oBAAoB;CACtB,CAAC,GACK,IAAU,GAAQ,aAAa,WAAW;CAEhD,OACE,kBAAC,GAAD;EAAM,WAAW,EAAW,EAAa,MAAM,EAAO,IAAI;YAA1D,CACE,kBAAC,OAAD;GAAK,WAAW,EAAO;aAAvB;IACE,kBAAC,OAAD;KAAK,WAAW,EAAO;eAAvB;MACE,kBAAC,OAAD;OAAK,WAAW,EAAO;iBAAvB;QACE,kBAAC,GAAD;SACE,SAAQ;SACR,WAAW,EAAO;SAClB,eAAe,EAAc,CAAC,CAAU;mBAEvC;QACS,CAAA;QACX,KAAY,kBAAC,GAAD,EAAc,OAAO,EAAW,CAAA;QAC5C,KACC,kBAAC,GAAD;SACE,eAAe,KAAK,EAAS,QAAQ,GAAQ;SAC7C,cAAW;mBAEX,kBAAC,GAAD,CAAuB,CAAA;QACb,CAAA;OAEX;;MACL,kBAAC,OAAD;OAAK,WAAW,EAAO;iBAAvB,CACG,GAAQ,QAAQ,OACf,kBAAC,GAAD;QAAY,SAAQ;kBAAS,EAAO,OAAO;OAAiB,CAAA,IAE5D,kBAAC,GAAD,EAAU,OAAO,IAAM,CAAA,GAExB,KACC,kBAAC,GAAD;QAAY,SAAQ;kBAApB,CAA4B,aAAU,CAAmB;SAExD;;MACL,kBAAC,OAAD;OAAK,WAAW,EAAO;iBACpB,EAAa,KAAI,MAChB,kBAAC,GAAD,EAA+C,eAAc,GAAxC,CAAwC,CAC9D;MACE,CAAA;KACF;;IACL,kBAAC,OAAD;KAAK,WAAW,EAAO;eAAvB,CACE,kBAAC,GAAD,EAAgB,OAAO,EAAW,QAAQ,MAAQ,CAAA,GAClD,kBAAC,GAAD;MACE,SAAS,EAAW,MAAM;MAC1B,WAAW,EAAW,QAAQ;KAC/B,CAAA,CACE;;IACJ,CAAC,KACA,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;KACE,aAAY;KACZ,UAAA;KACA,IAAI,EAAE,SAAS;MAAE,IAAI;MAAQ,IAAI;KAAQ,EAAE;IAC5C,CAAA,GACA,EAAmB,EAAE,UAAU,GAAM,CAAC,CACvC,EAAA,CAAA;GAED;MACL,kBAAC,GAAD;GAAU,IAAI;aACZ,kBAAC,OAAD;IAAK,WAAW,EAAO;cAAvB,CACE,kBAAC,OAAD;KAAK,WAAW,EAAO;eAAvB,CACG,KACC,kBAAC,GAAD;MAAY,SAAQ;gBAAS;KAAwB,CAAA,GAEvD,kBAAC,GAAD;MACE,MAAK;MACL,QAAO;MACP,KAAI;MACJ,OAAM;MACN,WAAU;MACV,WAAW,EAAO;MAClB,IAAI,EAAE,YAAY,IAAI;gBAPxB,CASE,kBAAC,GAAD,EAAa,WAAW,EAAO,SAAW,CAAA,GAAC,8BAEvC;OACH;QACJ,EAAmB,EAAE,UAAU,GAAK,CAAC,CACnC;;EACG,CAAA,CACN;;AAEV"}

package/dist/features/entity/metadata-task/components/CreateOrUpdateCurationTaskDialog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CreateOrUpdateCurationTaskDialog.d.ts","sourceRoot":"","sources":["../../../../../src/features/entity/metadata-task/components/CreateOrUpdateCurationTaskDialog.tsx"],"names":[],"mappings":"AAuCA,OAAO,EACL,YAAY,EAMb,MAAM,kCAAkC,CAAA;AA8CzC,MAAM,MAAM,qCAAqC,GAAG;IAClD,IAAI,EAAE,OAAO,CAAA;IACb,QAAQ,EAAE,MAAM,IAAI,CAAA;IACpB,SAAS,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAA;IACvC;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;IAC5B,SAAS,EAAE,MAAM,CAAA;IACjB,IAAI,CAAC,EAAE,YAAY,CAAA;CACpB,CAAA;AAsBD;;GAEG;AACH,MAAM,CAAC,OAAO,UAAU,gCAAgC,CACtD,KAAK,EAAE,qCAAqC,2CA0qB7C"}
+{"version":3,"file":"CreateOrUpdateCurationTaskDialog.d.ts","sourceRoot":"","sources":["../../../../../src/features/entity/metadata-task/components/CreateOrUpdateCurationTaskDialog.tsx"],"names":[],"mappings":"AAuCA,OAAO,EACL,YAAY,EAMb,MAAM,kCAAkC,CAAA;AA8CzC,MAAM,MAAM,qCAAqC,GAAG;IAClD,IAAI,EAAE,OAAO,CAAA;IACb,QAAQ,EAAE,MAAM,IAAI,CAAA;IACpB,SAAS,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAA;IACvC;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;IAC5B,SAAS,EAAE,MAAM,CAAA;IACjB,IAAI,CAAC,EAAE,YAAY,CAAA;CACpB,CAAA;AAsBD;;GAEG;AACH,MAAM,CAAC,OAAO,UAAU,gCAAgC,CACtD,KAAK,EAAE,qCAAqC,2CAsqB7C"}