synapse-react-client 4.0.33 → 4.0.35

package/dist/components/SynapseChat/SynapseChatMessage.js

@@ -20,27 +20,28 @@ function s(t, n) {
 	}, [c, u]), { traceEvents: o };
 }
 function c(e) {
-	let { userMessage: r, chatJobId: i, onSendChat: a, agentAvatar: c, userAvatar: l, scrollIntoView: u, animateEntry: d, isAwaitingResponse: f, pendingAttachments: p } = e, { data: m } = n(i), h = m?.requestBody, g = m?.responseBody, _ = m?.errorMessage, { traceEvents: v } = s(i, !!i && (!m?.jobState || m.jobState == "PROCESSING")), y = h?.attachments?.map((e) => {
-		let t = e.fileHandleId, n = g?.attachmentStatuses?.find((e) => e.fileHandleId === t), r = p?.find((e) => e.fileHandleId === t);
+	let { userMessage: r, chatJobId: i, onSendChat: a, agentAvatar: c, userAvatar: l, scrollIntoView: u, animateEntry: d, isAwaitingResponse: f, showLoadingIcon: p, pendingAttachments: m } = e, { data: h } = n(i), g = h?.requestBody, _ = h?.responseBody, v = h?.errorMessage, { traceEvents: y } = s(i, !!i && (!h?.jobState || h.jobState == "PROCESSING")), b = g?.attachments?.map((e) => {
+		let t = e.fileHandleId, n = _?.attachmentStatuses?.find((e) => e.fileHandleId === t), r = m?.find((e) => e.fileHandleId === t);
 		return {
 			fileHandleId: t,
 			fileName: n?.fileName ?? r?.fileName,
 			contentType: n?.contentType ?? r?.contentType
 		};
-	}) ?? p;
+	}) ?? m;
 	return /* @__PURE__ */ o(t, {
 		agentAvatar: c,
 		userAvatar: l,
 		userMessage: r,
-		chatResponseText: g?.responseText,
-		chatResponseTrace: v,
-		chatErrorReason: _,
+		chatResponseText: _?.responseText,
+		chatResponseTrace: y,
+		chatErrorReason: v,
 		onSendChat: a,
 		scrollIntoView: u,
 		animateEntry: d,
 		isAwaitingResponse: f,
-		attachments: y,
-		attachmentStatuses: g?.attachmentStatuses
+		showLoadingIcon: p,
+		attachments: b,
+		attachmentStatuses: _?.attachmentStatuses
 	});
 }
 //#endregion

package/dist/components/SynapseChat/SynapseChatMessage.js.map

