synapse-react-client/dist/components/ChallengeSubmission/SubmissionDirectoryList.js

[](https://badge.fury.io/js/synapse-react-client) [](https://github.com/prettier/prettie

import { jsx as i, jsxs as d } from "react/jsx-runtime";
import * as h from "../../synapse-client/SynapseClient.js";
import "@sage-bionetworks/synapse-client/generated/models/ErrorResponseCode";
import "@sage-bionetworks/synapse-client/generated/models/TwoFactorAuthErrorResponse";
import "@sage-bionetworks/synapse-client/util/SynapseClientError";
import { Direction as se, SortBy as de, FILE_ENTITY_CONCRETE_TYPE_VALUE as B } from "@sage-bionetworks/synapse-types";
import "../../utils/functions/EntityTypeUtils.js";
import { getEndpoint as L, BackendDestinationEnum as G } from "../../utils/functions/getEndpoint.js";
import "lodash-es";
import "@sage-bionetworks/synapse-client/util/synapseClientFetch";
import { useQueryClient as le } from "@tanstack/react-query";
import "../../utils/PermissionLevelToAccessType.js";
import "../../utils/SynapseConstants.js";
import { useState as a, useEffect as U, useMemo as ce } from "react";
import { useSynapseContext as me } from "../../utils/context/SynapseContext.js";
import "use-deep-compare-effect";
import { Radio as pe, Box as c, Typography as S, Button as ue } from "@mui/material";
import "../../utils/hooks/useCookiePreferences.js";
import "../../utils/hooks/useSourceAppConfigs.js";
import "universal-cookie";
import "../../utils/AppUtils/session/ApplicationSessionContext.js";
import "../../utils/context/FullContextProvider.js";
import "../../utils/context/DocumentMetadataContext.js";
import '../../style/components/_spinner.css';/* empty css                                   */
import { invalidateAllQueriesForEntity as fe } from "../../synapse-queries/QueryFilterUtils.js";
import "lodash-es/isEmpty";
import "lodash-es/isEqual";
import "lodash-es/xorWith";
import { Link as N } from "react-router";
import { EntityType as g } from "@sage-bionetworks/synapse-client";
import "../../utils/types/IsType.js";
import { useGetEntities as he } from "../../synapse-queries/entity/useEntity.js";
import { useGetEntityChildren as ge } from "../../synapse-queries/entity/useGetEntityChildren.js";
import { formatDate as ye } from "../../utils/functions/DateFormatter.js";
import { InfoTwoTone as Ce } from "@mui/icons-material";
import { DataGrid as be } from "@mui/x-data-grid";
import xe from "dayjs";
import { ConfirmationDialog as Ee } from "../ConfirmationDialog/ConfirmationDialog.js";
import { CopyToClipboardIcon as we } from "../CopyToClipboardIcon.js";
import { ErrorBanner as ke } from "../error/ErrorBanner.js";
import { FileUpload as De } from "../FileUpload/FileUpload.js";
import Ie from "../IconSvg/IconSvg.js";
function ut({
  pageSize: F,
  challengeProjectId: m,
  entityType: l,
  onItemSelected: q
}) {
  const T = le(), { accessToken: f, keyFactory: v } = me(), [C, z] = a(0), [P, Y] = a(), [M, n] = a(), [$, b] = a(), [x, O] = a([]), [Q, H] = a(), [j, E] = a(!1), [J, w] = a(!1), [y, R] = a(), p = F, k = 50, _ = `${L(
    G.PORTAL_ENDPOINT
  )}Synapse:${m}`, K = {
    parentId: m,
    nextPageToken: j ? Q : null,
    includeTypes: [l],
    includeTotalChildCount: !0,
    sortBy: de.MODIFIED_ON,
    sortDirection: se.DESC
  }, { data: u, refetch: V } = ge(K, {
    enabled: !!m,
    throwOnError: !0
  });
  U(() => {
    if (u) {
      const e = [...x], t = Math.floor((C + 1) * p / k) * k;
      e.splice(t, t + k, ...u.page), O(e), E(!1), H(u.nextPageToken);
    }
  }, [u]);
  function W() {
    const e = C * p;
    return x.slice(e, e + p);
  }
  function D() {
    n(void 0), b(void 0), O([]), H(void 0), E(!1), V();
  }
  U(() => {
    D();
  }, [l, F]);
  const I = he(W()), A = ce(
    () => I.filter((e) => e.status === "success").map((e) => e.data),
    [I]
  ), X = I.some((e) => e.isLoading), Z = async (e) => {
    b(!1);
    const o = A.find((t) => t?.id === e);
    if (o) {
      if (Y(o), l === g.dockerrepo) {
        let t;
        try {
          t = await h.getDockerTag(
            o.id,
            f,
            0,
            1
          );
        } catch (r) {
          return n(r.message);
        }
        if (t.totalNumberOfResults === 0)
          return n(
            "No commits have been made to this repository. Please select a repository with at least one commit."
          );
      }
      b(!0), n(void 0);
    }
  }, ee = [
    {
      field: "radiobutton",
      headerName: "",
      width: 25,
      sortable: !1,
      filterable: !1,
      hideable: !1,
      disableColumnMenu: !0,
      renderCell: (e) => /* @__PURE__ */ i(
        pe,
        {
          value: e.id,
          checked: e.id === P?.id,
          onChange: (o) => {
            Z(o.target.value);
          }
        }
      )
    },
    {
      field: "name",
      headerName: l === g.dockerrepo ? "Docker Repository" : "File Name",
      flex: 1,
      filterable: !1,
      hideable: !1,
      disableColumnMenu: !0,
      renderCell: (e) => /* @__PURE__ */ i(
        N,
        {
          to: {
            pathname: `${L(
              G.PORTAL_ENDPOINT
            )}Synapse:${e.row.id}`
          },
          target: "_blank",
          children: e.row.name
        }
      )
    },
    {
      field: "modifiedOn",
      headerName: "Updated On",
      width: 100,
      filterable: !1,
      hideable: !1,
      disableColumnMenu: !0
    },
    {
      field: "id",
      headerName: "ID",
      width: 200,
      filterable: !1,
      hideable: !1,
      disableColumnMenu: !0
    }
  ], te = (e) => {
    const o = [];
    return e.forEach((t) => {
      o.push({
        id: t.id,
        name: l === g.dockerrepo ? t.repositoryName ?? t.name : t.name,
        modifiedOn: ye(xe(t.modifiedOn), "MM/DD/YY")
      });
    }), o;
  }, oe = (e) => {
    Math.min(
      u?.totalChildCount ?? 0,
      (e + 1) * p
    ) > x.length && E(!0), z(e);
  }, ie = () => {
    q(P);
  };
  function ne(e) {
    if (!e) return;
    const { fileHandleId: o, fileName: t } = e, r = {
      parentId: m,
      name: t,
      concreteType: B,
      dataFileHandleId: o
    };
    h.createEntity(r, f).then(() => {
      D();
    }).catch((s) => {
      n(s.reason);
    });
  }
  async function re() {
    if (!y) return;
    const { fileHandleId: e, entityId: o } = y;
    if (!o)
      return n("Error: missing entityId. Please try again.");
    let t;
    try {
      t = await h.getEntity(f, o);
    } catch {
      return n(`The entity ${o} could not be retrieved.`);
    }
    const r = {
      id: t.id,
      name: t.name,
      dataFileHandleId: e,
      concreteType: B,
      parentId: t.parentId,
      etag: t.etag,
      modifiedOn: t.modifiedOn
    };
    try {
      const s = await h.updateEntity(
        r,
        f,
        !0
      );
      await fe(
        T,
        v,
        s.id
      ), T.setQueryData(
        v.getEntityQueryKey(s.id),
        s
      ), D();
    } catch (s) {
      n(s.reason);
    }
  }
  const ae = async (e) => {
    if (e.success && e.resp) {
      const { fileName: o } = e.resp, t = {
        entityName: o,
        parentId: m
      };
      try {
        const r = await h.lookupChildEntity(
          t,
          f
        );
        r && (R({ ...e.resp, entityId: r.id }), w(!0));
      } catch {
        R(void 0), ne(e.resp);
      }
    } else !e.success && e.error ? n(e.error.reason) : n("An unknown error occurred. Please try again.");
  };
  return /* @__PURE__ */ d(c, { children: [
    /* @__PURE__ */ d(
      c,
      {
        sx: {
          display: "flex",
          backgroundColor: "#FBFBFC",
          padding: "10px",
          justifyContent: "space-between"
        },
        children: [
          /* @__PURE__ */ i(
            S,
            {
              variant: "h6",
              sx: { fontSize: "18px", lineHeight: "20px", fontWeight: 700 },
              children: "Your Submission Directory"
            }
          ),
          /* @__PURE__ */ d(c, { sx: { display: "flex" }, children: [
            /* @__PURE__ */ d(
              S,
              {
                variant: "body1",
                sx: { fontSize: "14px", color: "#71767F" },
                children: [
                  "Project SynID:",
                  "  ",
                  /* @__PURE__ */ i(N, { to: { pathname: _ }, target: "_blank", children: m })
                ]
              }
            ),
            /* @__PURE__ */ i(we, { value: _, sx: { marginTop: "-4px" } })
          ] })
        ]
      }
    ),
    /* @__PURE__ */ i(c, { children: /* @__PURE__ */ i(
      be,
      {
        loading: X,
        columns: ee,
        rows: te(A),
        rowCount: u?.totalChildCount ?? 0,
        pagination: !0,
        paginationMode: "server",
        paginationModel: { page: C, pageSize: p },
        pageSizeOptions: [p],
        onPaginationModelChange: ({ page: e }) => {
          oe(e);
        },
        density: "compact",
        autoHeight: !0,
        sx: {
          fontSize: "14px",
          border: "none",
          height: "100%",
          "& .MuiDataGrid-columnHeader": {
            backgroundColor: "#F1F3F5"
          },
          "& .Mui-odd": {
            backgroundColor: "#FBFBFC"
          },
          ".MuiDataGrid-columnHeaderTitleContainer": {
            justifyContent: "space-between"
          },
          ".radio": {
            display: "flex",
            alignItems: "center",
            height: "100%"
          }
        },
        getRowClassName: (e) => e.indexRelativeToCurrentPage % 2 === 0 ? "Mui-even" : "Mui-odd"
      }
    ) }),
    M && /* @__PURE__ */ i(ke, { error: M }),
    /* @__PURE__ */ d(
      c,
      {
        sx: {
          display: "flex",
          justifyContent: "space-between"
        },
        children: [
          l === g.file && /* @__PURE__ */ i(
            De,
            {
              label: "Upload File",
              buttonProps: {
                variant: "outlined",
                endIcon: /* @__PURE__ */ i(Ie, { icon: "upload" }),
                sx: { lineHeight: 1 }
              },
              onComplete: (e) => {
                ae(e);
              }
            }
          ),
          /* @__PURE__ */ i(
            ue,
            {
              color: "primary",
              variant: "contained",
              onClick: ie,
              disabled: !$,
              children: "Submit Selection"
            }
          )
        ]
      }
    ),
    l === g.dockerrepo && /* @__PURE__ */ d(
      c,
      {
        sx: {
          mt: 4,
          display: "flex"
        },
        children: [
          /* @__PURE__ */ i(
            Ce,
            {
              sx: {
                width: "16px",
                height: "16px",
                verticalAlign: "text-bottom"
              }
            }
          ),
          /* @__PURE__ */ d(
            c,
            {
              sx: {
                ml: 2
              },
              children: [
                "To learn more about how to create and submit the Docker containers using command line, see our",
                " ",
                /* @__PURE__ */ i(
                  N,
                  {
                    to: "https://github.com/Sage-Bionetworks-Challenges/sample-model-templates#build-your-model",
                    target: "_blank",
                    children: "Docker model submission guide"
                  }
                ),
                "."
              ]
            }
          )
        ]
      }
    ),
    /* @__PURE__ */ i(
      Ee,
      {
        open: J,
        title: "File exists",
        content: /* @__PURE__ */ d(S, { variant: "body1", sx: { fontSize: "16px" }, children: [
          'A file named "',
          y?.fileName,
          '" (',
          y?.entityId,
          ") already exists in this location. Do you want to update the existing file and create a new version?"
        ] }),
        onCancel: () => w(!1),
        onConfirm: () => {
          re(), w(!1);
        }
      }
    )
  ] });
}
export {
  ut as default
};
//# sourceMappingURL=SubmissionDirectoryList.js.map