synapse-react-client 4.0.9 → 4.0.11

package/dist/components/PortalAclEditor/PortalAclEditor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PortalAclEditor.d.ts","sourceRoot":"","sources":["../../../src/components/PortalAclEditor/PortalAclEditor.tsx"],"names":[],"mappings":"AAyBA,MAAM,MAAM,qBAAqB,GAAG;IAElC,IAAI,EAAE,MAAM,IAAI,CAAA;CACjB,CAAA;AAED,MAAM,MAAM,oBAAoB,GAAG;IACjC,QAAQ,EAAE,MAAM,CAAA;IAChB,cAAc,EAAE,CAAC,cAAc,EAAE,OAAO,KAAK,IAAI,CAAA;CAClD,CAAA;AAED,eAAO,MAAM,eAAe,wHAuG1B,CAAA"}
+{"version":3,"file":"PortalAclEditor.d.ts","sourceRoot":"","sources":["../../../src/components/PortalAclEditor/PortalAclEditor.tsx"],"names":[],"mappings":"AA2BA,MAAM,MAAM,qBAAqB,GAAG;IAElC,IAAI,EAAE,MAAM,IAAI,CAAA;CACjB,CAAA;AAED,MAAM,MAAM,oBAAoB,GAAG;IACjC,QAAQ,EAAE,MAAM,CAAA;IAChB,cAAc,EAAE,CAAC,cAAc,EAAE,OAAO,KAAK,IAAI,CAAA;CAClD,CAAA;AAED,eAAO,MAAM,eAAe,wHAyH1B,CAAA"}

package/dist/components/PortalAclEditor/PortalAclEditor.js

@@ -1,65 +1,67 @@
 import { getAccessTypeFromPermissionLevel as e } from "../../utils/PermissionLevelToAccessType.js";
 import { useGetPortalACL as t, useUpdatePortalACL as n } from "../../synapse-queries/portal/usePortal.js";
 import "../../synapse-queries/index.js";
-import { convertResourceAccessSetToSRC as r, updateACLWithSRCResourceAccessList as i } from "../../utils/functions/AccessControlListUtils.js";
-import { AclEditor as a } from "../AclEditor/AclEditor.js";
-import o from "../AclEditor/useUpdateAcl.js";
-import { forwardRef as s, useEffect as c, useImperativeHandle as l, useState as u } from "react";
-import { isEqual as d } from "lodash-es";
-import { Alert as f, Stack as p } from "@mui/material";
-import { jsx as m, jsxs as h } from "react/jsx-runtime";
+import { consolidateResourceAccessList as r, convertResourceAccessSetToSRC as i, updateACLWithSRCResourceAccessList as a } from "../../utils/functions/AccessControlListUtils.js";
+import { AclEditor as o } from "../AclEditor/AclEditor.js";
+import s from "../AclEditor/useUpdateAcl.js";
+import { forwardRef as c, useEffect as l, useImperativeHandle as u, useMemo as d, useState as f } from "react";
+import { isEqual as p } from "lodash-es";
+import { Alert as m, Stack as h } from "@mui/material";
+import { jsx as g, jsxs as _ } from "react/jsx-runtime";
 //#region src/components/PortalAclEditor/PortalAclEditor.tsx