@@ -1 +1 @@
-{"version":3,"file":"SynapseChatMessage.js","names":[],"sources":["../../../src/components/SynapseChat/SynapseChatMessage.tsx"],"sourcesContent":["import SynapseChatInteraction from '@/components/SynapseChat/SynapseChatInteraction'\nimport usePollAsynchronousJob from '@/synapse-queries/asynchronous/usePollAsynchronousJob'\nimport { useGetChatAgentTraceEvents } from '@/synapse-queries/chat/useChat'\nimport {\n  AgentChatRequest,\n  AgentChatResponse,\n} from '@sage-bionetworks/synapse-client'\nimport { TraceEvent } from '@sage-bionetworks/synapse-types'\nimport { useCallback, useEffect, useState } from 'react'\nimport { ChatAttachment } from './utils/types'\n\nfunction useTraceEvent(chatJobId: string | undefined, enabled: boolean) {\n  const [traceEvents, setTraceEvents] = useState<TraceEvent[]>([])\n\n  const appendTraceEvents = useCallback((newEvents: TraceEvent[]) => {\n    setTraceEvents(prev => {\n      return [...prev, ...newEvents]\n    })\n  }, [])\n\n  const latestTraceEvent = traceEvents.at(traceEvents.length - 1)\n  const { data: newTraceEvents } = useGetChatAgentTraceEvents(\n    {\n      jobId: chatJobId ?? '',\n      newerThanTimestamp: latestTraceEvent?.timestamp,\n    },\n    {\n      enabled: enabled,\n      refetchInterval: 1000, // Re-fetch every second if enabled\n      refetchIntervalInBackground: true, // Continue polling even when the tab is not active\n    },\n  )\n  useEffect(() => {\n    if (newTraceEvents && newTraceEvents.page.length > 0) {\n      appendTraceEvents(newTraceEvents.page)\n\n      // send trace events to the console to ease agent debugging\n      // if the trace events do not contain the latest event, add the events to the array\n      console.debug(newTraceEvents.page)\n    }\n  }, [appendTraceEvents, newTraceEvents])\n\n  return {\n    traceEvents,\n  }\n}\n\ntype SynapseChatMessageProps = {\n  agentAvatar: React.ReactNode\n  userAvatar: React.ReactNode\n  /** Known at send time; never re-derived from the polled job so the bubble never renders empty. */\n  userMessage: string\n  /** Undefined until the async job has been registered for this interaction. */\n  chatJobId?: string\n  onSendChat?: (message: string) => void\n  scrollIntoView?: boolean\n  animateEntry?: boolean\n  isAwaitingResponse?: boolean\n  /**\n   * Attachments sent with this message. This information is not available in any API request/response\n   * until the job has finished processing, so this prop is used to optimistically render the attachment\n   * chips in the message bubble until the response arrives.\n   */\n  pendingAttachments?: ChatAttachment[]\n}\n\nexport default function SynapseChatMessage(props: SynapseChatMessageProps) {\n  const {\n    userMessage,\n    chatJobId,\n    onSendChat,\n    agentAvatar,\n    userAvatar,\n    scrollIntoView,\n    animateEntry,\n    isAwaitingResponse,\n    pendingAttachments,\n  } = props\n  const { data: asyncJobStatus } = usePollAsynchronousJob(chatJobId)\n\n  const chatRequest = asyncJobStatus?.requestBody as AgentChatRequest\n  const chatResponse = asyncJobStatus?.responseBody as\n    | AgentChatResponse\n    | undefined\n  const chatError = asyncJobStatus?.errorMessage\n\n  // enabled if the job has been registered and has not finished processing\n  const enableTrace =\n    !!chatJobId &&\n    (!asyncJobStatus?.jobState || asyncJobStatus.jobState == 'PROCESSING')\n  const { traceEvents } = useTraceEvent(chatJobId, enableTrace)\n\n  const attachments =\n    chatRequest?.attachments?.map(attachment => {\n      const fileHandleId = attachment.fileHandleId!\n      const status = chatResponse?.attachmentStatuses?.find(\n        s => s.fileHandleId === fileHandleId,\n      )\n      const pending = pendingAttachments?.find(\n        a => a.fileHandleId === fileHandleId,\n      )\n      // Prefer the server-resolved metadata once the job's response arrives. Fall back to what\n      // was optimistically sent (`pending`) so the chip doesn't lose its filename between the\n      // job being registered and its response arriving.\n      return {\n        fileHandleId,\n        fileName: status?.fileName ?? pending?.fileName,\n        contentType: status?.contentType ?? pending?.contentType,\n      }\n    }) ?? pendingAttachments\n\n  return (\n    <SynapseChatInteraction\n      agentAvatar={agentAvatar}\n      userAvatar={userAvatar}\n      userMessage={userMessage}\n      chatResponseText={chatResponse?.responseText}\n      chatResponseTrace={traceEvents}\n      chatErrorReason={chatError}\n      onSendChat={onSendChat}\n      scrollIntoView={scrollIntoView}\n      animateEntry={animateEntry}\n      isAwaitingResponse={isAwaitingResponse}\n      attachments={attachments}\n      attachmentStatuses={chatResponse?.attachmentStatuses}\n    />\n  )\n}\n"],"mappings":";;;;;;AAWA,SAAS,EAAc,GAA+B,GAAkB;CACtE,IAAM,CAAC,GAAa,KAAkB,EAAuB,CAAC,CAAC,GAEzD,IAAoB,GAAa,MAA4B;EACjE,GAAe,MACN,CAAC,GAAG,GAAM,GAAG,CAAS,CAC9B;CACH,GAAG,CAAC,CAAC,GAEC,IAAmB,EAAY,GAAG,EAAY,SAAS,CAAC,GACxD,EAAE,MAAM,MAAmB,EAC/B;EACE,OAAO,KAAa;EACpB,oBAAoB,GAAkB;CACxC,GACA;EACW;EACT,iBAAiB;EACjB,6BAA6B;CAC/B,CACF;CAWA,OAVA,QAAgB;EACd,AAAI,KAAkB,EAAe,KAAK,SAAS,MACjD,EAAkB,EAAe,IAAI,GAIrC,QAAQ,MAAM,EAAe,IAAI;CAErC,GAAG,CAAC,GAAmB,CAAc,CAAC,GAE/B,EACL,eACF;AACF;AAqBA,SAAwB,EAAmB,GAAgC;CACzE,IAAM,EACJ,gBACA,cACA,eACA,gBACA,eACA,mBACA,iBACA,uBACA,0BACE,GACE,EAAE,MAAM,MAAmB,EAAuB,CAAS,GAE3D,IAAc,GAAgB,aAC9B,IAAe,GAAgB,cAG/B,IAAY,GAAgB,cAM5B,EAAE,mBAAgB,EAAc,GAFpC,CAAC,CAAC,MACD,CAAC,GAAgB,YAAY,EAAe,YAAY,aACC,GAEtD,IACJ,GAAa,aAAa,KAAI,MAAc;EAC1C,IAAM,IAAe,EAAW,cAC1B,IAAS,GAAc,oBAAoB,MAC/C,MAAK,EAAE,iBAAiB,CAC1B,GACM,IAAU,GAAoB,MAClC,MAAK,EAAE,iBAAiB,CAC1B;EAIA,OAAO;GACL;GACA,UAAU,GAAQ,YAAY,GAAS;GACvC,aAAa,GAAQ,eAAe,GAAS;EAC/C;CACF,CAAC,KAAK;CAER,OACE,kBAAC,GAAD;EACe;EACD;EACC;EACb,kBAAkB,GAAc;EAChC,mBAAmB;EACnB,iBAAiB;EACL;EACI;EACF;EACM;EACP;EACb,oBAAoB,GAAc;CACnC,CAAA;AAEL"}
+{"version":3,"file":"SynapseChatMessage.js","names":[],"sources":["../../../src/components/SynapseChat/SynapseChatMessage.tsx"],"sourcesContent":["import SynapseChatInteraction from '@/components/SynapseChat/SynapseChatInteraction'\nimport usePollAsynchronousJob from '@/synapse-queries/asynchronous/usePollAsynchronousJob'\nimport { useGetChatAgentTraceEvents } from '@/synapse-queries/chat/useChat'\nimport {\n  AgentChatRequest,\n  AgentChatResponse,\n} from '@sage-bionetworks/synapse-client'\nimport { TraceEvent } from '@sage-bionetworks/synapse-types'\nimport { useCallback, useEffect, useState } from 'react'\nimport { ChatAttachment } from './utils/types'\n\nfunction useTraceEvent(chatJobId: string | undefined, enabled: boolean) {\n  const [traceEvents, setTraceEvents] = useState<TraceEvent[]>([])\n\n  const appendTraceEvents = useCallback((newEvents: TraceEvent[]) => {\n    setTraceEvents(prev => {\n      return [...prev, ...newEvents]\n    })\n  }, [])\n\n  const latestTraceEvent = traceEvents.at(traceEvents.length - 1)\n  const { data: newTraceEvents } = useGetChatAgentTraceEvents(\n    {\n      jobId: chatJobId ?? '',\n      newerThanTimestamp: latestTraceEvent?.timestamp,\n    },\n    {\n      enabled: enabled,\n      refetchInterval: 1000, // Re-fetch every second if enabled\n      refetchIntervalInBackground: true, // Continue polling even when the tab is not active\n    },\n  )\n  useEffect(() => {\n    if (newTraceEvents && newTraceEvents.page.length > 0) {\n      appendTraceEvents(newTraceEvents.page)\n\n      // send trace events to the console to ease agent debugging\n      // if the trace events do not contain the latest event, add the events to the array\n      console.debug(newTraceEvents.page)\n    }\n  }, [appendTraceEvents, newTraceEvents])\n\n  return {\n    traceEvents,\n  }\n}\n\ntype SynapseChatMessageProps = {\n  agentAvatar: React.ReactNode\n  userAvatar: React.ReactNode\n  /** Known at send time; never re-derived from the polled job so the bubble never renders empty. */\n  userMessage: string\n  /** Undefined until the async job has been registered for this interaction. */\n  chatJobId?: string\n  onSendChat?: (message: string) => void\n  scrollIntoView?: boolean\n  animateEntry?: boolean\n  isAwaitingResponse?: boolean\n  showLoadingIcon?: boolean\n  /**\n   * Attachments sent with this message. This information is not available in any API request/response\n   * until the job has finished processing, so this prop is used to optimistically render the attachment\n   * chips in the message bubble until the response arrives.\n   */\n  pendingAttachments?: ChatAttachment[]\n}\n\nexport default function SynapseChatMessage(props: SynapseChatMessageProps) {\n  const {\n    userMessage,\n    chatJobId,\n    onSendChat,\n    agentAvatar,\n    userAvatar,\n    scrollIntoView,\n    animateEntry,\n    isAwaitingResponse,\n    showLoadingIcon,\n    pendingAttachments,\n  } = props\n  const { data: asyncJobStatus } = usePollAsynchronousJob(chatJobId)\n\n  const chatRequest = asyncJobStatus?.requestBody as AgentChatRequest\n  const chatResponse = asyncJobStatus?.responseBody as\n    | AgentChatResponse\n    | undefined\n  const chatError = asyncJobStatus?.errorMessage\n\n  // enabled if the job has been registered and has not finished processing\n  const enableTrace =\n    !!chatJobId &&\n    (!asyncJobStatus?.jobState || asyncJobStatus.jobState == 'PROCESSING')\n  const { traceEvents } = useTraceEvent(chatJobId, enableTrace)\n\n  const attachments =\n    chatRequest?.attachments?.map(attachment => {\n      const fileHandleId = attachment.fileHandleId!\n      const status = chatResponse?.attachmentStatuses?.find(\n        s => s.fileHandleId === fileHandleId,\n      )\n      const pending = pendingAttachments?.find(\n        a => a.fileHandleId === fileHandleId,\n      )\n      // Prefer the server-resolved metadata once the job's response arrives. Fall back to what\n      // was optimistically sent (`pending`) so the chip doesn't lose its filename between the\n      // job being registered and its response arriving.\n      return {\n        fileHandleId,\n        fileName: status?.fileName ?? pending?.fileName,\n        contentType: status?.contentType ?? pending?.contentType,\n      }\n    }) ?? pendingAttachments\n\n  return (\n    <SynapseChatInteraction\n      agentAvatar={agentAvatar}\n      userAvatar={userAvatar}\n      userMessage={userMessage}\n      chatResponseText={chatResponse?.responseText}\n      chatResponseTrace={traceEvents}\n      chatErrorReason={chatError}\n      onSendChat={onSendChat}\n      scrollIntoView={scrollIntoView}\n      animateEntry={animateEntry}\n      isAwaitingResponse={isAwaitingResponse}\n      showLoadingIcon={showLoadingIcon}\n      attachments={attachments}\n      attachmentStatuses={chatResponse?.attachmentStatuses}\n    />\n  )\n}\n"],"mappings":";;;;;;AAWA,SAAS,EAAc,GAA+B,GAAkB;CACtE,IAAM,CAAC,GAAa,KAAkB,EAAuB,CAAC,CAAC,GAEzD,IAAoB,GAAa,MAA4B;EACjE,GAAe,MACN,CAAC,GAAG,GAAM,GAAG,CAAS,CAC9B;CACH,GAAG,CAAC,CAAC,GAEC,IAAmB,EAAY,GAAG,EAAY,SAAS,CAAC,GACxD,EAAE,MAAM,MAAmB,EAC/B;EACE,OAAO,KAAa;EACpB,oBAAoB,GAAkB;CACxC,GACA;EACW;EACT,iBAAiB;EACjB,6BAA6B;CAC/B,CACF;CAWA,OAVA,QAAgB;EACd,AAAI,KAAkB,EAAe,KAAK,SAAS,MACjD,EAAkB,EAAe,IAAI,GAIrC,QAAQ,MAAM,EAAe,IAAI;CAErC,GAAG,CAAC,GAAmB,CAAc,CAAC,GAE/B,EACL,eACF;AACF;AAsBA,SAAwB,EAAmB,GAAgC;CACzE,IAAM,EACJ,gBACA,cACA,eACA,gBACA,eACA,mBACA,iBACA,uBACA,oBACA,0BACE,GACE,EAAE,MAAM,MAAmB,EAAuB,CAAS,GAE3D,IAAc,GAAgB,aAC9B,IAAe,GAAgB,cAG/B,IAAY,GAAgB,cAM5B,EAAE,mBAAgB,EAAc,GAFpC,CAAC,CAAC,MACD,CAAC,GAAgB,YAAY,EAAe,YAAY,aACC,GAEtD,IACJ,GAAa,aAAa,KAAI,MAAc;EAC1C,IAAM,IAAe,EAAW,cAC1B,IAAS,GAAc,oBAAoB,MAC/C,MAAK,EAAE,iBAAiB,CAC1B,GACM,IAAU,GAAoB,MAClC,MAAK,EAAE,iBAAiB,CAC1B;EAIA,OAAO;GACL;GACA,UAAU,GAAQ,YAAY,GAAS;GACvC,aAAa,GAAQ,eAAe,GAAS;EAC/C;CACF,CAAC,KAAK;CAER,OACE,kBAAC,GAAD;EACe;EACD;EACC;EACb,kBAAkB,GAAc;EAChC,mBAAmB;EACnB,iBAAiB;EACL;EACI;EACF;EACM;EACH;EACJ;EACb,oBAAoB,GAAc;CACnC,CAAA;AAEL"}

