synapse-react-client 4.0.2 → 4.0.4

package/dist/components/Evaluation/EvaluationRoundEditor.js

@@ -1,49 +1,50 @@
 import { jsx as t, jsxs as h } from "react/jsx-runtime";
-import { updateEvaluationRound as K, createEvaluationRound as W, deleteEvaluationRound as Y } from "../../synapse-client/SynapseClient.js";
-import { useSynapseContext as $ } from "../../utils/context/SynapseContext.js";
-import { useListState as q } from "../../utils/hooks/useListState.js";
-import { Card as Q, CardContent as V, Box as u, Grid as v, TextField as X, Button as N, Alert as Z } from "@mui/material";
-import l from "dayjs";
-import _ from "dayjs/plugin/isSameOrAfter";
-import I from "dayjs/plugin/utc";
-import { upperFirst as ee } from "lodash-es";
-import { useState as c, useEffect as te } from "react";
-import C from "../DateTimePicker/DateTimePicker.js";
-import { ErrorBanner as re } from "../error/ErrorBanner.js";
-import se from "../IconSvg/IconSvg.js";
-import { EvaluationRoundEditorDropdown as ie } from "./EvaluationRoundEditorDropdown.js";
-import { convertEvaluationRoundToInput as oe } from "./input_models/models.js";
-import { EvaluationRoundLimitOptionsList as ne } from "./round_limits/EvaluationRoundLimitOptionsList.js";
-l.extend(I);
-l.extend(_);
-const ae = (e) => {
-  const a = e.startOf("day");
-  return (i) => i.isSameOrAfter(a);
-}, A = (e, a) => {
-  let i, s, o;
-  const n = l();
-  return n.isSameOrAfter(e) ? n.isBefore(a) ? (i = "status-in-progress", s = { icon: "sync" }, o = "IN PROGRESS") : (i = "status-completed", s = { icon: "clipboardCheck" }, o = "COMPLETED") : (i = "status-not-yet-started", s = void 0, o = "NOT YET STARTED"), /* @__PURE__ */ t("div", { className: i, children: /* @__PURE__ */ h("div", { className: "status", children: [
-    s && /* @__PURE__ */ t(se, { ...s }),
-    /* @__PURE__ */ t("span", { children: o })
+import { updateEvaluationRound as Q, createEvaluationRound as V, deleteEvaluationRound as X } from "../../synapse-client/SynapseClient.js";
+import { useGlobalIsEditingContext as Z } from "../../utils/context/GlobalIsEditingContext.js";
+import { useSynapseContext as _ } from "../../utils/context/SynapseContext.js";
+import { useListState as ee } from "../../utils/hooks/useListState.js";
+import { Card as te, CardContent as re, Box as u, Grid as b, TextField as se, Button as N, Alert as ie } from "@mui/material";
+import c from "dayjs";
+import ne from "dayjs/plugin/isSameOrAfter";
+import oe from "dayjs/plugin/utc";
+import { upperFirst as ae } from "lodash-es";
+import { useState as l, useEffect as A } from "react";
+import O from "../DateTimePicker/DateTimePicker.js";
+import { ErrorBanner as de } from "../error/ErrorBanner.js";
+import le from "../IconSvg/IconSvg.js";
+import { EvaluationRoundEditorDropdown as ce } from "./EvaluationRoundEditorDropdown.js";
+import { convertEvaluationRoundToInput as me } from "./input_models/models.js";
+import { EvaluationRoundLimitOptionsList as ue } from "./round_limits/EvaluationRoundLimitOptionsList.js";
+c.extend(oe);
+c.extend(ne);
+const he = (e) => {
+  const o = e.startOf("day");
+  return (n) => n.isSameOrAfter(o);
+}, B = (e, o) => {
+  let n, i, a;
+  const d = c();
+  return d.isSameOrAfter(e) ? d.isBefore(o) ? (n = "status-in-progress", i = { icon: "sync" }, a = "IN PROGRESS") : (n = "status-completed", i = { icon: "clipboardCheck" }, a = "COMPLETED") : (n = "status-not-yet-started", i = void 0, a = "NOT YET STARTED"), /* @__PURE__ */ t("div", { className: n, children: /* @__PURE__ */ h("div", { className: "status", children: [
+    i && /* @__PURE__ */ t(le, { ...i }),
+    /* @__PURE__ */ t("span", { children: a })
   ] }) });
-}, O = (e, a, i, s, o) => {
-  const n = [];
-  if (s) {
-    const d = Number(s);
-    if (Number.isNaN(d))
+}, P = (e, o, n, i, a) => {
+  const d = [];
+  if (i) {
+    const s = Number(i);
+    if (Number.isNaN(s))
       throw TypeError("Total Submission is not an integer");
-    n.push({
+    d.push({
       limitType: "TOTAL",
-      maximumSubmissions: d
+      maximumSubmissions: s
     });
   }
-  return o.forEach((d) => {
-    if (d.maxSubmissionString) {
-      const m = Number(d.maxSubmissionString);
+  return a.forEach((s) => {
+    if (s.maxSubmissionString) {
+      const m = Number(s.maxSubmissionString);
       if (Number.isNaN(m))
-        throw TypeError(d.type + " Limit is not an integer");
-      n.push({
-        limitType: d.type,
+        throw TypeError(s.type + " Limit is not an integer");
+      d.push({
+        limitType: s.type,
         maximumSubmissions: m
       });
     }
@@ -51,116 +52,122 @@ const ae = (e) => {
     id: e.id,
     etag: e.etag,
     evaluationId: e.evaluationId,
-    roundStart: l.utc(a).toJSON(),
-    roundEnd: l.utc(i).toJSON(),
-    limits: n
+    roundStart: c.utc(o).toJSON(),
+    roundEnd: c.utc(n).toJSON(),
+    limits: d
   };
 };
-function D(e, a) {
-  return a == null ? null : a === "disablePast" ? `${ee(e)} date cannot be in the past` : "Invalid date";
+function w(e, o) {
+  return o == null ? null : o === "disablePast" ? `${ae(e)} date cannot be in the past` : "Invalid date";
 }
-function Le({
+function Be({
   evaluationRoundInput: e,
-  onSave: a,
-  onDelete: i
+  onSave: o,
+  onDelete: n
 }) {
-  const { accessToken: s } = $(), [o, n] = c(), [d, m] = c(!1);
-  te(() => {
-    o && m(!1);
-  }, [o]);
-  const [x, w] = c(
-    e.roundStart ? l(e.roundStart) : null
-  ), [S, B] = c(
-    e.roundEnd ? l(e.roundEnd) : null
-  ), [T, P] = c(
+  const { accessToken: i } = _(), { setIsEditing: a } = Z(), [d, s] = l(!1), [m, f] = l(), [k, S] = l(!1);
+  A(() => (a(d), () => {
+    a(!1);
+  }), [d, a]), A(() => {
+    m && S(!1);
+  }, [m]);
+  const [T, F] = l(
+    e.roundStart ? c(e.roundStart) : null
+  ), [E, M] = l(
+    e.roundEnd ? c(e.roundEnd) : null
+  ), [y, j] = l(
     e.totalSubmissionLimit
-  ), [b, y] = c(!1), [k, F] = c(null), [M, j] = c(null), {
-    list: p,
-    handleListRemove: R,
-    handleListChange: U,
-    appendToList: z
-  } = q(e.otherLimits), G = (r) => {
-    const f = R(r);
+  ), [g, L] = l(!1), [R, U] = l(null), [z, G] = l(null), {
+    list: v,
+    handleListRemove: J,
+    handleListChange: H,
+    appendToList: I
+  } = ee(e.otherLimits), K = (...r) => (s(!0), H(...r)), W = (...r) => (s(!0), I(...r)), Y = (r) => {
+    const p = J(r);
     return () => {
-      f(), p.length === 1 && y(!1);
+      s(!0), p(), v.length === 1 && L(!1);
     };
-  }, g = () => {
-    m(!1);
+  }, C = () => {
+    S(!1);
     let r;
     try {
-      r = O(
+      r = P(
         e,
-        x,
-        S,
         T,
-        p
+        E,
+        y,
+        v
       );
-    } catch (f) {
-      n(f);
+    } catch (p) {
+      f(p);
     }
-    r && (r.id ? K(r, s) : W(r, s)).then((E) => {
-      const H = oe(
-        E,
+    r && (r.id ? Q(r, i) : V(r, i)).then((x) => {
+      const q = me(
+        x,
         e.reactListKey
       );
-      n(void 0), m(!0), a(H);
-    }).catch((E) => n(E));
-  }, J = () => {
-    e.id ? Y(
+      f(void 0), S(!0), s(!1), o(q);
+    }).catch((x) => f(x));
+  }, $ = () => {
+    e.id ? X(
       e.evaluationId,
       e.id,
-      s
-    ).then(() => i()).catch((r) => n(r)) : i();
-  }, L = l().isSameOrAfter(
+      i
+    ).then(() => n()).catch((r) => f(r)) : n();
+  }, D = c().isSameOrAfter(
     e.roundStart
   );
-  return /* @__PURE__ */ t("div", { className: "evaluation-round-editor", children: /* @__PURE__ */ t(Q, { children: /* @__PURE__ */ t(V, { sx: { p: 3 }, children: /* @__PURE__ */ h("form", { "aria-label": "Evaluation Round Form", children: [
+  return /* @__PURE__ */ t("div", { className: "evaluation-round-editor", children: /* @__PURE__ */ t(te, { children: /* @__PURE__ */ t(re, { sx: { p: 3 }, children: /* @__PURE__ */ h("form", { "aria-label": "Evaluation Round Form", children: [
     /* @__PURE__ */ h(u, { sx: { display: "flex", justifyContent: "space-between" }, children: [
       /* @__PURE__ */ h("h5", { children: [
         "ROUND STATUS",
         e.id && " (" + e.id + ")"
       ] }),
       /* @__PURE__ */ t(
-        ie,
+        ce,
         {
-          onDelete: J,
-          onSave: g
+          onDelete: $,
+          onSave: C
         }
       )
     ] }),
-    /* @__PURE__ */ t(u, { className: "round-status", sx: { mb: 2 }, children: A(
+    /* @__PURE__ */ t(u, { className: "round-status", sx: { mb: 2 }, children: B(
       e.roundStart,
       e.roundEnd
     ) }),
     /* @__PURE__ */ t("h5", { children: "DURATION" }),
-    /* @__PURE__ */ h(v, { container: !0, children: [
-      /* @__PURE__ */ t(v, { size: 6, children: /* @__PURE__ */ t(
-        C,
+    /* @__PURE__ */ h(b, { container: !0, children: [
+      /* @__PURE__ */ t(b, { size: 6, children: /* @__PURE__ */ t(
+        O,
         {
           label: "Round Start",
-          value: x,
-          onChange: w,
-          onError: (r) => F(r),
-          disabled: L,
-          disablePast: !L,
+          value: T,
+          onChange: (r) => {
+            F(r), s(!0);
+          },
+          onError: (r) => U(r),
+          disabled: D,
+          disablePast: !D,
           slotProps: {
             textField: {
-              helperText: D("start", k)
+              helperText: w("start", R)
             }
           }
         }
       ) }),
-      /* @__PURE__ */ t(v, { size: 6, children: /* @__PURE__ */ t(
-        C,
+      /* @__PURE__ */ t(b, { size: 6, children: /* @__PURE__ */ t(
+        O,
         {
           label: "Round End",
-          value: S,
-          onChange: B,
-          onError: (r) => j(r),
-          disablePast: !l(S).isSame(e.roundEnd),
+          value: E,
+          onChange: (r) => {
+            M(r), s(!0);
+          },
+          onError: (r) => G(r),
+          disablePast: !c(E).isSame(e.roundEnd),
           slotProps: {
             textField: {
-              helperText: D("end", M)
+              helperText: w("end", z)
             }
           }
         }
@@ -168,12 +175,14 @@ function Le({
     ] }),
     /* @__PURE__ */ t("h5", { style: { marginTop: "20px" }, children: "SUBMISSION LIMITS" }),
     /* @__PURE__ */ t(
-      X,
+      se,
       {
         fullWidth: !0,
         label: "Total Submissions / Round",
-        value: T,
-        onChange: (r) => P(r.target.value),
+        value: y,
+        onChange: (r) => {
+          j(r.target.value), s(!0);
+        },
         autoComplete: "new-password",
         slotProps: {
           htmlInput: {
@@ -188,26 +197,26 @@ function Le({
         variant: "outlined",
         color: "primary",
         size: "small",
-        onClick: () => y(!b),
+        onClick: () => L(!g),
         children: "Advanced Limits"
       }
     ) }),
-    b && /* @__PURE__ */ t(
-      ne,
+    g && /* @__PURE__ */ t(
+      ue,
       {
-        limitInputs: p,
-        handleChange: U,
-        handleDeleteLimit: G,
-        onAddNewLimit: z
+        limitInputs: v,
+        handleChange: K,
+        handleDeleteLimit: Y,
+        onAddNewLimit: W
       }
     ),
-    o && /* @__PURE__ */ t(u, { sx: { my: 3 }, children: /* @__PURE__ */ t(re, { error: o }) }),
-    d && /* @__PURE__ */ t(u, { sx: { my: 3 }, children: /* @__PURE__ */ t(
-      Z,
+    m && /* @__PURE__ */ t(u, { sx: { my: 3 }, children: /* @__PURE__ */ t(de, { error: m }) }),
+    k && /* @__PURE__ */ t(u, { sx: { my: 3 }, children: /* @__PURE__ */ t(
+      ie,
       {
         className: "save-success-alert",
         severity: "success",
-        onClose: () => m(!1),
+        onClose: () => S(!1),
         sx: { mb: "20px" },
         children: "Successfully saved."
       }
@@ -217,19 +226,19 @@ function Le({
       {
         variant: "contained",
         color: "primary",
-        onClick: g,
+        onClick: C,
         children: "Save"
       }
     ) })
   ] }) }) }) });
 }
-const Ne = {
-  disallowCalendarDateBefore: ae,
-  determineRoundStatus: A,
-  convertInputsToEvaluationRound: O
+const Pe = {
+  disallowCalendarDateBefore: he,
+  determineRoundStatus: B,
+  convertInputsToEvaluationRound: P
 };
 export {
-  Le as EvaluationRoundEditor,
-  Ne as HelpersToTest
+  Be as EvaluationRoundEditor,
+  Pe as HelpersToTest
 };
 //# sourceMappingURL=EvaluationRoundEditor.js.map

package/dist/components/Evaluation/EvaluationRoundEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"EvaluationRoundEditor.js","sources":["../../../src/components/Evaluation/EvaluationRoundEditor.tsx"],"sourcesContent":["import {\n  createEvaluationRound,\n  deleteEvaluationRound,\n  updateEvaluationRound,\n} from '@/synapse-client/SynapseClient'\nimport { useSynapseContext } from '@/utils/context/SynapseContext'\nimport { useListState } from '@/utils/hooks/useListState'\nimport {\n  Alert,\n  Box,\n  Button,\n  Card,\n  CardContent,\n  Grid as Grid2,\n  TextField,\n} from '@mui/material'\nimport { DateTimeValidationError } from '@mui/x-date-pickers'\nimport { SynapseClientError } from '@sage-bionetworks/synapse-client/util/SynapseClientError'\nimport {\n  EvaluationRound,\n  EvaluationRoundLimit,\n} from '@sage-bionetworks/synapse-types'\nimport dayjs, { Dayjs } from 'dayjs'\nimport isSameOrAfter from 'dayjs/plugin/isSameOrAfter'\nimport utc from 'dayjs/plugin/utc'\nimport { upperFirst } from 'lodash-es'\nimport { useEffect, useState } from 'react'\nimport DateTimePicker from '../DateTimePicker/DateTimePicker'\nimport { ErrorBanner } from '../error/ErrorBanner'\nimport IconSvg, { IconSvgProps } from '../IconSvg/IconSvg'\nimport { EvaluationRoundEditorDropdown } from './EvaluationRoundEditorDropdown'\nimport {\n  convertEvaluationRoundToInput,\n  EvaluationRoundInput,\n  EvaluationRoundLimitInput,\n} from './input_models/models'\nimport { EvaluationRoundLimitOptionsList } from './round_limits/EvaluationRoundLimitOptionsList'\n\ndayjs.extend(utc)\ndayjs.extend(isSameOrAfter)\n\nexport type EvaluationRoundEditorProps = {\n  evaluationRoundInput: EvaluationRoundInput\n  onDelete: () => void\n  onSave: (evaluationRound: EvaluationRoundInput) => void\n}\n\nconst disallowCalendarDateBefore = (date: Dayjs) => {\n  const startOfDay = date.startOf('day')\n  return (currentDate: Dayjs) => currentDate.isSameOrAfter(startOfDay)\n}\n\nconst determineRoundStatus = (\n  roundStart: Dayjs | string,\n  roundEnd: Dayjs | string,\n) => {\n  let className: string\n  let iconProps: IconSvgProps | undefined\n  let status: string\n  const now = dayjs()\n  // based off of start/end datetime from props so that users making\n  // unsaved changes to the start/end dates do not change the status\n  if (now.isSameOrAfter(roundStart)) {\n    if (now.isBefore(roundEnd)) {\n      className = 'status-in-progress'\n      iconProps = { icon: 'sync' }\n      status = 'IN PROGRESS'\n    } else {\n      className = 'status-completed'\n      iconProps = { icon: 'clipboardCheck' }\n      status = 'COMPLETED'\n    }\n  } else {\n    className = 'status-not-yet-started'\n    iconProps = undefined\n    status = 'NOT YET STARTED'\n  }\n\n  return (\n    <div className={className}>\n      <div className=\"status\">\n        {iconProps && <IconSvg {...iconProps} />}\n        <span>{status}</span>\n      </div>\n    </div>\n  )\n}\n\nconst convertInputsToEvaluationRound = (\n  evaluationRoundInputProp: EvaluationRoundInput,\n  startDate: string | Dayjs | null,\n  endDate: string | Dayjs | null,\n  totalSubmissionLimit: string,\n  advancedLimits: EvaluationRoundLimitInput[],\n): EvaluationRound => {\n  const limits: EvaluationRoundLimit[] = []\n  if (totalSubmissionLimit) {\n    const totalSubmissionLimitInt = Number(totalSubmissionLimit)\n    if (Number.isNaN(totalSubmissionLimitInt)) {\n      throw TypeError('Total Submission is not an integer')\n    }\n    limits.push({\n      limitType: 'TOTAL',\n      maximumSubmissions: totalSubmissionLimitInt,\n    })\n  }\n  advancedLimits.forEach(limitInput => {\n    if (limitInput.maxSubmissionString) {\n      const maxSubmissionInt = Number(limitInput.maxSubmissionString)\n      if (Number.isNaN(maxSubmissionInt)) {\n        throw TypeError(limitInput.type + ' Limit is not an integer')\n      }\n      limits.push({\n        limitType: limitInput.type,\n        maximumSubmissions: maxSubmissionInt,\n      })\n    }\n  })\n\n  return {\n    id: evaluationRoundInputProp.id,\n    etag: evaluationRoundInputProp.etag,\n    evaluationId: evaluationRoundInputProp.evaluationId,\n    roundStart: dayjs.utc(startDate).toJSON(),\n    roundEnd: dayjs.utc(endDate).toJSON(),\n    limits: limits,\n  }\n}\n\nfunction getDateErrorMessage(\n  dateField: 'start' | 'end',\n  error: DateTimeValidationError | null,\n): string | null {\n  if (error == null) return null\n  switch (error) {\n    case 'disablePast':\n      return `${upperFirst(dateField)} date cannot be in the past`\n    case 'invalidDate':\n    default:\n      return 'Invalid date'\n  }\n}\n\nexport function EvaluationRoundEditor({\n  evaluationRoundInput,\n  onSave,\n  onDelete,\n}: EvaluationRoundEditorProps) {\n  const { accessToken } = useSynapseContext()\n  const [error, setError] = useState<string | SynapseClientError | undefined>()\n  const [showSaveSuccess, setShowSaveSuccess] = useState<boolean>(false)\n\n  useEffect(() => {\n    if (error) {\n      setShowSaveSuccess(false)\n    }\n  }, [error])\n\n  const [startDate, setStartDate] = useState<Dayjs | null>(\n    evaluationRoundInput.roundStart\n      ? dayjs(evaluationRoundInput.roundStart)\n      : null,\n  )\n  const [endDate, setEndDate] = useState<Dayjs | null>(\n    evaluationRoundInput.roundEnd ? dayjs(evaluationRoundInput.roundEnd) : null,\n  )\n\n  const [totalSubmissionLimit, setTotalSubmissionLimit] = useState<string>(\n    evaluationRoundInput.totalSubmissionLimit,\n  )\n\n  const [advancedMode, setAdvancedMode] = useState<boolean>(false)\n\n  const [startDateError, setStartDateError] =\n    useState<DateTimeValidationError | null>(null)\n  const [endDateError, setEndDateError] =\n    useState<DateTimeValidationError | null>(null)\n\n  const {\n    list: advancedLimits,\n    handleListRemove,\n    handleListChange: handleAdvancedLimitsChange,\n    appendToList: addAdvancedLimit,\n  } = useListState<EvaluationRoundLimitInput>(evaluationRoundInput.otherLimits)\n\n  // if we remove the last advanced limit, hide the advanced limits\n  const handleAdvancedLimitsRemove = (index: number) => {\n    const generatedRemoveFunc = handleListRemove(index)\n    return () => {\n      //we are deleting the last advanced limit\n\n      generatedRemoveFunc()\n      if (advancedLimits.length === 1) {\n        // NOTE: we dont check for length == 0 because we don't modify the original list,\n        // instead the generated function will setState() with a NEW empty list\n        // so the original list we reference still has 1 element\n        setAdvancedMode(false)\n      }\n    }\n  }\n\n  const onSaveButtonClick = () => {\n    setShowSaveSuccess(false)\n    let evaluationRound\n    try {\n      evaluationRound = convertInputsToEvaluationRound(\n        evaluationRoundInput,\n        startDate,\n        endDate,\n        totalSubmissionLimit,\n        advancedLimits,\n      )\n    } catch (err) {\n      // error thrown if number\n      setError(err)\n    }\n    if (evaluationRound) {\n      const promise = evaluationRound.id\n        ? updateEvaluationRound(evaluationRound, accessToken)\n        : createEvaluationRound(evaluationRound, accessToken)\n\n      promise\n        .then(createdOrUpdatedRound => {\n          const newInput = convertEvaluationRoundToInput(\n            createdOrUpdatedRound,\n            evaluationRoundInput.reactListKey,\n          )\n          //clear out previous error if any\n          setError(undefined)\n          setShowSaveSuccess(true)\n          onSave(newInput)\n        })\n        .catch(error => setError(error))\n    }\n  }\n\n  const onDeleteButtonClick = () => {\n    if (evaluationRoundInput.id) {\n      deleteEvaluationRound(\n        evaluationRoundInput.evaluationId,\n        evaluationRoundInput.id,\n        accessToken,\n      )\n        .then(() => onDelete())\n        .catch(error => setError(error))\n    } else {\n      onDelete()\n    }\n  }\n\n  const disableStartInput = dayjs().isSameOrAfter(\n    evaluationRoundInput.roundStart,\n  )\n\n  return (\n    <div className=\"evaluation-round-editor\">\n      <Card>\n        <CardContent sx={{ p: 3 }}>\n          <form aria-label={'Evaluation Round Form'}>\n            <Box sx={{ display: 'flex', justifyContent: 'space-between' }}>\n              <h5>\n                ROUND STATUS\n                {evaluationRoundInput.id &&\n                  ' (' + evaluationRoundInput.id + ')'}\n              </h5>\n              <EvaluationRoundEditorDropdown\n                onDelete={onDeleteButtonClick}\n                onSave={onSaveButtonClick}\n              />\n            </Box>\n            <Box className=\"round-status\" sx={{ mb: 2 }}>\n              {determineRoundStatus(\n                evaluationRoundInput.roundStart,\n                evaluationRoundInput.roundEnd,\n              )}\n            </Box>\n            <h5>DURATION</h5>\n\n            <Grid2 container>\n              <Grid2 size={6}>\n                <DateTimePicker\n                  label=\"Round Start\"\n                  value={startDate}\n                  onChange={setStartDate}\n                  onError={error => setStartDateError(error)}\n                  disabled={disableStartInput}\n                  // Don't allow the value to be a past date only if the input is not disabled.\n                  // i.e. allow a past date if the round has already started\n                  disablePast={!disableStartInput}\n                  slotProps={{\n                    textField: {\n                      helperText: getDateErrorMessage('start', startDateError),\n                    },\n                  }}\n                />\n              </Grid2>\n              <Grid2 size={6}>\n                <DateTimePicker\n                  label=\"Round End\"\n                  value={endDate}\n                  onChange={setEndDate}\n                  onError={error => setEndDateError(error)}\n                  disablePast={\n                    !dayjs(endDate).isSame(evaluationRoundInput.roundEnd)\n                  }\n                  slotProps={{\n                    textField: {\n                      helperText: getDateErrorMessage('end', endDateError),\n                    },\n                  }}\n                />\n              </Grid2>\n            </Grid2>\n            <h5 style={{ marginTop: '20px' }}>SUBMISSION LIMITS</h5>\n            <TextField\n              fullWidth\n              label=\"Total Submissions / Round\"\n              value={totalSubmissionLimit}\n              onChange={event => setTotalSubmissionLimit(event.target.value)}\n              // Chrome for some reason decides to autofill this input box with email address, so we must disable autofill\n              // this is a hacky, but consistent way to disable autofill because Chrome does not respect the spec :(\n              // https://bugs.chromium.org/p/chromium/issues/detail?id=914451\n              autoComplete=\"new-password\"\n              slotProps={{\n                htmlInput: {\n                  pattern: '[0-9]*',\n                },\n              }}\n            />\n            <Box sx={{ my: 2 }}>\n              <Button\n                variant=\"outlined\"\n                color=\"primary\"\n                size={'small'}\n                onClick={() => setAdvancedMode(!advancedMode)}\n              >\n                Advanced Limits\n              </Button>\n            </Box>\n            {advancedMode && (\n              <EvaluationRoundLimitOptionsList\n                limitInputs={advancedLimits}\n                handleChange={handleAdvancedLimitsChange}\n                handleDeleteLimit={handleAdvancedLimitsRemove}\n                onAddNewLimit={addAdvancedLimit}\n              />\n            )}\n\n            {error && (\n              <Box sx={{ my: 3 }}>\n                <ErrorBanner error={error} />\n              </Box>\n            )}\n\n            {showSaveSuccess && (\n              <Box sx={{ my: 3 }}>\n                <Alert\n                  className=\"save-success-alert\"\n                  severity=\"success\"\n                  onClose={() => setShowSaveSuccess(false)}\n                  sx={{ mb: '20px' }}\n                >\n                  Successfully saved.\n                </Alert>\n              </Box>\n            )}\n\n            <Box sx={{ mt: 3, textAlign: 'right' }}>\n              <Button\n                variant=\"contained\"\n                color=\"primary\"\n                onClick={onSaveButtonClick}\n              >\n                Save\n              </Button>\n            </Box>\n          </form>\n        </CardContent>\n      </Card>\n    </div>\n  )\n}\n\nexport const HelpersToTest = {\n  disallowCalendarDateBefore,\n  determineRoundStatus,\n  convertInputsToEvaluationRound,\n}\n"],"names":["dayjs","utc","isSameOrAfter","disallowCalendarDateBefore","date","startOfDay","currentDate","determineRoundStatus","roundStart","roundEnd","className","iconProps","status","now","jsxs","jsx","IconSvg","convertInputsToEvaluationRound","evaluationRoundInputProp","startDate","endDate","totalSubmissionLimit","advancedLimits","limits","totalSubmissionLimitInt","limitInput","maxSubmissionInt","getDateErrorMessage","dateField","error","upperFirst","EvaluationRoundEditor","evaluationRoundInput","onSave","onDelete","accessToken","useSynapseContext","setError","useState","showSaveSuccess","setShowSaveSuccess","useEffect","setStartDate","setEndDate","setTotalSubmissionLimit","advancedMode","setAdvancedMode","startDateError","setStartDateError","endDateError","setEndDateError","handleListRemove","handleAdvancedLimitsChange","addAdvancedLimit","useListState","handleAdvancedLimitsRemove","index","generatedRemoveFunc","onSaveButtonClick","evaluationRound","err","updateEvaluationRound","createEvaluationRound","createdOrUpdatedRound","newInput","convertEvaluationRoundToInput","onDeleteButtonClick","deleteEvaluationRound","disableStartInput","Card","CardContent","Box","EvaluationRoundEditorDropdown","Grid2","DateTimePicker","TextField","event","Button","EvaluationRoundLimitOptionsList","ErrorBanner","Alert","HelpersToTest"],"mappings":"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"}
+{"version":3,"file":"EvaluationRoundEditor.js","sources":["../../../src/components/Evaluation/EvaluationRoundEditor.tsx"],"sourcesContent":["import {\n  createEvaluationRound,\n  deleteEvaluationRound,\n  updateEvaluationRound,\n} from '@/synapse-client/SynapseClient'\nimport { useGlobalIsEditingContext } from '@/utils/context/GlobalIsEditingContext'\nimport { useSynapseContext } from '@/utils/context/SynapseContext'\nimport { useListState } from '@/utils/hooks/useListState'\nimport {\n  Alert,\n  Box,\n  Button,\n  Card,\n  CardContent,\n  Grid as Grid2,\n  TextField,\n} from '@mui/material'\nimport { DateTimeValidationError } from '@mui/x-date-pickers'\nimport { SynapseClientError } from '@sage-bionetworks/synapse-client/util/SynapseClientError'\nimport {\n  EvaluationRound,\n  EvaluationRoundLimit,\n} from '@sage-bionetworks/synapse-types'\nimport dayjs, { Dayjs } from 'dayjs'\nimport isSameOrAfter from 'dayjs/plugin/isSameOrAfter'\nimport utc from 'dayjs/plugin/utc'\nimport { upperFirst } from 'lodash-es'\nimport { useEffect, useState } from 'react'\nimport DateTimePicker from '../DateTimePicker/DateTimePicker'\nimport { ErrorBanner } from '../error/ErrorBanner'\nimport IconSvg, { IconSvgProps } from '../IconSvg/IconSvg'\nimport { EvaluationRoundEditorDropdown } from './EvaluationRoundEditorDropdown'\nimport {\n  convertEvaluationRoundToInput,\n  EvaluationRoundInput,\n  EvaluationRoundLimitInput,\n} from './input_models/models'\nimport { EvaluationRoundLimitOptionsList } from './round_limits/EvaluationRoundLimitOptionsList'\n\ndayjs.extend(utc)\ndayjs.extend(isSameOrAfter)\n\nexport type EvaluationRoundEditorProps = {\n  evaluationRoundInput: EvaluationRoundInput\n  onDelete: () => void\n  onSave: (evaluationRound: EvaluationRoundInput) => void\n}\n\nconst disallowCalendarDateBefore = (date: Dayjs) => {\n  const startOfDay = date.startOf('day')\n  return (currentDate: Dayjs) => currentDate.isSameOrAfter(startOfDay)\n}\n\nconst determineRoundStatus = (\n  roundStart: Dayjs | string,\n  roundEnd: Dayjs | string,\n) => {\n  let className: string\n  let iconProps: IconSvgProps | undefined\n  let status: string\n  const now = dayjs()\n  // based off of start/end datetime from props so that users making\n  // unsaved changes to the start/end dates do not change the status\n  if (now.isSameOrAfter(roundStart)) {\n    if (now.isBefore(roundEnd)) {\n      className = 'status-in-progress'\n      iconProps = { icon: 'sync' }\n      status = 'IN PROGRESS'\n    } else {\n      className = 'status-completed'\n      iconProps = { icon: 'clipboardCheck' }\n      status = 'COMPLETED'\n    }\n  } else {\n    className = 'status-not-yet-started'\n    iconProps = undefined\n    status = 'NOT YET STARTED'\n  }\n\n  return (\n    <div className={className}>\n      <div className=\"status\">\n        {iconProps && <IconSvg {...iconProps} />}\n        <span>{status}</span>\n      </div>\n    </div>\n  )\n}\n\nconst convertInputsToEvaluationRound = (\n  evaluationRoundInputProp: EvaluationRoundInput,\n  startDate: string | Dayjs | null,\n  endDate: string | Dayjs | null,\n  totalSubmissionLimit: string,\n  advancedLimits: EvaluationRoundLimitInput[],\n): EvaluationRound => {\n  const limits: EvaluationRoundLimit[] = []\n  if (totalSubmissionLimit) {\n    const totalSubmissionLimitInt = Number(totalSubmissionLimit)\n    if (Number.isNaN(totalSubmissionLimitInt)) {\n      throw TypeError('Total Submission is not an integer')\n    }\n    limits.push({\n      limitType: 'TOTAL',\n      maximumSubmissions: totalSubmissionLimitInt,\n    })\n  }\n  advancedLimits.forEach(limitInput => {\n    if (limitInput.maxSubmissionString) {\n      const maxSubmissionInt = Number(limitInput.maxSubmissionString)\n      if (Number.isNaN(maxSubmissionInt)) {\n        throw TypeError(limitInput.type + ' Limit is not an integer')\n      }\n      limits.push({\n        limitType: limitInput.type,\n        maximumSubmissions: maxSubmissionInt,\n      })\n    }\n  })\n\n  return {\n    id: evaluationRoundInputProp.id,\n    etag: evaluationRoundInputProp.etag,\n    evaluationId: evaluationRoundInputProp.evaluationId,\n    roundStart: dayjs.utc(startDate).toJSON(),\n    roundEnd: dayjs.utc(endDate).toJSON(),\n    limits: limits,\n  }\n}\n\nfunction getDateErrorMessage(\n  dateField: 'start' | 'end',\n  error: DateTimeValidationError | null,\n): string | null {\n  if (error == null) return null\n  switch (error) {\n    case 'disablePast':\n      return `${upperFirst(dateField)} date cannot be in the past`\n    case 'invalidDate':\n    default:\n      return 'Invalid date'\n  }\n}\n\nexport function EvaluationRoundEditor({\n  evaluationRoundInput,\n  onSave,\n  onDelete,\n}: EvaluationRoundEditorProps) {\n  const { accessToken } = useSynapseContext()\n  const { setIsEditing } = useGlobalIsEditingContext()\n  const [isDirty, setIsDirty] = useState(false)\n  const [error, setError] = useState<string | SynapseClientError | undefined>()\n  const [showSaveSuccess, setShowSaveSuccess] = useState<boolean>(false)\n\n  useEffect(() => {\n    setIsEditing(isDirty)\n    return () => {\n      setIsEditing(false)\n    }\n  }, [isDirty, setIsEditing])\n\n  useEffect(() => {\n    if (error) {\n      setShowSaveSuccess(false)\n    }\n  }, [error])\n\n  const [startDate, setStartDate] = useState<Dayjs | null>(\n    evaluationRoundInput.roundStart\n      ? dayjs(evaluationRoundInput.roundStart)\n      : null,\n  )\n  const [endDate, setEndDate] = useState<Dayjs | null>(\n    evaluationRoundInput.roundEnd ? dayjs(evaluationRoundInput.roundEnd) : null,\n  )\n\n  const [totalSubmissionLimit, setTotalSubmissionLimit] = useState<string>(\n    evaluationRoundInput.totalSubmissionLimit,\n  )\n\n  const [advancedMode, setAdvancedMode] = useState<boolean>(false)\n\n  const [startDateError, setStartDateError] =\n    useState<DateTimeValidationError | null>(null)\n  const [endDateError, setEndDateError] =\n    useState<DateTimeValidationError | null>(null)\n\n  const {\n    list: advancedLimits,\n    handleListRemove,\n    handleListChange: handleAdvancedLimitsChangeBase,\n    appendToList: appendAdvancedLimit,\n  } = useListState<EvaluationRoundLimitInput>(evaluationRoundInput.otherLimits)\n\n  const handleAdvancedLimitsChange = (\n    ...args: Parameters<typeof handleAdvancedLimitsChangeBase>\n  ) => {\n    setIsDirty(true)\n    return handleAdvancedLimitsChangeBase(...args)\n  }\n\n  const addAdvancedLimit = (\n    ...args: Parameters<typeof appendAdvancedLimit>\n  ) => {\n    setIsDirty(true)\n    return appendAdvancedLimit(...args)\n  }\n\n  // if we remove the last advanced limit, hide the advanced limits\n  const handleAdvancedLimitsRemove = (index: number) => {\n    const generatedRemoveFunc = handleListRemove(index)\n    return () => {\n      //we are deleting the last advanced limit\n      setIsDirty(true)\n      generatedRemoveFunc()\n      if (advancedLimits.length === 1) {\n        // NOTE: we dont check for length == 0 because we don't modify the original list,\n        // instead the generated function will setState() with a NEW empty list\n        // so the original list we reference still has 1 element\n        setAdvancedMode(false)\n      }\n    }\n  }\n\n  const onSaveButtonClick = () => {\n    setShowSaveSuccess(false)\n    let evaluationRound\n    try {\n      evaluationRound = convertInputsToEvaluationRound(\n        evaluationRoundInput,\n        startDate,\n        endDate,\n        totalSubmissionLimit,\n        advancedLimits,\n      )\n    } catch (err) {\n      // error thrown if number\n      setError(err)\n    }\n    if (evaluationRound) {\n      const promise = evaluationRound.id\n        ? updateEvaluationRound(evaluationRound, accessToken)\n        : createEvaluationRound(evaluationRound, accessToken)\n\n      promise\n        .then(createdOrUpdatedRound => {\n          const newInput = convertEvaluationRoundToInput(\n            createdOrUpdatedRound,\n            evaluationRoundInput.reactListKey,\n          )\n          //clear out previous error if any\n          setError(undefined)\n          setShowSaveSuccess(true)\n          setIsDirty(false)\n          onSave(newInput)\n        })\n        .catch(error => setError(error))\n    }\n  }\n\n  const onDeleteButtonClick = () => {\n    if (evaluationRoundInput.id) {\n      deleteEvaluationRound(\n        evaluationRoundInput.evaluationId,\n        evaluationRoundInput.id,\n        accessToken,\n      )\n        .then(() => onDelete())\n        .catch(error => setError(error))\n    } else {\n      onDelete()\n    }\n  }\n\n  const disableStartInput = dayjs().isSameOrAfter(\n    evaluationRoundInput.roundStart,\n  )\n\n  return (\n    <div className=\"evaluation-round-editor\">\n      <Card>\n        <CardContent sx={{ p: 3 }}>\n          <form aria-label={'Evaluation Round Form'}>\n            <Box sx={{ display: 'flex', justifyContent: 'space-between' }}>\n              <h5>\n                ROUND STATUS\n                {evaluationRoundInput.id &&\n                  ' (' + evaluationRoundInput.id + ')'}\n              </h5>\n              <EvaluationRoundEditorDropdown\n                onDelete={onDeleteButtonClick}\n                onSave={onSaveButtonClick}\n              />\n            </Box>\n            <Box className=\"round-status\" sx={{ mb: 2 }}>\n              {determineRoundStatus(\n                evaluationRoundInput.roundStart,\n                evaluationRoundInput.roundEnd,\n              )}\n            </Box>\n            <h5>DURATION</h5>\n\n            <Grid2 container>\n              <Grid2 size={6}>\n                <DateTimePicker\n                  label=\"Round Start\"\n                  value={startDate}\n                  onChange={date => {\n                    setStartDate(date)\n                    setIsDirty(true)\n                  }}\n                  onError={error => setStartDateError(error)}\n                  disabled={disableStartInput}\n                  // Don't allow the value to be a past date only if the input is not disabled.\n                  // i.e. allow a past date if the round has already started\n                  disablePast={!disableStartInput}\n                  slotProps={{\n                    textField: {\n                      helperText: getDateErrorMessage('start', startDateError),\n                    },\n                  }}\n                />\n              </Grid2>\n              <Grid2 size={6}>\n                <DateTimePicker\n                  label=\"Round End\"\n                  value={endDate}\n                  onChange={date => {\n                    setEndDate(date)\n                    setIsDirty(true)\n                  }}\n                  onError={error => setEndDateError(error)}\n                  disablePast={\n                    !dayjs(endDate).isSame(evaluationRoundInput.roundEnd)\n                  }\n                  slotProps={{\n                    textField: {\n                      helperText: getDateErrorMessage('end', endDateError),\n                    },\n                  }}\n                />\n              </Grid2>\n            </Grid2>\n            <h5 style={{ marginTop: '20px' }}>SUBMISSION LIMITS</h5>\n            <TextField\n              fullWidth\n              label=\"Total Submissions / Round\"\n              value={totalSubmissionLimit}\n              onChange={event => {\n                setTotalSubmissionLimit(event.target.value)\n                setIsDirty(true)\n              }}\n              // Chrome for some reason decides to autofill this input box with email address, so we must disable autofill\n              // this is a hacky, but consistent way to disable autofill because Chrome does not respect the spec :(\n              // https://bugs.chromium.org/p/chromium/issues/detail?id=914451\n              autoComplete=\"new-password\"\n              slotProps={{\n                htmlInput: {\n                  pattern: '[0-9]*',\n                },\n              }}\n            />\n            <Box sx={{ my: 2 }}>\n              <Button\n                variant=\"outlined\"\n                color=\"primary\"\n                size={'small'}\n                onClick={() => setAdvancedMode(!advancedMode)}\n              >\n                Advanced Limits\n              </Button>\n            </Box>\n            {advancedMode && (\n              <EvaluationRoundLimitOptionsList\n                limitInputs={advancedLimits}\n                handleChange={handleAdvancedLimitsChange}\n                handleDeleteLimit={handleAdvancedLimitsRemove}\n                onAddNewLimit={addAdvancedLimit}\n              />\n            )}\n\n            {error && (\n              <Box sx={{ my: 3 }}>\n                <ErrorBanner error={error} />\n              </Box>\n            )}\n\n            {showSaveSuccess && (\n              <Box sx={{ my: 3 }}>\n                <Alert\n                  className=\"save-success-alert\"\n                  severity=\"success\"\n                  onClose={() => setShowSaveSuccess(false)}\n                  sx={{ mb: '20px' }}\n                >\n                  Successfully saved.\n                </Alert>\n              </Box>\n            )}\n\n            <Box sx={{ mt: 3, textAlign: 'right' }}>\n              <Button\n                variant=\"contained\"\n                color=\"primary\"\n                onClick={onSaveButtonClick}\n              >\n                Save\n              </Button>\n            </Box>\n          </form>\n        </CardContent>\n      </Card>\n    </div>\n  )\n}\n\nexport const HelpersToTest = {\n  disallowCalendarDateBefore,\n  determineRoundStatus,\n  convertInputsToEvaluationRound,\n}\n"],"names":["dayjs","utc","isSameOrAfter","disallowCalendarDateBefore","date","startOfDay","currentDate","determineRoundStatus","roundStart","roundEnd","className","iconProps","status","now","jsxs","jsx","IconSvg","convertInputsToEvaluationRound","evaluationRoundInputProp","startDate","endDate","totalSubmissionLimit","advancedLimits","limits","totalSubmissionLimitInt","limitInput","maxSubmissionInt","getDateErrorMessage","dateField","error","upperFirst","EvaluationRoundEditor","evaluationRoundInput","onSave","onDelete","accessToken","useSynapseContext","setIsEditing","useGlobalIsEditingContext","isDirty","setIsDirty","useState","setError","showSaveSuccess","setShowSaveSuccess","useEffect","setStartDate","setEndDate","setTotalSubmissionLimit","advancedMode","setAdvancedMode","startDateError","setStartDateError","endDateError","setEndDateError","handleListRemove","handleAdvancedLimitsChangeBase","appendAdvancedLimit","useListState","handleAdvancedLimitsChange","args","addAdvancedLimit","handleAdvancedLimitsRemove","index","generatedRemoveFunc","onSaveButtonClick","evaluationRound","err","updateEvaluationRound","createEvaluationRound","createdOrUpdatedRound","newInput","convertEvaluationRoundToInput","onDeleteButtonClick","deleteEvaluationRound","disableStartInput","Card","CardContent","Box","EvaluationRoundEditorDropdown","Grid2","DateTimePicker","TextField","event","Button","EvaluationRoundLimitOptionsList","ErrorBanner","Alert","HelpersToTest"],"mappings":"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"}

package/dist/components/FeaturedDataTabs/FacetPlotsCard.js

@@ -37,11 +37,14 @@ import "@mui/material/SvgIcon";
 import "../../assets/icons/AccessPending.svg.js";
 import "../../assets/icons/AccessPendingCloud.svg.js";
 import "../../assets/icons/FileWithShield.svg.js";
+import "../../assets/icons/MultiFile.svg.js";
+import "../../assets/icons/UnpackagableFile.svg.js";
 import "../../assets/icons/bioChemicalPhysical.svg.js";
 import "../../assets/icons/computationalTool.svg.js";
 import "../../assets/icons/dataReuse.svg.js";
 import "../../assets/icons/inSilicoModel.svg.js";
 import "../../assets/icons/modelSystem.svg.js";
+import "../../assets/mui_components/PackagableFile.svg.js";
 import "../../assets/icons/spatialProfiling.svg.js";
 import "@mui/icons-material";
 import "../../assets/icons/chart2.svg.js";
@@ -57,6 +60,7 @@ import "../../assets/icons/study-complete.svg.js";
 import "../../assets/icons/translational.svg.js";
 import "../../assets/icons/tree_horizontal.svg.js";
 import "../../assets/icons/standardDataModel.svg.js";
+import "../../assets/icons/Challenge.svg.js";
 import K from "../ShowMore/ShowMore.js";
 import "@mui/material/Skeleton";
 import { SkeletonTable as Z } from "../Skeleton/SkeletonTable.js";
@@ -233,7 +237,7 @@ function rt(a) {
     ) }, r))
   ] });
 }
-function yr(a) {
+function Tr(a) {
   return /* @__PURE__ */ t(
     H,
     {
@@ -243,6 +247,6 @@ function yr(a) {
   );
 }
 export {
-  yr as default
+  Tr as default
 };
 //# sourceMappingURL=FacetPlotsCard.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"FacetPlotsCard.js","sources":["../../../src/components/FeaturedDataTabs/FacetPlotsCard.tsx"],"sourcesContent":["import { useSynapseContext } from '@/utils/context/SynapseContext'\nimport {\n  Box,\n  Button,\n  Divider,\n  Paper,\n  Skeleton,\n  Typography,\n} from '@mui/material'\nimport {\n  ColumnTypeEnum,\n  FacetColumnResult,\n  FacetColumnResultValueCount,\n  FacetColumnResultValues,\n} from '@sage-bionetworks/synapse-types'\nimport { useSuspenseQuery } from '@tanstack/react-query'\nimport { times } from 'lodash-es'\nimport Plotly from 'plotly.js-basic-dist'\nimport { Fragment, Suspense, useMemo } from 'react'\nimport Plot from '../Plot/Plot'\nimport { useQueryVisualizationContext } from '../QueryVisualizationWrapper'\nimport { useSuspenseGetQueryMetadata } from '../QueryWrapper/useGetQueryMetadata'\nimport { ShowMore } from '../row_renderers/utils'\nimport { SkeletonParagraph, SkeletonTable } from '../Skeleton'\nimport {\n  extractPlotDataArray,\n  getPlotStyle,\n  PlotType,\n} from '../widgets/facet-nav/FacetNavPanel'\nimport { FacetPlotLegendTable } from '../widgets/facet-nav/FacetPlotLegendTable'\nimport { getFacets } from '../widgets/facet-nav/useFacetPlots'\nimport {\n  FACET_PLOTS_CARD_CLASSNAME,\n  FACET_PLOTS_CARD_PLOT_CONTAINER_CLASSNAME,\n  FACET_PLOTS_CARD_TITLE_CONTAINER_CLASSNAME,\n  FacetPlotsCardPlotContainer,\n  FacetPlotsCardTitleContainer,\n} from './FacetPlotsCardGrid'\nimport { useMeasure } from '@react-hookz/web'\n\nexport type FacetPlotsCardProps = {\n  title?: string\n  description?: string\n  facetsToPlot?: string[]\n  detailsPagePath?: string\n  plotType?: PlotType\n}\n\nconst layout: Partial<Plotly.Layout> = {\n  showlegend: false,\n  annotations: [],\n  margin: { l: 0, r: 0, b: 0, t: 0, pad: 0 },\n  yaxis: {\n    visible: false,\n    showgrid: false,\n  },\n  xaxis: {\n    visible: false,\n    showgrid: false,\n  },\n}\n\nfunction LoadingCard(props: { numPlots: number }) {\n  const { numPlots } = props\n  return (\n    <Paper className={FACET_PLOTS_CARD_CLASSNAME}>\n      <FacetPlotsCardTitleContainer\n        className={FACET_PLOTS_CARD_TITLE_CONTAINER_CLASSNAME}\n      >\n        <Skeleton width={'60%'} height={'24px'} />\n\n        <SkeletonParagraph numRows={5} />\n\n        <Skeleton width={'40%'}>\n          <Button variant={'contained'}>Explore</Button>\n        </Skeleton>\n      </FacetPlotsCardTitleContainer>\n      {times(numPlots).map(index => (\n        <FacetPlotsCardPlotContainer\n          key={index}\n          className={FACET_PLOTS_CARD_PLOT_CONTAINER_CLASSNAME}\n          sx={{\n            py: 3,\n            gridRow: `plot${index}`,\n          }}\n        >\n          <Skeleton width={'100%'} height={'300px'} />\n          <SkeletonTable numRows={4} numCols={2} />\n        </FacetPlotsCardPlotContainer>\n      ))}\n    </Paper>\n  )\n}\n\nfunction FacetPlotsCard(props: FacetPlotsCardProps) {\n  const {\n    title,\n    description,\n    facetsToPlot,\n    detailsPagePath,\n    plotType = 'PIE',\n  } = props\n  const { accessToken } = useSynapseContext()\n  const { data: queryMetadata } = useSuspenseGetQueryMetadata()\n  const { getColumnDisplayName } = useQueryVisualizationContext()\n  const [plotContainerMeasurements, plotContainerRef] = useMeasure()\n\n  const facetDataArray = useMemo(() => {\n    if (!facetsToPlot) {\n      return []\n    }\n\n    return getFacets(queryMetadata, facetsToPlot)\n  }, [facetsToPlot, queryMetadata])\n\n  const currentLayout: Partial<Plotly.Layout> = useMemo(() => {\n    return {\n      ...layout,\n      barmode: plotType === 'STACKED_HORIZONTAL_BAR' ? 'stack' : undefined,\n    }\n  }, [plotType])\n  const maxPlotHeight = plotType === 'STACKED_HORIZONTAL_BAR' ? 50 : 150\n  const { data: facetPlotDataArray } = useSuspenseQuery({\n    queryKey: ['facetPlotDataArray', facetsToPlot, facetDataArray],\n    queryFn: async () => {\n      if (!facetsToPlot) {\n        return []\n      }\n\n      const getColumnType = (\n        facetToPlot: FacetColumnResult,\n      ): ColumnTypeEnum | undefined =>\n        queryMetadata.columnModels!.find(\n          columnModel => columnModel.name === facetToPlot.columnName,\n        )?.columnType as ColumnTypeEnum\n\n      return Promise.all(\n        facetDataArray.map(async (item, index) => {\n          const plotData = await extractPlotDataArray(\n            item as FacetColumnResultValues,\n            getColumnType(item),\n            index + 1, //individual plot rgbIndex\n            plotType,\n            accessToken,\n          )\n          return plotData\n        }),\n      )\n    },\n  })\n\n  const selectedFacetValue = useMemo(() => {\n    if (!facetsToPlot) {\n      return ''\n    }\n\n    // If we are showing a facet selection based card, then set the selectedFacetValue.  For example, facet column \"study\" with value \"ROSMAP\"\n    const selectedFacet: FacetColumnResultValueCount | undefined = queryMetadata\n      ?.facets!.map(item => {\n        const facetValues: FacetColumnResultValueCount[] = (\n          item as FacetColumnResultValues\n        ).facetValues\n        if (facetValues) {\n          const filteredFacetValues: FacetColumnResultValueCount[] =\n            facetValues.filter(facetValue => {\n              return facetValue.isSelected\n            })\n          return filteredFacetValues.length > 0\n            ? filteredFacetValues[0]\n            : undefined\n        } else {\n          return undefined\n        }\n      })\n      .filter(x => x !== undefined)[0]\n\n    if (selectedFacet && selectedFacet.value) {\n      return selectedFacet?.value\n    }\n    return ''\n  }, [facetsToPlot, queryMetadata?.facets])\n\n  const isShowingMultiplePlots = facetPlotDataArray.length > 1\n  const cardTitle =\n    title ??\n    (isShowingMultiplePlots\n      ? selectedFacetValue\n      : getColumnDisplayName(facetDataArray[0].columnName))\n  return (\n    <Paper className={FACET_PLOTS_CARD_CLASSNAME} sx={{ overflow: 'hidden' }}>\n      <FacetPlotsCardTitleContainer\n        className={FACET_PLOTS_CARD_TITLE_CONTAINER_CLASSNAME}\n      >\n        <Typography variant={'headline1'}>{cardTitle}</Typography>\n        {description && (\n          <Typography variant={'body1'} sx={{ color: 'grey.700', my: 2 }}>\n            <ShowMore summary={description} maxCharacterCount={200} />\n          </Typography>\n        )}\n\n        {detailsPagePath && selectedFacetValue && (\n          <Box sx={{ my: 2 }}>\n            <Button\n              variant={'contained'}\n              href={detailsPagePath}\n              color={'secondary'}\n              sx={theme => ({\n                [theme.breakpoints.down('sm')]: { width: '100%' },\n              })}\n            >\n              Explore {selectedFacetValue}\n            </Button>\n          </Box>\n        )}\n      </FacetPlotsCardTitleContainer>\n\n      {/* create a plot for every facet to be plotted */}\n      {facetPlotDataArray.map((plotData, index) => {\n        return (\n          <Fragment key={index}>\n            <FacetPlotsCardPlotContainer\n              className={FACET_PLOTS_CARD_PLOT_CONTAINER_CLASSNAME}\n              sx={{\n                pt: index === 0 ? 5 : 0,\n                gridRow: `plot${index}`,\n              }}\n              key={index}\n            >\n              {index != 0 && <Divider sx={{ mt: 2, mb: 4 }} />}\n              <Box sx={{ minHeight: '130px' }}>\n                <Box\n                  ref={plotContainerRef}\n                  sx={{\n                    display: 'flex',\n                    justifyContent: 'center',\n                    alignItems: 'center',\n                  }}\n                >\n                  <Plot\n                    key={`${facetsToPlot![index]}-${\n                      plotContainerMeasurements?.width\n                    }`}\n                    layout={currentLayout}\n                    data={plotData?.data ?? []}\n                    style={getPlotStyle(\n                      plotContainerMeasurements?.width,\n                      plotType,\n                      maxPlotHeight,\n                    )}\n                    config={{ displayModeBar: false }}\n                  />\n                </Box>\n                <Box sx={{ mt: 4, width: '100%' }}>\n                  <FacetPlotLegendTable\n                    facetName={getColumnDisplayName(\n                      facetDataArray[index].columnName,\n                    )}\n                    labels={plotData?.labels}\n                    colors={plotData?.colors}\n                    isExpanded={false}\n                    linkToFullQuery={detailsPagePath}\n                  />\n                </Box>\n              </Box>\n            </FacetPlotsCardPlotContainer>\n          </Fragment>\n        )\n      })}\n    </Paper>\n  )\n}\n\nexport default function FacetPlotsCardWithSuspense(props: FacetPlotsCardProps) {\n  return (\n    <Suspense\n      fallback={<LoadingCard numPlots={(props.facetsToPlot ?? []).length} />}\n    >\n      <FacetPlotsCard {...props} />\n    </Suspense>\n  )\n}\n"],"names":["layout","LoadingCard","props","numPlots","jsxs","Paper","FACET_PLOTS_CARD_CLASSNAME","FacetPlotsCardTitleContainer","FACET_PLOTS_CARD_TITLE_CONTAINER_CLASSNAME","jsx","Skeleton","SkeletonParagraph","Button","times","index","FacetPlotsCardPlotContainer","FACET_PLOTS_CARD_PLOT_CONTAINER_CLASSNAME","SkeletonTable","FacetPlotsCard","title","description","facetsToPlot","detailsPagePath","plotType","accessToken","useSynapseContext","queryMetadata","useSuspenseGetQueryMetadata","getColumnDisplayName","useQueryVisualizationContext","plotContainerMeasurements","plotContainerRef","useMeasure","facetDataArray","useMemo","getFacets","currentLayout","maxPlotHeight","facetPlotDataArray","useSuspenseQuery","getColumnType","facetToPlot","columnModel","item","extractPlotDataArray","selectedFacetValue","selectedFacet","facetValues","filteredFacetValues","facetValue","x","isShowingMultiplePlots","cardTitle","Typography","ShowMore","Box","theme","plotData","Fragment","Divider","Plot","getPlotStyle","FacetPlotLegendTable","FacetPlotsCardWithSuspense","Suspense"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgDA,MAAMA,IAAiC;AAAA,EACrC,YAAY;AAAA,EACZ,aAAa,CAAA;AAAA,EACb,QAAQ,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,KAAK,EAAA;AAAA,EACvC,OAAO;AAAA,IACL,SAAS;AAAA,IACT,UAAU;AAAA,EAAA;AAAA,EAEZ,OAAO;AAAA,IACL,SAAS;AAAA,IACT,UAAU;AAAA,EAAA;AAEd;AAEA,SAASC,GAAYC,GAA6B;AAChD,QAAM,EAAE,UAAAC,MAAaD;AACrB,SACE,gBAAAE,EAACC,GAAA,EAAM,WAAWC,GAChB,UAAA;AAAA,IAAA,gBAAAF;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,WAAWC;AAAA,QAEX,UAAA;AAAA,UAAA,gBAAAC,EAACC,GAAA,EAAS,OAAO,OAAO,QAAQ,QAAQ;AAAA,UAExC,gBAAAD,EAACE,GAAA,EAAkB,SAAS,EAAA,CAAG;AAAA,UAE/B,gBAAAF,EAACC,KAAS,OAAO,OACf,4BAACE,GAAA,EAAO,SAAS,aAAa,UAAA,UAAA,CAAO,EAAA,CACvC;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAEDC,EAAMV,CAAQ,EAAE,IAAI,CAAAW,MACnB,gBAAAV;AAAA,MAACW;AAAA,MAAA;AAAA,QAEC,WAAWC;AAAA,QACX,IAAI;AAAA,UACF,IAAI;AAAA,UACJ,SAAS,OAAOF,CAAK;AAAA,QAAA;AAAA,QAGvB,UAAA;AAAA,UAAA,gBAAAL,EAACC,GAAA,EAAS,OAAO,QAAQ,QAAQ,SAAS;AAAA,UAC1C,gBAAAD,EAACQ,GAAA,EAAc,SAAS,GAAG,SAAS,EAAA,CAAG;AAAA,QAAA;AAAA,MAAA;AAAA,MARlCH;AAAA,IAAA,CAUR;AAAA,EAAA,GACH;AAEJ;AAEA,SAASI,GAAehB,GAA4B;AAClD,QAAM;AAAA,IACJ,OAAAiB;AAAA,IACA,aAAAC;AAAA,IACA,cAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,EAAA,IACTrB,GACE,EAAE,aAAAsB,EAAA,IAAgBC,EAAA,GAClB,EAAE,MAAMC,EAAA,IAAkBC,EAAA,GAC1B,EAAE,sBAAAC,EAAA,IAAyBC,EAAA,GAC3B,CAACC,GAA2BC,CAAgB,IAAIC,EAAA,GAEhDC,IAAiBC,EAAQ,MACxBb,IAIEc,EAAUT,GAAeL,CAAY,IAHnC,CAAA,GAIR,CAACA,GAAcK,CAAa,CAAC,GAE1BU,IAAwCF,EAAQ,OAC7C;AAAA,IACL,GAAGlC;AAAA,IACH,SAASuB,MAAa,2BAA2B,UAAU;AAAA,EAAA,IAE5D,CAACA,CAAQ,CAAC,GACPc,IAAgBd,MAAa,2BAA2B,KAAK,KAC7D,EAAE,MAAMe,EAAA,IAAuBC,EAAiB;AAAA,IACpD,UAAU,CAAC,sBAAsBlB,GAAcY,CAAc;AAAA,IAC7D,SAAS,YAAY;AACnB,UAAI,CAACZ;AACH,eAAO,CAAA;AAGT,YAAMmB,IAAgB,CACpBC,MAEAf,EAAc,aAAc;AAAA,QAC1B,CAAAgB,MAAeA,EAAY,SAASD,EAAY;AAAA,MAAA,GAC/C;AAEL,aAAO,QAAQ;AAAA,QACbR,EAAe,IAAI,OAAOU,GAAM7B,MACb,MAAM8B;AAAA,UACrBD;AAAA,UACAH,EAAcG,CAAI;AAAA,UAClB7B,IAAQ;AAAA;AAAA,UACRS;AAAA,UACAC;AAAA,QAAA,CAGH;AAAA,MAAA;AAAA,IAEL;AAAA,EAAA,CACD,GAEKqB,IAAqBX,EAAQ,MAAM;AACvC,QAAI,CAACb;AACH,aAAO;AAIT,UAAMyB,IAAyDpB,GAC3D,OAAQ,IAAI,CAAAiB,MAAQ;AACpB,YAAMI,IACJJ,EACA;AACF,UAAII,GAAa;AACf,cAAMC,IACJD,EAAY,OAAO,CAAAE,MACVA,EAAW,UACnB;AACH,eAAOD,EAAoB,SAAS,IAChCA,EAAoB,CAAC,IACrB;AAAA,MACN;AACE;AAAA,IAEJ,CAAC,EACA,OAAO,OAAKE,MAAM,MAAS,EAAE,CAAC;AAEjC,WAAIJ,KAAiBA,EAAc,QAC1BA,GAAe,QAEjB;AAAA,EACT,GAAG,CAACzB,GAAcK,GAAe,MAAM,CAAC,GAElCyB,IAAyBb,EAAmB,SAAS,GACrDc,IACJjC,MACCgC,IACGN,IACAjB,EAAqBK,EAAe,CAAC,EAAE,UAAU;AACvD,SACE,gBAAA7B,EAACC,KAAM,WAAWC,GAA4B,IAAI,EAAE,UAAU,YAC5D,UAAA;AAAA,IAAA,gBAAAF;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,WAAWC;AAAA,QAEX,UAAA;AAAA,UAAA,gBAAAC,EAAC4C,GAAA,EAAW,SAAS,aAAc,UAAAD,GAAU;AAAA,UAC5ChC,KACC,gBAAAX,EAAC4C,GAAA,EAAW,SAAS,SAAS,IAAI,EAAE,OAAO,YAAY,IAAI,EAAA,GACzD,UAAA,gBAAA5C,EAAC6C,GAAA,EAAS,SAASlC,GAAa,mBAAmB,KAAK,GAC1D;AAAA,UAGDE,KAAmBuB,KAClB,gBAAApC,EAAC8C,GAAA,EAAI,IAAI,EAAE,IAAI,KACb,UAAA,gBAAAnD;AAAA,YAACQ;AAAA,YAAA;AAAA,cACC,SAAS;AAAA,cACT,MAAMU;AAAA,cACN,OAAO;AAAA,cACP,IAAI,CAAAkC,OAAU;AAAA,gBACZ,CAACA,EAAM,YAAY,KAAK,IAAI,CAAC,GAAG,EAAE,OAAO,OAAA;AAAA,cAAO;AAAA,cAEnD,UAAA;AAAA,gBAAA;AAAA,gBACUX;AAAA,cAAA;AAAA,YAAA;AAAA,UAAA,EACX,CACF;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAKHP,EAAmB,IAAI,CAACmB,GAAU3C,wBAE9B4C,GAAA,EACC,UAAA,gBAAAtD;AAAA,MAACW;AAAA,MAAA;AAAA,QACC,WAAWC;AAAA,QACX,IAAI;AAAA,UACF,IAAIF,MAAU,IAAI,IAAI;AAAA,UACtB,SAAS,OAAOA,CAAK;AAAA,QAAA;AAAA,QAItB,UAAA;AAAA,UAAAA,KAAS,uBAAM6C,GAAA,EAAQ,IAAI,EAAE,IAAI,GAAG,IAAI,EAAA,EAAE,CAAG;AAAA,4BAC7CJ,GAAA,EAAI,IAAI,EAAE,WAAW,WACpB,UAAA;AAAA,YAAA,gBAAA9C;AAAA,cAAC8C;AAAA,cAAA;AAAA,gBACC,KAAKxB;AAAA,gBACL,IAAI;AAAA,kBACF,SAAS;AAAA,kBACT,gBAAgB;AAAA,kBAChB,YAAY;AAAA,gBAAA;AAAA,gBAGd,UAAA,gBAAAtB;AAAA,kBAACmD;AAAA,kBAAA;AAAA,oBAIC,QAAQxB;AAAA,oBACR,MAAMqB,GAAU,QAAQ,CAAA;AAAA,oBACxB,OAAOI;AAAA,sBACL/B,GAA2B;AAAA,sBAC3BP;AAAA,sBACAc;AAAA,oBAAA;AAAA,oBAEF,QAAQ,EAAE,gBAAgB,GAAA;AAAA,kBAAM;AAAA,kBAV3B,GAAGhB,EAAcP,CAAK,CAAC,IAC1BgB,GAA2B,KAC7B;AAAA,gBAAA;AAAA,cASF;AAAA,YAAA;AAAA,YAEF,gBAAArB,EAAC8C,KAAI,IAAI,EAAE,IAAI,GAAG,OAAO,UACvB,UAAA,gBAAA9C;AAAA,cAACqD;AAAA,cAAA;AAAA,gBACC,WAAWlC;AAAA,kBACTK,EAAenB,CAAK,EAAE;AAAA,gBAAA;AAAA,gBAExB,QAAQ2C,GAAU;AAAA,gBAClB,QAAQA,GAAU;AAAA,gBAClB,YAAY;AAAA,gBACZ,iBAAiBnC;AAAA,cAAA;AAAA,YAAA,EACnB,CACF;AAAA,UAAA,EAAA,CACF;AAAA,QAAA;AAAA,MAAA;AAAA,MArCKR;AAAA,IAAA,KAPMA,CA8Cf,CAEH;AAAA,EAAA,GACH;AAEJ;AAEA,SAAwBiD,GAA2B7D,GAA4B;AAC7E,SACE,gBAAAO;AAAA,IAACuD;AAAA,IAAA;AAAA,MACC,4BAAW/D,IAAA,EAAY,WAAWC,EAAM,gBAAgB,IAAI,QAAQ;AAAA,MAEpE,UAAA,gBAAAO,EAACS,IAAA,EAAgB,GAAGhB,EAAA,CAAO;AAAA,IAAA;AAAA,EAAA;AAGjC;"}
+{"version":3,"file":"FacetPlotsCard.js","sources":["../../../src/components/FeaturedDataTabs/FacetPlotsCard.tsx"],"sourcesContent":["import { useSynapseContext } from '@/utils/context/SynapseContext'\nimport {\n  Box,\n  Button,\n  Divider,\n  Paper,\n  Skeleton,\n  Typography,\n} from '@mui/material'\nimport {\n  ColumnTypeEnum,\n  FacetColumnResult,\n  FacetColumnResultValueCount,\n  FacetColumnResultValues,\n} from '@sage-bionetworks/synapse-types'\nimport { useSuspenseQuery } from '@tanstack/react-query'\nimport { times } from 'lodash-es'\nimport Plotly from 'plotly.js-basic-dist'\nimport { Fragment, Suspense, useMemo } from 'react'\nimport Plot from '../Plot/Plot'\nimport { useQueryVisualizationContext } from '../QueryVisualizationWrapper'\nimport { useSuspenseGetQueryMetadata } from '../QueryWrapper/useGetQueryMetadata'\nimport { ShowMore } from '../row_renderers/utils'\nimport { SkeletonParagraph, SkeletonTable } from '../Skeleton'\nimport {\n  extractPlotDataArray,\n  getPlotStyle,\n  PlotType,\n} from '../widgets/facet-nav/FacetNavPanel'\nimport { FacetPlotLegendTable } from '../widgets/facet-nav/FacetPlotLegendTable'\nimport { getFacets } from '../widgets/facet-nav/useFacetPlots'\nimport {\n  FACET_PLOTS_CARD_CLASSNAME,\n  FACET_PLOTS_CARD_PLOT_CONTAINER_CLASSNAME,\n  FACET_PLOTS_CARD_TITLE_CONTAINER_CLASSNAME,\n  FacetPlotsCardPlotContainer,\n  FacetPlotsCardTitleContainer,\n} from './FacetPlotsCardGrid'\nimport { useMeasure } from '@react-hookz/web'\n\nexport type FacetPlotsCardProps = {\n  title?: string\n  description?: string\n  facetsToPlot?: string[]\n  detailsPagePath?: string\n  plotType?: PlotType\n}\n\nconst layout: Partial<Plotly.Layout> = {\n  showlegend: false,\n  annotations: [],\n  margin: { l: 0, r: 0, b: 0, t: 0, pad: 0 },\n  yaxis: {\n    visible: false,\n    showgrid: false,\n  },\n  xaxis: {\n    visible: false,\n    showgrid: false,\n  },\n}\n\nfunction LoadingCard(props: { numPlots: number }) {\n  const { numPlots } = props\n  return (\n    <Paper className={FACET_PLOTS_CARD_CLASSNAME}>\n      <FacetPlotsCardTitleContainer\n        className={FACET_PLOTS_CARD_TITLE_CONTAINER_CLASSNAME}\n      >\n        <Skeleton width={'60%'} height={'24px'} />\n\n        <SkeletonParagraph numRows={5} />\n\n        <Skeleton width={'40%'}>\n          <Button variant={'contained'}>Explore</Button>\n        </Skeleton>\n      </FacetPlotsCardTitleContainer>\n      {times(numPlots).map(index => (\n        <FacetPlotsCardPlotContainer\n          key={index}\n          className={FACET_PLOTS_CARD_PLOT_CONTAINER_CLASSNAME}\n          sx={{\n            py: 3,\n            gridRow: `plot${index}`,\n          }}\n        >\n          <Skeleton width={'100%'} height={'300px'} />\n          <SkeletonTable numRows={4} numCols={2} />\n        </FacetPlotsCardPlotContainer>\n      ))}\n    </Paper>\n  )\n}\n\nfunction FacetPlotsCard(props: FacetPlotsCardProps) {\n  const {\n    title,\n    description,\n    facetsToPlot,\n    detailsPagePath,\n    plotType = 'PIE',\n  } = props\n  const { accessToken } = useSynapseContext()\n  const { data: queryMetadata } = useSuspenseGetQueryMetadata()\n  const { getColumnDisplayName } = useQueryVisualizationContext()\n  const [plotContainerMeasurements, plotContainerRef] = useMeasure()\n\n  const facetDataArray = useMemo(() => {\n    if (!facetsToPlot) {\n      return []\n    }\n\n    return getFacets(queryMetadata, facetsToPlot)\n  }, [facetsToPlot, queryMetadata])\n\n  const currentLayout: Partial<Plotly.Layout> = useMemo(() => {\n    return {\n      ...layout,\n      barmode: plotType === 'STACKED_HORIZONTAL_BAR' ? 'stack' : undefined,\n    }\n  }, [plotType])\n  const maxPlotHeight = plotType === 'STACKED_HORIZONTAL_BAR' ? 50 : 150\n  const { data: facetPlotDataArray } = useSuspenseQuery({\n    queryKey: ['facetPlotDataArray', facetsToPlot, facetDataArray],\n    queryFn: async () => {\n      if (!facetsToPlot) {\n        return []\n      }\n\n      const getColumnType = (\n        facetToPlot: FacetColumnResult,\n      ): ColumnTypeEnum | undefined =>\n        queryMetadata.columnModels!.find(\n          columnModel => columnModel.name === facetToPlot.columnName,\n        )?.columnType as ColumnTypeEnum\n\n      return Promise.all(\n        facetDataArray.map(async (item, index) => {\n          const plotData = await extractPlotDataArray(\n            item as FacetColumnResultValues,\n            getColumnType(item),\n            index + 1, //individual plot rgbIndex\n            plotType,\n            accessToken,\n          )\n          return plotData\n        }),\n      )\n    },\n  })\n\n  const selectedFacetValue = useMemo(() => {\n    if (!facetsToPlot) {\n      return ''\n    }\n\n    // If we are showing a facet selection based card, then set the selectedFacetValue.  For example, facet column \"study\" with value \"ROSMAP\"\n    const selectedFacet: FacetColumnResultValueCount | undefined = queryMetadata\n      ?.facets!.map(item => {\n        const facetValues: FacetColumnResultValueCount[] = (\n          item as FacetColumnResultValues\n        ).facetValues\n        if (facetValues) {\n          const filteredFacetValues: FacetColumnResultValueCount[] =\n            facetValues.filter(facetValue => {\n              return facetValue.isSelected\n            })\n          return filteredFacetValues.length > 0\n            ? filteredFacetValues[0]\n            : undefined\n        } else {\n          return undefined\n        }\n      })\n      .filter(x => x !== undefined)[0]\n\n    if (selectedFacet && selectedFacet.value) {\n      return selectedFacet?.value\n    }\n    return ''\n  }, [facetsToPlot, queryMetadata?.facets])\n\n  const isShowingMultiplePlots = facetPlotDataArray.length > 1\n  const cardTitle =\n    title ??\n    (isShowingMultiplePlots\n      ? selectedFacetValue\n      : getColumnDisplayName(facetDataArray[0].columnName))\n  return (\n    <Paper className={FACET_PLOTS_CARD_CLASSNAME} sx={{ overflow: 'hidden' }}>\n      <FacetPlotsCardTitleContainer\n        className={FACET_PLOTS_CARD_TITLE_CONTAINER_CLASSNAME}\n      >\n        <Typography variant={'headline1'}>{cardTitle}</Typography>\n        {description && (\n          <Typography variant={'body1'} sx={{ color: 'grey.700', my: 2 }}>\n            <ShowMore summary={description} maxCharacterCount={200} />\n          </Typography>\n        )}\n\n        {detailsPagePath && selectedFacetValue && (\n          <Box sx={{ my: 2 }}>\n            <Button\n              variant={'contained'}\n              href={detailsPagePath}\n              color={'secondary'}\n              sx={theme => ({\n                [theme.breakpoints.down('sm')]: { width: '100%' },\n              })}\n            >\n              Explore {selectedFacetValue}\n            </Button>\n          </Box>\n        )}\n      </FacetPlotsCardTitleContainer>\n\n      {/* create a plot for every facet to be plotted */}\n      {facetPlotDataArray.map((plotData, index) => {\n        return (\n          <Fragment key={index}>\n            <FacetPlotsCardPlotContainer\n              className={FACET_PLOTS_CARD_PLOT_CONTAINER_CLASSNAME}\n              sx={{\n                pt: index === 0 ? 5 : 0,\n                gridRow: `plot${index}`,\n              }}\n              key={index}\n            >\n              {index != 0 && <Divider sx={{ mt: 2, mb: 4 }} />}\n              <Box sx={{ minHeight: '130px' }}>\n                <Box\n                  ref={plotContainerRef}\n                  sx={{\n                    display: 'flex',\n                    justifyContent: 'center',\n                    alignItems: 'center',\n                  }}\n                >\n                  <Plot\n                    key={`${facetsToPlot![index]}-${\n                      plotContainerMeasurements?.width\n                    }`}\n                    layout={currentLayout}\n                    data={plotData?.data ?? []}\n                    style={getPlotStyle(\n                      plotContainerMeasurements?.width,\n                      plotType,\n                      maxPlotHeight,\n                    )}\n                    config={{ displayModeBar: false }}\n                  />\n                </Box>\n                <Box sx={{ mt: 4, width: '100%' }}>\n                  <FacetPlotLegendTable\n                    facetName={getColumnDisplayName(\n                      facetDataArray[index].columnName,\n                    )}\n                    labels={plotData?.labels}\n                    colors={plotData?.colors}\n                    isExpanded={false}\n                    linkToFullQuery={detailsPagePath}\n                  />\n                </Box>\n              </Box>\n            </FacetPlotsCardPlotContainer>\n          </Fragment>\n        )\n      })}\n    </Paper>\n  )\n}\n\nexport default function FacetPlotsCardWithSuspense(props: FacetPlotsCardProps) {\n  return (\n    <Suspense\n      fallback={<LoadingCard numPlots={(props.facetsToPlot ?? []).length} />}\n    >\n      <FacetPlotsCard {...props} />\n    </Suspense>\n  )\n}\n"],"names":["layout","LoadingCard","props","numPlots","jsxs","Paper","FACET_PLOTS_CARD_CLASSNAME","FacetPlotsCardTitleContainer","FACET_PLOTS_CARD_TITLE_CONTAINER_CLASSNAME","jsx","Skeleton","SkeletonParagraph","Button","times","index","FacetPlotsCardPlotContainer","FACET_PLOTS_CARD_PLOT_CONTAINER_CLASSNAME","SkeletonTable","FacetPlotsCard","title","description","facetsToPlot","detailsPagePath","plotType","accessToken","useSynapseContext","queryMetadata","useSuspenseGetQueryMetadata","getColumnDisplayName","useQueryVisualizationContext","plotContainerMeasurements","plotContainerRef","useMeasure","facetDataArray","useMemo","getFacets","currentLayout","maxPlotHeight","facetPlotDataArray","useSuspenseQuery","getColumnType","facetToPlot","columnModel","item","extractPlotDataArray","selectedFacetValue","selectedFacet","facetValues","filteredFacetValues","facetValue","x","isShowingMultiplePlots","cardTitle","Typography","ShowMore","Box","theme","plotData","Fragment","Divider","Plot","getPlotStyle","FacetPlotLegendTable","FacetPlotsCardWithSuspense","Suspense"],"mappings":"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"}