-var g = ["CAN_ADMINISTER_PORTAL"], _ = s(function(s, _) {
-	let { portalId: v, onSaveComplete: y } = s, [b, x] = u(null), S = () => {
-		x(null), y(!0);
-	}, C = (e) => {
-		x(e.reason), y(!1);
-	}, { data: w, isLoading: T } = t(v, { staleTime: Infinity }), { resourceAccessList: E, setResourceAccessList: D, addResourceAccessItem: O, updateResourceAccessItem: k, removeResourceAccessItem: A, resetDirtyState: j } = o({
-		onChange: () => x(null),
-		onError: x
+var v = ["CAN_ADMINISTER_PORTAL"], y = c(function(c, y) {
+	let { portalId: b, onSaveComplete: x } = c, [S, C] = f(null), w = () => {
+		C(null), x(!0);
+	}, T = (e) => {
+		C(e.reason), x(!1);
+	}, { data: E, isLoading: D } = t(b, { staleTime: Infinity }), O = d(() => r(i(E?.resourceAccess)), [E]), { resourceAccessList: k, setResourceAccessList: A, addResourceAccessItem: j, updateResourceAccessItem: M, removeResourceAccessItem: N, resetDirtyState: P } = s({
+		onChange: () => C(null),
+		onError: C
 	});
-	c(() => {
-		w && (j(), D(r(w.resourceAccess)));
+	l(() => {
+		E && (P(), A(O));
 	}, [
-		w,
-		D,
-		j
+		E,
+		O,
+		P,
+		A
 	]);
-	let { mutate: M } = n({
-		onSuccess: () => S(),
-		onError: (e) => C(e)
+	let { mutate: F } = n({
+		onSuccess: () => w(),
+		onError: (e) => T(e)
 	});
-	return l(_, () => ({ save() {
-		let e = i(w, E);
-		w === null && e == null || d(w?.resourceAccess, E) && w?.id === e?.id ? y(!0) : M(e);
+	return u(y, () => ({ save() {
+		let e = a(E, k);
+		E === null && e == null || p(O, k) && E?.id === e?.id ? x(!0) : F(e);
 	} }), [
-		v,
-		w,
+		b,
 		E,
-		y,
-		M
-	]), /* @__PURE__ */ h(p, {
+		O,
+		k,
+		x,
+		F
+	]), /* @__PURE__ */ _(h, {
 		direction: "column",
 		sx: { gap: "20px" },
-		children: [/* @__PURE__ */ m(a, {
-			resourceAccessList: E,
-			availablePermissionLevels: g,
-			isLoading: T,
+		children: [/* @__PURE__ */ g(o, {
+			resourceAccessList: k,
+			availablePermissionLevels: v,
+			isLoading: D,
 			canEdit: !0,
 			emptyText: "",
-			onAddPrincipalToAcl: (t) => O(t, e("CAN_ADMINISTER_PORTAL")),
-			updateResourceAccessItem: k,
-			removeResourceAccessItem: A,
+			onAddPrincipalToAcl: (t) => j(t, e("CAN_ADMINISTER_PORTAL")),
+			updateResourceAccessItem: M,
+			removeResourceAccessItem: N,
 			showAddRemovePublicButton: !1,
 			showNotifyCheckbox: !1,
 			isInherited: !1
-		}), b && /* @__PURE__ */ m(f, {
+		}), S && /* @__PURE__ */ g(m, {
 			severity: "error",
-			children: b
+			children: S
 		})]
 	});
 });
 //#endregion
-export { _ as PortalAclEditor };
+export { y as PortalAclEditor };
 
 //# sourceMappingURL=PortalAclEditor.js.map

package/dist/components/PortalAclEditor/PortalAclEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"PortalAclEditor.js","names":[],"sources":["../../../src/components/PortalAclEditor/PortalAclEditor.tsx"],"sourcesContent":["import { useGetPortalACL, useUpdatePortalACL } from '@/synapse-queries'\nimport {\n  getAccessTypeFromPermissionLevel,\n  PermissionLevel,\n} from '@/utils/PermissionLevelToAccessType'\nimport { Alert, Stack } from '@mui/material'\nimport { SynapseClientError } from '@sage-bionetworks/synapse-client/util/SynapseClientError'\nimport { isEqual } from 'lodash-es'\nimport {\n  ForwardedRef,\n  forwardRef,\n  useEffect,\n  useImperativeHandle,\n  useState,\n} from 'react'\nimport { AclEditor } from '../AclEditor/AclEditor'\nimport useUpdateAcl from '../AclEditor/useUpdateAcl'\nimport { AccessControlList } from '@sage-bionetworks/synapse-client'\nimport {\n  convertResourceAccessSetToSRC,\n  updateACLWithSRCResourceAccessList,\n} from '@/utils/functions/AccessControlListUtils'\n\nconst availablePermissionLevels: PermissionLevel[] = ['CAN_ADMINISTER_PORTAL']\n\nexport type PortalAclEditorHandle = {\n  /* Allow the parent component to trigger saving the ACL, so this may be embedded in an arbitrary modal. */\n  save: () => void\n}\n\nexport type PortalAclEditorProps = {\n  portalId: string\n  onSaveComplete: (saveSuccessful: boolean) => void\n}\n\nexport const PortalAclEditor = forwardRef(function PortalAclEditor(\n  props: PortalAclEditorProps,\n  ref: ForwardedRef<PortalAclEditorHandle>,\n) {\n  const { portalId, onSaveComplete } = props\n  const [error, setError] = useState<string | null>(null)\n\n  const onMutationSuccess = () => {\n    setError(null)\n    onSaveComplete(true)\n  }\n\n  const onMutationError = (error: SynapseClientError) => {\n    setError(error.reason)\n    onSaveComplete(false)\n  }\n\n  const { data: originalAcl, isLoading: isLoadingOriginalAcl } =\n    useGetPortalACL(portalId, {\n      // Infinite staleTime ensures this won't get re-fetched unless explicitly invalidated by the mutation\n      staleTime: Infinity,\n    })\n\n  const {\n    resourceAccessList,\n    setResourceAccessList,\n    addResourceAccessItem,\n    updateResourceAccessItem,\n    removeResourceAccessItem,\n    resetDirtyState,\n  } = useUpdateAcl({\n    onChange: () => setError(null),\n    onError: setError,\n  })\n\n  // set resourceAccessList when the fetched acl changes\n  useEffect(() => {\n    if (originalAcl) {\n      resetDirtyState()\n      setResourceAccessList(\n        convertResourceAccessSetToSRC(originalAcl.resourceAccess),\n      )\n    }\n  }, [originalAcl, setResourceAccessList, resetDirtyState])\n\n  const { mutate: updateAcl } = useUpdatePortalACL({\n    onSuccess: () => onMutationSuccess(),\n    onError: (error: SynapseClientError) => onMutationError(error),\n  })\n\n  useImperativeHandle(\n    ref,\n    () => {\n      return {\n        save() {\n          const updatedAcl: AccessControlList =\n            updateACLWithSRCResourceAccessList(originalAcl, resourceAccessList)\n          const aclIsUnchanged =\n            (originalAcl === null && updatedAcl == null) ||\n            // ignore properties that will change when the ACL is saved (etag, modifiedOn)\n            (isEqual(originalAcl?.resourceAccess, resourceAccessList) &&\n              originalAcl?.id === updatedAcl?.id)\n\n          if (aclIsUnchanged) {\n            // noop\n            onSaveComplete(true)\n          } else {\n            updateAcl(updatedAcl)\n          }\n        },\n      }\n    },\n    [portalId, originalAcl, resourceAccessList, onSaveComplete, updateAcl],\n  )\n\n  return (\n    <Stack\n      direction=\"column\"\n      sx={{\n        gap: '20px',\n      }}\n    >\n      <AclEditor\n        resourceAccessList={resourceAccessList}\n        availablePermissionLevels={availablePermissionLevels}\n        isLoading={isLoadingOriginalAcl}\n        canEdit={true}\n        emptyText={/* This should never happen */ ''}\n        onAddPrincipalToAcl={id =>\n          addResourceAccessItem(\n            id,\n            getAccessTypeFromPermissionLevel('CAN_ADMINISTER_PORTAL'),\n          )\n        }\n        updateResourceAccessItem={updateResourceAccessItem}\n        removeResourceAccessItem={removeResourceAccessItem}\n        showAddRemovePublicButton={false}\n        showNotifyCheckbox={false}\n        isInherited={false}\n      />\n      {error && <Alert severity=\"error\">{error}</Alert>}\n    </Stack>\n  )\n})\n"],"mappings":";;;;;;;;;;;AAuBA,IAAM,IAA+C,CAAC,wBAAwB,EAYjE,IAAkB,EAAW,SACxC,GACA,GACA;CACA,IAAM,EAAE,aAAU,sBAAmB,GAC/B,CAAC,GAAO,KAAY,EAAwB,KAAK,EAEjD,UAA0B;AAE9B,EADA,EAAS,KAAK,EACd,EAAe,GAAK;IAGhB,KAAmB,MAA8B;AAErD,EADA,EAAS,EAAM,OAAO,EACtB,EAAe,GAAM;IAGjB,EAAE,MAAM,GAAa,WAAW,MACpC,EAAgB,GAAU,EAExB,WAAW,UACZ,CAAC,EAEE,EACJ,uBACA,0BACA,0BACA,6BACA,6BACA,uBACE,EAAa;EACf,gBAAgB,EAAS,KAAK;EAC9B,SAAS;EACV,CAAC;AAGF,SAAgB;AACd,EAAI,MACF,GAAiB,EACjB,EACE,EAA8B,EAAY,eAAe,CAC1D;IAEF;EAAC;EAAa;EAAuB;EAAgB,CAAC;CAEzD,IAAM,EAAE,QAAQ,MAAc,EAAmB;EAC/C,iBAAiB,GAAmB;EACpC,UAAU,MAA8B,EAAgB,EAAM;EAC/D,CAAC;AA2BF,QAzBA,EACE,UAES,EACL,OAAO;EACL,IAAM,IACJ,EAAmC,GAAa,EAAmB;AAOrE,EALG,MAAgB,QAAQ,KAAc,QAEtC,EAAQ,GAAa,gBAAgB,EAAmB,IACvD,GAAa,OAAO,GAAY,KAIlC,EAAe,GAAK,GAEpB,EAAU,EAAW;IAG1B,GAEH;EAAC;EAAU;EAAa;EAAoB;EAAgB;EAAU,CACvE,EAGC,kBAAC,GAAD;EACE,WAAU;EACV,IAAI,EACF,KAAK,QACN;YAJH,CAME,kBAAC,GAAD;GACsB;GACO;GAC3B,WAAW;GACX,SAAS;GACT,WAA0C;GAC1C,sBAAqB,MACnB,EACE,GACA,EAAiC,wBAAwB,CAC1D;GAEuB;GACA;GAC1B,2BAA2B;GAC3B,oBAAoB;GACpB,aAAa;GACb,CAAA,EACD,KAAS,kBAAC,GAAD;GAAO,UAAS;aAAS;GAAc,CAAA,CAC3C;;EAEV"}
+{"version":3,"file":"PortalAclEditor.js","names":[],"sources":["../../../src/components/PortalAclEditor/PortalAclEditor.tsx"],"sourcesContent":["import { useGetPortalACL, useUpdatePortalACL } from '@/synapse-queries'\nimport {\n  getAccessTypeFromPermissionLevel,\n  PermissionLevel,\n} from '@/utils/PermissionLevelToAccessType'\nimport { Alert, Stack } from '@mui/material'\nimport { SynapseClientError } from '@sage-bionetworks/synapse-client/util/SynapseClientError'\nimport {\n  consolidateResourceAccessList,\n  convertResourceAccessSetToSRC,\n  updateACLWithSRCResourceAccessList,\n} from '@/utils/functions/AccessControlListUtils'\nimport { isEqual } from 'lodash-es'\nimport {\n  ForwardedRef,\n  forwardRef,\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useState,\n} from 'react'\nimport { AclEditor } from '../AclEditor/AclEditor'\nimport useUpdateAcl from '../AclEditor/useUpdateAcl'\nimport { AccessControlList } from '@sage-bionetworks/synapse-client'\n\nconst availablePermissionLevels: PermissionLevel[] = ['CAN_ADMINISTER_PORTAL']\n\nexport type PortalAclEditorHandle = {\n  /* Allow the parent component to trigger saving the ACL, so this may be embedded in an arbitrary modal. */\n  save: () => void\n}\n\nexport type PortalAclEditorProps = {\n  portalId: string\n  onSaveComplete: (saveSuccessful: boolean) => void\n}\n\nexport const PortalAclEditor = forwardRef(function PortalAclEditor(\n  props: PortalAclEditorProps,\n  ref: ForwardedRef<PortalAclEditorHandle>,\n) {\n  const { portalId, onSaveComplete } = props\n  const [error, setError] = useState<string | null>(null)\n\n  const onMutationSuccess = () => {\n    setError(null)\n    onSaveComplete(true)\n  }\n\n  const onMutationError = (error: SynapseClientError) => {\n    setError(error.reason)\n    onSaveComplete(false)\n  }\n\n  const { data: originalAcl, isLoading: isLoadingOriginalAcl } =\n    useGetPortalACL(portalId, {\n      // Infinite staleTime ensures this won't get re-fetched unless explicitly invalidated by the mutation\n      staleTime: Infinity,\n    })\n\n  const consolidatedOriginalResourceAccess = useMemo(\n    () =>\n      consolidateResourceAccessList(\n        convertResourceAccessSetToSRC(originalAcl?.resourceAccess),\n      ),\n    [originalAcl],\n  )\n\n  const {\n    resourceAccessList,\n    setResourceAccessList,\n    addResourceAccessItem,\n    updateResourceAccessItem,\n    removeResourceAccessItem,\n    resetDirtyState,\n  } = useUpdateAcl({\n    onChange: () => setError(null),\n    onError: setError,\n  })\n\n  // set resourceAccessList when the fetched acl changes\n  useEffect(() => {\n    if (originalAcl) {\n      resetDirtyState()\n      setResourceAccessList(consolidatedOriginalResourceAccess)\n    }\n  }, [\n    originalAcl,\n    consolidatedOriginalResourceAccess,\n    resetDirtyState,\n    setResourceAccessList,\n  ])\n\n  const { mutate: updateAcl } = useUpdatePortalACL({\n    onSuccess: () => onMutationSuccess(),\n    onError: (error: SynapseClientError) => onMutationError(error),\n  })\n\n  useImperativeHandle(\n    ref,\n    () => {\n      return {\n        save() {\n          const updatedAcl: AccessControlList =\n            updateACLWithSRCResourceAccessList(originalAcl, resourceAccessList)\n          const aclIsUnchanged =\n            (originalAcl === null && updatedAcl == null) ||\n            // ignore properties that will change when the ACL is saved (etag, modifiedOn)\n            (isEqual(consolidatedOriginalResourceAccess, resourceAccessList) &&\n              originalAcl?.id === updatedAcl?.id)\n\n          if (aclIsUnchanged) {\n            // noop\n            onSaveComplete(true)\n          } else {\n            updateAcl(updatedAcl)\n          }\n        },\n      }\n    },\n    [\n      portalId,\n      originalAcl,\n      consolidatedOriginalResourceAccess,\n      resourceAccessList,\n      onSaveComplete,\n      updateAcl,\n    ],\n  )\n\n  return (\n    <Stack\n      direction=\"column\"\n      sx={{\n        gap: '20px',\n      }}\n    >\n      <AclEditor\n        resourceAccessList={resourceAccessList}\n        availablePermissionLevels={availablePermissionLevels}\n        isLoading={isLoadingOriginalAcl}\n        canEdit={true}\n        emptyText={/* This should never happen */ ''}\n        onAddPrincipalToAcl={id =>\n          addResourceAccessItem(\n            id,\n            getAccessTypeFromPermissionLevel('CAN_ADMINISTER_PORTAL'),\n          )\n        }\n        updateResourceAccessItem={updateResourceAccessItem}\n        removeResourceAccessItem={removeResourceAccessItem}\n        showAddRemovePublicButton={false}\n        showNotifyCheckbox={false}\n        isInherited={false}\n      />\n      {error && <Alert severity=\"error\">{error}</Alert>}\n    </Stack>\n  )\n})\n"],"mappings":";;;;;;;;;;;AAyBA,IAAM,IAA+C,CAAC,wBAAwB,EAYjE,IAAkB,EAAW,SACxC,GACA,GACA;CACA,IAAM,EAAE,aAAU,sBAAmB,GAC/B,CAAC,GAAO,KAAY,EAAwB,KAAK,EAEjD,UAA0B;AAE9B,EADA,EAAS,KAAK,EACd,EAAe,GAAK;IAGhB,KAAmB,MAA8B;AAErD,EADA,EAAS,EAAM,OAAO,EACtB,EAAe,GAAM;IAGjB,EAAE,MAAM,GAAa,WAAW,MACpC,EAAgB,GAAU,EAExB,WAAW,UACZ,CAAC,EAEE,IAAqC,QAEvC,EACE,EAA8B,GAAa,eAAe,CAC3D,EACH,CAAC,EAAY,CACd,EAEK,EACJ,uBACA,0BACA,0BACA,6BACA,6BACA,uBACE,EAAa;EACf,gBAAgB,EAAS,KAAK;EAC9B,SAAS;EACV,CAAC;AAGF,SAAgB;AACd,EAAI,MACF,GAAiB,EACjB,EAAsB,EAAmC;IAE1D;EACD;EACA;EACA;EACA;EACD,CAAC;CAEF,IAAM,EAAE,QAAQ,MAAc,EAAmB;EAC/C,iBAAiB,GAAmB;EACpC,UAAU,MAA8B,EAAgB,EAAM;EAC/D,CAAC;AAkCF,QAhCA,EACE,UAES,EACL,OAAO;EACL,IAAM,IACJ,EAAmC,GAAa,EAAmB;AAOrE,EALG,MAAgB,QAAQ,KAAc,QAEtC,EAAQ,GAAoC,EAAmB,IAC9D,GAAa,OAAO,GAAY,KAIlC,EAAe,GAAK,GAEpB,EAAU,EAAW;IAG1B,GAEH;EACE;EACA;EACA;EACA;EACA;EACA;EACD,CACF,EAGC,kBAAC,GAAD;EACE,WAAU;EACV,IAAI,EACF,KAAK,QACN;YAJH,CAME,kBAAC,GAAD;GACsB;GACO;GAC3B,WAAW;GACX,SAAS;GACT,WAA0C;GAC1C,sBAAqB,MACnB,EACE,GACA,EAAiC,wBAAwB,CAC1D;GAEuB;GACA;GAC1B,2BAA2B;GAC3B,oBAAoB;GACpB,aAAa;GACb,CAAA,EACD,KAAS,kBAAC,GAAD;GAAO,UAAS;aAAS;GAAc,CAAA,CAC3C;;EAEV"}

package/dist/components/PortalFeaturedPartners/PortalFeaturedPartners.js.map

@@ -1 +1 @@
-{"version":3,"file":"PortalFeaturedPartners.js","names":[],"sources":["../../../src/components/PortalFeaturedPartners/PortalFeaturedPartners.tsx"],"sourcesContent":["import React from 'react'\nimport useGetQueryResultBundle from '@/synapse-queries/entity/useGetQueryResultBundle'\nimport { SynapseConstants } from '@/utils'\nimport { parseEntityIdFromSqlStatement } from '@/utils/functions'\nimport { getFieldIndex } from '@/utils/functions/queryUtils'\nimport { useImageUrl } from '@/utils/hooks/useImageUrlUtils'\nimport {\n  Box,\n  CardMedia,\n  Link,\n  Skeleton,\n  SxProps,\n  Typography,\n} from '@mui/material'\nimport { QueryBundleRequest, Row } from '@sage-bionetworks/synapse-types'\nimport PortalSectionHeader from '../PortalSectionHeader'\n\nconst partnerIconHeight = 101\nconst partnerIconWidth = 156\n\nexport type PortalFeaturedPartnersProps = {\n  variation?: 'default' | 'centered'\n  sql: string\n  titleText?: string\n  sx?: SxProps\n}\n\ntype PartnerIcons = {\n  partner: Row\n  imageColIndex: number\n  organizationNameColIndex: number\n  websiteColIndex: number\n  entityId: string\n  isLoading?: boolean\n}\n\ntype PartnerWrapperProps = {\n  website?: string | null\n  children: React.ReactNode\n}\n\nconst PartnerWrapper = ({\n  website,\n  children,\n}: PartnerWrapperProps): React.ReactNode => {\n  const commonSx = {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n  }\n\n  return website ? (\n    <Link\n      href={website}\n      target=\"_blank\"\n      sx={{\n        ...commonSx,\n        textDecoration: 'none !important',\n      }}\n    >\n      {children}\n    </Link>\n  ) : (\n    <Box sx={commonSx}>{children}</Box>\n  )\n}\n\nconst PartnerIcon = ({\n  partner,\n  imageColIndex,\n  organizationNameColIndex,\n  websiteColIndex,\n  entityId,\n  isLoading,\n}: PartnerIcons): React.ReactNode => {\n  const fileId = partner.values[imageColIndex] ?? ''\n  const organizationName = partner.values[organizationNameColIndex]\n  const website = partner.values[websiteColIndex]\n  const imageUrl = useImageUrl(fileId, entityId)\n\n  if (!imageUrl && !organizationName) return null\n\n  if (isLoading)\n    return (\n      <Skeleton\n        variant=\"rectangular\"\n        height={partnerIconHeight}\n        width={partnerIconWidth}\n      />\n    )\n\n  const PartnerContent = imageUrl ? (\n    <CardMedia\n      component=\"img\"\n      image={imageUrl}\n      aria-hidden=\"true\"\n      sx={{\n        width: `${partnerIconWidth}px`,\n        height: `${partnerIconHeight}px`,\n        objectFit: 'contain',\n        borderRadius: '10px',\n      }}\n    />\n  ) : (\n    <Box\n      sx={{\n        display: 'flex',\n        width: '165px',\n        padding: '3px',\n        flexDirection: 'column',\n        gap: '10px',\n        border: '2px solid',\n        borderColor: 'grey.900',\n        backgroundColor: '#FFF',\n        textAlign: 'center',\n      }}\n    >\n      <Box\n        sx={{\n          display: 'flex',\n          padding: '10px',\n          justifyContent: 'center',\n          alignItems: 'center',\n          gap: '10px',\n          border: '1px solid',\n          borderColor: 'grey.900',\n        }}\n      >\n        <Typography\n          variant=\"headline3\"\n          sx={{\n            fontSize: '14px',\n            fontWeight: 400,\n            lineHeight: '130%',\n            color: 'grey.900',\n          }}\n        >\n          {organizationName}\n        </Typography>\n      </Box>\n    </Box>\n  )\n\n  return <PartnerWrapper website={website}>{PartnerContent}</PartnerWrapper>\n}\n\nconst PortalFeaturedPartners = ({\n  sql,\n  titleText = 'Our Partners',\n  variation = 'default',\n  sx,\n}: PortalFeaturedPartnersProps): React.ReactNode => {\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    },\n  }\n  const { data: queryResultBundle, isLoading } =\n    useGetQueryResultBundle(queryBundleRequest)\n\n  const dataRows = queryResultBundle?.queryResult!.queryResults.rows ?? []\n\n  enum ExpectedColumns {\n    CARDLOGO = 'cardLogo',\n    ORGANIZATION_NAME = 'organizationName',\n    WEBSITE = 'website',\n  }\n\n  const imageColIndex = getFieldIndex(\n    ExpectedColumns.CARDLOGO,\n    queryResultBundle,\n  )\n\n  const organizationNameColIndex = getFieldIndex(\n    ExpectedColumns.ORGANIZATION_NAME,\n    queryResultBundle,\n  )\n\n  const websiteColIndex = getFieldIndex(\n    ExpectedColumns.WEBSITE,\n    queryResultBundle,\n  )\n\n  return (\n    <Box\n      sx={{\n        display: 'grid',\n        padding: { xs: '40px', lg: '20px 80px' },\n        gridTemplateColumns:\n          variation === 'centered'\n            ? { xs: '1fr' }\n            : { xs: '1fr', md: '1fr 3fr' },\n        gap: '50px',\n        textAlign: variation === 'centered' ? 'center' : 'left',\n        ...sx,\n      }}\n    >\n      {variation === 'default' ? (\n        <PortalSectionHeader\n          title={titleText}\n          sx={{ h2: { fontSize: '24px', paddingTop: '26px', width: '100%' } }}\n        />\n      ) : (\n        <Typography\n          variant=\"headline1\"\n          sx={{ fontSize: '48px', color: 'grey.900' }}\n        >\n          {titleText}\n        </Typography>\n      )}\n      <Box\n        sx={theme => ({\n          display: 'flex',\n          flexWrap: 'wrap',\n          gap: '64px',\n          flex: '1 1 0',\n          justifyContent: variation === 'centered' ? 'center' : 'flex-start',\n          [theme.breakpoints.down('sm')]: {\n            justifyContent: 'center',\n          },\n        })}\n      >\n        {dataRows?.map((partner, index) => (\n          <PartnerIcon\n            key={`partner-${index}`}\n            partner={partner}\n            imageColIndex={imageColIndex}\n            organizationNameColIndex={organizationNameColIndex}\n            websiteColIndex={websiteColIndex}\n            entityId={entityId}\n            isLoading={isLoading}\n          />\n        ))}\n      </Box>\n    </Box>\n  )\n}\n\nexport default PortalFeaturedPartners\n"],"mappings":"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"}
+{"version":3,"file":"PortalFeaturedPartners.js","names":[],"sources":["../../../src/components/PortalFeaturedPartners/PortalFeaturedPartners.tsx"],"sourcesContent":["import React from 'react'\nimport useGetQueryResultBundle from '@/synapse-queries/entity/useGetQueryResultBundle'\nimport { SynapseConstants } from '@/utils'\nimport { parseEntityIdFromSqlStatement } from '@/utils/functions'\nimport { getFieldIndex } from '@/utils/functions/queryUtils'\nimport { useImageUrl } from '@/utils/hooks/useImageUrlUtils'\nimport {\n  Box,\n  CardMedia,\n  Link,\n  Skeleton,\n  SxProps,\n  Typography,\n} from '@mui/material'\nimport { QueryBundleRequest, Row } from '@sage-bionetworks/synapse-types'\nimport PortalSectionHeader from '../PortalSectionHeader'\n\nconst partnerIconHeight = 101\nconst partnerIconWidth = 156\n\nexport type PortalFeaturedPartnersProps = {\n  variation?: 'default' | 'centered'\n  sql: string\n  titleText?: string\n  sx?: SxProps\n}\n\ntype PartnerIcons = {\n  partner: Row\n  imageColIndex: number\n  organizationNameColIndex: number\n  websiteColIndex: number\n  entityId: string\n  isLoading?: boolean\n}\n\ntype PartnerWrapperProps = {\n  website?: string | null\n  children: React.ReactNode\n}\n\nconst PartnerWrapper = ({\n  website,\n  children,\n}: PartnerWrapperProps): React.ReactNode => {\n  const commonSx = {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n  }\n\n  return website ? (\n    <Link\n      href={website}\n      target=\"_blank\"\n      sx={{\n        ...commonSx,\n        textDecoration: 'none !important',\n      }}\n    >\n      {children}\n    </Link>\n  ) : (\n    <Box sx={commonSx}>{children}</Box>\n  )\n}\n\nconst PartnerIcon = ({\n  partner,\n  imageColIndex,\n  organizationNameColIndex,\n  websiteColIndex,\n  entityId,\n  isLoading,\n}: PartnerIcons): React.ReactNode => {\n  const fileId = partner.values[imageColIndex] ?? ''\n  const organizationName = partner.values[organizationNameColIndex]\n  const website = partner.values[websiteColIndex]\n  const imageUrl = useImageUrl(fileId, entityId)\n\n  if (!imageUrl && !organizationName) return null\n\n  if (isLoading)\n    return (\n      <Skeleton\n        variant=\"rectangular\"\n        height={partnerIconHeight}\n        width={partnerIconWidth}\n      />\n    )\n\n  const PartnerContent = imageUrl ? (\n    <CardMedia\n      component=\"img\"\n      image={imageUrl}\n      aria-hidden=\"true\"\n      sx={{\n        width: `${partnerIconWidth}px`,\n        height: `${partnerIconHeight}px`,\n        objectFit: 'contain',\n        borderRadius: '10px',\n      }}\n    />\n  ) : (\n    <Box\n      sx={{\n        display: 'flex',\n        width: '165px',\n        padding: '3px',\n        flexDirection: 'column',\n        gap: '10px',\n        border: '2px solid',\n        borderColor: 'grey.900',\n        backgroundColor: '#FFF',\n        textAlign: 'center',\n      }}\n    >\n      <Box\n        sx={{\n          display: 'flex',\n          padding: '10px',\n          justifyContent: 'center',\n          alignItems: 'center',\n          gap: '10px',\n          border: '1px solid',\n          borderColor: 'grey.900',\n        }}\n      >\n        <Typography\n          variant=\"headline3\"\n          sx={{\n            fontSize: '14px',\n            fontWeight: 400,\n            lineHeight: '130%',\n            color: 'grey.900',\n          }}\n        >\n          {organizationName}\n        </Typography>\n      </Box>\n    </Box>\n  )\n\n  return <PartnerWrapper website={website}>{PartnerContent}</PartnerWrapper>\n}\n\nconst PortalFeaturedPartners = ({\n  sql,\n  titleText = 'Our Partners',\n  variation = 'default',\n  sx,\n}: PortalFeaturedPartnersProps): React.ReactNode => {\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    },\n  }\n  const { data: queryResultBundle, isLoading } =\n    useGetQueryResultBundle(queryBundleRequest)\n\n  const dataRows = queryResultBundle?.queryResult!.queryResults.rows ?? []\n\n  enum ExpectedColumns {\n    CARDLOGO = 'cardLogo',\n    ORGANIZATION_NAME = 'organizationName',\n    WEBSITE = 'website',\n  }\n\n  const imageColIndex = getFieldIndex(\n    ExpectedColumns.CARDLOGO,\n    queryResultBundle,\n  )\n\n  const organizationNameColIndex = getFieldIndex(\n    ExpectedColumns.ORGANIZATION_NAME,\n    queryResultBundle,\n  )\n\n  const websiteColIndex = getFieldIndex(\n    ExpectedColumns.WEBSITE,\n    queryResultBundle,\n  )\n\n  return (\n    <Box\n      sx={{\n        display: 'grid',\n        padding: { xs: '40px', lg: '20px 80px' },\n        gridTemplateColumns:\n          variation === 'centered'\n            ? { xs: '1fr' }\n            : { xs: '1fr', md: '1fr 3fr' },\n        gap: '50px',\n        textAlign: variation === 'centered' ? 'center' : 'left',\n        ...sx,\n      }}\n    >\n      {variation === 'default' ? (\n        <PortalSectionHeader\n          title={titleText}\n          sx={{ h2: { fontSize: '24px', paddingTop: '26px', width: '100%' } }}\n        />\n      ) : (\n        <Typography\n          variant=\"headline1\"\n          sx={{ fontSize: '48px', color: 'grey.900' }}\n        >\n          {titleText}\n        </Typography>\n      )}\n      <Box\n        sx={theme => ({\n          display: 'flex',\n          flexWrap: 'wrap',\n          gap: '64px',\n          flex: '1 1 0',\n          justifyContent: variation === 'centered' ? 'center' : 'flex-start',\n          [theme.breakpoints.down('sm')]: {\n            justifyContent: 'center',\n          },\n        })}\n      >\n        {dataRows?.map((partner, index) => (\n          <PartnerIcon\n            key={`partner-${index}`}\n            partner={partner}\n            imageColIndex={imageColIndex}\n            organizationNameColIndex={organizationNameColIndex}\n            websiteColIndex={websiteColIndex}\n            entityId={entityId}\n            isLoading={isLoading}\n          />\n        ))}\n      </Box>\n    </Box>\n  )\n}\n\nexport default PortalFeaturedPartners\n"],"mappings":"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"}

package/dist/components/PortalList/CreatePortalModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"CreatePortalModal.js","names":[],"sources":["../../../src/components/PortalList/CreatePortalModal.tsx"],"sourcesContent":["import { useCreatePortal } from '@/synapse-queries/portal/usePortal'\nimport { Alert } from '@mui/material'\nimport { Portal } from '@sage-bionetworks/synapse-client'\nimport { SynapseClientError } from '@sage-bionetworks/synapse-client/util/SynapseClientError'\nimport { KeyboardEvent, useState } from 'react'\nimport { ConfirmationDialog } from '../ConfirmationDialog/ConfirmationDialog'\nimport { displayToast } from '../ToastMessage'\nimport TextField from '../TextField/TextField'\n\nexport type CreatePortalModalProps = {\n  open: boolean\n  onClose: () => void\n  onSuccess?: (portal: Portal) => void\n}\n\nexport function CreatePortalModal({\n  open,\n  onClose,\n  onSuccess,\n}: CreatePortalModalProps): React.ReactNode {\n  const [portalName, setPortalName] = useState<string>('')\n  const [portalUrl, setPortalUrl] = useState<string>('')\n  const [errorMessage, setErrorMessage] = useState<string>()\n\n  const { mutate: createPortal, isPending } = useCreatePortal({\n    onSuccess: portal => {\n      displayToast('Portal created successfully', 'success')\n      handleClose()\n      onSuccess?.(portal)\n    },\n    onError: (error: SynapseClientError) => {\n      setErrorMessage(error.reason || error.message)\n    },\n  })\n\n  const handleClose = () => {\n    setPortalName('')\n    setPortalUrl('')\n    setErrorMessage(undefined)\n    onClose()\n  }\n\n  const handleCreate = () => {\n    if (!portalName.trim()) {\n      setErrorMessage('Portal name is required')\n      return\n    }\n    if (!portalUrl.trim()) {\n      setErrorMessage('Portal URL is required')\n      return\n    }\n\n    const newPortal: Portal = {\n      name: portalName.trim(),\n      url: portalUrl.trim(),\n    }\n\n    createPortal(newPortal)\n  }\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\n    if (event.key === 'Enter' && portalName.trim() && portalUrl.trim()) {\n      handleCreate()\n    }\n  }\n\n  const dialogContent = (\n    <>\n      <TextField\n        id=\"portalNameInput\"\n        label=\"Portal Name\"\n        value={portalName}\n        fullWidth\n        required\n        onChange={event => {\n          setPortalName(event.target.value)\n          setErrorMessage(undefined)\n        }}\n        inputProps={{\n          onKeyDown: handleKeyDown,\n        }}\n        sx={{ mb: 2 }}\n      />\n      <TextField\n        id=\"portalUrlInput\"\n        label=\"Portal URL\"\n        value={portalUrl}\n        fullWidth\n        required\n        placeholder=\"https://example.synapse.org\"\n        onChange={event => {\n          setPortalUrl(event.target.value)\n          setErrorMessage(undefined)\n        }}\n        inputProps={{\n          onKeyDown: handleKeyDown,\n        }}\n      />\n      {errorMessage && (\n        <Alert severity=\"error\" sx={{ mt: 2 }}>\n          {errorMessage}\n        </Alert>\n      )}\n    </>\n  )\n\n  return (\n    <ConfirmationDialog\n      open={open}\n      title=\"Create a New Portal\"\n      content={dialogContent}\n      confirmButtonProps={{\n        children: 'Create',\n        disabled: isPending || !portalName.trim() || !portalUrl.trim(),\n      }}\n      onConfirm={handleCreate}\n      onCancel={handleClose}\n      maxWidth=\"sm\"\n    />\n  )\n}\n\nexport default CreatePortalModal\n"],"mappings":";;;;;;;;;AAeA,SAAgB,EAAkB,EAChC,SACA,YACA,gBAC0C;CAC1C,IAAM,CAAC,GAAY,KAAiB,EAAiB,GAAG,EAClD,CAAC,GAAW,KAAgB,EAAiB,GAAG,EAChD,CAAC,GAAc,KAAmB,GAAkB,EAEpD,EAAE,QAAQ,GAAc,iBAAc,EAAgB;EAC1D,YAAW,MAAU;AAGnB,GAFA,EAAa,+BAA+B,UAAU,EACtD,GAAa,EACb,IAAY,EAAO;;EAErB,UAAU,MAA8B;AACtC,KAAgB,EAAM,UAAU,EAAM,QAAQ;;EAEjD,CAAC,EAEI,UAAoB;AAIxB,EAHA,EAAc,GAAG,EACjB,EAAa,GAAG,EAChB,EAAgB,KAAA,EAAU,EAC1B,GAAS;IAGL,UAAqB;AACzB,MAAI,CAAC,EAAW,MAAM,EAAE;AACtB,KAAgB,0BAA0B;AAC1C;;AAEF,MAAI,CAAC,EAAU,MAAM,EAAE;AACrB,KAAgB,yBAAyB;AACzC;;AAQF,IAL0B;GACxB,MAAM,EAAW,MAAM;GACvB,KAAK,EAAU,MAAM;GACtB,CAEsB;IAGnB,KAAiB,MAA2C;AAChE,EAAI,EAAM,QAAQ,WAAW,EAAW,MAAM,IAAI,EAAU,MAAM,IAChE,GAAc;;AA4ClB,QACE,kBAAC,GAAD;EACQ;EACN,OAAM;EACN,SA3CF,kBAAA,GAAA,EAAA,UAAA;GACE,kBAAC,GAAD;IACE,IAAG;IACH,OAAM;IACN,OAAO;IACP,WAAA;IACA,UAAA;IACA,WAAU,MAAS;AAEjB,KADA,EAAc,EAAM,OAAO,MAAM,EACjC,EAAgB,KAAA,EAAU;;IAE5B,YAAY,EACV,WAAW,GACZ;IACD,IAAI,EAAE,IAAI,GAAG;IACb,CAAA;GACF,kBAAC,GAAD;IACE,IAAG;IACH,OAAM;IACN,OAAO;IACP,WAAA;IACA,UAAA;IACA,aAAY;IACZ,WAAU,MAAS;AAEjB,KADA,EAAa,EAAM,OAAO,MAAM,EAChC,EAAgB,KAAA,EAAU;;IAE5B,YAAY,EACV,WAAW,GACZ;IACD,CAAA;GACD,KACC,kBAAC,GAAD;IAAO,UAAS;IAAQ,IAAI,EAAE,IAAI,GAAG;cAClC;IACK,CAAA;GAET,EAAA,CAAA;EAQD,oBAAoB;GAClB,UAAU;GACV,UAAU,KAAa,CAAC,EAAW,MAAM,IAAI,CAAC,EAAU,MAAM;GAC/D;EACD,WAAW;EACX,UAAU;EACV,UAAS;EACT,CAAA"}
+{"version":3,"file":"CreatePortalModal.js","names":[],"sources":["../../../src/components/PortalList/CreatePortalModal.tsx"],"sourcesContent":["import { useCreatePortal } from '@/synapse-queries/portal/usePortal'\nimport { Alert } from '@mui/material'\nimport { Portal } from '@sage-bionetworks/synapse-client'\nimport { SynapseClientError } from '@sage-bionetworks/synapse-client/util/SynapseClientError'\nimport { KeyboardEvent, useState } from 'react'\nimport { ConfirmationDialog } from '../ConfirmationDialog/ConfirmationDialog'\nimport { displayToast } from '../ToastMessage'\nimport TextField from '../TextField/TextField'\n\nexport type CreatePortalModalProps = {\n  open: boolean\n  onClose: () => void\n  onSuccess?: (portal: Portal) => void\n}\n\nexport function CreatePortalModal({\n  open,\n  onClose,\n  onSuccess,\n}: CreatePortalModalProps): React.ReactNode {\n  const [portalName, setPortalName] = useState<string>('')\n  const [portalUrl, setPortalUrl] = useState<string>('')\n  const [errorMessage, setErrorMessage] = useState<string>()\n\n  const { mutate: createPortal, isPending } = useCreatePortal({\n    onSuccess: portal => {\n      displayToast('Portal created successfully', 'success')\n      handleClose()\n      onSuccess?.(portal)\n    },\n    onError: (error: SynapseClientError) => {\n      setErrorMessage(error.reason || error.message)\n    },\n  })\n\n  const handleClose = () => {\n    setPortalName('')\n    setPortalUrl('')\n    setErrorMessage(undefined)\n    onClose()\n  }\n\n  const handleCreate = () => {\n    if (!portalName.trim()) {\n      setErrorMessage('Portal name is required')\n      return\n    }\n    if (!portalUrl.trim()) {\n      setErrorMessage('Portal URL is required')\n      return\n    }\n\n    const newPortal: Portal = {\n      name: portalName.trim(),\n      url: portalUrl.trim(),\n    }\n\n    createPortal(newPortal)\n  }\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\n    if (event.key === 'Enter' && portalName.trim() && portalUrl.trim()) {\n      handleCreate()\n    }\n  }\n\n  const dialogContent = (\n    <>\n      <TextField\n        id=\"portalNameInput\"\n        label=\"Portal Name\"\n        value={portalName}\n        fullWidth\n        required\n        onChange={event => {\n          setPortalName(event.target.value)\n          setErrorMessage(undefined)\n        }}\n        inputProps={{\n          onKeyDown: handleKeyDown,\n        }}\n        sx={{ mb: 2 }}\n      />\n      <TextField\n        id=\"portalUrlInput\"\n        label=\"Portal URL\"\n        value={portalUrl}\n        fullWidth\n        required\n        placeholder=\"https://example.synapse.org\"\n        onChange={event => {\n          setPortalUrl(event.target.value)\n          setErrorMessage(undefined)\n        }}\n        inputProps={{\n          onKeyDown: handleKeyDown,\n        }}\n      />\n      {errorMessage && (\n        <Alert severity=\"error\" sx={{ mt: 2 }}>\n          {errorMessage}\n        </Alert>\n      )}\n    </>\n  )\n\n  return (\n    <ConfirmationDialog\n      open={open}\n      title=\"Create a New Portal\"\n      content={dialogContent}\n      confirmButtonProps={{\n        children: 'Create',\n        disabled: isPending || !portalName.trim() || !portalUrl.trim(),\n      }}\n      onConfirm={handleCreate}\n      onCancel={handleClose}\n      maxWidth=\"sm\"\n    />\n  )\n}\n\nexport default CreatePortalModal\n"],"mappings":";;;;;;;;;AAeA,SAAgB,EAAkB,EAChC,SACA,YACA,gBAC0C;CAC1C,IAAM,CAAC,GAAY,KAAiB,EAAiB,GAAG,EAClD,CAAC,GAAW,KAAgB,EAAiB,GAAG,EAChD,CAAC,GAAc,KAAmB,GAAkB,EAEpD,EAAE,QAAQ,GAAc,iBAAc,EAAgB;EAC1D,YAAW,MAAU;AAGnB,GAFA,EAAa,+BAA+B,UAAU,EACtD,GAAa,EACb,IAAY,EAAO;;EAErB,UAAU,MAA8B;AACtC,KAAgB,EAAM,UAAU,EAAM,QAAQ;;EAEjD,CAAC,EAEI,UAAoB;AAIxB,EAHA,EAAc,GAAG,EACjB,EAAa,GAAG,EAChB,EAAgB,KAAA,EAAU,EAC1B,GAAS;IAGL,UAAqB;AACzB,MAAI,CAAC,EAAW,MAAM,EAAE;AACtB,KAAgB,0BAA0B;AAC1C;;AAEF,MAAI,CAAC,EAAU,MAAM,EAAE;AACrB,KAAgB,yBAAyB;AACzC;;AAQF,IAAa;GAJX,MAAM,EAAW,MAAM;GACvB,KAAK,EAAU,MAAM;GAGV,CAAU;IAGnB,KAAiB,MAA2C;AAChE,EAAI,EAAM,QAAQ,WAAW,EAAW,MAAM,IAAI,EAAU,MAAM,IAChE,GAAc;;AA4ClB,QACE,kBAAC,GAAD;EACQ;EACN,OAAM;EACN,SA3CF,kBAAA,GAAA,EAAA,UAAA;GACE,kBAAC,GAAD;IACE,IAAG;IACH,OAAM;IACN,OAAO;IACP,WAAA;IACA,UAAA;IACA,WAAU,MAAS;AAEjB,KADA,EAAc,EAAM,OAAO,MAAM,EACjC,EAAgB,KAAA,EAAU;;IAE5B,YAAY,EACV,WAAW,GACZ;IACD,IAAI,EAAE,IAAI,GAAG;IACb,CAAA;GACF,kBAAC,GAAD;IACE,IAAG;IACH,OAAM;IACN,OAAO;IACP,WAAA;IACA,UAAA;IACA,aAAY;IACZ,WAAU,MAAS;AAEjB,KADA,EAAa,EAAM,OAAO,MAAM,EAChC,EAAgB,KAAA,EAAU;;IAE5B,YAAY,EACV,WAAW,GACZ;IACD,CAAA;GACD,KACC,kBAAC,GAAD;IAAO,UAAS;IAAQ,IAAI,EAAE,IAAI,GAAG;cAClC;IACK,CAAA;GAET,EAAA,CAOQ;EACT,oBAAoB;GAClB,UAAU;GACV,UAAU,KAAa,CAAC,EAAW,MAAM,IAAI,CAAC,EAAU,MAAM;GAC/D;EACD,WAAW;EACX,UAAU;EACV,UAAS;EACT,CAAA"}

package/dist/components/ProgrammaticInstructionsModal/ProgrammaticInstructionsModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProgrammaticInstructionsModal.js","names":[],"sources":["../../../src/components/ProgrammaticInstructionsModal/ProgrammaticInstructionsModal.tsx"],"sourcesContent":["import React from 'react'\nimport { Box, Link, Tab, Tabs, Typography } from '@mui/material'\nimport { ReactElement, SyntheticEvent, useState } from 'react'\nimport { ConfirmationDialog } from '../ConfirmationDialog/ConfirmationDialog'\n\nexport enum ProgrammaticOptionsTabs {\n  COMMAND_LINE = 'Command Line',\n  R = 'R',\n  PYTHON = 'Python',\n}\n\nexport type ProgrammaticInstructionsModalProps = {\n  show: boolean\n  title: string\n  onClose: () => void\n  pythonNotes?: ReactElement\n  pythonCode?: string\n  rNotes?: ReactElement\n  rCode?: string\n  cliNotes?: ReactElement\n  cliCode?: string\n  helpMarkdown?: string\n  helpUrl?: string\n}\n\n/**\n * Modal used to show programmatic instructions\n * @param props\n * @returns\n */\n\nexport const ProgrammaticInstructionsModal = ({\n  show,\n  title,\n  onClose,\n  pythonNotes,\n  pythonCode,\n  rNotes,\n  rCode,\n  cliNotes,\n  cliCode,\n  helpMarkdown,\n  helpUrl,\n}: ProgrammaticInstructionsModalProps): React.ReactNode => {\n  let defaultTab\n  if (cliCode) {\n    defaultTab = ProgrammaticOptionsTabs.COMMAND_LINE\n  } else if (pythonCode) {\n    defaultTab = ProgrammaticOptionsTabs.PYTHON\n  } else {\n    defaultTab = ProgrammaticOptionsTabs.R\n  }\n  const [currentTab, setCurrentTab] =\n    useState<ProgrammaticOptionsTabs>(defaultTab)\n\n  const installationInstructions = (\n    <Typography variant=\"body1\">\n      Installation instructions are available at our{' '}\n      <Link\n        href={\n          'https://help.synapse.org/docs/Installing-Synapse-API-Clients.1985249668.html'\n        }\n        target=\"_blank\"\n        rel=\"noopener noreferrer\"\n      >\n        Synapse API Documentation Site\n      </Link>\n      .\n    </Typography>\n  )\n\n  const dialogContent = (\n    <>\n      <Box\n        sx={{\n          borderBottom: 1,\n          borderColor: 'divider',\n          marginBottom: 4,\n        }}\n      >\n        <Tabs\n          value={currentTab}\n          onChange={(\n            event: SyntheticEvent,\n            newValue: ProgrammaticOptionsTabs,\n          ) => {\n            event.stopPropagation()\n            setCurrentTab(newValue)\n          }}\n          textColor=\"secondary\"\n          indicatorColor=\"secondary\"\n        >\n          {cliCode && (\n            <Tab\n              value={ProgrammaticOptionsTabs.COMMAND_LINE}\n              label={ProgrammaticOptionsTabs.COMMAND_LINE}\n            />\n          )}\n          {rCode && (\n            <Tab\n              value={ProgrammaticOptionsTabs.R}\n              label={ProgrammaticOptionsTabs.R}\n            />\n          )}\n          {pythonCode && (\n            <Tab\n              value={ProgrammaticOptionsTabs.PYTHON}\n              label={ProgrammaticOptionsTabs.PYTHON}\n            />\n          )}\n        </Tabs>\n      </Box>\n      <Box sx={{ '& > p': { marginBottom: 3 } }}>\n        {currentTab === ProgrammaticOptionsTabs.COMMAND_LINE && (\n          <>\n            <Typography variant=\"body1\">{cliNotes}</Typography>\n            {installationInstructions}\n            <pre>{cliCode}</pre>\n          </>\n        )}\n        {currentTab === ProgrammaticOptionsTabs.R && (\n          <>\n            <Typography variant=\"body1\">{rNotes}</Typography>\n            {installationInstructions}\n            <pre>{rCode}</pre>\n          </>\n        )}\n        {currentTab === ProgrammaticOptionsTabs.PYTHON && (\n          <>\n            <Typography variant=\"body1\">{pythonNotes}</Typography>\n            {installationInstructions}\n            <pre>{pythonCode}</pre>\n          </>\n        )}\n      </Box>\n    </>\n  )\n\n  const titleHelpPopoverProps = helpMarkdown\n    ? {\n        markdownText: helpMarkdown,\n        helpUrl: helpUrl,\n      }\n    : undefined\n\n  return (\n    <ConfirmationDialog\n      open={show}\n      title={title}\n      onCancel={onClose}\n      onConfirm={onClose}\n      maxWidth=\"md\"\n      titleHelpPopoverProps={titleHelpPopoverProps}\n      content={dialogContent}\n      hasCancelButton={false}\n    />\n  )\n}\n\nexport default ProgrammaticInstructionsModal\n"],"mappings":";;;;;AAKA,IAAY,IAAL,yBAAA,GAAA;QACL,EAAA,eAAA,gBACA,EAAA,IAAA,KACA,EAAA,SAAA;KACD,EAsBY,KAAiC,EAC5C,SACA,UACA,YACA,gBACA,eACA,WACA,UACA,aACA,YACA,iBACA,iBACyD;CACzD,IAAI;AACJ,CAKE,IALE,IACW,EAAwB,eAC5B,IACI,EAAwB,SAExB,EAAwB;CAEvC,IAAM,CAAC,GAAY,KACjB,EAAkC,EAAW,EAEzC,IACJ,kBAAC,GAAD;EAAY,SAAQ;YAApB;GAA4B;GACqB;GAC/C,kBAAC,GAAD;IACE,MACE;IAEF,QAAO;IACP,KAAI;cACL;IAEM,CAAA;;GAEI;KAGT,IACJ,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;EACE,IAAI;GACF,cAAc;GACd,aAAa;GACb,cAAc;GACf;YAED,kBAAC,GAAD;GACE,OAAO;GACP,WACE,GACA,MACG;AAEH,IADA,EAAM,iBAAiB,EACvB,EAAc,EAAS;;GAEzB,WAAU;GACV,gBAAe;aAVjB;IAYG,KACC,kBAAC,GAAD;KACE,OAAO,EAAwB;KAC/B,OAAO,EAAwB;KAC/B,CAAA;IAEH,KACC,kBAAC,GAAD;KACE,OAAO,EAAwB;KAC/B,OAAO,EAAwB;KAC/B,CAAA;IAEH,KACC,kBAAC,GAAD;KACE,OAAO,EAAwB;KAC/B,OAAO,EAAwB;KAC/B,CAAA;IAEC;;EACH,CAAA,EACN,kBAAC,GAAD;EAAK,IAAI,EAAE,SAAS,EAAE,cAAc,GAAG,EAAE;YAAzC;GACG,MAAe,EAAwB,gBACtC,kBAAA,GAAA,EAAA,UAAA;IACE,kBAAC,GAAD;KAAY,SAAQ;eAAS;KAAsB,CAAA;IAClD;IACD,kBAAC,OAAD,EAAA,UAAM,GAAc,CAAA;IACnB,EAAA,CAAA;GAEJ,MAAe,EAAwB,KACtC,kBAAA,GAAA,EAAA,UAAA;IACE,kBAAC,GAAD;KAAY,SAAQ;eAAS;KAAoB,CAAA;IAChD;IACD,kBAAC,OAAD,EAAA,UAAM,GAAY,CAAA;IACjB,EAAA,CAAA;GAEJ,MAAe,EAAwB,UACtC,kBAAA,GAAA,EAAA,UAAA;IACE,kBAAC,GAAD;KAAY,SAAQ;eAAS;KAAyB,CAAA;IACrD;IACD,kBAAC,OAAD,EAAA,UAAM,GAAiB,CAAA;IACtB,EAAA,CAAA;GAED;IACL,EAAA,CAAA;AAUL,QACE,kBAAC,GAAD;EACE,MAAM;EACC;EACP,UAAU;EACV,WAAW;EACX,UAAS;EACc,uBAdG,IAC1B;GACE,cAAc;GACL;GACV,GACD,KAAA;EAUA,SAAS;EACT,iBAAiB;EACjB,CAAA"}
+{"version":3,"file":"ProgrammaticInstructionsModal.js","names":[],"sources":["../../../src/components/ProgrammaticInstructionsModal/ProgrammaticInstructionsModal.tsx"],"sourcesContent":["import React from 'react'\nimport { Box, Link, Tab, Tabs, Typography } from '@mui/material'\nimport { ReactElement, SyntheticEvent, useState } from 'react'\nimport { ConfirmationDialog } from '../ConfirmationDialog/ConfirmationDialog'\n\nexport enum ProgrammaticOptionsTabs {\n  COMMAND_LINE = 'Command Line',\n  R = 'R',\n  PYTHON = 'Python',\n}\n\nexport type ProgrammaticInstructionsModalProps = {\n  show: boolean\n  title: string\n  onClose: () => void\n  pythonNotes?: ReactElement\n  pythonCode?: string\n  rNotes?: ReactElement\n  rCode?: string\n  cliNotes?: ReactElement\n  cliCode?: string\n  helpMarkdown?: string\n  helpUrl?: string\n}\n\n/**\n * Modal used to show programmatic instructions\n * @param props\n * @returns\n */\n\nexport const ProgrammaticInstructionsModal = ({\n  show,\n  title,\n  onClose,\n  pythonNotes,\n  pythonCode,\n  rNotes,\n  rCode,\n  cliNotes,\n  cliCode,\n  helpMarkdown,\n  helpUrl,\n}: ProgrammaticInstructionsModalProps): React.ReactNode => {\n  let defaultTab\n  if (cliCode) {\n    defaultTab = ProgrammaticOptionsTabs.COMMAND_LINE\n  } else if (pythonCode) {\n    defaultTab = ProgrammaticOptionsTabs.PYTHON\n  } else {\n    defaultTab = ProgrammaticOptionsTabs.R\n  }\n  const [currentTab, setCurrentTab] =\n    useState<ProgrammaticOptionsTabs>(defaultTab)\n\n  const installationInstructions = (\n    <Typography variant=\"body1\">\n      Installation instructions are available at our{' '}\n      <Link\n        href={\n          'https://help.synapse.org/docs/Installing-Synapse-API-Clients.1985249668.html'\n        }\n        target=\"_blank\"\n        rel=\"noopener noreferrer\"\n      >\n        Synapse API Documentation Site\n      </Link>\n      .\n    </Typography>\n  )\n\n  const dialogContent = (\n    <>\n      <Box\n        sx={{\n          borderBottom: 1,\n          borderColor: 'divider',\n          marginBottom: 4,\n        }}\n      >\n        <Tabs\n          value={currentTab}\n          onChange={(\n            event: SyntheticEvent,\n            newValue: ProgrammaticOptionsTabs,\n          ) => {\n            event.stopPropagation()\n            setCurrentTab(newValue)\n          }}\n          textColor=\"secondary\"\n          indicatorColor=\"secondary\"\n        >\n          {cliCode && (\n            <Tab\n              value={ProgrammaticOptionsTabs.COMMAND_LINE}\n              label={ProgrammaticOptionsTabs.COMMAND_LINE}\n            />\n          )}\n          {rCode && (\n            <Tab\n              value={ProgrammaticOptionsTabs.R}\n              label={ProgrammaticOptionsTabs.R}\n            />\n          )}\n          {pythonCode && (\n            <Tab\n              value={ProgrammaticOptionsTabs.PYTHON}\n              label={ProgrammaticOptionsTabs.PYTHON}\n            />\n          )}\n        </Tabs>\n      </Box>\n      <Box sx={{ '& > p': { marginBottom: 3 } }}>\n        {currentTab === ProgrammaticOptionsTabs.COMMAND_LINE && (\n          <>\n            <Typography variant=\"body1\">{cliNotes}</Typography>\n            {installationInstructions}\n            <pre>{cliCode}</pre>\n          </>\n        )}\n        {currentTab === ProgrammaticOptionsTabs.R && (\n          <>\n            <Typography variant=\"body1\">{rNotes}</Typography>\n            {installationInstructions}\n            <pre>{rCode}</pre>\n          </>\n        )}\n        {currentTab === ProgrammaticOptionsTabs.PYTHON && (\n          <>\n            <Typography variant=\"body1\">{pythonNotes}</Typography>\n            {installationInstructions}\n            <pre>{pythonCode}</pre>\n          </>\n        )}\n      </Box>\n    </>\n  )\n\n  const titleHelpPopoverProps = helpMarkdown\n    ? {\n        markdownText: helpMarkdown,\n        helpUrl: helpUrl,\n      }\n    : undefined\n\n  return (\n    <ConfirmationDialog\n      open={show}\n      title={title}\n      onCancel={onClose}\n      onConfirm={onClose}\n      maxWidth=\"md\"\n      titleHelpPopoverProps={titleHelpPopoverProps}\n      content={dialogContent}\n      hasCancelButton={false}\n    />\n  )\n}\n\nexport default ProgrammaticInstructionsModal\n"],"mappings":";;;;;AAKA,IAAY,IAAL,yBAAA,GAAA;QACL,EAAA,eAAe,gBACf,EAAA,IAAI,KACJ,EAAA,SAAS;KACV,EAsBY,KAAiC,EAC5C,SACA,UACA,YACA,gBACA,eACA,WACA,UACA,aACA,YACA,iBACA,iBACyD;CACzD,IAAI;AACJ,CAKE,IALE,IACW,EAAwB,eAC5B,IACI,EAAwB,SAExB,EAAwB;CAEvC,IAAM,CAAC,GAAY,KACjB,EAAkC,EAAW,EAEzC,IACJ,kBAAC,GAAD;EAAY,SAAQ;YAApB;GAA4B;GACqB;GAC/C,kBAAC,GAAD;IACE,MACE;IAEF,QAAO;IACP,KAAI;cACL;IAEM,CAAA;;GAEI;KAGT,IACJ,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;EACE,IAAI;GACF,cAAc;GACd,aAAa;GACb,cAAc;GACf;YAED,kBAAC,GAAD;GACE,OAAO;GACP,WACE,GACA,MACG;AAEH,IADA,EAAM,iBAAiB,EACvB,EAAc,EAAS;;GAEzB,WAAU;GACV,gBAAe;aAVjB;IAYG,KACC,kBAAC,GAAD;KACE,OAAO,EAAwB;KAC/B,OAAO,EAAwB;KAC/B,CAAA;IAEH,KACC,kBAAC,GAAD;KACE,OAAO,EAAwB;KAC/B,OAAO,EAAwB;KAC/B,CAAA;IAEH,KACC,kBAAC,GAAD;KACE,OAAO,EAAwB;KAC/B,OAAO,EAAwB;KAC/B,CAAA;IAEC;;EACH,CAAA,EACN,kBAAC,GAAD;EAAK,IAAI,EAAE,SAAS,EAAE,cAAc,GAAG,EAAE;YAAzC;GACG,MAAe,EAAwB,gBACtC,kBAAA,GAAA,EAAA,UAAA;IACE,kBAAC,GAAD;KAAY,SAAQ;eAAS;KAAsB,CAAA;IAClD;IACD,kBAAC,OAAD,EAAA,UAAM,GAAc,CAAA;IACnB,EAAA,CAAA;GAEJ,MAAe,EAAwB,KACtC,kBAAA,GAAA,EAAA,UAAA;IACE,kBAAC,GAAD;KAAY,SAAQ;eAAS;KAAoB,CAAA;IAChD;IACD,kBAAC,OAAD,EAAA,UAAM,GAAY,CAAA;IACjB,EAAA,CAAA;GAEJ,MAAe,EAAwB,UACtC,kBAAA,GAAA,EAAA,UAAA;IACE,kBAAC,GAAD;KAAY,SAAQ;eAAS;KAAyB,CAAA;IACrD;IACD,kBAAC,OAAD,EAAA,UAAM,GAAiB,CAAA;IACtB,EAAA,CAAA;GAED;IACL,EAAA,CAAA;AAUL,QACE,kBAAC,GAAD;EACE,MAAM;EACC;EACP,UAAU;EACV,WAAW;EACX,UAAS;EACc,uBAdG,IAC1B;GACE,cAAc;GACL;GACV,GACD,KAAA;EAUA,SAAS;EACT,iBAAiB;EACjB,CAAA"}

package/dist/components/ProgrammaticTableDownload/ProgrammaticTableDownload.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProgrammaticTableDownload.js","names":[],"sources":["../../../src/components/ProgrammaticTableDownload/ProgrammaticTableDownload.tsx"],"sourcesContent":["import { useGetQueryResultBundleWithAsyncStatus } from '@/synapse-queries'\nimport { SynapseConstants } from '@/utils'\nimport { Link } from '@mui/material'\nimport { QueryBundleRequest } from '@sage-bionetworks/synapse-types'\nimport { useEffect, useMemo, useState } from 'react'\nimport {\n  PYTHON_CLIENT_IMPORT_AND_LOGIN,\n  R_CLIENT_IMPORT_AND_LOGIN,\n} from '../DownloadCart/DirectProgrammaticDownload'\nimport { ProgrammaticInstructionsModal } from '../ProgrammaticInstructionsModal/ProgrammaticInstructionsModal'\n\nexport type ProgrammaticTableDownloadProps = {\n  queryBundleRequest: QueryBundleRequest\n  onHide: () => void\n}\n\nexport function ProgrammaticTableDownload({\n  queryBundleRequest,\n  onHide,\n}: ProgrammaticTableDownloadProps) {\n  const [generatedSql, setGeneratedSql] = useState('...')\n\n  const {\n    data: asyncJobStatus,\n    isLoading: queryIsLoading,\n    isPlaceholderData: newQueryIsFetching,\n  } = useGetQueryResultBundleWithAsyncStatus(\n    {\n      ...queryBundleRequest,\n      partMask: SynapseConstants.BUNDLE_MASK_COMBINED_SQL,\n    },\n    {\n      placeholderData: previousData => previousData,\n      throwOnError: true,\n    },\n  )\n\n  const combinedSql = asyncJobStatus?.responseBody?.combinedSql\n  const isLoadingNewBundle = queryIsLoading || newQueryIsFetching\n\n  useEffect(() => {\n    if (combinedSql && !isLoadingNewBundle) {\n      // SWC-5686: The ID column is required by the client, and this column may not have been selected!\n      // Change the SQL to \"SELECT * ...\"\n      const indexOfFrom = combinedSql.toUpperCase().indexOf('FROM SYN')\n      const selectStarTransformedSql = `SELECT * ${combinedSql.substring(\n        indexOfFrom,\n      )}`\n      setGeneratedSql(selectStarTransformedSql)\n    }\n  }, [combinedSql, isLoadingNewBundle])\n\n  // Replace quotation marks with escaped quotations. For CLI, also escape backticks.\n  const commandLineSql = useMemo(\n    () => generatedSql.replace(/([\"`])/g, '\\\\$1'),\n    [generatedSql],\n  )\n\n  const clientSql = useMemo(\n    () => generatedSql.replace(/\"/g, '\\\\\"'),\n    [generatedSql],\n  )\n\n  return (\n    <ProgrammaticInstructionsModal\n      show={true}\n      onClose={onHide}\n      title=\"Download Programmatically\"\n      cliNotes={\n        <>\n          This command line code will download Synapse files AND file\n          annotations to your working directory.\n        </>\n      }\n      cliCode={`synapse get -q \"${commandLineSql}\"`}\n      rNotes={\n        <>\n          This R code will download file annotations only. Use{' '}\n          <Link\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            href=\"https://help.synapse.org/docs/Get-Started-with-Downloading-Data.2004254837.html#GetStartedwithDownloadingData-DownloadingFiles\"\n          >\n            synGet{'()'}\n          </Link>{' '}\n          to loop over the list of Synapse IDs from the file annotations to\n          download files.\n        </>\n      }\n      rCode={`${R_CLIENT_IMPORT_AND_LOGIN}\nquery ${'<-'} synTableQuery(\"${clientSql}\")${'\\n'}read.table(query$filepath, sep = \",\")`}\n      pythonNotes={\n        <>\n          This Python code will download file annotations only. Use{' '}\n          <Link\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            href=\"https://help.synapse.org/docs/Get-Started-with-Downloading-Data.2004254837.html#GetStartedwithDownloadingData-DownloadingFiles\"\n          >\n            syn.get\n          </Link>{' '}\n          to loop over the list of Synapse IDs from the file annotations to\n          download files.\n        </>\n      }\n      pythonCode={`${PYTHON_CLIENT_IMPORT_AND_LOGIN}\nquery = syn.tableQuery(\"${clientSql}\")${'\\n'}query.asDataFrame()`}\n    />\n  )\n}\n\nexport default ProgrammaticTableDownload\n"],"mappings":";;;;;;;;;;AAgBA,SAAgB,EAA0B,EACxC,uBACA,aACiC;CACjC,IAAM,CAAC,GAAc,KAAmB,EAAS,MAAM,EAEjD,EACJ,MAAM,GACN,WAAW,GACX,mBAAmB,MACjB,EACF;EACE,GAAG;EACH,UAAU;EACX,EACD;EACE,kBAAiB,MAAgB;EACjC,cAAc;EACf,CACF,EAEK,IAAc,GAAgB,cAAc,aAC5C,IAAqB,KAAkB;AAE7C,SAAgB;AACd,MAAI,KAAe,CAAC,GAAoB;GAGtC,IAAM,IAAc,EAAY,aAAa,CAAC,QAAQ,WAAW;AAIjE,KAHiC,YAAY,EAAY,UACvD,EACD,GACwC;;IAE1C,CAAC,GAAa,EAAmB,CAAC;CAGrC,IAAM,IAAiB,QACf,EAAa,QAAQ,WAAW,OAAO,EAC7C,CAAC,EAAa,CACf,EAEK,IAAY,QACV,EAAa,QAAQ,MAAM,OAAM,EACvC,CAAC,EAAa,CACf;AAED,QACE,kBAAC,GAAD;EACE,MAAM;EACN,SAAS;EACT,OAAM;EACN,UACE,kBAAA,GAAA,EAAA,UAAE,sGAGC,CAAA;EAEL,SAAS,mBAAmB,EAAe;EAC3C,QACE,kBAAA,GAAA,EAAA,UAAA;GAAE;GACqD;GACrD,kBAAC,GAAD;IACE,QAAO;IACP,KAAI;IACJ,MAAK;cAHP,CAIC,UACQ,KACF;;GAAC;GAAI;GAGX,EAAA,CAAA;EAEL,OAAO,GAAG,EAA0B;0BACX,EAAU;;EACnC,aACE,kBAAA,GAAA,EAAA,UAAA;GAAE;GAC0D;GAC1D,kBAAC,GAAD;IACE,QAAO;IACP,KAAI;IACJ,MAAK;cACN;IAEM,CAAA;GAAC;GAAI;GAGX,EAAA,CAAA;EAEL,YAAY,GAAG,EAA+B;0BAC1B,EAAU;;EAC9B,CAAA"}
+{"version":3,"file":"ProgrammaticTableDownload.js","names":[],"sources":["../../../src/components/ProgrammaticTableDownload/ProgrammaticTableDownload.tsx"],"sourcesContent":["import { useGetQueryResultBundleWithAsyncStatus } from '@/synapse-queries'\nimport { SynapseConstants } from '@/utils'\nimport { Link } from '@mui/material'\nimport { QueryBundleRequest } from '@sage-bionetworks/synapse-types'\nimport { useEffect, useMemo, useState } from 'react'\nimport {\n  PYTHON_CLIENT_IMPORT_AND_LOGIN,\n  R_CLIENT_IMPORT_AND_LOGIN,\n} from '../DownloadCart/DirectProgrammaticDownload'\nimport { ProgrammaticInstructionsModal } from '../ProgrammaticInstructionsModal/ProgrammaticInstructionsModal'\n\nexport type ProgrammaticTableDownloadProps = {\n  queryBundleRequest: QueryBundleRequest\n  onHide: () => void\n}\n\nexport function ProgrammaticTableDownload({\n  queryBundleRequest,\n  onHide,\n}: ProgrammaticTableDownloadProps) {\n  const [generatedSql, setGeneratedSql] = useState('...')\n\n  const {\n    data: asyncJobStatus,\n    isLoading: queryIsLoading,\n    isPlaceholderData: newQueryIsFetching,\n  } = useGetQueryResultBundleWithAsyncStatus(\n    {\n      ...queryBundleRequest,\n      partMask: SynapseConstants.BUNDLE_MASK_COMBINED_SQL,\n    },\n    {\n      placeholderData: previousData => previousData,\n      throwOnError: true,\n    },\n  )\n\n  const combinedSql = asyncJobStatus?.responseBody?.combinedSql\n  const isLoadingNewBundle = queryIsLoading || newQueryIsFetching\n\n  useEffect(() => {\n    if (combinedSql && !isLoadingNewBundle) {\n      // SWC-5686: The ID column is required by the client, and this column may not have been selected!\n      // Change the SQL to \"SELECT * ...\"\n      const indexOfFrom = combinedSql.toUpperCase().indexOf('FROM SYN')\n      const selectStarTransformedSql = `SELECT * ${combinedSql.substring(\n        indexOfFrom,\n      )}`\n      setGeneratedSql(selectStarTransformedSql)\n    }\n  }, [combinedSql, isLoadingNewBundle])\n\n  // Replace quotation marks with escaped quotations. For CLI, also escape backticks.\n  const commandLineSql = useMemo(\n    () => generatedSql.replace(/([\"`])/g, '\\\\$1'),\n    [generatedSql],\n  )\n\n  const clientSql = useMemo(\n    () => generatedSql.replace(/\"/g, '\\\\\"'),\n    [generatedSql],\n  )\n\n  return (\n    <ProgrammaticInstructionsModal\n      show={true}\n      onClose={onHide}\n      title=\"Download Programmatically\"\n      cliNotes={\n        <>\n          This command line code will download Synapse files AND file\n          annotations to your working directory.\n        </>\n      }\n      cliCode={`synapse get -q \"${commandLineSql}\"`}\n      rNotes={\n        <>\n          This R code will download file annotations only. Use{' '}\n          <Link\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            href=\"https://help.synapse.org/docs/Get-Started-with-Downloading-Data.2004254837.html#GetStartedwithDownloadingData-DownloadingFiles\"\n          >\n            synGet{'()'}\n          </Link>{' '}\n          to loop over the list of Synapse IDs from the file annotations to\n          download files.\n        </>\n      }\n      rCode={`${R_CLIENT_IMPORT_AND_LOGIN}\nquery ${'<-'} synTableQuery(\"${clientSql}\")${'\\n'}read.table(query$filepath, sep = \",\")`}\n      pythonNotes={\n        <>\n          This Python code will download file annotations only. Use{' '}\n          <Link\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            href=\"https://help.synapse.org/docs/Get-Started-with-Downloading-Data.2004254837.html#GetStartedwithDownloadingData-DownloadingFiles\"\n          >\n            syn.get\n          </Link>{' '}\n          to loop over the list of Synapse IDs from the file annotations to\n          download files.\n        </>\n      }\n      pythonCode={`${PYTHON_CLIENT_IMPORT_AND_LOGIN}\nquery = syn.tableQuery(\"${clientSql}\")${'\\n'}query.asDataFrame()`}\n    />\n  )\n}\n\nexport default ProgrammaticTableDownload\n"],"mappings":";;;;;;;;;;AAgBA,SAAgB,EAA0B,EACxC,uBACA,aACiC;CACjC,IAAM,CAAC,GAAc,KAAmB,EAAS,MAAM,EAEjD,EACJ,MAAM,GACN,WAAW,GACX,mBAAmB,MACjB,EACF;EACE,GAAG;EACH,UAAU;EACX,EACD;EACE,kBAAiB,MAAgB;EACjC,cAAc;EACf,CACF,EAEK,IAAc,GAAgB,cAAc,aAC5C,IAAqB,KAAkB;AAE7C,SAAgB;AACd,MAAI,KAAe,CAAC,GAAoB;GAGtC,IAAM,IAAc,EAAY,aAAa,CAAC,QAAQ,WAAW;AAIjE,KAAgB,YAH6B,EAAY,UACvD,EACD,GACwC;;IAE1C,CAAC,GAAa,EAAmB,CAAC;CAGrC,IAAM,IAAiB,QACf,EAAa,QAAQ,WAAW,OAAO,EAC7C,CAAC,EAAa,CACf,EAEK,IAAY,QACV,EAAa,QAAQ,MAAM,OAAM,EACvC,CAAC,EAAa,CACf;AAED,QACE,kBAAC,GAAD;EACE,MAAM;EACN,SAAS;EACT,OAAM;EACN,UACE,kBAAA,GAAA,EAAA,UAAE,sGAGC,CAAA;EAEL,SAAS,mBAAmB,EAAe;EAC3C,QACE,kBAAA,GAAA,EAAA,UAAA;GAAE;GACqD;GACrD,kBAAC,GAAD;IACE,QAAO;IACP,KAAI;IACJ,MAAK;cAHP,CAIC,UACQ,KACF;;GAAC;GAAI;GAGX,EAAA,CAAA;EAEL,OAAO,GAAG,EAA0B;0BACX,EAAU;;EACnC,aACE,kBAAA,GAAA,EAAA,UAAA;GAAE;GAC0D;GAC1D,kBAAC,GAAD;IACE,QAAO;IACP,KAAI;IACJ,MAAK;cACN;IAEM,CAAA;GAAC;GAAI;GAGX,EAAA,CAAA;EAEL,YAAY,GAAG,EAA+B;0BAC1B,EAAU;;EAC9B,CAAA"}

package/dist/components/Programs/Programs.Mobile.js.map

@@ -1 +1 @@
-{"version":3,"file":"Programs.Mobile.js","names":[],"sources":["../../../src/components/Programs/Programs.Mobile.tsx"],"sourcesContent":["import LargeButton from '@/components/styled/LargeButton'\nimport ExpandableContent from '../home_page/ExpandableContent'\nimport { ImageFileHandle } from '../widgets/ImageFileHandle'\nimport { ProgramsDataProps } from './Programs'\n\nexport default function ProgramsMobile({\n  link,\n  summary,\n  title,\n  color,\n  fileHandleAssociation,\n  exploreLink,\n}: ProgramsDataProps) {\n  const titleElement = (\n    <div className=\"Programs__Mobile__Header\">\n      <span className=\"Programs__Card__header__icon\">\n        {fileHandleAssociation && (\n          <ImageFileHandle fileHandleAssociation={fileHandleAssociation} />\n        )}\n      </span>\n      <span className=\"Programs__Mobile__Header__Title\"> {title} </span>\n    </div>\n  )\n  const content = (\n    <div className=\"Programs__Mobile__Content\">\n      {link && (\n        <p className=\"Programs__Card__header__info__link\">\n          <a\n            className=\"highlight-link\"\n            href={link}\n            target=\"_blank\"\n            rel=\"noreferrer\"\n          >\n            Visit website\n          </a>\n        </p>\n      )}\n      <p>{summary}</p>\n      <LargeButton\n        color=\"secondary\"\n        variant=\"contained\"\n        href={exploreLink}\n        sx={{ marginLeft: 0 }}\n      >\n        Explore\n      </LargeButton>\n    </div>\n  )\n  return <ExpandableContent title={titleElement} content={content} />\n}\n"],"mappings":";;;;;AAKA,SAAwB,EAAe,EACrC,SACA,YACA,UACA,UACA,0BACA,kBACoB;AAoCpB,QAAO,kBAAC,GAAD;EAAmB,OAlCxB,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,QAAD;IAAM,WAAU;cACb,KACC,kBAAC,GAAD,EAAwC,0BAAyB,CAAA;IAE9D,CAAA,EACP,kBAAC,QAAD;IAAM,WAAU;cAAhB;KAAkD;KAAE;KAAM;KAAQ;MAC9D;;EA2BgD,SAxBtD,kBAAC,OAAD;GAAK,WAAU;aAAf;IACG,KACC,kBAAC,KAAD;KAAG,WAAU;eACX,kBAAC,KAAD;MACE,WAAU;MACV,MAAM;MACN,QAAO;MACP,KAAI;gBACL;MAEG,CAAA;KACF,CAAA;IAEN,kBAAC,KAAD,EAAA,UAAI,GAAY,CAAA;IAChB,kBAAC,GAAD;KACE,OAAM;KACN,SAAQ;KACR,MAAM;KACN,IAAI,EAAE,YAAY,GAAG;eACtB;KAEa,CAAA;IACV;;EAE2D,CAAA"}
+{"version":3,"file":"Programs.Mobile.js","names":[],"sources":["../../../src/components/Programs/Programs.Mobile.tsx"],"sourcesContent":["import LargeButton from '@/components/styled/LargeButton'\nimport ExpandableContent from '../home_page/ExpandableContent'\nimport { ImageFileHandle } from '../widgets/ImageFileHandle'\nimport { ProgramsDataProps } from './Programs'\n\nexport default function ProgramsMobile({\n  link,\n  summary,\n  title,\n  color,\n  fileHandleAssociation,\n  exploreLink,\n}: ProgramsDataProps) {\n  const titleElement = (\n    <div className=\"Programs__Mobile__Header\">\n      <span className=\"Programs__Card__header__icon\">\n        {fileHandleAssociation && (\n          <ImageFileHandle fileHandleAssociation={fileHandleAssociation} />\n        )}\n      </span>\n      <span className=\"Programs__Mobile__Header__Title\"> {title} </span>\n    </div>\n  )\n  const content = (\n    <div className=\"Programs__Mobile__Content\">\n      {link && (\n        <p className=\"Programs__Card__header__info__link\">\n          <a\n            className=\"highlight-link\"\n            href={link}\n            target=\"_blank\"\n            rel=\"noreferrer\"\n          >\n            Visit website\n          </a>\n        </p>\n      )}\n      <p>{summary}</p>\n      <LargeButton\n        color=\"secondary\"\n        variant=\"contained\"\n        href={exploreLink}\n        sx={{ marginLeft: 0 }}\n      >\n        Explore\n      </LargeButton>\n    </div>\n  )\n  return <ExpandableContent title={titleElement} content={content} />\n}\n"],"mappings":";;;;;AAKA,SAAwB,EAAe,EACrC,SACA,YACA,UACA,UACA,0BACA,kBACoB;AAoCpB,QAAO,kBAAC,GAAD;EAAmB,OAlCxB,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,QAAD;IAAM,WAAU;cACb,KACC,kBAAC,GAAD,EAAwC,0BAAyB,CAAA;IAE9D,CAAA,EACP,kBAAC,QAAD;IAAM,WAAU;cAAhB;KAAkD;KAAE;KAAM;KAAQ;MAC9D;IA2ByB;EAAuB,SAxBtD,kBAAC,OAAD;GAAK,WAAU;aAAf;IACG,KACC,kBAAC,KAAD;KAAG,WAAU;eACX,kBAAC,KAAD;MACE,WAAU;MACV,MAAM;MACN,QAAO;MACP,KAAI;gBACL;MAEG,CAAA;KACF,CAAA;IAEN,kBAAC,KAAD,EAAA,UAAI,GAAY,CAAA;IAChB,kBAAC,GAAD;KACE,OAAM;KACN,SAAQ;KACR,MAAM;KACN,IAAI,EAAE,YAAY,GAAG;eACtB;KAEa,CAAA;IACV;IAEgD;EAAW,CAAA"}

package/dist/components/Programs/Programs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Programs.js","names":[],"sources":["../../../src/components/Programs/Programs.tsx"],"sourcesContent":["import { useGetEntity } from '@/synapse-queries/entity/useEntity'\nimport useGetQueryResultBundle from '@/synapse-queries/entity/useGetQueryResultBundle'\nimport { SynapseConstants } from '@/utils'\nimport { getFieldIndex } from '@/utils/functions/queryUtils'\nimport useShowDesktop from '@/utils/hooks/useShowDesktop'\nimport {\n  FileHandleAssociation,\n  QueryBundleRequest,\n} from '@sage-bionetworks/synapse-types'\nimport { CardLink } from '../CardContainer/CardLink'\nimport { getColorPalette } from '../ColorGradient/ColorGradient'\nimport {\n  getFileHandleAssociation,\n  getLinkParams,\n} from '../GenericCard/CardUtils'\nimport ProgramsDesktop from './Programs.Desktop'\nimport ProgramsMobile from './Programs.Mobile'\n\nexport type ProgramsProps = {\n  entityId: string\n  rgbIndex: number\n  titleColumnName: string\n  linkColumnName: string\n  summaryColumnName: string\n  imageFileHandleColumnName: string\n  linkConfig: CardLink\n}\n\nexport type ProgramsDataProps = {\n  title: string\n  summary: string\n  link: string\n  exploreLink: string\n  color: string\n  fileHandleAssociation?: FileHandleAssociation\n}\n\nexport function Programs(props: ProgramsProps) {\n  const {\n    entityId,\n    titleColumnName,\n    linkColumnName,\n    summaryColumnName,\n    imageFileHandleColumnName,\n    linkConfig,\n    rgbIndex,\n  } = props\n  const showDesktop = useShowDesktop()\n  const entity = useGetEntity(entityId)\n  const color: string = getColorPalette(rgbIndex ?? 0, 2).colorPalette[0]\n  const queryBundleRequest: QueryBundleRequest = {\n    concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n    entityId,\n    partMask:\n      SynapseConstants.BUNDLE_MASK_QUERY_SELECT_COLUMNS |\n      SynapseConstants.BUNDLE_MASK_QUERY_RESULTS,\n    query: {\n      sql: `select * from ${entityId}`,\n    },\n  }\n  const { data: queryResultBundle } =\n    useGetQueryResultBundle(queryBundleRequest)\n\n  const titleColumnIndex = getFieldIndex(titleColumnName, queryResultBundle)\n  const summaryColumnIndex = getFieldIndex(summaryColumnName, queryResultBundle)\n  const linkColumnIndex = getFieldIndex(linkColumnName, queryResultBundle)\n  const iconColumnIndex = getFieldIndex(\n    imageFileHandleColumnName,\n    queryResultBundle,\n  )\n  return (\n    <div className={`Programs${showDesktop ? '__Desktop' : ''}`}>\n      {queryResultBundle?.queryResult!.queryResults.rows.map(el => {\n        const values = el.values as string[]\n        if (values.some(value => value === null)) {\n          // We cast values above assuming there are no null values, emit a warning just in case.\n          console.warn('Row has null value(s) when no nulls expected')\n        }\n\n        const title = values[titleColumnIndex]\n        const summary = values[summaryColumnIndex]\n        const link = values[linkColumnIndex] ?? ''\n        const iconFileHandleIdValue = values[iconColumnIndex]\n\n        const schema: Record<string, number> = {}\n        queryResultBundle?.queryResult!.queryResults.headers.forEach(\n          (header, colIndex) => {\n            schema[header.name] = colIndex\n          },\n        )\n        const { href } = getLinkParams(link, linkConfig, values, schema)\n\n        const fileHandleAssociation = getFileHandleAssociation(\n          entity.data,\n          iconFileHandleIdValue,\n          `syn${el.rowId}`,\n        )\n        const ProgramsDataProps: ProgramsDataProps = {\n          title,\n          summary,\n          link,\n          color,\n          exploreLink: href,\n          fileHandleAssociation,\n        }\n        return showDesktop ? (\n          <ProgramsDesktop {...ProgramsDataProps} />\n        ) : (\n          <ProgramsMobile {...ProgramsDataProps} />\n        )\n      })}\n    </div>\n  )\n}\n\nexport default Programs\n"],"mappings":";;;;;;;;;;;;AAqCA,SAAgB,EAAS,GAAsB;CAC7C,IAAM,EACJ,aACA,oBACA,mBACA,sBACA,8BACA,eACA,gBACE,GACE,IAAc,GAAgB,EAC9B,IAAS,EAAa,EAAS,EAC/B,IAAgB,EAAgB,KAAY,GAAG,EAAE,CAAC,aAAa,IAW/D,EAAE,MAAM,MACZ,EAX6C;EAC7C,cAAc;EACd;EACA,UACE;EAEF,OAAO,EACL,KAAK,iBAAiB,KACvB;EACF,CAE4C,EAEvC,IAAmB,EAAc,GAAiB,EAAkB,EACpE,IAAqB,EAAc,GAAmB,EAAkB,EACxE,IAAkB,EAAc,GAAgB,EAAkB,EAClE,IAAkB,EACtB,GACA,EACD;AACD,QACE,kBAAC,OAAD;EAAK,WAAW,WAAW,IAAc,cAAc;YACpD,GAAmB,YAAa,aAAa,KAAK,KAAI,MAAM;GAC3D,IAAM,IAAS,EAAG;AAClB,GAAI,EAAO,MAAK,MAAS,MAAU,KAAK,IAEtC,QAAQ,KAAK,+CAA+C;GAG9D,IAAM,IAAQ,EAAO,IACf,IAAU,EAAO,IACjB,IAAO,EAAO,MAAoB,IAClC,IAAwB,EAAO,IAE/B,IAAiC,EAAE;AACzC,MAAmB,YAAa,aAAa,QAAQ,SAClD,GAAQ,MAAa;AACpB,MAAO,EAAO,QAAQ;KAEzB;GACD,IAAM,EAAE,YAAS,EAAc,GAAM,GAAY,GAAQ,EAAO,EAO1D,IAAuC;IAC3C;IACA;IACA;IACA;IACA,aAAa;IACb,uBAX4B,EAC5B,EAAO,MACP,GACA,MAAM,EAAG,QACV;IAQA;AACD,UACE,EADK,IACJ,IAEA,GAFD,EAAiB,GAAI,GAAqB,CAED;IAE3C;EACE,CAAA"}
+{"version":3,"file":"Programs.js","names":[],"sources":["../../../src/components/Programs/Programs.tsx"],"sourcesContent":["import { useGetEntity } from '@/synapse-queries/entity/useEntity'\nimport useGetQueryResultBundle from '@/synapse-queries/entity/useGetQueryResultBundle'\nimport { SynapseConstants } from '@/utils'\nimport { getFieldIndex } from '@/utils/functions/queryUtils'\nimport useShowDesktop from '@/utils/hooks/useShowDesktop'\nimport {\n  FileHandleAssociation,\n  QueryBundleRequest,\n} from '@sage-bionetworks/synapse-types'\nimport { CardLink } from '../CardContainer/CardLink'\nimport { getColorPalette } from '../ColorGradient/ColorGradient'\nimport {\n  getFileHandleAssociation,\n  getLinkParams,\n} from '../GenericCard/CardUtils'\nimport ProgramsDesktop from './Programs.Desktop'\nimport ProgramsMobile from './Programs.Mobile'\n\nexport type ProgramsProps = {\n  entityId: string\n  rgbIndex: number\n  titleColumnName: string\n  linkColumnName: string\n  summaryColumnName: string\n  imageFileHandleColumnName: string\n  linkConfig: CardLink\n}\n\nexport type ProgramsDataProps = {\n  title: string\n  summary: string\n  link: string\n  exploreLink: string\n  color: string\n  fileHandleAssociation?: FileHandleAssociation\n}\n\nexport function Programs(props: ProgramsProps) {\n  const {\n    entityId,\n    titleColumnName,\n    linkColumnName,\n    summaryColumnName,\n    imageFileHandleColumnName,\n    linkConfig,\n    rgbIndex,\n  } = props\n  const showDesktop = useShowDesktop()\n  const entity = useGetEntity(entityId)\n  const color: string = getColorPalette(rgbIndex ?? 0, 2).colorPalette[0]\n  const queryBundleRequest: QueryBundleRequest = {\n    concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n    entityId,\n    partMask:\n      SynapseConstants.BUNDLE_MASK_QUERY_SELECT_COLUMNS |\n      SynapseConstants.BUNDLE_MASK_QUERY_RESULTS,\n    query: {\n      sql: `select * from ${entityId}`,\n    },\n  }\n  const { data: queryResultBundle } =\n    useGetQueryResultBundle(queryBundleRequest)\n\n  const titleColumnIndex = getFieldIndex(titleColumnName, queryResultBundle)\n  const summaryColumnIndex = getFieldIndex(summaryColumnName, queryResultBundle)\n  const linkColumnIndex = getFieldIndex(linkColumnName, queryResultBundle)\n  const iconColumnIndex = getFieldIndex(\n    imageFileHandleColumnName,\n    queryResultBundle,\n  )\n  return (\n    <div className={`Programs${showDesktop ? '__Desktop' : ''}`}>\n      {queryResultBundle?.queryResult!.queryResults.rows.map(el => {\n        const values = el.values as string[]\n        if (values.some(value => value === null)) {\n          // We cast values above assuming there are no null values, emit a warning just in case.\n          console.warn('Row has null value(s) when no nulls expected')\n        }\n\n        const title = values[titleColumnIndex]\n        const summary = values[summaryColumnIndex]\n        const link = values[linkColumnIndex] ?? ''\n        const iconFileHandleIdValue = values[iconColumnIndex]\n\n        const schema: Record<string, number> = {}\n        queryResultBundle?.queryResult!.queryResults.headers.forEach(\n          (header, colIndex) => {\n            schema[header.name] = colIndex\n          },\n        )\n        const { href } = getLinkParams(link, linkConfig, values, schema)\n\n        const fileHandleAssociation = getFileHandleAssociation(\n          entity.data,\n          iconFileHandleIdValue,\n          `syn${el.rowId}`,\n        )\n        const ProgramsDataProps: ProgramsDataProps = {\n          title,\n          summary,\n          link,\n          color,\n          exploreLink: href,\n          fileHandleAssociation,\n        }\n        return showDesktop ? (\n          <ProgramsDesktop {...ProgramsDataProps} />\n        ) : (\n          <ProgramsMobile {...ProgramsDataProps} />\n        )\n      })}\n    </div>\n  )\n}\n\nexport default Programs\n"],"mappings":";;;;;;;;;;;;AAqCA,SAAgB,EAAS,GAAsB;CAC7C,IAAM,EACJ,aACA,oBACA,mBACA,sBACA,8BACA,eACA,gBACE,GACE,IAAc,GAAgB,EAC9B,IAAS,EAAa,EAAS,EAC/B,IAAgB,EAAgB,KAAY,GAAG,EAAE,CAAC,aAAa,IAW/D,EAAE,MAAM,MACZ,EAAwB;EAVxB,cAAc;EACd;EACA,UACE;EAEF,OAAO,EACL,KAAK,iBAAiB,KACvB;EAGuB,CAAmB,EAEvC,IAAmB,EAAc,GAAiB,EAAkB,EACpE,IAAqB,EAAc,GAAmB,EAAkB,EACxE,IAAkB,EAAc,GAAgB,EAAkB,EAClE,IAAkB,EACtB,GACA,EACD;AACD,QACE,kBAAC,OAAD;EAAK,WAAW,WAAW,IAAc,cAAc;YACpD,GAAmB,YAAa,aAAa,KAAK,KAAI,MAAM;GAC3D,IAAM,IAAS,EAAG;AAClB,GAAI,EAAO,MAAK,MAAS,MAAU,KAAK,IAEtC,QAAQ,KAAK,+CAA+C;GAG9D,IAAM,IAAQ,EAAO,IACf,IAAU,EAAO,IACjB,IAAO,EAAO,MAAoB,IAClC,IAAwB,EAAO,IAE/B,IAAiC,EAAE;AACzC,MAAmB,YAAa,aAAa,QAAQ,SAClD,GAAQ,MAAa;AACpB,MAAO,EAAO,QAAQ;KAEzB;GACD,IAAM,EAAE,YAAS,EAAc,GAAM,GAAY,GAAQ,EAAO,EAO1D,IAAuC;IAC3C;IACA;IACA;IACA;IACA,aAAa;IACb,uBAX4B,EAC5B,EAAO,MACP,GACA,MAAM,EAAG,QAQT;IACD;AACD,UACE,EADK,IACJ,IAEA,GAFD,EAAiB,GAAI,GAAqB,CAED;IAE3C;EACE,CAAA"}

package/dist/components/ProvenanceGraph/ProvenanceExternalIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProvenanceExternalIcon.js","names":[],"sources":["../../../src/components/ProvenanceGraph/ProvenanceExternalIcon.tsx"],"sourcesContent":["import React from 'react'\nimport IconSvg, { IconName } from '../IconSvg/IconSvg'\n\nexport type ProvenanceExternalIconProps = {\n  url: string\n}\nconst githubRegex = /^(.+?\\.)?github\\.com$/\nconst githubusercontentRegex = /^(.+?\\.)?githubusercontent\\.com$/\n\nexport const ProvenanceExternalIcon = (\n  props: ProvenanceExternalIconProps,\n): React.ReactNode => {\n  const { url } = props\n  let icon: IconName = 'link'\n  const parsedUrl = new URL(url)\n  const { hostname } = parsedUrl\n\n  if (hostname.match(githubRegex) || hostname.match(githubusercontentRegex)) {\n    icon = 'github'\n  }\n  // else if (url.includes(\"genomespace.org\")) {\n  //   icon = 'genomespace'\n  // }\n\n  // return the default (File icon)\n  return <IconSvg icon={icon} />\n}\n"],"mappings":";;;;AAMA,IAAM,IAAc,yBACd,IAAyB,oCAElB,KACX,MACoB;CACpB,IAAM,EAAE,WAAQ,GACZ,IAAiB,QAEf,EAAE,gBADU,IAAI,IAAI,EAAI;AAW9B,SARI,EAAS,MAAM,EAAY,IAAI,EAAS,MAAM,EAAuB,MACvE,IAAO,WAOF,kBAAC,GAAD,EAAe,SAAQ,CAAA"}
+{"version":3,"file":"ProvenanceExternalIcon.js","names":[],"sources":["../../../src/components/ProvenanceGraph/ProvenanceExternalIcon.tsx"],"sourcesContent":["import React from 'react'\nimport IconSvg, { IconName } from '../IconSvg/IconSvg'\n\nexport type ProvenanceExternalIconProps = {\n  url: string\n}\nconst githubRegex = /^(.+?\\.)?github\\.com$/\nconst githubusercontentRegex = /^(.+?\\.)?githubusercontent\\.com$/\n\nexport const ProvenanceExternalIcon = (\n  props: ProvenanceExternalIconProps,\n): React.ReactNode => {\n  const { url } = props\n  let icon: IconName = 'link'\n  const parsedUrl = new URL(url)\n  const { hostname } = parsedUrl\n\n  if (hostname.match(githubRegex) || hostname.match(githubusercontentRegex)) {\n    icon = 'github'\n  }\n  // else if (url.includes(\"genomespace.org\")) {\n  //   icon = 'genomespace'\n  // }\n\n  // return the default (File icon)\n  return <IconSvg icon={icon} />\n}\n"],"mappings":";;;;AAMA,IAAM,IAAc,yBACd,IAAyB,oCAElB,KACX,MACoB;CACpB,IAAM,EAAE,WAAQ,GACZ,IAAiB,QAEf,EAAE,gBAAa,IADC,IAAI,EACL;AAUrB,SARI,EAAS,MAAM,EAAY,IAAI,EAAS,MAAM,EAAuB,MACvE,IAAO,WAOF,kBAAC,GAAD,EAAe,SAAQ,CAAA"}

package/dist/components/ProvenanceGraph/ProvenanceGraph.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProvenanceGraph.js","names":[],"sources":["../../../src/components/ProvenanceGraph/ProvenanceGraph.tsx"],"sourcesContent":["import SynapseClient from '@/synapse-client'\nimport { useGetEntityHeaders } from '@/synapse-queries'\nimport { useSynapseContext } from '@/utils/context/SynapseContext'\nimport { CircularProgress } from '@mui/material'\nimport {\n  Activity,\n  EntityHeader,\n  ReferenceList,\n  Used,\n  USED_ENTITY_CONCRETE_TYPE_VALUE,\n  UsedEntity,\n  UsedURL,\n} from '@sage-bionetworks/synapse-types'\nimport { MouseEvent, useCallback, useEffect, useState, WheelEvent } from 'react'\nimport { useErrorHandler } from 'react-error-boundary'\nimport ReactFlow, {\n  Controls,\n  Edge,\n  getConnectedEdges,\n  Node,\n  ReactFlowProvider,\n  useEdgesState,\n  useNodesState,\n  useReactFlow,\n} from 'reactflow'\nimport { SynapseErrorBoundary } from '../error/ErrorBanner'\nimport { displayToast } from '../ToastMessage/ToastMessage'\nimport { ExpandGraphNodeDataProps } from './ExpandGraphNodeLabel'\nimport {\n  addActivityNode,\n  addEntityNode,\n  addEntityPlaceholderNode,\n  addExpandNode,\n  addExternalNode,\n  addUndefinedNode,\n  findEntityNode,\n  isRootEntity,\n} from './ProvenanceGraphUtils'\nimport {\n  getLayoutedElements,\n  isArrayEqual,\n  NodeType,\n  ProvenanceNodeData,\n} from './ProvenanceUtils'\nimport 'reactflow/dist/style.css'\n\nexport type ProvenanceProps = {\n  // what entity nodes should we start with?\n  entityRefs: ReferenceList\n  containerHeight?: string\n  initialNodes?: Node[]\n  initialEdges?: Edge[]\n  onNodesChangedListener?: (nodes: Node[]) => void\n  onEdgesChangedListener?: (edges: Edge[]) => void\n}\n\nconst MAX_ACTIVITY_EXPAND_NODES = 400\nconst DEFAULT_ZOOM = 0.85\n\n/**\n * Renders a Provenance Graph for a set of entities.\n * New Nodes are added to tempNodes, and new Edges are added to tempEdges.\n * On change, these are fed into the dagre js graph library to figure out the node positions,\n * and the output stored in 'nodes' and 'edges'. The 'nodes' and 'edges' arrays are used by the\n * ReactFlow component.\n */\nconst ProvenanceReactFlow = (props: ProvenanceProps): React.ReactNode => {\n  const {\n    entityRefs: rootEntityRefs,\n    containerHeight = '200px',\n    initialNodes = [],\n    initialEdges = [],\n    onNodesChangedListener,\n    onEdgesChangedListener,\n  } = props\n  const { accessToken } = useSynapseContext()\n  const [tempNodes, setTempNodes] = useState<Node[]>(initialNodes)\n  const [tempEdges, setTempEdges] = useState<Edge[]>(initialEdges)\n  const [nodes, setNodes] = useNodesState([])\n  const [edges, setEdges] = useEdgesState([])\n  const [clickedNode, setClickedNode] = useState<Node>()\n  const handleError = useErrorHandler()\n\n  const { data: rootEntityHeadersPage, isSuccess } = useGetEntityHeaders(\n    rootEntityRefs,\n    { throwOnError: true },\n  )\n  if (\n    isSuccess &&\n    rootEntityHeadersPage &&\n    rootEntityHeadersPage.totalNumberOfResults == 0\n  ) {\n    const synapseIds = rootEntityRefs.map(ref => ref.targetId).join(',')\n    handleError(\n      `Unable to load provenance for the given Synapse IDs: ${synapseIds}`,\n    )\n  }\n  const rootEntityHeaders = rootEntityHeadersPage?.results\n  const [initializedPosition, setInitializedPosition] = useState<boolean>(false)\n\n  // Get the react flow instance so we attempt to properly center the view.\n  const reactFlowInstance = useReactFlow()\n\n  const onClickNode = useCallback((_event: MouseEvent, node: Node) => {\n    setClickedNode(node)\n  }, [])\n\n  /**\n   * Called when we have a new entity to add to the graph.  This will result in adding\n   * a new Entity Node to the nodesCopy, a link from the usedInActivity to the new Entity Node,\n   * AND it will look for an Activity associated with the new entity.  If an Activity is found,\n   * it will add an Expand Node for the user to click (to expand to see this Activity!).\n   * If this is a root node (starting entity node), then we automatically add the Activity Node\n   * and process it.\n   */\n  const addEntity = useCallback(\n    async (params: {\n      entityHeader: EntityHeader\n      usedInActivity?: Activity\n      nodesCopy: Node[]\n      edgesCopy: Edge[]\n    }) => {\n      const { entityHeader, nodesCopy, edgesCopy, usedInActivity } = params\n      addEntityNode({\n        entityHeader,\n        activity: usedInActivity,\n        nodesCopy,\n        edgesCopy,\n      })\n      //look for Activity\n      try {\n        const activity = await SynapseClient.getActivityForEntity(\n          entityHeader.id,\n          entityHeader.versionNumber,\n          accessToken,\n        )\n        // if this is not a root node (or there are too many items to show), add an expand node\n        if (\n          !isRootEntity({ entityHeader, rootEntityHeaders }) ||\n          (activity.used && activity.used.length >= MAX_ACTIVITY_EXPAND_NODES)\n        ) {\n          addExpandNode({\n            entityHeader,\n            itemCount: activity.used?.length,\n            nodesCopy,\n            edgesCopy,\n          })\n        }\n      } catch (e) {\n        // Activity is not accessible\n        console.error(e)\n        if (\n          isRootEntity({\n            entityHeader,\n            rootEntityHeaders,\n          })\n        ) {\n          // add provenance undefined node\n          addUndefinedNode({\n            entityHeader,\n            nodesCopy,\n            edgesCopy,\n          })\n        }\n      }\n    },\n    [accessToken, rootEntityHeaders],\n  )\n\n  /**\n   * This effect attempts to center the graph on one of the root nodes.\n   * Only initializes after after a root node has been added to the graph.\n   */\n  useEffect(() => {\n    if (!initializedPosition && nodes.length > 0) {\n      setTimeout(() => {\n        if (rootEntityHeaders) {\n          const rootEntityNode = findEntityNode(rootEntityHeaders[0], nodes)\n          if (rootEntityNode) {\n            const currentZoom = reactFlowInstance.getZoom()\n            const zoom = currentZoom > DEFAULT_ZOOM ? DEFAULT_ZOOM : currentZoom\n            reactFlowInstance?.setCenter(\n              rootEntityNode.position.x + 150,\n              rootEntityNode.position.y - 30,\n              { zoom, duration: 0 },\n            )\n          }\n          setInitializedPosition(true)\n        }\n      })\n    }\n  }, [initializedPosition, nodes, reactFlowInstance, rootEntityHeaders])\n\n  /**\n   * This is called when the user clicks on an Expand Node.  It will add the associated Activity\n   * and all \"used\" items (entities and urls) to the graph by adding items to the nodesCopy and edgesCopy arrays.\n   */\n  const onExpandEntity = useCallback(\n    async (params: {\n      entityHeader: EntityHeader\n      nodesCopy: Node[]\n      edgesCopy: Edge[]\n    }) => {\n      const { entityHeader, nodesCopy, edgesCopy } = params\n      try {\n        const activity = await SynapseClient.getActivityForEntity(\n          entityHeader.id,\n          entityHeader.versionNumber,\n          accessToken,\n        )\n        addActivityNode({\n          activity,\n          entityHeader,\n          nodesCopy,\n          edgesCopy,\n        })\n        // go through Activity.used array to add these nodes/edges\n        if (activity.used && activity.used.length < MAX_ACTIVITY_EXPAND_NODES) {\n          const usedEntityReferences: ReferenceList = []\n          activity.used.forEach((usedItem: Used) => {\n            if (usedItem.concreteType == USED_ENTITY_CONCRETE_TYPE_VALUE) {\n              usedEntityReferences.push((usedItem as UsedEntity).reference)\n            } else {\n              // UsedURL\n              const usedURL = usedItem as UsedURL\n              addExternalNode({ usedURL, activity, nodesCopy, edgesCopy })\n            }\n          })\n          const usedEntityHeadersPage = await SynapseClient.getEntityHeaders(\n            usedEntityReferences,\n            accessToken,\n          )\n          const { results: usedEntityHeaderPageResults } = usedEntityHeadersPage\n          // find refs that were not returned by the entity header call\n          const refsMissingEntityHeaders = usedEntityReferences.filter(ref => {\n            return (\n              usedEntityHeaderPageResults.find(header => {\n                return header.id == ref.targetId\n              }) == undefined\n            )\n          })\n          refsMissingEntityHeaders.forEach(ref => {\n            addEntityPlaceholderNode({ ref, activity, nodesCopy, edgesCopy })\n          })\n          const addEntityPromises: Promise<void>[] = []\n          usedEntityHeaderPageResults.forEach(header => {\n            addEntityPromises.push(\n              addEntity({\n                entityHeader: header,\n                nodesCopy,\n                edgesCopy,\n                usedInActivity: activity,\n              }),\n            )\n          })\n          await Promise.allSettled(addEntityPromises)\n        }\n      } catch (e) {\n        // Activity is not accessible\n        console.error(e)\n      }\n    },\n    [accessToken, addEntity],\n  )\n\n  /**\n   * This effect code executes when no nodes have been added.\n   * It will add the root nodes, and attempt to expand the root nodes.\n   */\n  useEffect(() => {\n    if (rootEntityHeaders && tempNodes.length == 0) {\n      const nodesCopy = [...tempNodes]\n      const edgesCopy = [...tempEdges]\n      const addAndExpandPromises: Promise<void>[] = []\n      rootEntityHeaders.forEach(header => {\n        const addEntityPromise = addEntity({\n          entityHeader: header,\n          nodesCopy,\n          edgesCopy,\n        })\n        addAndExpandPromises.push(addEntityPromise)\n\n        const expandEntityPromise = onExpandEntity({\n          entityHeader: header,\n          nodesCopy,\n          edgesCopy,\n        })\n        addAndExpandPromises.push(expandEntityPromise)\n      })\n      Promise.allSettled(addAndExpandPromises).finally(() => {\n        setTempNodes(nodesCopy)\n        setTempEdges(edgesCopy)\n      })\n    }\n  }, [\n    addEntity,\n    handleError,\n    onExpandEntity,\n    rootEntityHeaders,\n    rootEntityRefs,\n    tempEdges,\n    tempNodes,\n  ])\n\n  /**\n   * This effect code executes when a node is clicked.\n   * We check to see if it is an expand node.  If it is, then we remove the expand node (and associated edge)\n   * and ask for the Activity and associated \"used\" nodes (entities and URLs)\n   */\n  useEffect(() => {\n    const nodeData: ProvenanceNodeData = clickedNode?.data as ProvenanceNodeData\n    if (clickedNode && nodeData?.type == NodeType.EXPAND) {\n      const expandNodeDataProps = nodeData.props as ExpandGraphNodeDataProps\n      if (expandNodeDataProps.itemCount > MAX_ACTIVITY_EXPAND_NODES) {\n        displayToast(\n          'Web visualization does not support expanding this many items at this time.',\n          'danger',\n        )\n        return\n      } else {\n        // graph will be used outside of synapse, so show a non-branded spinner\n        nodeData.label = <CircularProgress size={30} />\n        // remove clicked node\n        const nodesWithoutExpandNode = tempNodes.filter(\n          node => node.id != clickedNode.id,\n        )\n        const edgeToRemove = getConnectedEdges([clickedNode], tempEdges)[0]\n        const edgesWithoutExpandEdge = tempEdges.filter(\n          edge => edge != edgeToRemove,\n        )\n        onExpandEntity({\n          entityHeader: expandNodeDataProps.entityHeader,\n          nodesCopy: nodesWithoutExpandNode,\n          edgesCopy: edgesWithoutExpandEdge,\n        }).finally(() => {\n          setTempNodes(nodesWithoutExpandNode)\n          setTempEdges(edgesWithoutExpandEdge)\n        })\n      }\n      setClickedNode(undefined)\n    }\n  }, [clickedNode, tempNodes, tempEdges, onExpandEntity])\n\n  /**\n   * This effect code is run when the graph nodes or edges change.\n   * It feeds the nodes and edges into our layout library to figure out where they should be positioned.\n   * The result is saved in the state variable \"nodes\" and \"edges\".\n   */\n  useEffect(() => {\n    const { nodes: layoutedNodes, edges: layoutedEdges } = getLayoutedElements(\n      tempNodes,\n      tempEdges,\n      'TB',\n    )\n    // hack: ProvenanceUtils.getProvenanceNode() returns a new object every time, so check to see if\n    // there were any real changes\n    if (!isArrayEqual(layoutedNodes, nodes)) {\n      setNodes(layoutedNodes)\n      if (onNodesChangedListener) {\n        onNodesChangedListener(layoutedNodes)\n      }\n    }\n    if (!isArrayEqual(layoutedEdges, edges)) {\n      setEdges(layoutedEdges)\n      if (onEdgesChangedListener) {\n        onEdgesChangedListener(layoutedEdges)\n      }\n    }\n  }, [\n    tempNodes,\n    tempEdges,\n    nodes,\n    edges,\n    setNodes,\n    setEdges,\n    initializedPosition,\n    reactFlowInstance,\n    rootEntityRefs,\n    onNodesChangedListener,\n    onEdgesChangedListener,\n  ])\n\n  const onPaneScrollFunction: (event?: WheelEvent) => void = useCallback(\n    event => {\n      // Cannot simply check the truthy value of event.deltaX (or Y) because the value might be 0 (or -0), which is falsy\n      if (\n        event &&\n        typeof event.deltaX !== 'undefined' &&\n        typeof event.deltaY !== 'undefined'\n      ) {\n        window.scrollTo(\n          window.scrollX + event.deltaX,\n          window.scrollY + event.deltaY,\n        )\n      }\n    },\n    [],\n  )\n  return (\n    <div\n      className=\"ProvenanceWidget\"\n      role=\"graphics-doc\" //https://www.w3.org/wiki/SVG_Accessibility/ARIA_roles_for_charts#Document_Roles\n      style={{ width: '100%', height: containerHeight }}\n    >\n      <ReactFlow\n        defaultViewport={{ x: 0, y: 0, zoom: DEFAULT_ZOOM }}\n        nodes={nodes}\n        edges={edges}\n        onNodeClick={onClickNode}\n        // onNodesChange={onNodesChange}  // SWC-6804: When the nodes/edges are updated (expanded) the graph is already re-rendered.\n        // onEdgesChange={onEdgesChange}  // Specifying these callbacks causes an infinite re-rendering loop.\n        attributionPosition=\"bottom-right\"\n        onConnect={undefined}\n        zoomOnScroll={false}\n        onPaneScroll={onPaneScrollFunction}\n      >\n        <Controls />\n      </ReactFlow>\n    </div>\n  )\n}\n\nconst ProvenanceGraph = (props: ProvenanceProps): React.ReactNode => {\n  return (\n    <SynapseErrorBoundary>\n      <ReactFlowProvider>\n        <ProvenanceReactFlow {...props} />\n      </ReactFlowProvider>\n    </SynapseErrorBoundary>\n  )\n}\n\nexport default ProvenanceGraph\n"],"mappings":"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"}
+{"version":3,"file":"ProvenanceGraph.js","names":[],"sources":["../../../src/components/ProvenanceGraph/ProvenanceGraph.tsx"],"sourcesContent":["import SynapseClient from '@/synapse-client'\nimport { useGetEntityHeaders } from '@/synapse-queries'\nimport { useSynapseContext } from '@/utils/context/SynapseContext'\nimport { CircularProgress } from '@mui/material'\nimport {\n  Activity,\n  EntityHeader,\n  ReferenceList,\n  Used,\n  USED_ENTITY_CONCRETE_TYPE_VALUE,\n  UsedEntity,\n  UsedURL,\n} from '@sage-bionetworks/synapse-types'\nimport { MouseEvent, useCallback, useEffect, useState, WheelEvent } from 'react'\nimport { useErrorHandler } from 'react-error-boundary'\nimport ReactFlow, {\n  Controls,\n  Edge,\n  getConnectedEdges,\n  Node,\n  ReactFlowProvider,\n  useEdgesState,\n  useNodesState,\n  useReactFlow,\n} from 'reactflow'\nimport { SynapseErrorBoundary } from '../error/ErrorBanner'\nimport { displayToast } from '../ToastMessage/ToastMessage'\nimport { ExpandGraphNodeDataProps } from './ExpandGraphNodeLabel'\nimport {\n  addActivityNode,\n  addEntityNode,\n  addEntityPlaceholderNode,\n  addExpandNode,\n  addExternalNode,\n  addUndefinedNode,\n  findEntityNode,\n  isRootEntity,\n} from './ProvenanceGraphUtils'\nimport {\n  getLayoutedElements,\n  isArrayEqual,\n  NodeType,\n  ProvenanceNodeData,\n} from './ProvenanceUtils'\nimport 'reactflow/dist/style.css'\n\nexport type ProvenanceProps = {\n  // what entity nodes should we start with?\n  entityRefs: ReferenceList\n  containerHeight?: string\n  initialNodes?: Node[]\n  initialEdges?: Edge[]\n  onNodesChangedListener?: (nodes: Node[]) => void\n  onEdgesChangedListener?: (edges: Edge[]) => void\n}\n\nconst MAX_ACTIVITY_EXPAND_NODES = 400\nconst DEFAULT_ZOOM = 0.85\n\n/**\n * Renders a Provenance Graph for a set of entities.\n * New Nodes are added to tempNodes, and new Edges are added to tempEdges.\n * On change, these are fed into the dagre js graph library to figure out the node positions,\n * and the output stored in 'nodes' and 'edges'. The 'nodes' and 'edges' arrays are used by the\n * ReactFlow component.\n */\nconst ProvenanceReactFlow = (props: ProvenanceProps): React.ReactNode => {\n  const {\n    entityRefs: rootEntityRefs,\n    containerHeight = '200px',\n    initialNodes = [],\n    initialEdges = [],\n    onNodesChangedListener,\n    onEdgesChangedListener,\n  } = props\n  const { accessToken } = useSynapseContext()\n  const [tempNodes, setTempNodes] = useState<Node[]>(initialNodes)\n  const [tempEdges, setTempEdges] = useState<Edge[]>(initialEdges)\n  const [nodes, setNodes] = useNodesState([])\n  const [edges, setEdges] = useEdgesState([])\n  const [clickedNode, setClickedNode] = useState<Node>()\n  const handleError = useErrorHandler()\n\n  const { data: rootEntityHeadersPage, isSuccess } = useGetEntityHeaders(\n    rootEntityRefs,\n    { throwOnError: true },\n  )\n  if (\n    isSuccess &&\n    rootEntityHeadersPage &&\n    rootEntityHeadersPage.totalNumberOfResults == 0\n  ) {\n    const synapseIds = rootEntityRefs.map(ref => ref.targetId).join(',')\n    handleError(\n      `Unable to load provenance for the given Synapse IDs: ${synapseIds}`,\n    )\n  }\n  const rootEntityHeaders = rootEntityHeadersPage?.results\n  const [initializedPosition, setInitializedPosition] = useState<boolean>(false)\n\n  // Get the react flow instance so we attempt to properly center the view.\n  const reactFlowInstance = useReactFlow()\n\n  const onClickNode = useCallback((_event: MouseEvent, node: Node) => {\n    setClickedNode(node)\n  }, [])\n\n  /**\n   * Called when we have a new entity to add to the graph.  This will result in adding\n   * a new Entity Node to the nodesCopy, a link from the usedInActivity to the new Entity Node,\n   * AND it will look for an Activity associated with the new entity.  If an Activity is found,\n   * it will add an Expand Node for the user to click (to expand to see this Activity!).\n   * If this is a root node (starting entity node), then we automatically add the Activity Node\n   * and process it.\n   */\n  const addEntity = useCallback(\n    async (params: {\n      entityHeader: EntityHeader\n      usedInActivity?: Activity\n      nodesCopy: Node[]\n      edgesCopy: Edge[]\n    }) => {\n      const { entityHeader, nodesCopy, edgesCopy, usedInActivity } = params\n      addEntityNode({\n        entityHeader,\n        activity: usedInActivity,\n        nodesCopy,\n        edgesCopy,\n      })\n      //look for Activity\n      try {\n        const activity = await SynapseClient.getActivityForEntity(\n          entityHeader.id,\n          entityHeader.versionNumber,\n          accessToken,\n        )\n        // if this is not a root node (or there are too many items to show), add an expand node\n        if (\n          !isRootEntity({ entityHeader, rootEntityHeaders }) ||\n          (activity.used && activity.used.length >= MAX_ACTIVITY_EXPAND_NODES)\n        ) {\n          addExpandNode({\n            entityHeader,\n            itemCount: activity.used?.length,\n            nodesCopy,\n            edgesCopy,\n          })\n        }\n      } catch (e) {\n        // Activity is not accessible\n        console.error(e)\n        if (\n          isRootEntity({\n            entityHeader,\n            rootEntityHeaders,\n          })\n        ) {\n          // add provenance undefined node\n          addUndefinedNode({\n            entityHeader,\n            nodesCopy,\n            edgesCopy,\n          })\n        }\n      }\n    },\n    [accessToken, rootEntityHeaders],\n  )\n\n  /**\n   * This effect attempts to center the graph on one of the root nodes.\n   * Only initializes after after a root node has been added to the graph.\n   */\n  useEffect(() => {\n    if (!initializedPosition && nodes.length > 0) {\n      setTimeout(() => {\n        if (rootEntityHeaders) {\n          const rootEntityNode = findEntityNode(rootEntityHeaders[0], nodes)\n          if (rootEntityNode) {\n            const currentZoom = reactFlowInstance.getZoom()\n            const zoom = currentZoom > DEFAULT_ZOOM ? DEFAULT_ZOOM : currentZoom\n            reactFlowInstance?.setCenter(\n              rootEntityNode.position.x + 150,\n              rootEntityNode.position.y - 30,\n              { zoom, duration: 0 },\n            )\n          }\n          setInitializedPosition(true)\n        }\n      })\n    }\n  }, [initializedPosition, nodes, reactFlowInstance, rootEntityHeaders])\n\n  /**\n   * This is called when the user clicks on an Expand Node.  It will add the associated Activity\n   * and all \"used\" items (entities and urls) to the graph by adding items to the nodesCopy and edgesCopy arrays.\n   */\n  const onExpandEntity = useCallback(\n    async (params: {\n      entityHeader: EntityHeader\n      nodesCopy: Node[]\n      edgesCopy: Edge[]\n    }) => {\n      const { entityHeader, nodesCopy, edgesCopy } = params\n      try {\n        const activity = await SynapseClient.getActivityForEntity(\n          entityHeader.id,\n          entityHeader.versionNumber,\n          accessToken,\n        )\n        addActivityNode({\n          activity,\n          entityHeader,\n          nodesCopy,\n          edgesCopy,\n        })\n        // go through Activity.used array to add these nodes/edges\n        if (activity.used && activity.used.length < MAX_ACTIVITY_EXPAND_NODES) {\n          const usedEntityReferences: ReferenceList = []\n          activity.used.forEach((usedItem: Used) => {\n            if (usedItem.concreteType == USED_ENTITY_CONCRETE_TYPE_VALUE) {\n              usedEntityReferences.push((usedItem as UsedEntity).reference)\n            } else {\n              // UsedURL\n              const usedURL = usedItem as UsedURL\n              addExternalNode({ usedURL, activity, nodesCopy, edgesCopy })\n            }\n          })\n          const usedEntityHeadersPage = await SynapseClient.getEntityHeaders(\n            usedEntityReferences,\n            accessToken,\n          )\n          const { results: usedEntityHeaderPageResults } = usedEntityHeadersPage\n          // find refs that were not returned by the entity header call\n          const refsMissingEntityHeaders = usedEntityReferences.filter(ref => {\n            return (\n              usedEntityHeaderPageResults.find(header => {\n                return header.id == ref.targetId\n              }) == undefined\n            )\n          })\n          refsMissingEntityHeaders.forEach(ref => {\n            addEntityPlaceholderNode({ ref, activity, nodesCopy, edgesCopy })\n          })\n          const addEntityPromises: Promise<void>[] = []\n          usedEntityHeaderPageResults.forEach(header => {\n            addEntityPromises.push(\n              addEntity({\n                entityHeader: header,\n                nodesCopy,\n                edgesCopy,\n                usedInActivity: activity,\n              }),\n            )\n          })\n          await Promise.allSettled(addEntityPromises)\n        }\n      } catch (e) {\n        // Activity is not accessible\n        console.error(e)\n      }\n    },\n    [accessToken, addEntity],\n  )\n\n  /**\n   * This effect code executes when no nodes have been added.\n   * It will add the root nodes, and attempt to expand the root nodes.\n   */\n  useEffect(() => {\n    if (rootEntityHeaders && tempNodes.length == 0) {\n      const nodesCopy = [...tempNodes]\n      const edgesCopy = [...tempEdges]\n      const addAndExpandPromises: Promise<void>[] = []\n      rootEntityHeaders.forEach(header => {\n        const addEntityPromise = addEntity({\n          entityHeader: header,\n          nodesCopy,\n          edgesCopy,\n        })\n        addAndExpandPromises.push(addEntityPromise)\n\n        const expandEntityPromise = onExpandEntity({\n          entityHeader: header,\n          nodesCopy,\n          edgesCopy,\n        })\n        addAndExpandPromises.push(expandEntityPromise)\n      })\n      Promise.allSettled(addAndExpandPromises).finally(() => {\n        setTempNodes(nodesCopy)\n        setTempEdges(edgesCopy)\n      })\n    }\n  }, [\n    addEntity,\n    handleError,\n    onExpandEntity,\n    rootEntityHeaders,\n    rootEntityRefs,\n    tempEdges,\n    tempNodes,\n  ])\n\n  /**\n   * This effect code executes when a node is clicked.\n   * We check to see if it is an expand node.  If it is, then we remove the expand node (and associated edge)\n   * and ask for the Activity and associated \"used\" nodes (entities and URLs)\n   */\n  useEffect(() => {\n    const nodeData: ProvenanceNodeData = clickedNode?.data as ProvenanceNodeData\n    if (clickedNode && nodeData?.type == NodeType.EXPAND) {\n      const expandNodeDataProps = nodeData.props as ExpandGraphNodeDataProps\n      if (expandNodeDataProps.itemCount > MAX_ACTIVITY_EXPAND_NODES) {\n        displayToast(\n          'Web visualization does not support expanding this many items at this time.',\n          'danger',\n        )\n        return\n      } else {\n        // graph will be used outside of synapse, so show a non-branded spinner\n        nodeData.label = <CircularProgress size={30} />\n        // remove clicked node\n        const nodesWithoutExpandNode = tempNodes.filter(\n          node => node.id != clickedNode.id,\n        )\n        const edgeToRemove = getConnectedEdges([clickedNode], tempEdges)[0]\n        const edgesWithoutExpandEdge = tempEdges.filter(\n          edge => edge != edgeToRemove,\n        )\n        onExpandEntity({\n          entityHeader: expandNodeDataProps.entityHeader,\n          nodesCopy: nodesWithoutExpandNode,\n          edgesCopy: edgesWithoutExpandEdge,\n        }).finally(() => {\n          setTempNodes(nodesWithoutExpandNode)\n          setTempEdges(edgesWithoutExpandEdge)\n        })\n      }\n      setClickedNode(undefined)\n    }\n  }, [clickedNode, tempNodes, tempEdges, onExpandEntity])\n\n  /**\n   * This effect code is run when the graph nodes or edges change.\n   * It feeds the nodes and edges into our layout library to figure out where they should be positioned.\n   * The result is saved in the state variable \"nodes\" and \"edges\".\n   */\n  useEffect(() => {\n    const { nodes: layoutedNodes, edges: layoutedEdges } = getLayoutedElements(\n      tempNodes,\n      tempEdges,\n      'TB',\n    )\n    // hack: ProvenanceUtils.getProvenanceNode() returns a new object every time, so check to see if\n    // there were any real changes\n    if (!isArrayEqual(layoutedNodes, nodes)) {\n      setNodes(layoutedNodes)\n      if (onNodesChangedListener) {\n        onNodesChangedListener(layoutedNodes)\n      }\n    }\n    if (!isArrayEqual(layoutedEdges, edges)) {\n      setEdges(layoutedEdges)\n      if (onEdgesChangedListener) {\n        onEdgesChangedListener(layoutedEdges)\n      }\n    }\n  }, [\n    tempNodes,\n    tempEdges,\n    nodes,\n    edges,\n    setNodes,\n    setEdges,\n    initializedPosition,\n    reactFlowInstance,\n    rootEntityRefs,\n    onNodesChangedListener,\n    onEdgesChangedListener,\n  ])\n\n  const onPaneScrollFunction: (event?: WheelEvent) => void = useCallback(\n    event => {\n      // Cannot simply check the truthy value of event.deltaX (or Y) because the value might be 0 (or -0), which is falsy\n      if (\n        event &&\n        typeof event.deltaX !== 'undefined' &&\n        typeof event.deltaY !== 'undefined'\n      ) {\n        window.scrollTo(\n          window.scrollX + event.deltaX,\n          window.scrollY + event.deltaY,\n        )\n      }\n    },\n    [],\n  )\n  return (\n    <div\n      className=\"ProvenanceWidget\"\n      role=\"graphics-doc\" //https://www.w3.org/wiki/SVG_Accessibility/ARIA_roles_for_charts#Document_Roles\n      style={{ width: '100%', height: containerHeight }}\n    >\n      <ReactFlow\n        defaultViewport={{ x: 0, y: 0, zoom: DEFAULT_ZOOM }}\n        nodes={nodes}\n        edges={edges}\n        onNodeClick={onClickNode}\n        // onNodesChange={onNodesChange}  // SWC-6804: When the nodes/edges are updated (expanded) the graph is already re-rendered.\n        // onEdgesChange={onEdgesChange}  // Specifying these callbacks causes an infinite re-rendering loop.\n        attributionPosition=\"bottom-right\"\n        onConnect={undefined}\n        zoomOnScroll={false}\n        onPaneScroll={onPaneScrollFunction}\n      >\n        <Controls />\n      </ReactFlow>\n    </div>\n  )\n}\n\nconst ProvenanceGraph = (props: ProvenanceProps): React.ReactNode => {\n  return (\n    <SynapseErrorBoundary>\n      <ReactFlowProvider>\n        <ProvenanceReactFlow {...props} />\n      </ReactFlowProvider>\n    </SynapseErrorBoundary>\n  )\n}\n\nexport default ProvenanceGraph\n"],"mappings":"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"}

package/dist/components/ProvenanceGraph/ProvenanceGraphUtils.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProvenanceGraphUtils.js","names":[],"sources":["../../../src/components/ProvenanceGraph/ProvenanceGraphUtils.ts"],"sourcesContent":["import { Edge, Node } from 'reactflow'\nimport { EntityHeader, Reference } from '@sage-bionetworks/synapse-types'\nimport { Activity, UsedURL } from '@sage-bionetworks/synapse-types'\nimport {\n  getNodeId,\n  getProvenanceEdge,\n  getProvenanceNode,\n  NodeType,\n  ProvenanceNodeProps,\n} from './ProvenanceUtils'\n\n/**\n * Is one of the root Entities given by the user\n */\nexport const isRootEntity = (params: {\n  entityHeader: EntityHeader\n  rootEntityHeaders?: EntityHeader[]\n}) => {\n  const { entityHeader, rootEntityHeaders } = params\n  const foundNode = rootEntityHeaders?.find(header => {\n    return (\n      entityHeader.id == header.id &&\n      entityHeader.versionNumber == header.versionNumber\n    )\n  })\n  return foundNode !== undefined\n}\n\n/**\n * Given the node properties, will return true if this node is already in the nodesCopy array.\n */\nexport const isNodeNotFound = (\n  nodeProps: ProvenanceNodeProps,\n  nodesCopy: Node[],\n) => {\n  const foundNode = nodesCopy.find(node => {\n    return node.id === getNodeId(nodeProps)\n  })\n  return foundNode === undefined\n}\n\nexport const findEntityNode = (\n  entityHeader: EntityHeader,\n  nodesCopy: Node[],\n) => {\n  const nodeProps = {\n    type: NodeType.ENTITY,\n    data: entityHeader,\n  }\n  return nodesCopy.find(node => {\n    return node.id === getNodeId(nodeProps)\n  })\n}\n\n/**\n * Given the node properties, will return true if this edge is already in the edgesCopy array.\n */\nexport const isEdgeNotFound = (\n  nodeProps1: ProvenanceNodeProps,\n  nodeProps2: ProvenanceNodeProps,\n  edgesCopy: Edge[],\n) => {\n  const foundEdge = edgesCopy.find(edge => {\n    return (\n      edge.source === getNodeId(nodeProps1) &&\n      edge.target === getNodeId(nodeProps2)\n    )\n  })\n  return foundEdge === undefined\n}\n\n/**\n * Given node properties of the new node and existing node, this function creates and adds a new node to\n * nodesCopy, and creates an edge from the new node to the existing node.  Note, this will only create\n * a new node or edge if these items are not found in the input nodesCopy array and edgesCopy array.\n */\nexport const addNodeAndEdge = (params: {\n  newNodeProps: ProvenanceNodeProps\n  existingNodeProps: ProvenanceNodeProps\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { newNodeProps, existingNodeProps, nodesCopy, edgesCopy } = params\n  if (isNodeNotFound(newNodeProps, nodesCopy)) {\n    nodesCopy.push(getProvenanceNode(newNodeProps))\n  }\n  if (isEdgeNotFound(newNodeProps, existingNodeProps, edgesCopy)) {\n    edgesCopy.push(getProvenanceEdge(newNodeProps, existingNodeProps))\n  }\n}\n\nexport const addActivityNode = (params: {\n  activity: Activity\n  entityHeader: EntityHeader\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { activity, entityHeader, nodesCopy, edgesCopy } = params\n  const activityNodeProps = {\n    type: NodeType.ACTIVITY,\n    data: activity,\n  }\n  const entityNodeProps = {\n    type: NodeType.ENTITY,\n    data: entityHeader,\n  }\n  addNodeAndEdge({\n    newNodeProps: activityNodeProps,\n    existingNodeProps: entityNodeProps,\n    nodesCopy,\n    edgesCopy,\n  })\n}\n\nexport const addExpandNode = (params: {\n  entityHeader: EntityHeader\n  itemCount: number | undefined\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { entityHeader, itemCount = 0, nodesCopy, edgesCopy } = params\n  const expandNodeProps = {\n    type: NodeType.EXPAND,\n    data: {\n      itemCount,\n      entityHeader,\n    },\n  }\n  const entityNodeProps = {\n    type: NodeType.ENTITY,\n    data: entityHeader,\n  }\n  addNodeAndEdge({\n    newNodeProps: expandNodeProps,\n    existingNodeProps: entityNodeProps,\n    nodesCopy,\n    edgesCopy,\n  })\n}\n\nexport const addEntityPlaceholderNode = (params: {\n  ref: Reference\n  activity: Activity\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { ref, activity, nodesCopy, edgesCopy } = params\n  const entityPlaceholderNodeProps = {\n    type: NodeType.ENTITY_PLACEHOLDER,\n    data: ref,\n  }\n  const activityNodeProps = {\n    type: NodeType.ACTIVITY,\n    data: activity,\n  }\n  addNodeAndEdge({\n    newNodeProps: entityPlaceholderNodeProps,\n    existingNodeProps: activityNodeProps,\n    nodesCopy,\n    edgesCopy,\n  })\n}\n\nexport const addUndefinedNode = (params: {\n  entityHeader: EntityHeader\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { entityHeader, nodesCopy, edgesCopy } = params\n  const undefinedNodeProps = {\n    type: NodeType.UNDEFINED,\n    data: entityHeader,\n  }\n  const entityNodeProps = {\n    type: NodeType.ENTITY,\n    data: entityHeader,\n  }\n  addNodeAndEdge({\n    newNodeProps: undefinedNodeProps,\n    existingNodeProps: entityNodeProps,\n    nodesCopy,\n    edgesCopy,\n  })\n}\n\nexport const addExternalNode = (params: {\n  usedURL: UsedURL\n  activity: Activity\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { usedURL, activity, nodesCopy, edgesCopy } = params\n  const activityNodeProps = {\n    type: NodeType.ACTIVITY,\n    data: activity,\n  }\n  const externalNodeProps = {\n    type: NodeType.EXTERNAL,\n    data: usedURL,\n  }\n  addNodeAndEdge({\n    newNodeProps: externalNodeProps,\n    existingNodeProps: activityNodeProps,\n    nodesCopy,\n    edgesCopy,\n  })\n}\n\nexport const addEntityNode = (params: {\n  entityHeader: EntityHeader\n  activity: Activity | undefined\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { entityHeader, activity, nodesCopy, edgesCopy } = params\n  const entityNodeProps = {\n    type: NodeType.ENTITY,\n    data: entityHeader,\n  }\n  if (isNodeNotFound(entityNodeProps, nodesCopy)) {\n    // add the new entity node\n    nodesCopy.push(getProvenanceNode(entityNodeProps))\n    if (activity) {\n      const activityNodeProps = {\n        type: NodeType.ACTIVITY,\n        data: activity,\n      }\n      edgesCopy.push(getProvenanceEdge(entityNodeProps, activityNodeProps))\n    }\n  }\n}\n"],"mappings":";;AAcA,IAAa,KAAgB,MAGvB;CACJ,IAAM,EAAE,iBAAc,yBAAsB;AAO5C,QANkB,GAAmB,MAAK,MAEtC,EAAa,MAAM,EAAO,MAC1B,EAAa,iBAAiB,EAAO,cAEvC,KACmB,KAAA;GAMV,KACX,GACA,MAEkB,EAAU,MAAK,MACxB,EAAK,OAAO,EAAU,EAAU,CACvC,KACmB,KAAA,GAGV,KACX,GACA,MACG;CACH,IAAM,IAAY;EAChB,MAAM,EAAS;EACf,MAAM;EACP;AACD,QAAO,EAAU,MAAK,MACb,EAAK,OAAO,EAAU,EAAU,CACvC;GAMS,KACX,GACA,GACA,MAEkB,EAAU,MAAK,MAE7B,EAAK,WAAW,EAAU,EAAW,IACrC,EAAK,WAAW,EAAU,EAAW,CAEvC,KACmB,KAAA,GAQV,KAAkB,MAKzB;CACJ,IAAM,EAAE,iBAAc,sBAAmB,cAAW,iBAAc;AAIlE,CAHI,EAAe,GAAc,EAAU,IACzC,EAAU,KAAK,EAAkB,EAAa,CAAC,EAE7C,EAAe,GAAc,GAAmB,EAAU,IAC5D,EAAU,KAAK,EAAkB,GAAc,EAAkB,CAAC;GAIzD,KAAmB,MAK1B;CACJ,IAAM,EAAE,aAAU,iBAAc,cAAW,iBAAc;AASzD,GAAe;EACb,cATwB;GACxB,MAAM,EAAS;GACf,MAAM;GACP;EAOC,mBANsB;GACtB,MAAM,EAAS;GACf,MAAM;GACP;EAIC;EACA;EACD,CAAC;GAGS,KAAiB,MAKxB;CACJ,IAAM,EAAE,iBAAc,eAAY,GAAG,cAAW,iBAAc;AAY9D,GAAe;EACb,cAZsB;GACtB,MAAM,EAAS;GACf,MAAM;IACJ;IACA;IACD;GACF;EAOC,mBANsB;GACtB,MAAM,EAAS;GACf,MAAM;GACP;EAIC;EACA;EACD,CAAC;GAGS,KAA4B,MAKnC;CACJ,IAAM,EAAE,QAAK,aAAU,cAAW,iBAAc;AAShD,GAAe;EACb,cATiC;GACjC,MAAM,EAAS;GACf,MAAM;GACP;EAOC,mBANwB;GACxB,MAAM,EAAS;GACf,MAAM;GACP;EAIC;EACA;EACD,CAAC;GAGS,KAAoB,MAI3B;CACJ,IAAM,EAAE,iBAAc,cAAW,iBAAc;AAS/C,GAAe;EACb,cATyB;GACzB,MAAM,EAAS;GACf,MAAM;GACP;EAOC,mBANsB;GACtB,MAAM,EAAS;GACf,MAAM;GACP;EAIC;EACA;EACD,CAAC;GAGS,KAAmB,MAK1B;CACJ,IAAM,EAAE,YAAS,aAAU,cAAW,iBAAc,GAC9C,IAAoB;EACxB,MAAM,EAAS;EACf,MAAM;EACP;AAKD,GAAe;EACb,cALwB;GACxB,MAAM,EAAS;GACf,MAAM;GACP;EAGC,mBAAmB;EACnB;EACA;EACD,CAAC;GAGS,KAAiB,MAKxB;CACJ,IAAM,EAAE,iBAAc,aAAU,cAAW,iBAAc,GACnD,IAAkB;EACtB,MAAM,EAAS;EACf,MAAM;EACP;AACD,KAAI,EAAe,GAAiB,EAAU,KAE5C,EAAU,KAAK,EAAkB,EAAgB,CAAC,EAC9C,IAAU;EACZ,IAAM,IAAoB;GACxB,MAAM,EAAS;GACf,MAAM;GACP;AACD,IAAU,KAAK,EAAkB,GAAiB,EAAkB,CAAC"}
+{"version":3,"file":"ProvenanceGraphUtils.js","names":[],"sources":["../../../src/components/ProvenanceGraph/ProvenanceGraphUtils.ts"],"sourcesContent":["import { Edge, Node } from 'reactflow'\nimport { EntityHeader, Reference } from '@sage-bionetworks/synapse-types'\nimport { Activity, UsedURL } from '@sage-bionetworks/synapse-types'\nimport {\n  getNodeId,\n  getProvenanceEdge,\n  getProvenanceNode,\n  NodeType,\n  ProvenanceNodeProps,\n} from './ProvenanceUtils'\n\n/**\n * Is one of the root Entities given by the user\n */\nexport const isRootEntity = (params: {\n  entityHeader: EntityHeader\n  rootEntityHeaders?: EntityHeader[]\n}) => {\n  const { entityHeader, rootEntityHeaders } = params\n  const foundNode = rootEntityHeaders?.find(header => {\n    return (\n      entityHeader.id == header.id &&\n      entityHeader.versionNumber == header.versionNumber\n    )\n  })\n  return foundNode !== undefined\n}\n\n/**\n * Given the node properties, will return true if this node is already in the nodesCopy array.\n */\nexport const isNodeNotFound = (\n  nodeProps: ProvenanceNodeProps,\n  nodesCopy: Node[],\n) => {\n  const foundNode = nodesCopy.find(node => {\n    return node.id === getNodeId(nodeProps)\n  })\n  return foundNode === undefined\n}\n\nexport const findEntityNode = (\n  entityHeader: EntityHeader,\n  nodesCopy: Node[],\n) => {\n  const nodeProps = {\n    type: NodeType.ENTITY,\n    data: entityHeader,\n  }\n  return nodesCopy.find(node => {\n    return node.id === getNodeId(nodeProps)\n  })\n}\n\n/**\n * Given the node properties, will return true if this edge is already in the edgesCopy array.\n */\nexport const isEdgeNotFound = (\n  nodeProps1: ProvenanceNodeProps,\n  nodeProps2: ProvenanceNodeProps,\n  edgesCopy: Edge[],\n) => {\n  const foundEdge = edgesCopy.find(edge => {\n    return (\n      edge.source === getNodeId(nodeProps1) &&\n      edge.target === getNodeId(nodeProps2)\n    )\n  })\n  return foundEdge === undefined\n}\n\n/**\n * Given node properties of the new node and existing node, this function creates and adds a new node to\n * nodesCopy, and creates an edge from the new node to the existing node.  Note, this will only create\n * a new node or edge if these items are not found in the input nodesCopy array and edgesCopy array.\n */\nexport const addNodeAndEdge = (params: {\n  newNodeProps: ProvenanceNodeProps\n  existingNodeProps: ProvenanceNodeProps\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { newNodeProps, existingNodeProps, nodesCopy, edgesCopy } = params\n  if (isNodeNotFound(newNodeProps, nodesCopy)) {\n    nodesCopy.push(getProvenanceNode(newNodeProps))\n  }\n  if (isEdgeNotFound(newNodeProps, existingNodeProps, edgesCopy)) {\n    edgesCopy.push(getProvenanceEdge(newNodeProps, existingNodeProps))\n  }\n}\n\nexport const addActivityNode = (params: {\n  activity: Activity\n  entityHeader: EntityHeader\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { activity, entityHeader, nodesCopy, edgesCopy } = params\n  const activityNodeProps = {\n    type: NodeType.ACTIVITY,\n    data: activity,\n  }\n  const entityNodeProps = {\n    type: NodeType.ENTITY,\n    data: entityHeader,\n  }\n  addNodeAndEdge({\n    newNodeProps: activityNodeProps,\n    existingNodeProps: entityNodeProps,\n    nodesCopy,\n    edgesCopy,\n  })\n}\n\nexport const addExpandNode = (params: {\n  entityHeader: EntityHeader\n  itemCount: number | undefined\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { entityHeader, itemCount = 0, nodesCopy, edgesCopy } = params\n  const expandNodeProps = {\n    type: NodeType.EXPAND,\n    data: {\n      itemCount,\n      entityHeader,\n    },\n  }\n  const entityNodeProps = {\n    type: NodeType.ENTITY,\n    data: entityHeader,\n  }\n  addNodeAndEdge({\n    newNodeProps: expandNodeProps,\n    existingNodeProps: entityNodeProps,\n    nodesCopy,\n    edgesCopy,\n  })\n}\n\nexport const addEntityPlaceholderNode = (params: {\n  ref: Reference\n  activity: Activity\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { ref, activity, nodesCopy, edgesCopy } = params\n  const entityPlaceholderNodeProps = {\n    type: NodeType.ENTITY_PLACEHOLDER,\n    data: ref,\n  }\n  const activityNodeProps = {\n    type: NodeType.ACTIVITY,\n    data: activity,\n  }\n  addNodeAndEdge({\n    newNodeProps: entityPlaceholderNodeProps,\n    existingNodeProps: activityNodeProps,\n    nodesCopy,\n    edgesCopy,\n  })\n}\n\nexport const addUndefinedNode = (params: {\n  entityHeader: EntityHeader\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { entityHeader, nodesCopy, edgesCopy } = params\n  const undefinedNodeProps = {\n    type: NodeType.UNDEFINED,\n    data: entityHeader,\n  }\n  const entityNodeProps = {\n    type: NodeType.ENTITY,\n    data: entityHeader,\n  }\n  addNodeAndEdge({\n    newNodeProps: undefinedNodeProps,\n    existingNodeProps: entityNodeProps,\n    nodesCopy,\n    edgesCopy,\n  })\n}\n\nexport const addExternalNode = (params: {\n  usedURL: UsedURL\n  activity: Activity\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { usedURL, activity, nodesCopy, edgesCopy } = params\n  const activityNodeProps = {\n    type: NodeType.ACTIVITY,\n    data: activity,\n  }\n  const externalNodeProps = {\n    type: NodeType.EXTERNAL,\n    data: usedURL,\n  }\n  addNodeAndEdge({\n    newNodeProps: externalNodeProps,\n    existingNodeProps: activityNodeProps,\n    nodesCopy,\n    edgesCopy,\n  })\n}\n\nexport const addEntityNode = (params: {\n  entityHeader: EntityHeader\n  activity: Activity | undefined\n  nodesCopy: Node[]\n  edgesCopy: Edge[]\n}) => {\n  const { entityHeader, activity, nodesCopy, edgesCopy } = params\n  const entityNodeProps = {\n    type: NodeType.ENTITY,\n    data: entityHeader,\n  }\n  if (isNodeNotFound(entityNodeProps, nodesCopy)) {\n    // add the new entity node\n    nodesCopy.push(getProvenanceNode(entityNodeProps))\n    if (activity) {\n      const activityNodeProps = {\n        type: NodeType.ACTIVITY,\n        data: activity,\n      }\n      edgesCopy.push(getProvenanceEdge(entityNodeProps, activityNodeProps))\n    }\n  }\n}\n"],"mappings":";;AAcA,IAAa,KAAgB,MAGvB;CACJ,IAAM,EAAE,iBAAc,yBAAsB;AAO5C,QANkB,GAAmB,MAAK,MAEtC,EAAa,MAAM,EAAO,MAC1B,EAAa,iBAAiB,EAAO,cAEvC,KACmB,KAAA;GAMV,KACX,GACA,MAEkB,EAAU,MAAK,MACxB,EAAK,OAAO,EAAU,EAAU,CAElC,KAAc,KAAA,GAGV,KACX,GACA,MACG;CACH,IAAM,IAAY;EAChB,MAAM,EAAS;EACf,MAAM;EACP;AACD,QAAO,EAAU,MAAK,MACb,EAAK,OAAO,EAAU,EAAU,CACvC;GAMS,KACX,GACA,GACA,MAEkB,EAAU,MAAK,MAE7B,EAAK,WAAW,EAAU,EAAW,IACrC,EAAK,WAAW,EAAU,EAAW,CAGlC,KAAc,KAAA,GAQV,KAAkB,MAKzB;CACJ,IAAM,EAAE,iBAAc,sBAAmB,cAAW,iBAAc;AAIlE,CAHI,EAAe,GAAc,EAAU,IACzC,EAAU,KAAK,EAAkB,EAAa,CAAC,EAE7C,EAAe,GAAc,GAAmB,EAAU,IAC5D,EAAU,KAAK,EAAkB,GAAc,EAAkB,CAAC;GAIzD,KAAmB,MAK1B;CACJ,IAAM,EAAE,aAAU,iBAAc,cAAW,iBAAc;AASzD,GAAe;EACb,cAAc;GARd,MAAM,EAAS;GACf,MAAM;GAOQ;EACd,mBAAmB;GALnB,MAAM,EAAS;GACf,MAAM;GAIa;EACnB;EACA;EACD,CAAC;GAGS,KAAiB,MAKxB;CACJ,IAAM,EAAE,iBAAc,eAAY,GAAG,cAAW,iBAAc;AAY9D,GAAe;EACb,cAAc;GAXd,MAAM,EAAS;GACf,MAAM;IACJ;IACA;IACD;GAOa;EACd,mBAAmB;GALnB,MAAM,EAAS;GACf,MAAM;GAIa;EACnB;EACA;EACD,CAAC;GAGS,KAA4B,MAKnC;CACJ,IAAM,EAAE,QAAK,aAAU,cAAW,iBAAc;AAShD,GAAe;EACb,cAAc;GARd,MAAM,EAAS;GACf,MAAM;GAOQ;EACd,mBAAmB;GALnB,MAAM,EAAS;GACf,MAAM;GAIa;EACnB;EACA;EACD,CAAC;GAGS,KAAoB,MAI3B;CACJ,IAAM,EAAE,iBAAc,cAAW,iBAAc;AAS/C,GAAe;EACb,cAAc;GARd,MAAM,EAAS;GACf,MAAM;GAOQ;EACd,mBAAmB;GALnB,MAAM,EAAS;GACf,MAAM;GAIa;EACnB;EACA;EACD,CAAC;GAGS,KAAmB,MAK1B;CACJ,IAAM,EAAE,YAAS,aAAU,cAAW,iBAAc,GAC9C,IAAoB;EACxB,MAAM,EAAS;EACf,MAAM;EACP;AAKD,GAAe;EACb,cAAc;GAJd,MAAM,EAAS;GACf,MAAM;GAGQ;EACd,mBAAmB;EACnB;EACA;EACD,CAAC;GAGS,KAAiB,MAKxB;CACJ,IAAM,EAAE,iBAAc,aAAU,cAAW,iBAAc,GACnD,IAAkB;EACtB,MAAM,EAAS;EACf,MAAM;EACP;AACD,KAAI,EAAe,GAAiB,EAAU,KAE5C,EAAU,KAAK,EAAkB,EAAgB,CAAC,EAC9C,IAAU;EACZ,IAAM,IAAoB;GACxB,MAAM,EAAS;GACf,MAAM;GACP;AACD,IAAU,KAAK,EAAkB,GAAiB,EAAkB,CAAC"}

package/dist/components/ProvenanceGraph/ProvenanceUtils.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProvenanceUtils.js","names":[],"sources":["../../../src/components/ProvenanceGraph/ProvenanceUtils.tsx"],"sourcesContent":["import { ReactNode } from 'react'\nimport { Node, Position, ConnectionLineType, Edge, MarkerType } from 'reactflow'\nimport { ActivityNodeLabel } from './ActivityNodeLabel'\nimport { EntityNodeLabel } from './EntityNodeLabel'\nimport {\n  ExpandGraphNodeDataProps,\n  ExpandGraphNodeLabel,\n} from './ExpandGraphNodeLabel'\nimport { ExternalGraphNodeLabel } from './ExternalGraphNodeLabel'\nimport dagre from 'dagre'\nimport { differenceWith, isEqual } from 'lodash-es'\nimport { UndefinedNodeLabel } from './UndefinedNodeLabel'\nimport { EntityHeader, Reference } from '@sage-bionetworks/synapse-types'\nimport { Activity, UsedURL } from '@sage-bionetworks/synapse-types'\nimport { EntityPlaceholderNodeLabel } from './EntityPlaceholderNodeLabel'\n\nexport enum NodeType {\n  ENTITY = 'EntityNode',\n  ENTITY_PLACEHOLDER = 'EntityPlaceholderNode',\n  EXTERNAL = 'ExternalNode',\n  ACTIVITY = 'ActivityNode',\n  EXPAND = 'ExpandNode',\n  UNDEFINED = 'UndefinedNode',\n}\n\ntype ProvenanceNodeLabelProps =\n  | UsedURL\n  | Activity\n  | ExpandGraphNodeDataProps\n  | EntityHeader\n  | Reference\n\nexport type ProvenanceNodeProps = {\n  type: NodeType\n  data: ProvenanceNodeLabelProps\n}\n\nexport type ProvenanceNodeData = {\n  label: ReactNode\n  props: ProvenanceNodeLabelProps\n  type: NodeType\n}\n\nexport const getProvenanceNode = (props: ProvenanceNodeProps): Node => {\n  const { type, data } = props\n  let nodeLabel: ReactNode\n  switch (type) {\n    case NodeType.ENTITY:\n      nodeLabel = <EntityNodeLabel {...(data as EntityHeader)} />\n      break\n    case NodeType.ENTITY_PLACEHOLDER:\n      nodeLabel = <EntityPlaceholderNodeLabel {...(data as Reference)} />\n      break\n    case NodeType.EXTERNAL:\n      nodeLabel = <ExternalGraphNodeLabel {...(data as UsedURL)} />\n      break\n    case NodeType.ACTIVITY:\n      nodeLabel = <ActivityNodeLabel {...(data as Activity)} />\n      break\n    case NodeType.EXPAND:\n      nodeLabel = (\n        <ExpandGraphNodeLabel {...(data as ExpandGraphNodeDataProps)} />\n      )\n      break\n    case NodeType.UNDEFINED:\n      nodeLabel = <UndefinedNodeLabel />\n      break\n    default:\n      nodeLabel = <p>Unrecognized node type: {type}</p>\n      break\n  }\n  const nodeData: ProvenanceNodeData = {\n    label: nodeLabel,\n    props: data,\n    type: type,\n  }\n  return {\n    id: getNodeId(props),\n    position: { x: 100, y: 100 }, // hard coded, let graph layout library figure this out\n    data: nodeData,\n    connectable: false,\n    draggable: false,\n    // selectable: false, // like to make unselectable, but node contents become non-interactive\n    className: `${type}`,\n  }\n}\n\nexport const getProvenanceEdge = (\n  node1Props: ProvenanceNodeProps,\n  node2Props: ProvenanceNodeProps,\n): Edge => {\n  const node1Id = getNodeId(node1Props)\n  const node2Id = getNodeId(node2Props)\n  return {\n    id: `${node1Id}-${node2Id}`,\n    source: node1Id,\n    target: node2Id,\n    animated: true,\n    type: ConnectionLineType.SimpleBezier,\n    markerEnd: {\n      type: MarkerType.ArrowClosed,\n    },\n  }\n}\n\nexport const getNodeId = (props: ProvenanceNodeProps) => {\n  const { type, data } = props\n  switch (type) {\n    case NodeType.ENTITY:\n      return `${(data as EntityHeader).id}.${\n        (data as EntityHeader).versionNumber ?? 'latest'\n      }`\n    case NodeType.ENTITY_PLACEHOLDER:\n      return `${(data as Reference).targetId}.${\n        (data as Reference).targetVersionNumber ?? 'latest'\n      }`\n    case NodeType.EXTERNAL:\n      return `${(data as UsedURL).url}`\n    case NodeType.ACTIVITY:\n      return `${(data as Activity).id}`\n    case NodeType.EXPAND:\n      return `expand.node.${\n        (data as ExpandGraphNodeDataProps).entityHeader.id\n      }.${\n        (data as ExpandGraphNodeDataProps).entityHeader.versionNumber ??\n        'latest'\n      }`\n    case NodeType.UNDEFINED:\n      return `undefined.dummy.node.${(data as EntityHeader).id}.${\n        (data as EntityHeader).versionNumber ?? 'latest'\n      }`\n  }\n}\n\n// layout\nconst dagreGraph = new dagre.graphlib.Graph()\ndagreGraph.setDefaultEdgeLabel(() => ({}))\n\nconst getNodeHeight = (node: Node) => {\n  const nodeData: ProvenanceNodeData = node.data as ProvenanceNodeData\n  return nodeData.type == NodeType.EXPAND ? 30 : 100\n}\nconst getNodeWidth = (node: Node) => {\n  const nodeData: ProvenanceNodeData = node.data as ProvenanceNodeData\n  return nodeData.type == NodeType.EXPAND ? 30 : 172\n}\n\nexport const getLayoutedElements = (\n  nodes: Node[],\n  edges: Edge[],\n  direction: string,\n) => {\n  const isHorizontal = direction === 'LR'\n  dagreGraph.setGraph({ rankdir: direction })\n\n  nodes.forEach(node => {\n    dagreGraph.setNode(node.id, {\n      width: getNodeWidth(node),\n      height: getNodeHeight(node),\n    })\n  })\n\n  edges.forEach(edge => {\n    dagreGraph.setEdge(edge.source, edge.target)\n  })\n\n  dagre.layout(dagreGraph)\n\n  nodes.forEach(node => {\n    const nodeWithPosition = dagreGraph.node(node.id)\n    node.targetPosition = isHorizontal ? Position.Left : Position.Top\n    node.sourcePosition = isHorizontal ? Position.Right : Position.Bottom\n\n    // We are shifting the dagre node position (anchor=center center) to the top left\n    // so it matches the React Flow node anchor point (top left).\n    node.position = {\n      x: nodeWithPosition.x - getNodeWidth(node) / 2,\n      y: nodeWithPosition.y - getNodeHeight(node) / 2,\n    }\n\n    return node\n  })\n\n  return { nodes, edges }\n}\n\nexport const isArrayEqual = (x: any[], y: any[]) => {\n  return differenceWith(x, y, isEqual).length == 0\n}\n"],"mappings":"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"}
+{"version":3,"file":"ProvenanceUtils.js","names":[],"sources":["../../../src/components/ProvenanceGraph/ProvenanceUtils.tsx"],"sourcesContent":["import { ReactNode } from 'react'\nimport { Node, Position, ConnectionLineType, Edge, MarkerType } from 'reactflow'\nimport { ActivityNodeLabel } from './ActivityNodeLabel'\nimport { EntityNodeLabel } from './EntityNodeLabel'\nimport {\n  ExpandGraphNodeDataProps,\n  ExpandGraphNodeLabel,\n} from './ExpandGraphNodeLabel'\nimport { ExternalGraphNodeLabel } from './ExternalGraphNodeLabel'\nimport dagre from 'dagre'\nimport { differenceWith, isEqual } from 'lodash-es'\nimport { UndefinedNodeLabel } from './UndefinedNodeLabel'\nimport { EntityHeader, Reference } from '@sage-bionetworks/synapse-types'\nimport { Activity, UsedURL } from '@sage-bionetworks/synapse-types'\nimport { EntityPlaceholderNodeLabel } from './EntityPlaceholderNodeLabel'\n\nexport enum NodeType {\n  ENTITY = 'EntityNode',\n  ENTITY_PLACEHOLDER = 'EntityPlaceholderNode',\n  EXTERNAL = 'ExternalNode',\n  ACTIVITY = 'ActivityNode',\n  EXPAND = 'ExpandNode',\n  UNDEFINED = 'UndefinedNode',\n}\n\ntype ProvenanceNodeLabelProps =\n  | UsedURL\n  | Activity\n  | ExpandGraphNodeDataProps\n  | EntityHeader\n  | Reference\n\nexport type ProvenanceNodeProps = {\n  type: NodeType\n  data: ProvenanceNodeLabelProps\n}\n\nexport type ProvenanceNodeData = {\n  label: ReactNode\n  props: ProvenanceNodeLabelProps\n  type: NodeType\n}\n\nexport const getProvenanceNode = (props: ProvenanceNodeProps): Node => {\n  const { type, data } = props\n  let nodeLabel: ReactNode\n  switch (type) {\n    case NodeType.ENTITY:\n      nodeLabel = <EntityNodeLabel {...(data as EntityHeader)} />\n      break\n    case NodeType.ENTITY_PLACEHOLDER:\n      nodeLabel = <EntityPlaceholderNodeLabel {...(data as Reference)} />\n      break\n    case NodeType.EXTERNAL:\n      nodeLabel = <ExternalGraphNodeLabel {...(data as UsedURL)} />\n      break\n    case NodeType.ACTIVITY:\n      nodeLabel = <ActivityNodeLabel {...(data as Activity)} />\n      break\n    case NodeType.EXPAND:\n      nodeLabel = (\n        <ExpandGraphNodeLabel {...(data as ExpandGraphNodeDataProps)} />\n      )\n      break\n    case NodeType.UNDEFINED:\n      nodeLabel = <UndefinedNodeLabel />\n      break\n    default:\n      nodeLabel = <p>Unrecognized node type: {type}</p>\n      break\n  }\n  const nodeData: ProvenanceNodeData = {\n    label: nodeLabel,\n    props: data,\n    type: type,\n  }\n  return {\n    id: getNodeId(props),\n    position: { x: 100, y: 100 }, // hard coded, let graph layout library figure this out\n    data: nodeData,\n    connectable: false,\n    draggable: false,\n    // selectable: false, // like to make unselectable, but node contents become non-interactive\n    className: `${type}`,\n  }\n}\n\nexport const getProvenanceEdge = (\n  node1Props: ProvenanceNodeProps,\n  node2Props: ProvenanceNodeProps,\n): Edge => {\n  const node1Id = getNodeId(node1Props)\n  const node2Id = getNodeId(node2Props)\n  return {\n    id: `${node1Id}-${node2Id}`,\n    source: node1Id,\n    target: node2Id,\n    animated: true,\n    type: ConnectionLineType.SimpleBezier,\n    markerEnd: {\n      type: MarkerType.ArrowClosed,\n    },\n  }\n}\n\nexport const getNodeId = (props: ProvenanceNodeProps) => {\n  const { type, data } = props\n  switch (type) {\n    case NodeType.ENTITY:\n      return `${(data as EntityHeader).id}.${\n        (data as EntityHeader).versionNumber ?? 'latest'\n      }`\n    case NodeType.ENTITY_PLACEHOLDER:\n      return `${(data as Reference).targetId}.${\n        (data as Reference).targetVersionNumber ?? 'latest'\n      }`\n    case NodeType.EXTERNAL:\n      return `${(data as UsedURL).url}`\n    case NodeType.ACTIVITY:\n      return `${(data as Activity).id}`\n    case NodeType.EXPAND:\n      return `expand.node.${\n        (data as ExpandGraphNodeDataProps).entityHeader.id\n      }.${\n        (data as ExpandGraphNodeDataProps).entityHeader.versionNumber ??\n        'latest'\n      }`\n    case NodeType.UNDEFINED:\n      return `undefined.dummy.node.${(data as EntityHeader).id}.${\n        (data as EntityHeader).versionNumber ?? 'latest'\n      }`\n  }\n}\n\n// layout\nconst dagreGraph = new dagre.graphlib.Graph()\ndagreGraph.setDefaultEdgeLabel(() => ({}))\n\nconst getNodeHeight = (node: Node) => {\n  const nodeData: ProvenanceNodeData = node.data as ProvenanceNodeData\n  return nodeData.type == NodeType.EXPAND ? 30 : 100\n}\nconst getNodeWidth = (node: Node) => {\n  const nodeData: ProvenanceNodeData = node.data as ProvenanceNodeData\n  return nodeData.type == NodeType.EXPAND ? 30 : 172\n}\n\nexport const getLayoutedElements = (\n  nodes: Node[],\n  edges: Edge[],\n  direction: string,\n) => {\n  const isHorizontal = direction === 'LR'\n  dagreGraph.setGraph({ rankdir: direction })\n\n  nodes.forEach(node => {\n    dagreGraph.setNode(node.id, {\n      width: getNodeWidth(node),\n      height: getNodeHeight(node),\n    })\n  })\n\n  edges.forEach(edge => {\n    dagreGraph.setEdge(edge.source, edge.target)\n  })\n\n  dagre.layout(dagreGraph)\n\n  nodes.forEach(node => {\n    const nodeWithPosition = dagreGraph.node(node.id)\n    node.targetPosition = isHorizontal ? Position.Left : Position.Top\n    node.sourcePosition = isHorizontal ? Position.Right : Position.Bottom\n\n    // We are shifting the dagre node position (anchor=center center) to the top left\n    // so it matches the React Flow node anchor point (top left).\n    node.position = {\n      x: nodeWithPosition.x - getNodeWidth(node) / 2,\n      y: nodeWithPosition.y - getNodeHeight(node) / 2,\n    }\n\n    return node\n  })\n\n  return { nodes, edges }\n}\n\nexport const isArrayEqual = (x: any[], y: any[]) => {\n  return differenceWith(x, y, isEqual).length == 0\n}\n"],"mappings":"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"}

package/dist/components/QueryCount/QueryCount.js.map

@@ -1 +1 @@
-{"version":3,"file":"QueryCount.js","names":[],"sources":["../../../src/components/QueryCount/QueryCount.tsx"],"sourcesContent":["import useGetQueryResultBundle from '@/synapse-queries/entity/useGetQueryResultBundle'\nimport { SynapseConstants } from '@/utils'\nimport { parseEntityIdFromSqlStatement } from '@/utils/functions/SqlFunctions'\nimport { Query, QueryBundleRequest } from '@sage-bionetworks/synapse-types'\nimport React from 'react'\n\nexport type QueryCountProps = {\n  query: Query\n  parens?: boolean\n}\n\n/**\n * Shows the total count of results for a table query.\n */\nexport function QueryCount(props: QueryCountProps): React.ReactNode {\n  const { query, parens } = props\n  const entityId = parseEntityIdFromSqlStatement(query.sql)\n\n  const request: QueryBundleRequest = {\n    concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n    query: query,\n    entityId,\n    partMask: SynapseConstants.BUNDLE_MASK_QUERY_COUNT,\n  }\n\n  const { data: queryResult } = useGetQueryResultBundle(request)\n\n  const localCount = queryResult?.queryCount?.toLocaleString()\n  /* https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toLocaleString#Using_toLocaleString */\n  return <>{localCount && (parens ? `(${localCount})` : localCount)}</>\n}\nexport default QueryCount\n"],"mappings":";;;;;;;AAcA,SAAgB,EAAW,GAAyC;CAClE,IAAM,EAAE,UAAO,cAAW,GAUpB,EAAE,MAAM,MAAgB,EAPM;EAClC,cAAc;EACP;EACP,UALe,EAA8B,EAAM,IAAI;EAMvD,UAAU;EACX,CAE6D,EAExD,IAAa,GAAa,YAAY,gBAAgB;AAE5D,QAAO,kBAAA,GAAA,EAAA,UAAG,MAAe,IAAS,IAAI,EAAW,KAAK,IAAe,CAAA"}
+{"version":3,"file":"QueryCount.js","names":[],"sources":["../../../src/components/QueryCount/QueryCount.tsx"],"sourcesContent":["import useGetQueryResultBundle from '@/synapse-queries/entity/useGetQueryResultBundle'\nimport { SynapseConstants } from '@/utils'\nimport { parseEntityIdFromSqlStatement } from '@/utils/functions/SqlFunctions'\nimport { Query, QueryBundleRequest } from '@sage-bionetworks/synapse-types'\nimport React from 'react'\n\nexport type QueryCountProps = {\n  query: Query\n  parens?: boolean\n}\n\n/**\n * Shows the total count of results for a table query.\n */\nexport function QueryCount(props: QueryCountProps): React.ReactNode {\n  const { query, parens } = props\n  const entityId = parseEntityIdFromSqlStatement(query.sql)\n\n  const request: QueryBundleRequest = {\n    concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n    query: query,\n    entityId,\n    partMask: SynapseConstants.BUNDLE_MASK_QUERY_COUNT,\n  }\n\n  const { data: queryResult } = useGetQueryResultBundle(request)\n\n  const localCount = queryResult?.queryCount?.toLocaleString()\n  /* https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toLocaleString#Using_toLocaleString */\n  return <>{localCount && (parens ? `(${localCount})` : localCount)}</>\n}\nexport default QueryCount\n"],"mappings":";;;;;;;AAcA,SAAgB,EAAW,GAAyC;CAClE,IAAM,EAAE,UAAO,cAAW,GAUpB,EAAE,MAAM,MAAgB,EAAwB;EANpD,cAAc;EACP;EACP,UALe,EAA8B,EAAM,IAKnD;EACA,UAAU;EAG0C,CAAQ,EAExD,IAAa,GAAa,YAAY,gBAAgB;AAE5D,QAAO,kBAAA,GAAA,EAAA,UAAG,MAAe,IAAS,IAAI,EAAW,KAAK,IAAe,CAAA"}

package/dist/components/QueryCountButton/QueryCountButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"QueryCountButton.js","names":[],"sources":["../../../src/components/QueryCountButton/QueryCountButton.tsx"],"sourcesContent":["import useGetQueryResultBundle from '@/synapse-queries/entity/useGetQueryResultBundle'\nimport { BUNDLE_MASK_QUERY_COUNT } from '@/utils/SynapseConstants'\nimport { parseEntityIdFromSqlStatement } from '@/utils/functions/SqlFunctions'\nimport { QueryBundleRequest } from '@sage-bionetworks/synapse-types'\nimport { Box, Button, ButtonProps } from '@mui/material'\nimport { NavigateNext } from '@mui/icons-material'\nimport React from 'react'\nimport { Link as RouterLink, useInRouterContext } from 'react-router'\n\nexport type QueryCountButtonProps = {\n  /**\n   * The SQL query to execute to get the count\n   */\n  sql: string\n  /**\n   * The target URL when the button is clicked\n   */\n  href: string\n  /**\n   * Text to display before the count (e.g., \"Explore\")\n   */\n  prefixText?: string\n  /**\n   * Text to display after the count (e.g., \"files\")\n   */\n  suffixText?: string\n  /**\n   * Additional MUI Button props\n   */\n} & Omit<ButtonProps, 'children'>\n\n/**\n * A button component that displays text with an inline count.\n * The count is fetched by executing a SQL query against a Synapse table.\n * Example: \"Explore 42 files\"\n */\nexport function QueryCountButton(props: QueryCountButtonProps) {\n  const { sql, href, prefixText = '', suffixText = '', ...buttonProps } = props\n  const entityId = parseEntityIdFromSqlStatement(sql)\n  const inRouterContext = useInRouterContext()\n\n  const request: QueryBundleRequest = {\n    concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n    query: { sql },\n    entityId,\n    partMask: BUNDLE_MASK_QUERY_COUNT,\n  }\n\n  const { data: queryResult, isLoading } = useGetQueryResultBundle(request)\n\n  const count = queryResult?.queryCount\n\n  const isExternalLink =\n    href?.startsWith('http://') || href?.startsWith('https://')\n\n  // Determine the appropriate link props based on context\n  let linkProps: Partial<ButtonProps> & { target?: string; to?: string } = {}\n\n  if (isExternalLink) {\n    linkProps = {\n      href,\n      target: '_blank',\n      rel: 'noopener noreferrer',\n      component: 'a',\n    }\n  } else if (inRouterContext) {\n    // For internal links, if we are in a react-router context, use RouterLink\n    linkProps = {\n      to: href,\n      component: RouterLink,\n    }\n  } else {\n    linkProps = {\n      href,\n      component: 'a',\n    }\n  }\n\n  // Build the button text: \"prefixText count suffixText\"\n  const buttonText = React.useMemo(() => {\n    const parts: string[] = []\n\n    if (prefixText) {\n      parts.push(prefixText)\n    }\n\n    if (!isLoading && count !== undefined) {\n      parts.push(count.toLocaleString())\n    }\n\n    if (suffixText) {\n      parts.push(suffixText)\n    }\n\n    return parts.join(' ')\n  }, [prefixText, count, suffixText, isLoading])\n\n  // Icon with theme-aware circular background\n  const endIcon = (\n    <Box\n      sx={{\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n        backgroundColor: 'background.paper',\n        borderRadius: '50%',\n        width: 24,\n        height: 24,\n      }}\n    >\n      <NavigateNext sx={{ color: 'primary.main', fontSize: 20 }} />\n    </Box>\n  )\n\n  return (\n    <Button\n      {...buttonProps}\n      {...linkProps}\n      endIcon={endIcon}\n      loading={isLoading}\n    >\n      {buttonText}\n    </Button>\n  )\n}\n\nexport default QueryCountButton\n"],"mappings":";;;;;;;;;AAoCA,SAAgB,EAAiB,GAA8B;CAC7D,IAAM,EAAE,QAAK,SAAM,gBAAa,IAAI,gBAAa,IAAI,GAAG,MAAgB,GAClE,IAAW,EAA8B,EAAI,EAC7C,IAAkB,GAAoB,EAStC,EAAE,MAAM,GAAa,iBAAc,EAPL;EAClC,cAAc;EACd,OAAO,EAAE,QAAK;EACd;EACA,UAAA;EACD,CAEwE,EAEnE,IAAQ,GAAa,YAErB,IACJ,GAAM,WAAW,UAAU,IAAI,GAAM,WAAW,WAAW,EAGzD,IAAqE,EAAE;AAE3E,CAcE,IAdE,IACU;EACV;EACA,QAAQ;EACR,KAAK;EACL,WAAW;EACZ,GACQ,IAEG;EACV,IAAI;EACJ,WAAW;EACZ,GAEW;EACV;EACA,WAAW;EACZ;CAIH,IAAM,IAAa,EAAM,cAAc;EACrC,IAAM,IAAkB,EAAE;AAc1B,SAZI,KACF,EAAM,KAAK,EAAW,EAGpB,CAAC,KAAa,MAAU,KAAA,KAC1B,EAAM,KAAK,EAAM,gBAAgB,CAAC,EAGhC,KACF,EAAM,KAAK,EAAW,EAGjB,EAAM,KAAK,IAAI;IACrB;EAAC;EAAY;EAAO;EAAY;EAAU,CAAC,EAGxC,IACJ,kBAAC,GAAD;EACE,IAAI;GACF,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,iBAAiB;GACjB,cAAc;GACd,OAAO;GACP,QAAQ;GACT;YAED,kBAAC,GAAD,EAAc,IAAI;GAAE,OAAO;GAAgB,UAAU;GAAI,EAAI,CAAA;EACzD,CAAA;AAGR,QACE,kBAAC,GAAD;EACE,GAAI;EACJ,GAAI;EACK;EACT,SAAS;YAER;EACM,CAAA"}
+{"version":3,"file":"QueryCountButton.js","names":[],"sources":["../../../src/components/QueryCountButton/QueryCountButton.tsx"],"sourcesContent":["import useGetQueryResultBundle from '@/synapse-queries/entity/useGetQueryResultBundle'\nimport { BUNDLE_MASK_QUERY_COUNT } from '@/utils/SynapseConstants'\nimport { parseEntityIdFromSqlStatement } from '@/utils/functions/SqlFunctions'\nimport { QueryBundleRequest } from '@sage-bionetworks/synapse-types'\nimport { Box, Button, ButtonProps } from '@mui/material'\nimport { NavigateNext } from '@mui/icons-material'\nimport React from 'react'\nimport { Link as RouterLink, useInRouterContext } from 'react-router'\n\nexport type QueryCountButtonProps = {\n  /**\n   * The SQL query to execute to get the count\n   */\n  sql: string\n  /**\n   * The target URL when the button is clicked\n   */\n  href: string\n  /**\n   * Text to display before the count (e.g., \"Explore\")\n   */\n  prefixText?: string\n  /**\n   * Text to display after the count (e.g., \"files\")\n   */\n  suffixText?: string\n  /**\n   * Additional MUI Button props\n   */\n} & Omit<ButtonProps, 'children'>\n\n/**\n * A button component that displays text with an inline count.\n * The count is fetched by executing a SQL query against a Synapse table.\n * Example: \"Explore 42 files\"\n */\nexport function QueryCountButton(props: QueryCountButtonProps) {\n  const { sql, href, prefixText = '', suffixText = '', ...buttonProps } = props\n  const entityId = parseEntityIdFromSqlStatement(sql)\n  const inRouterContext = useInRouterContext()\n\n  const request: QueryBundleRequest = {\n    concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n    query: { sql },\n    entityId,\n    partMask: BUNDLE_MASK_QUERY_COUNT,\n  }\n\n  const { data: queryResult, isLoading } = useGetQueryResultBundle(request)\n\n  const count = queryResult?.queryCount\n\n  const isExternalLink =\n    href?.startsWith('http://') || href?.startsWith('https://')\n\n  // Determine the appropriate link props based on context\n  let linkProps: Partial<ButtonProps> & { target?: string; to?: string } = {}\n\n  if (isExternalLink) {\n    linkProps = {\n      href,\n      target: '_blank',\n      rel: 'noopener noreferrer',\n      component: 'a',\n    }\n  } else if (inRouterContext) {\n    // For internal links, if we are in a react-router context, use RouterLink\n    linkProps = {\n      to: href,\n      component: RouterLink,\n    }\n  } else {\n    linkProps = {\n      href,\n      component: 'a',\n    }\n  }\n\n  // Build the button text: \"prefixText count suffixText\"\n  const buttonText = React.useMemo(() => {\n    const parts: string[] = []\n\n    if (prefixText) {\n      parts.push(prefixText)\n    }\n\n    if (!isLoading && count !== undefined) {\n      parts.push(count.toLocaleString())\n    }\n\n    if (suffixText) {\n      parts.push(suffixText)\n    }\n\n    return parts.join(' ')\n  }, [prefixText, count, suffixText, isLoading])\n\n  // Icon with theme-aware circular background\n  const endIcon = (\n    <Box\n      sx={{\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n        backgroundColor: 'background.paper',\n        borderRadius: '50%',\n        width: 24,\n        height: 24,\n      }}\n    >\n      <NavigateNext sx={{ color: 'primary.main', fontSize: 20 }} />\n    </Box>\n  )\n\n  return (\n    <Button\n      {...buttonProps}\n      {...linkProps}\n      endIcon={endIcon}\n      loading={isLoading}\n    >\n      {buttonText}\n    </Button>\n  )\n}\n\nexport default QueryCountButton\n"],"mappings":";;;;;;;;;AAoCA,SAAgB,EAAiB,GAA8B;CAC7D,IAAM,EAAE,QAAK,SAAM,gBAAa,IAAI,gBAAa,IAAI,GAAG,MAAgB,GAClE,IAAW,EAA8B,EAAI,EAC7C,IAAkB,GAAoB,EAStC,EAAE,MAAM,GAAa,iBAAc,EAAwB;EAN/D,cAAc;EACd,OAAO,EAAE,QAAK;EACd;EACA,UAAA;EAG+D,CAAQ,EAEnE,IAAQ,GAAa,YAErB,IACJ,GAAM,WAAW,UAAU,IAAI,GAAM,WAAW,WAAW,EAGzD,IAAqE,EAAE;AAE3E,CAcE,IAdE,IACU;EACV;EACA,QAAQ;EACR,KAAK;EACL,WAAW;EACZ,GACQ,IAEG;EACV,IAAI;EACJ,WAAW;EACZ,GAEW;EACV;EACA,WAAW;EACZ;CAIH,IAAM,IAAa,EAAM,cAAc;EACrC,IAAM,IAAkB,EAAE;AAc1B,SAZI,KACF,EAAM,KAAK,EAAW,EAGpB,CAAC,KAAa,MAAU,KAAA,KAC1B,EAAM,KAAK,EAAM,gBAAgB,CAAC,EAGhC,KACF,EAAM,KAAK,EAAW,EAGjB,EAAM,KAAK,IAAI;IACrB;EAAC;EAAY;EAAO;EAAY;EAAU,CAAC,EAGxC,IACJ,kBAAC,GAAD;EACE,IAAI;GACF,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,iBAAiB;GACjB,cAAc;GACd,OAAO;GACP,QAAQ;GACT;YAED,kBAAC,GAAD,EAAc,IAAI;GAAE,OAAO;GAAgB,UAAU;GAAI,EAAI,CAAA;EACzD,CAAA;AAGR,QACE,kBAAC,GAAD;EACE,GAAI;EACJ,GAAI;EACK;EACT,SAAS;YAER;EACM,CAAA"}