package/dist/components/SynapseChat/SynapsePortalChatDialog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SynapsePortalChatDialog.d.ts","sourceRoot":"","sources":["../../../src/components/SynapseChat/SynapsePortalChatDialog.tsx"],"names":[],"mappings":"AACA,OAAoB,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAA;AAE7D,MAAM,MAAM,4BAA4B,GAAG,gBAAgB,GAAG;IAC5D,IAAI,EAAE,OAAO,CAAA;IACb,OAAO,EAAE,MAAM,IAAI,CAAA;CACpB,CAAA;AAED;;;GAGG;AACH,wBAAgB,uBAAuB,CAAC,EACtC,IAAI,EACJ,OAAO,EACP,GAAG,eAAe,EACnB,EAAE,4BAA4B,2CAc9B;AAED,eAAe,uBAAuB,CAAA"}
+{"version":3,"file":"SynapsePortalChatDialog.d.ts","sourceRoot":"","sources":["../../../src/components/SynapseChat/SynapsePortalChatDialog.tsx"],"names":[],"mappings":"AACA,OAAoB,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAA;AAE7D,MAAM,MAAM,4BAA4B,GAAG,gBAAgB,GAAG;IAC5D,IAAI,EAAE,OAAO,CAAA;IACb,OAAO,EAAE,MAAM,IAAI,CAAA;CACpB,CAAA;AAED;;;GAGG;AACH,wBAAgB,uBAAuB,CAAC,EACtC,IAAI,EACJ,OAAO,EACP,GAAG,eAAe,EACnB,EAAE,4BAA4B,2CAgB9B;AAED,eAAe,uBAAuB,CAAA"}

package/dist/components/SynapseChat/SynapsePortalChatDialog.js

@@ -7,12 +7,13 @@ function r({ open: r, onClose: i, ...a }) {
 		open: r,
 		onClose: i,
 		title: a.chatbotName || "SynapseChat",
+		variant: a.variant,
 		children: /* @__PURE__ */ n(e, {
 			hideTitle: !0,
 			textboxPositionOffset: "16px",
 			...a
 		})
-	});
+	}, a.variant);
 }
 //#endregion
 export { r as SynapsePortalChatDialog, r as default };

package/dist/components/SynapseChat/SynapsePortalChatDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"SynapsePortalChatDialog.js","names":[],"sources":["../../../src/components/SynapseChat/SynapsePortalChatDialog.tsx"],"sourcesContent":["import DraggableDialog from '../DraggableDialog/DraggableDialog'\nimport SynapseChat, { SynapseChatProps } from './SynapseChat'\n\nexport type SynapsePortalChatDialogProps = SynapseChatProps & {\n  open: boolean\n  onClose: () => void\n}\n\n/**\n * A dialog that wraps SynapseChat with externally-controlled open/close state.\n * Only shown when the user is logged in and the PORTAL_CHAT feature flag is enabled.\n */\nexport function SynapsePortalChatDialog({\n  open,\n  onClose,\n  ...chatDialogProps\n}: SynapsePortalChatDialogProps) {\n  return (\n    <DraggableDialog\n      open={open}\n      onClose={onClose}\n      title={chatDialogProps.chatbotName || 'SynapseChat'}\n    >\n      <SynapseChat\n        hideTitle={true}\n        textboxPositionOffset=\"16px\"\n        {...chatDialogProps}\n      />\n    </DraggableDialog>\n  )\n}\n\nexport default SynapsePortalChatDialog\n"],"mappings":";;;;AAYA,SAAgB,EAAwB,EACtC,SACA,YACA,GAAG,KAC4B;CAC/B,OACE,kBAAC,GAAD;EACQ;EACG;EACT,OAAO,EAAgB,eAAe;YAEtC,kBAAC,GAAD;GACE,WAAW;GACX,uBAAsB;GACtB,GAAI;EACL,CAAA;CACc,CAAA;AAErB"}
+{"version":3,"file":"SynapsePortalChatDialog.js","names":[],"sources":["../../../src/components/SynapseChat/SynapsePortalChatDialog.tsx"],"sourcesContent":["import DraggableDialog from '../DraggableDialog/DraggableDialog'\nimport SynapseChat, { SynapseChatProps } from './SynapseChat'\n\nexport type SynapsePortalChatDialogProps = SynapseChatProps & {\n  open: boolean\n  onClose: () => void\n}\n\n/**\n * A dialog that wraps SynapseChat with externally-controlled open/close state.\n * Only shown when the user is logged in and the PORTAL_CHAT feature flag is enabled.\n */\nexport function SynapsePortalChatDialog({\n  open,\n  onClose,\n  ...chatDialogProps\n}: SynapsePortalChatDialogProps) {\n  return (\n    <DraggableDialog\n      key={chatDialogProps.variant}\n      open={open}\n      onClose={onClose}\n      title={chatDialogProps.chatbotName || 'SynapseChat'}\n      variant={chatDialogProps.variant}\n    >\n      <SynapseChat\n        hideTitle={true}\n        textboxPositionOffset=\"16px\"\n        {...chatDialogProps}\n      />\n    </DraggableDialog>\n  )\n}\n\nexport default SynapsePortalChatDialog\n"],"mappings":";;;;AAYA,SAAgB,EAAwB,EACtC,SACA,YACA,GAAG,KAC4B;CAC/B,OACE,kBAAC,GAAD;EAEQ;EACG;EACT,OAAO,EAAgB,eAAe;EACtC,SAAS,EAAgB;YAEzB,kBAAC,GAAD;GACE,WAAW;GACX,uBAAsB;GACtB,GAAI;EACL,CAAA;CACc,GAXV,EAAgB,OAWN;AAErB"}

package/dist/components/TanStackTable/TanStackTableUtils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TanStackTableUtils.d.ts","sourceRoot":"","sources":["../../../src/components/TanStackTable/TanStackTableUtils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAA;AAC9C,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAErC,wBAAgB,wBAAwB,CAAC,QAAQ,EAAE,MAAM,UAExD;AAED,wBAAgB,wBAAwB,CAAC,QAAQ,EAAE,MAAM,UAExD;AAID,wBAAgB,sBAAsB,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,CAAC,GAAG,aAAa,CAqBzE"}
+{"version":3,"file":"TanStackTableUtils.d.ts","sourceRoot":"","sources":["../../../src/components/TanStackTable/TanStackTableUtils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAA;AAC9C,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAErC,wBAAgB,wBAAwB,CAAC,QAAQ,EAAE,MAAM,UAExD;AAED,wBAAgB,wBAAwB,CAAC,QAAQ,EAAE,MAAM,UAExD;AAID,wBAAgB,sBAAsB,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,CAAC,GAAG,aAAa,CAsBzE"}

package/dist/components/TanStackTable/TanStackTableUtils.js

@@ -7,16 +7,16 @@ function t(e) {
 }
 function n(e) {
 	let t = e.getIsPinned(), n = t === "left" && e.getIsLastColumn("left"), r = t === "right" && e.getIsFirstColumn("right");
-	return {
-		background: t ? "inherit" : void 0,
+	return t ? {
+		background: "inherit",
 		boxShadow: n ? "-4px 0 4px -4px gray inset" : r ? "4px 0 4px -4px gray inset" : void 0,
 		left: t === "left" ? `${e.getStart("left")}px` : void 0,
 		right: t === "right" ? `${e.getAfter("right")}px` : void 0,
-		opacity: t ? .95 : 1,
-		position: t ? "sticky" : "relative",
+		opacity: .95,
+		position: "sticky",
 		width: e.getSize(),
-		zIndex: +!!t
-	};
+		zIndex: 1
+	} : {};
 }
 //#endregion
 export { e as getColumnSizeCssVariable, n as getCommonPinningStyles, t as getHeaderSizeCssVariable };

package/dist/components/TanStackTable/TanStackTableUtils.js.map

@@ -1 +1 @@
-{"version":3,"file":"TanStackTableUtils.js","names":[],"sources":["../../../src/components/TanStackTable/TanStackTableUtils.ts"],"sourcesContent":["import { Column } from '@tanstack/react-table'\nimport { CSSProperties } from 'react'\n\nexport function getColumnSizeCssVariable(columnId: string) {\n  return `--col-${columnId}-size`\n}\n\nexport function getHeaderSizeCssVariable(headerId: string) {\n  return `--header-${headerId}-size`\n}\n\n// Styles for column pinning, retrieved from TanStack docs examples with very minor modifications\n// See https://tanstack.com/table/v8/docs/framework/react/examples/column-pinning-sticky\nexport function getCommonPinningStyles(column: Column<any>): CSSProperties {\n  const isPinned = column.getIsPinned()\n  const isLastLeftPinnedColumn =\n    isPinned === 'left' && column.getIsLastColumn('left')\n  const isFirstRightPinnedColumn =\n    isPinned === 'right' && column.getIsFirstColumn('right')\n\n  return {\n    background: isPinned ? 'inherit' : undefined,\n    boxShadow: isLastLeftPinnedColumn\n      ? '-4px 0 4px -4px gray inset'\n      : isFirstRightPinnedColumn\n        ? '4px 0 4px -4px gray inset'\n        : undefined,\n    left: isPinned === 'left' ? `${column.getStart('left')}px` : undefined,\n    right: isPinned === 'right' ? `${column.getAfter('right')}px` : undefined,\n    opacity: isPinned ? 0.95 : 1,\n    position: isPinned ? 'sticky' : 'relative',\n    width: column.getSize(),\n    zIndex: isPinned ? 1 : 0,\n  }\n}\n"],"mappings":";AAGA,SAAgB,EAAyB,GAAkB;CACzD,OAAO,SAAS,EAAS;AAC3B;AAEA,SAAgB,EAAyB,GAAkB;CACzD,OAAO,YAAY,EAAS;AAC9B;AAIA,SAAgB,EAAuB,GAAoC;CACzE,IAAM,IAAW,EAAO,YAAY,GAC9B,IACJ,MAAa,UAAU,EAAO,gBAAgB,MAAM,GAChD,IACJ,MAAa,WAAW,EAAO,iBAAiB,OAAO;CAEzD,OAAO;EACL,YAAY,IAAW,YAAY,KAAA;EACnC,WAAW,IACP,+BACA,IACE,8BACA,KAAA;EACN,MAAM,MAAa,SAAS,GAAG,EAAO,SAAS,MAAM,EAAE,MAAM,KAAA;EAC7D,OAAO,MAAa,UAAU,GAAG,EAAO,SAAS,OAAO,EAAE,MAAM,KAAA;EAChE,SAAS,IAAW,MAAO;EAC3B,UAAU,IAAW,WAAW;EAChC,OAAO,EAAO,QAAQ;EACtB,QAAQ;CACV;AACF"}
+{"version":3,"file":"TanStackTableUtils.js","names":[],"sources":["../../../src/components/TanStackTable/TanStackTableUtils.ts"],"sourcesContent":["import { Column } from '@tanstack/react-table'\nimport { CSSProperties } from 'react'\n\nexport function getColumnSizeCssVariable(columnId: string) {\n  return `--col-${columnId}-size`\n}\n\nexport function getHeaderSizeCssVariable(headerId: string) {\n  return `--header-${headerId}-size`\n}\n\n// Styles for column pinning, retrieved from TanStack docs examples with very minor modifications\n// See https://tanstack.com/table/v8/docs/framework/react/examples/column-pinning-sticky\nexport function getCommonPinningStyles(column: Column<any>): CSSProperties {\n  const isPinned = column.getIsPinned()\n  const isLastLeftPinnedColumn =\n    isPinned === 'left' && column.getIsLastColumn('left')\n  const isFirstRightPinnedColumn =\n    isPinned === 'right' && column.getIsFirstColumn('right')\n\n  if (!isPinned) return {}\n  return {\n    background: 'inherit',\n    boxShadow: isLastLeftPinnedColumn\n      ? '-4px 0 4px -4px gray inset'\n      : isFirstRightPinnedColumn\n        ? '4px 0 4px -4px gray inset'\n        : undefined,\n    left: isPinned === 'left' ? `${column.getStart('left')}px` : undefined,\n    right: isPinned === 'right' ? `${column.getAfter('right')}px` : undefined,\n    opacity: 0.95,\n    position: 'sticky',\n    width: column.getSize(),\n    zIndex: 1,\n  }\n}\n"],"mappings":";AAGA,SAAgB,EAAyB,GAAkB;CACzD,OAAO,SAAS,EAAS;AAC3B;AAEA,SAAgB,EAAyB,GAAkB;CACzD,OAAO,YAAY,EAAS;AAC9B;AAIA,SAAgB,EAAuB,GAAoC;CACzE,IAAM,IAAW,EAAO,YAAY,GAC9B,IACJ,MAAa,UAAU,EAAO,gBAAgB,MAAM,GAChD,IACJ,MAAa,WAAW,EAAO,iBAAiB,OAAO;CAGzD,OADK,IACE;EACL,YAAY;EACZ,WAAW,IACP,+BACA,IACE,8BACA,KAAA;EACN,MAAM,MAAa,SAAS,GAAG,EAAO,SAAS,MAAM,EAAE,MAAM,KAAA;EAC7D,OAAO,MAAa,UAAU,GAAG,EAAO,SAAS,OAAO,EAAE,MAAM,KAAA;EAChE,SAAS;EACT,UAAU;EACV,OAAO,EAAO,QAAQ;EACtB,QAAQ;CACV,IAdsB,CAAC;AAezB"}

package/dist/components/dataaccess/AccessRequirementDashboard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AccessRequirementDashboard.d.ts","sourceRoot":"","sources":["../../../src/components/dataaccess/AccessRequirementDashboard.tsx"],"names":[],"mappings":"AAcA,eAAO,MAAM,8BAA8B,aAAa,CAAA;AACxD,eAAO,MAAM,mCAAmC,qBAAqB,CAAA;AACrE,eAAO,MAAM,4BAA4B,eAAe,CAAA;AACxD,eAAO,MAAM,wBAAwB,SAAS,CAAA;AAE9C,MAAM,MAAM,+BAA+B,GAAG;IAC5C,mCAAmC,CAAC,EAAE,MAAM,IAAI,CAAA;CACjD,CAAA;AAED,wBAAgB,0BAA0B,CACxC,KAAK,EAAE,+BAA+B,2CA0MvC;AAED,eAAe,0BAA0B,CAAA"}
+{"version":3,"file":"AccessRequirementDashboard.d.ts","sourceRoot":"","sources":["../../../src/components/dataaccess/AccessRequirementDashboard.tsx"],"names":[],"mappings":"AAcA,eAAO,MAAM,8BAA8B,aAAa,CAAA;AACxD,eAAO,MAAM,mCAAmC,qBAAqB,CAAA;AACrE,eAAO,MAAM,4BAA4B,eAAe,CAAA;AACxD,eAAO,MAAM,wBAAwB,SAAS,CAAA;AAE9C,MAAM,MAAM,+BAA+B,GAAG;IAC5C,mCAAmC,CAAC,EAAE,MAAM,IAAI,CAAA;CACjD,CAAA;AAED,wBAAgB,0BAA0B,CACxC,KAAK,EAAE,+BAA+B,2CA8MvC;AAED,eAAe,0BAA0B,CAAA"}

package/dist/components/dataaccess/AccessRequirementDashboard.js

@@ -7,86 +7,86 @@ import { AccessRequirementTable as a } from "./AccessRequirementTable.js";
 import { useCallback as o, useEffect as s, useMemo as c, useState as l } from "react";
 import { omitBy as u } from "lodash-es";
 import { Grid as d, InputAdornment as f, TextField as p, Typography as m } from "@mui/material";
-import { jsx as h, jsxs as g } from "react/jsx-runtime";
-import { EntityType as _ } from "@sage-bionetworks/synapse-client";
-import { SearchOutlined as v } from "@mui/icons-material";
-import { useLocation as y, useNavigate as b } from "react-router";
-import { useDebouncedState as x } from "@react-hookz/web";
+import { Fragment as h, jsx as g, jsxs as _ } from "react/jsx-runtime";
+import { EntityType as v } from "@sage-bionetworks/synapse-client";
+import { SearchOutlined as y } from "@mui/icons-material";
+import { useLocation as b, useNavigate as x } from "react-router";
+import { useDebouncedState as S } from "@react-hookz/web";
 //#region src/components/dataaccess/AccessRequirementDashboard.tsx
-var S = "nameOrID", C = "relatedProjectId", w = "reviewerId", T = "type";
-function E(E) {
-	let { onCreateNewAccessRequirementClicked: D } = E, O = y(), k = c(() => new URLSearchParams(O.search), [O.search]), A = b(), [j, M] = x(k.get("nameOrID") ?? "", 500), [N, P] = x(k.get("relatedProjectId") ?? void 0, 500), [F, I] = x(k.get("reviewerId") ?? void 0, 500), [L, R] = l(k.get("type") ?? void 0), z = c(() => !!(N && !e.exec(N)), [N]), [B, V] = l(!1);
+var C = "nameOrID", w = "relatedProjectId", T = "reviewerId", E = "type";
+function D(D) {
+	let { onCreateNewAccessRequirementClicked: O } = D, k = b(), A = c(() => new URLSearchParams(k.search), [k.search]), j = x(), [M, N] = S(A.get("nameOrID") ?? "", 500), [P, F] = S(A.get("relatedProjectId") ?? void 0, 500), [I, L] = S(A.get("reviewerId") ?? void 0, 500), [R, z] = l(A.get("type") ?? void 0), B = c(() => !!(P && !e.exec(P)), [P]), [V, H] = l(!1);
 	s(() => {
 		let e = u({
-			[S]: j,
-			[C]: N,
-			[w]: F,
-			[T]: L
+			[C]: M,
+			[w]: P,
+			[T]: I,
+			[E]: R
 		}, (e) => e === void 0 || e === ""), t = new URLSearchParams(e);
-		A({
-			pathname: O.pathname,
+		j({
+			pathname: k.pathname,
 			search: t.toString()
 		}, { replace: !0 });
 	}, [
+		M,
+		P,
+		I,
+		R,
 		j,
-		N,
-		F,
-		L,
-		A,
-		O.pathname
+		k.pathname
 	]);
-	let H = o((e) => {
-		I(e || void 0);
-	}, [I]);
+	let U = o((e) => {
+		L(e || void 0);
+	}, [L]);
 	return /* @__PURE__ */ g("div", {
 		className: "AccessRequirementDashboard",
-		children: [
-			/* @__PURE__ */ h(i, {
+		children: /* @__PURE__ */ _(h, { children: [
+			/* @__PURE__ */ g(i, {
 				configuration: {
 					initialScope: n.ALL_PROJECTS,
 					initialContainer: null,
 					selectMultiple: !1,
-					selectableTypes: [_.project],
+					selectableTypes: [v.project],
 					treeOnly: !0
 				},
-				show: B,
+				show: V,
 				onCancel: () => {
-					V(!1);
+					H(!1);
 				},
 				title: "Select Project to Filter Access Requirements",
 				promptCopy: "Select a project to find Access Requirements that are associated with that project. Access Requirements will be found if the Access Requirement is applied to the project, or if it is applied to any item inside the project.",
 				onConfirm: (e) => {
-					P(e[0].targetId), V(!1);
+					F(e[0].targetId), H(!1);
 				},
 				confirmButtonCopy: "Select"
 			}),
-			/* @__PURE__ */ g(d, {
+			/* @__PURE__ */ _(d, {
 				component: "form",
 				container: !0,
 				spacing: 2,
 				className: "InputPanel",
 				children: [
-					/* @__PURE__ */ h(d, {
+					/* @__PURE__ */ g(d, {
 						size: {
 							xs: 12,
 							md: 4
 						},
-						children: /* @__PURE__ */ h(p, {
+						children: /* @__PURE__ */ g(p, {
 							label: "Filter by Access Requirement Name or ID",
 							id: "ar-name-filter",
 							type: "text",
 							fullWidth: !0,
 							placeholder: "Search for an Access Requirement Name or ID",
 							onChange: (e) => {
-								M(e.target.value);
+								N(e.target.value);
 							},
-							slotProps: { input: { endAdornment: /* @__PURE__ */ h(f, {
+							slotProps: { input: { endAdornment: /* @__PURE__ */ g(f, {
 								position: "end",
-								children: /* @__PURE__ */ h(v, {})
+								children: /* @__PURE__ */ g(y, {})
 							}) } }
 						})
 					}),
-					/* @__PURE__ */ g(d, {
+					/* @__PURE__ */ _(d, {
 						size: {
 							xs: 12,
 							md: 4
@@ -96,58 +96,58 @@ function E(E) {
 							gap: "5px",
 							alignItems: "stretch"
 						},
-						children: [/* @__PURE__ */ h(p, {
+						children: [/* @__PURE__ */ g(p, {
 							label: "Filter by Project",
 							id: "project-id-filter",
 							type: "text",
 							fullWidth: !0,
 							placeholder: "Enter a project SynID",
-							error: z,
-							helperText: z ? "Value must be a Synapse ID, e.g. \"syn1234\"" : void 0,
+							error: B,
+							helperText: B ? "Value must be a Synapse ID, e.g. \"syn1234\"" : void 0,
 							onChange: (e) => {
 								let t = e.target.value;
-								P(t === "" ? void 0 : t);
+								F(t === "" ? void 0 : t);
 							}
-						}), /* @__PURE__ */ h(r, {
+						}), /* @__PURE__ */ g(r, {
 							variant: "outlined",
 							color: "primary",
 							onClick: () => {
-								V(!0);
+								H(!0);
 							},
 							children: "Browse"
 						})]
 					}),
-					/* @__PURE__ */ g(d, {
+					/* @__PURE__ */ _(d, {
 						size: {
 							xs: 12,
 							md: 4
 						},
-						children: [/* @__PURE__ */ h(m, {
+						children: [/* @__PURE__ */ g(m, {
 							component: "label",
 							variant: "smallText2",
 							htmlFor: "reviewer-filter",
 							children: "Filter by Reviewer"
-						}), /* @__PURE__ */ h(t, {
+						}), /* @__PURE__ */ g(t, {
 							inputId: "reviewer-filter",
 							placeholder: "Search for a username or team name",
-							defaultValue: F,
-							onChange: H
+							defaultValue: I,
+							onChange: U
 						})]
 					})
 				]
 			}),
-			/* @__PURE__ */ h(a, {
-				nameOrID: j,
-				relatedProjectId: N,
-				reviewerId: F,
-				onCreateNewAccessRequirementClicked: D,
-				typeFilter: L,
-				onTypeFilterChange: R
+			/* @__PURE__ */ g(a, {
+				nameOrID: M,
+				relatedProjectId: P,
+				reviewerId: I,
+				onCreateNewAccessRequirementClicked: O,
+				typeFilter: R,
+				onTypeFilterChange: z
 			})
-		]
+		] })
 	});
 }
 //#endregion
-export { S as AR_NAME_OR_ID_SEARCH_PARAM_KEY, T as AR_TYPE_SEARCH_PARAM_KEY, E as AccessRequirementDashboard, E as default, C as RELATED_PROJECT_ID_SEARCH_PARAM_KEY, w as REVIEWER_ID_SEARCH_PARAM_KEY };
+export { C as AR_NAME_OR_ID_SEARCH_PARAM_KEY, E as AR_TYPE_SEARCH_PARAM_KEY, D as AccessRequirementDashboard, D as default, w as RELATED_PROJECT_ID_SEARCH_PARAM_KEY, T as REVIEWER_ID_SEARCH_PARAM_KEY };
 
 //# sourceMappingURL=AccessRequirementDashboard.js.map

package/dist/components/dataaccess/AccessRequirementDashboard.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccessRequirementDashboard.js","names":[],"sources":["../../../src/components/dataaccess/AccessRequirementDashboard.tsx"],"sourcesContent":["import { InputSizedButton } from '@/components/styled/InputSizedButton'\nimport { SYNAPSE_ENTITY_ID_REGEX } from '@/utils/functions/RegularExpressions'\nimport { SearchOutlined } from '@mui/icons-material'\nimport { Grid, InputAdornment, TextField, Typography } from '@mui/material'\nimport { useDebouncedState } from '@react-hookz/web'\nimport { EntityType } from '@sage-bionetworks/synapse-client'\nimport { omitBy } from 'lodash-es'\nimport { useCallback, useEffect, useMemo, useState } from 'react'\nimport { useLocation, useNavigate } from 'react-router'\nimport { EntityFinderModal } from '../EntityFinder/EntityFinderModal'\nimport { FinderScope } from '../EntityFinder/tree/EntityTree'\nimport UserSearchBox from '../UserSearchBox/UserSearchBox'\nimport { AccessRequirementTable } from './AccessRequirementTable'\n\nexport const AR_NAME_OR_ID_SEARCH_PARAM_KEY = 'nameOrID'\nexport const RELATED_PROJECT_ID_SEARCH_PARAM_KEY = 'relatedProjectId'\nexport const REVIEWER_ID_SEARCH_PARAM_KEY = 'reviewerId'\nexport const AR_TYPE_SEARCH_PARAM_KEY = 'type'\n\nexport type AccessRequirementDashboardProps = {\n  onCreateNewAccessRequirementClicked?: () => void\n}\n\nexport function AccessRequirementDashboard(\n  props: AccessRequirementDashboardProps,\n) {\n  // Amount of time to wait after an input value changes before sending a new request\n  const INPUT_CHANGE_DEBOUNCE_DELAY_MS = 500\n\n  const { onCreateNewAccessRequirementClicked } = props\n\n  const location = useLocation()\n  const urlSearchParams = useMemo(\n    () => new URLSearchParams(location.search),\n    [location.search],\n  )\n  const navigate = useNavigate()\n\n  /**\n   * When an input changes, update the props passed to the table and update the search params.\n   *\n   * Debounced to prevent firing many queries while the user is entering text.\n   */\n  const [nameOrID, setNameOrID] = useDebouncedState<string>(\n    urlSearchParams.get(AR_NAME_OR_ID_SEARCH_PARAM_KEY) ?? '',\n    INPUT_CHANGE_DEBOUNCE_DELAY_MS,\n  )\n  const [relatedProjectId, setRelatedProjectId] = useDebouncedState<\n    string | undefined\n  >(\n    urlSearchParams.get(RELATED_PROJECT_ID_SEARCH_PARAM_KEY) ?? undefined,\n    INPUT_CHANGE_DEBOUNCE_DELAY_MS,\n  )\n  const [reviewerId, setReviewerId] = useDebouncedState<string | undefined>(\n    urlSearchParams.get(REVIEWER_ID_SEARCH_PARAM_KEY) ?? undefined,\n    INPUT_CHANGE_DEBOUNCE_DELAY_MS,\n  )\n  const [typeFilter, setTypeFilter] = useState<string | undefined>(\n    urlSearchParams.get(AR_TYPE_SEARCH_PARAM_KEY) ?? undefined,\n  )\n\n  const projectFilterFieldIsError: boolean = useMemo(\n    () =>\n      !!(relatedProjectId && !SYNAPSE_ENTITY_ID_REGEX.exec(relatedProjectId)),\n    [relatedProjectId],\n  )\n\n  const [showEntityFinder, setShowEntityFinder] = useState(false)\n\n  // Update the QueryParams when the filter state changes\n  useEffect(() => {\n    // Don't include undefined/empty parameters\n    const params = omitBy(\n      {\n        // Sync the search params state with the debounced props\n        [AR_NAME_OR_ID_SEARCH_PARAM_KEY]: nameOrID,\n        [RELATED_PROJECT_ID_SEARCH_PARAM_KEY]: relatedProjectId,\n        [REVIEWER_ID_SEARCH_PARAM_KEY]: reviewerId,\n        [AR_TYPE_SEARCH_PARAM_KEY]: typeFilter, // typeFilter state is not debounced\n      },\n      item => item === undefined || item === '',\n    ) as Record<string, string>\n\n    // Add the new params to the URL\n    // Replace history because intuitively, the user has not navigated to a new page\n    const paramsObject = new URLSearchParams(params)\n    navigate(\n      {\n        pathname: location.pathname,\n        search: paramsObject.toString(),\n      },\n      { replace: true },\n    )\n  }, [\n    nameOrID,\n    relatedProjectId,\n    reviewerId,\n    typeFilter,\n    navigate,\n    location.pathname,\n  ])\n\n  const onReviewerChange = useCallback(\n    (selected: string | null) => {\n      if (selected) {\n        setReviewerId(selected)\n      } else {\n        setReviewerId(undefined)\n      }\n    },\n    [setReviewerId],\n  )\n\n  return (\n    <div className=\"AccessRequirementDashboard\">\n      <EntityFinderModal\n        configuration={{\n          initialScope: FinderScope.ALL_PROJECTS,\n          initialContainer: null,\n          selectMultiple: false,\n          selectableTypes: [EntityType.project],\n          treeOnly: true,\n        }}\n        show={showEntityFinder}\n        onCancel={() => {\n          setShowEntityFinder(false)\n        }}\n        title={'Select Project to Filter Access Requirements'}\n        promptCopy={\n          'Select a project to find Access Requirements that are associated with that project. Access Requirements will be found if the Access Requirement is applied to the project, or if it is applied to any item inside the project.'\n        }\n        onConfirm={selected => {\n          setRelatedProjectId(selected[0].targetId)\n          setShowEntityFinder(false)\n        }}\n        confirmButtonCopy={'Select'}\n      />\n      <Grid component={'form'} container spacing={2} className=\"InputPanel\">\n        <Grid size={{ xs: 12, md: 4 }}>\n          <TextField\n            label=\"Filter by Access Requirement Name or ID\"\n            id=\"ar-name-filter\"\n            type=\"text\"\n            fullWidth\n            placeholder=\"Search for an Access Requirement Name or ID\"\n            onChange={e => {\n              setNameOrID(e.target.value)\n            }}\n            slotProps={{\n              input: {\n                endAdornment: (\n                  <InputAdornment position=\"end\">\n                    <SearchOutlined />\n                  </InputAdornment>\n                ),\n              },\n            }}\n          />\n        </Grid>\n        <Grid\n          size={{ xs: 12, md: 4 }}\n          sx={{\n            display: 'flex',\n            gap: '5px',\n            alignItems: 'stretch',\n          }}\n        >\n          <TextField\n            label=\"Filter by Project\"\n            id=\"project-id-filter\"\n            type=\"text\"\n            fullWidth\n            placeholder=\"Enter a project SynID\"\n            error={projectFilterFieldIsError}\n            helperText={\n              projectFilterFieldIsError\n                ? 'Value must be a Synapse ID, e.g. \"syn1234\"'\n                : undefined\n            }\n            onChange={e => {\n              const newValue = e.target.value\n              if (newValue === '') {\n                setRelatedProjectId(undefined)\n              } else {\n                setRelatedProjectId(newValue)\n              }\n            }}\n          />\n          <InputSizedButton\n            variant=\"outlined\"\n            color=\"primary\"\n            onClick={() => {\n              setShowEntityFinder(true)\n            }}\n          >\n            Browse\n          </InputSizedButton>\n        </Grid>\n        <Grid size={{ xs: 12, md: 4 }}>\n          <Typography\n            component=\"label\"\n            variant=\"smallText2\"\n            htmlFor=\"reviewer-filter\"\n          >\n            Filter by Reviewer\n          </Typography>\n          <UserSearchBox\n            inputId=\"reviewer-filter\"\n            placeholder=\"Search for a username or team name\"\n            defaultValue={reviewerId}\n            onChange={onReviewerChange}\n          />\n        </Grid>\n      </Grid>\n      <AccessRequirementTable\n        nameOrID={nameOrID}\n        relatedProjectId={relatedProjectId}\n        reviewerId={reviewerId}\n        onCreateNewAccessRequirementClicked={\n          onCreateNewAccessRequirementClicked\n        }\n        typeFilter={typeFilter}\n        onTypeFilterChange={setTypeFilter}\n      />\n    </div>\n  )\n}\n\nexport default AccessRequirementDashboard\n"],"mappings":"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"}
+{"version":3,"file":"AccessRequirementDashboard.js","names":[],"sources":["../../../src/components/dataaccess/AccessRequirementDashboard.tsx"],"sourcesContent":["import { InputSizedButton } from '@/components/styled/InputSizedButton'\nimport { SYNAPSE_ENTITY_ID_REGEX } from '@/utils/functions/RegularExpressions'\nimport { SearchOutlined } from '@mui/icons-material'\nimport { Grid, InputAdornment, TextField, Typography } from '@mui/material'\nimport { useDebouncedState } from '@react-hookz/web'\nimport { EntityType } from '@sage-bionetworks/synapse-client'\nimport { omitBy } from 'lodash-es'\nimport { useCallback, useEffect, useMemo, useState } from 'react'\nimport { useLocation, useNavigate } from 'react-router'\nimport { EntityFinderModal } from '../EntityFinder/EntityFinderModal'\nimport { FinderScope } from '../EntityFinder/tree/EntityTree'\nimport UserSearchBox from '../UserSearchBox/UserSearchBox'\nimport { AccessRequirementTable } from './AccessRequirementTable'\n\nexport const AR_NAME_OR_ID_SEARCH_PARAM_KEY = 'nameOrID'\nexport const RELATED_PROJECT_ID_SEARCH_PARAM_KEY = 'relatedProjectId'\nexport const REVIEWER_ID_SEARCH_PARAM_KEY = 'reviewerId'\nexport const AR_TYPE_SEARCH_PARAM_KEY = 'type'\n\nexport type AccessRequirementDashboardProps = {\n  onCreateNewAccessRequirementClicked?: () => void\n}\n\nexport function AccessRequirementDashboard(\n  props: AccessRequirementDashboardProps,\n) {\n  // Amount of time to wait after an input value changes before sending a new request\n  const INPUT_CHANGE_DEBOUNCE_DELAY_MS = 500\n\n  const { onCreateNewAccessRequirementClicked } = props\n\n  const location = useLocation()\n  const urlSearchParams = useMemo(\n    () => new URLSearchParams(location.search),\n    [location.search],\n  )\n  const navigate = useNavigate()\n\n  /**\n   * When an input changes, update the props passed to the table and update the search params.\n   *\n   * Debounced to prevent firing many queries while the user is entering text.\n   */\n  const [nameOrID, setNameOrID] = useDebouncedState<string>(\n    urlSearchParams.get(AR_NAME_OR_ID_SEARCH_PARAM_KEY) ?? '',\n    INPUT_CHANGE_DEBOUNCE_DELAY_MS,\n  )\n  const [relatedProjectId, setRelatedProjectId] = useDebouncedState<\n    string | undefined\n  >(\n    urlSearchParams.get(RELATED_PROJECT_ID_SEARCH_PARAM_KEY) ?? undefined,\n    INPUT_CHANGE_DEBOUNCE_DELAY_MS,\n  )\n  const [reviewerId, setReviewerId] = useDebouncedState<string | undefined>(\n    urlSearchParams.get(REVIEWER_ID_SEARCH_PARAM_KEY) ?? undefined,\n    INPUT_CHANGE_DEBOUNCE_DELAY_MS,\n  )\n  const [typeFilter, setTypeFilter] = useState<string | undefined>(\n    urlSearchParams.get(AR_TYPE_SEARCH_PARAM_KEY) ?? undefined,\n  )\n\n  const projectFilterFieldIsError: boolean = useMemo(\n    () =>\n      !!(relatedProjectId && !SYNAPSE_ENTITY_ID_REGEX.exec(relatedProjectId)),\n    [relatedProjectId],\n  )\n\n  const [showEntityFinder, setShowEntityFinder] = useState(false)\n\n  // Update the QueryParams when the filter state changes\n  useEffect(() => {\n    // Don't include undefined/empty parameters\n    const params = omitBy(\n      {\n        // Sync the search params state with the debounced props\n        [AR_NAME_OR_ID_SEARCH_PARAM_KEY]: nameOrID,\n        [RELATED_PROJECT_ID_SEARCH_PARAM_KEY]: relatedProjectId,\n        [REVIEWER_ID_SEARCH_PARAM_KEY]: reviewerId,\n        [AR_TYPE_SEARCH_PARAM_KEY]: typeFilter, // typeFilter state is not debounced\n      },\n      item => item === undefined || item === '',\n    ) as Record<string, string>\n\n    // Add the new params to the URL\n    // Replace history because intuitively, the user has not navigated to a new page\n    const paramsObject = new URLSearchParams(params)\n    navigate(\n      {\n        pathname: location.pathname,\n        search: paramsObject.toString(),\n      },\n      { replace: true },\n    )\n  }, [\n    nameOrID,\n    relatedProjectId,\n    reviewerId,\n    typeFilter,\n    navigate,\n    location.pathname,\n  ])\n\n  const onReviewerChange = useCallback(\n    (selected: string | null) => {\n      if (selected) {\n        setReviewerId(selected)\n      } else {\n        setReviewerId(undefined)\n      }\n    },\n    [setReviewerId],\n  )\n\n  const accessRequirementsPanel = (\n    <>\n      <EntityFinderModal\n        configuration={{\n          initialScope: FinderScope.ALL_PROJECTS,\n          initialContainer: null,\n          selectMultiple: false,\n          selectableTypes: [EntityType.project],\n          treeOnly: true,\n        }}\n        show={showEntityFinder}\n        onCancel={() => {\n          setShowEntityFinder(false)\n        }}\n        title={'Select Project to Filter Access Requirements'}\n        promptCopy={\n          'Select a project to find Access Requirements that are associated with that project. Access Requirements will be found if the Access Requirement is applied to the project, or if it is applied to any item inside the project.'\n        }\n        onConfirm={selected => {\n          setRelatedProjectId(selected[0].targetId)\n          setShowEntityFinder(false)\n        }}\n        confirmButtonCopy={'Select'}\n      />\n      <Grid component={'form'} container spacing={2} className=\"InputPanel\">\n        <Grid size={{ xs: 12, md: 4 }}>\n          <TextField\n            label=\"Filter by Access Requirement Name or ID\"\n            id=\"ar-name-filter\"\n            type=\"text\"\n            fullWidth\n            placeholder=\"Search for an Access Requirement Name or ID\"\n            onChange={e => {\n              setNameOrID(e.target.value)\n            }}\n            slotProps={{\n              input: {\n                endAdornment: (\n                  <InputAdornment position=\"end\">\n                    <SearchOutlined />\n                  </InputAdornment>\n                ),\n              },\n            }}\n          />\n        </Grid>\n        <Grid\n          size={{ xs: 12, md: 4 }}\n          sx={{\n            display: 'flex',\n            gap: '5px',\n            alignItems: 'stretch',\n          }}\n        >\n          <TextField\n            label=\"Filter by Project\"\n            id=\"project-id-filter\"\n            type=\"text\"\n            fullWidth\n            placeholder=\"Enter a project SynID\"\n            error={projectFilterFieldIsError}\n            helperText={\n              projectFilterFieldIsError\n                ? 'Value must be a Synapse ID, e.g. \"syn1234\"'\n                : undefined\n            }\n            onChange={e => {\n              const newValue = e.target.value\n              if (newValue === '') {\n                setRelatedProjectId(undefined)\n              } else {\n                setRelatedProjectId(newValue)\n              }\n            }}\n          />\n          <InputSizedButton\n            variant=\"outlined\"\n            color=\"primary\"\n            onClick={() => {\n              setShowEntityFinder(true)\n            }}\n          >\n            Browse\n          </InputSizedButton>\n        </Grid>\n        <Grid size={{ xs: 12, md: 4 }}>\n          <Typography\n            component=\"label\"\n            variant=\"smallText2\"\n            htmlFor=\"reviewer-filter\"\n          >\n            Filter by Reviewer\n          </Typography>\n          <UserSearchBox\n            inputId=\"reviewer-filter\"\n            placeholder=\"Search for a username or team name\"\n            defaultValue={reviewerId}\n            onChange={onReviewerChange}\n          />\n        </Grid>\n      </Grid>\n      <AccessRequirementTable\n        nameOrID={nameOrID}\n        relatedProjectId={relatedProjectId}\n        reviewerId={reviewerId}\n        onCreateNewAccessRequirementClicked={\n          onCreateNewAccessRequirementClicked\n        }\n        typeFilter={typeFilter}\n        onTypeFilterChange={setTypeFilter}\n      />\n    </>\n  )\n\n  return (\n    <div className=\"AccessRequirementDashboard\">{accessRequirementsPanel}</div>\n  )\n}\n\nexport default AccessRequirementDashboard\n"],"mappings":"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"}

package/dist/components/dataaccess/EDucTemplateTable.d.ts

@@ -0,0 +1,3 @@
+export declare function EDucTemplateTable(): import("react/jsx-runtime").JSX.Element;
+export default EDucTemplateTable;
+//# sourceMappingURL=EDucTemplateTable.d.ts.map

package/dist/components/dataaccess/EDucTemplateTable.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EDucTemplateTable.d.ts","sourceRoot":"","sources":["../../../src/components/dataaccess/EDucTemplateTable.tsx"],"names":[],"mappings":"AAiKA,wBAAgB,iBAAiB,4CAuEhC;AAED,eAAe,iBAAiB,CAAA"}

package/dist/components/dataaccess/EDucTemplateTable.js

@@ -0,0 +1,213 @@
+import { SynapseSpinner as e } from "../LoadingScreen/LoadingScreen.js";
+import { useGetEDucTemplateValidation as t, useListEDucTemplates as n } from "../../synapse-queries/dataaccess/useEDuc.js";
+import "../../synapse-queries/index.js";
+import { formatDate as r } from "../../utils/functions/DateFormatter.js";
+import i from "../TanStackTable/StyledTanStackTable.js";
+import a from "../TanStackTable/ColumnHeader.js";
+import { useEffect as o, useMemo as s, useState as c } from "react";
+import { Alert as l, Box as u, Button as d, IconButton as f, Skeleton as p, Tooltip as m, Typography as h } from "@mui/material";
+import { jsx as g, jsxs as _ } from "react/jsx-runtime";
+import { CheckCircleTwoTone as v, ErrorTwoTone as y, Replay as b } from "@mui/icons-material";
+import x from "dayjs";
+import { createColumnHelper as S, getCoreRowModel as C, useReactTable as w } from "@tanstack/react-table";
+//#region src/components/dataaccess/EDucTemplateTable.tsx
+var T = S(), E = [
+	T.accessor("name", {
+		header: (e) => /* @__PURE__ */ g(a, {
+			...e,
+			title: "Name"
+		}),
+		cell: ({ getValue: e }) => e() ?? "",
+		enableSorting: !1,
+		enableColumnFilter: !1
+	}),
+	T.accessor("description", {
+		header: (e) => /* @__PURE__ */ g(a, {
+			...e,
+			title: "Description"
+		}),
+		cell: ({ getValue: e }) => e() ?? "",
+		enableSorting: !1,
+		enableColumnFilter: !1
+	}),
+	T.accessor("createdOn", {
+		header: (e) => /* @__PURE__ */ g(a, {
+			...e,
+			title: "Created on"
+		}),
+		cell: ({ getValue: e }) => {
+			let t = e();
+			return t ? r(x(t)) : "";
+		},
+		enableSorting: !1,
+		enableColumnFilter: !1
+	}),
+	T.accessor("modifiedOn", {
+		header: (e) => /* @__PURE__ */ g(a, {
+			...e,
+			title: "Modified on"
+		}),
+		cell: ({ getValue: e }) => {
+			let t = e();
+			return t ? r(x(t)) : "";
+		},
+		enableSorting: !1,
+		enableColumnFilter: !1
+	}),
+	T.display({
+		id: "validation",
+		header: (e) => /* @__PURE__ */ g(a, {
+			...e,
+			title: "Validation status"
+		}),
+		cell: ({ row: e }) => /* @__PURE__ */ g(D, { templateId: e.original.templateId })
+	})
+];
+function D(n) {
+	let { templateId: r } = n, [i, a] = c(!1), { data: o, error: s, isFetching: l, refetch: p } = t(r ?? "", { enabled: i && !!r });
+	return r ? i ? l ? /* @__PURE__ */ g(u, {
+		sx: {
+			display: "inline-flex",
+			alignItems: "center"
+		},
+		children: /* @__PURE__ */ g(e, { size: 16 })
+	}) : s ? /* @__PURE__ */ _(u, {
+		sx: {
+			display: "inline-flex",
+			alignItems: "center",
+			gap: .5
+		},
+		children: [
+			/* @__PURE__ */ g(y, {
+				color: "error",
+				fontSize: "small"
+			}),
+			/* @__PURE__ */ g(h, {
+				variant: "smallText1",
+				sx: { color: "error.main" },
+				children: s.reason
+			}),
+			/* @__PURE__ */ g(m, {
+				title: "Re-validate",
+				children: /* @__PURE__ */ g(f, {
+					size: "small",
+					onClick: () => {
+						p();
+					},
+					"aria-label": "Re-validate",
+					children: /* @__PURE__ */ g(b, { fontSize: "small" })
+				})
+			})
+		]
+	}) : o?.isValid ? /* @__PURE__ */ _(u, {
+		sx: {
+			display: "inline-flex",
+			alignItems: "center",
+			gap: .5
+		},
+		children: [
+			/* @__PURE__ */ g(v, {
+				color: "success",
+				fontSize: "small"
+			}),
+			/* @__PURE__ */ g(h, {
+				variant: "smallText1",
+				children: "Valid"
+			}),
+			/* @__PURE__ */ g(m, {
+				title: "Re-validate",
+				children: /* @__PURE__ */ g(f, {
+					size: "small",
+					onClick: () => {
+						p();
+					},
+					"aria-label": "Re-validate",
+					children: /* @__PURE__ */ g(b, { fontSize: "small" })
+				})
+			})
+		]
+	}) : /* @__PURE__ */ _(u, {
+		sx: {
+			display: "inline-flex",
+			alignItems: "center",
+			gap: .5
+		},
+		children: [
+			/* @__PURE__ */ g(y, {
+				color: "error",
+				fontSize: "small"
+			}),
+			/* @__PURE__ */ g(h, {
+				variant: "smallText1",
+				sx: { color: "error.main" },
+				children: o?.reason ?? "Invalid"
+			}),
+			/* @__PURE__ */ g(m, {
+				title: "Re-validate",
+				children: /* @__PURE__ */ g(f, {
+					size: "small",
+					onClick: () => {
+						p();
+					},
+					"aria-label": "Re-validate",
+					children: /* @__PURE__ */ g(b, { fontSize: "small" })
+				})
+			})
+		]
+	}) : /* @__PURE__ */ g(d, {
+		variant: "outlined",
+		size: "small",
+		onClick: () => a(!0),
+		children: "Validate"
+	}) : null;
+}
+function O() {
+	let { data: e, isLoading: t, error: r, hasNextPage: a, fetchNextPage: c, isFetchingNextPage: d } = n();
+	o(() => {
+		a && !d && c();
+	}, [
+		a,
+		d,
+		c
+	]);
+	let f = s(() => e?.pages.flatMap((e) => e.results ?? []) ?? [], [e]), m = w({
+		data: f,
+		columns: E,
+		getCoreRowModel: C(),
+		getRowId: (e) => e.templateId ?? ""
+	});
+	return t || a && f.length === 0 ? /* @__PURE__ */ g(u, { children: /* @__PURE__ */ g(p, {
+		variant: "rectangular",
+		height: 200,
+		"data-testid": "EDucTemplateTable-loading"
+	}) }) : r ? /* @__PURE__ */ _(l, {
+		severity: "error",
+		children: [
+			/* @__PURE__ */ g("strong", { children: "Sorry, we couldn't load the eDUC templates." }),
+			/* @__PURE__ */ g("br", {}),
+			r.reason
+		]
+	}) : f.length === 0 ? /* @__PURE__ */ g(l, {
+		severity: "info",
+		children: "No eDUC templates are registered in DocuSign."
+	}) : /* @__PURE__ */ _(u, { children: [/* @__PURE__ */ _(h, {
+		variant: "body1",
+		sx: {
+			mb: 2,
+			color: "grey.700"
+		},
+		children: [
+			"Templates are managed in DocuSign. Use the ",
+			/* @__PURE__ */ g("strong", { children: "Validate" }),
+			" ",
+			"action to check whether a template meets Synapse's eDUC requirements."
+		]
+	}), /* @__PURE__ */ g(i, {
+		table: m,
+		styledTableContainerProps: { sx: { my: 2 } }
+	})] });
+}
+//#endregion
+export { O as EDucTemplateTable, O as default };
+
+//# sourceMappingURL=EDucTemplateTable.js.map