UNPKG

synapse-react-client

Version:

[![npm version](https://badge.fury.io/js/synapse-react-client.svg)](https://badge.fury.io/js/synapse-react-client) [![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettie

412 lines (410 loc) 19.2 kB
import { jsx as e, jsxs as a, Fragment as $ } from "react/jsx-runtime"; import i from "./DownloadCartPage.module.scss.js"; import * as B 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 { FeatureFlagEnum as q } from "@sage-bionetworks/synapse-types"; import "../../utils/functions/EntityTypeUtils.js"; import "../../utils/SynapseConstants.js"; import "lodash-es"; import "@sage-bionetworks/synapse-client/util/synapseClientFetch"; import { useGetDownloadListStatistics as z } from "../../synapse-queries/download/useDownloadList.js"; import { useGetFeatureFlag as H } from "../../synapse-queries/featureflags/useGetFeatureFlag.js"; import { useSynapseContext as M } from "../../utils/context/SynapseContext.js"; import { DeleteTwoTone as G } from "@mui/icons-material"; import { Tooltip as g, Button as h, Typography as n } from "@mui/material"; import { useState as c, useRef as Z, useEffect as v } from "react"; import { ErrorBanner as V } from "../error/ErrorBanner.js"; import Y from "../FullWidthAlert/FullWidthAlert.js"; import d from "../IconSvg/IconSvg.js"; import { ProgrammaticInstructionsModal as U } from "../ProgrammaticInstructionsModal/ProgrammaticInstructionsModal.js"; import W from "./AvailableForDownloadTable.js"; import { CreatePackageV2 as j } from "./CreatePackageV2.js"; import { PYTHON_CLIENT_IMPORT_AND_LOGIN as J } from "./DirectProgrammaticDownload.js"; import { calculateFriendlyFileSize as K } from "../../utils/functions/calculateFriendlyFileSize.js"; import { DownloadIneligibleForPackagingFilesFromListButton as Q } from "./DownloadIneligibleForPackagingFilesFromListButton.js"; import { DownloadListActionsRequired as X } from "./DownloadListActionsRequired.js"; import w from "../ComponentCollapse.js"; const ee = `${J} dl_list_file_entities = syn.get_download_list()`, ie = "synapse get-download-list", I = [ { label: "All Files", filter: void 0 }, { label: "Files included in ZIP", filter: "eligibleForPackaging" }, { label: "Files not included in ZIP", filter: "ineligibleForPackaging" } ]; function xe(S) { const { accessToken: A } = M(), [t, p] = c(0), [u, x] = c(0), F = I[u].filter, [b, D] = c(!1), N = Z(null); v(() => { b && N.current?.scrollIntoView({ behavior: "smooth", block: "center" }); }, [b]); const [P, y] = c(!1), [O, C] = c(!1), [k, T] = c(), L = H( q.DOWNLOAD_CART_INELIGIBLE_FILE_DOWNLOADS ), { data: l, isLoading: m, isError: r, error: f, refetch: E } = z(); v(() => { r && f && T(f); }, [r, f]); const _ = (o, s) => s === void 0 ? o.numberOfFilesAvailableForDownload : s === "eligibleForPackaging" ? o.numberOfFilesAvailableForDownloadAndEligibleForPackaging : o.numberOfFilesAvailableForDownload - o.numberOfFilesAvailableForDownloadAndEligibleForPackaging; if (v(() => { l && l.numberOfFilesRequiringAction == 0 && p(1), l && l.numberOfFilesAvailableForDownloadAndEligibleForPackaging === 0 && D(!1); }, [l]), k) return /* @__PURE__ */ e(V, { error: k }); const R = async () => { await B.clearDownloadListV2(A), E(); }; return /* @__PURE__ */ a("div", { className: i.DownloadCartPage, children: [ /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e("div", { className: `${i.pageHeader}`, children: /* @__PURE__ */ e("div", { className: "container", children: /* @__PURE__ */ a("div", { className: i.grid, children: [ /* @__PURE__ */ e("h3", { className: "pageHeaderTitle", children: "Your Download List" }), /* @__PURE__ */ e( g, { title: "Immediately removes all items from your download list", enterNextDelay: 300, placement: "right", children: /* @__PURE__ */ e( h, { onClick: () => { R(); }, variant: "text", color: "primary", startIcon: /* @__PURE__ */ e(G, {}), children: "Clear Your Download List" } ) } ) ] }) }) }) }), /* @__PURE__ */ e("div", { className: i.tabsContainer, children: /* @__PURE__ */ e("div", { className: "container", children: /* @__PURE__ */ a("ul", { className: i.navTabs, children: [ /* @__PURE__ */ e( "li", { className: `${i.navItem}${t == 0 ? ` ${i.active}` : ""}`, "aria-selected": t == 0, children: /* @__PURE__ */ a("button", { onClick: () => p(0), children: [ "Access Actions Required", !r && !m && l && /* @__PURE__ */ e("span", { className: i.fileCount, children: l.totalNumberOfFiles - l.numberOfFilesAvailableForDownload }) ] }) } ), /* @__PURE__ */ e( "li", { className: `${i.navItem}${t == 1 ? ` ${i.active}` : ""}`, "aria-selected": t == 1, children: /* @__PURE__ */ a("button", { onClick: () => p(1), children: [ "Download List", !r && !m && l && /* @__PURE__ */ e("span", { className: i.fileCount, children: l.numberOfFilesAvailableForDownload }) ] }) } ) ] }) }) }), /* @__PURE__ */ a( "div", { className: ( /* The DownloadListActionsRequired component stores actions in local state to track which actions are completed. Mount the actions required component and hide it with style to ensure actions stored in component state are persisted as the user switches tabs */ t == 0 && !r && !m && l ? void 0 : i.hidden ), children: [ l?.numberOfFilesRequiringAction && l.numberOfFilesRequiringAction > 0 && // Unmount instead of hiding the DownloadListActionsRequired component when there are 0 actions required // The DownloadListActionsRequired cannot discern between a fulfilled action and an action that is no longer required because the // file was removed from the download cart. // In the typical case where the download cart is cleared, unmounting the component ensures that the actions are cleared out. /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e("div", { className: "container", children: /* @__PURE__ */ e(X, { ...S }) }) }), l?.numberOfFilesRequiringAction === 0 && /* @__PURE__ */ e("div", { className: i.placeholder, children: /* @__PURE__ */ e("div", { children: "No actions are currently required." }) }) ] } ), t == 1 && !r && !m && l && /* @__PURE__ */ a("div", { children: [ l.numberOfFilesAvailableForDownload > 0 && /* @__PURE__ */ a("div", { className: `container ${i.DownloadListTabContent}`, children: [ /* @__PURE__ */ a("h3", { className: `${i.sectionTitle} pageHeaderTitle`, children: [ "Bulk Download Options", l.sumOfFileSizesAvailableForDownload != null && /* @__PURE__ */ e( g, { placement: "right", title: /* @__PURE__ */ a($, { children: [ "Total file size", /* @__PURE__ */ e("br", {}), "Does not include files hosted outside Synapse" ] }), slotProps: { tooltip: { sx: { maxWidth: 400 } } }, children: /* @__PURE__ */ a("span", { className: i.totalFileSize, children: [ K( l.sumOfFileSizesAvailableForDownload ), " ", "total*" ] }) } ) ] }), /* @__PURE__ */ e("div", { children: /* @__PURE__ */ a("div", { className: i.subSectionOverview, children: [ /* @__PURE__ */ a("div", { className: i.subSection, children: [ /* @__PURE__ */ a("div", { className: i.subSectionHeader, children: [ /* @__PURE__ */ e("div", { className: i.headline, children: /* @__PURE__ */ a(n, { variant: "headline3", children: [ /* @__PURE__ */ e(d, { icon: "packagableFile" }), " Web Download (.ZIP)" ] }) }), /* @__PURE__ */ a("div", { className: i.subSectionActions, children: [ l.numberOfFilesAvailableForDownloadAndEligibleForPackaging > 0 && /* @__PURE__ */ e( h, { variant: "contained", onClick: () => { D(!0); }, startIcon: /* @__PURE__ */ e(d, { icon: "download", wrap: !1 }), children: "Download Packages" } ), l.numberOfFilesAvailableForDownloadAndEligibleForPackaging == 0 && /* @__PURE__ */ e( g, { title: "You cannot create a .zip package because there are no eligible files.", enterNextDelay: 300, placement: "top", children: /* @__PURE__ */ e("span", { children: /* @__PURE__ */ e( h, { variant: "contained", disabled: !0, startIcon: /* @__PURE__ */ e(d, { icon: "download", wrap: !1 }), children: "Download Packages" } ) }) } ) ] }) ] }), /* @__PURE__ */ e( w, { component: /* @__PURE__ */ a(n, { variant: "body1", component: "div", children: [ "Only some files may be eligible for packaging as ZIP. Use the Individual Downloads tab, below, to download non-packageable files. ", /* @__PURE__ */ e( "a", { href: "https://help.synapse.org/docs/Downloading-Data-From-the-Synapse-UI.2004254837.html", target: "_blank", rel: "noopener noreferrer", children: "More Information." } ) ] }), collapseBoxSx: { backgroundColor: "transparent", p: 0, mt: "15px" }, componentContainerSx: { backgroundColor: "transparent", p: 0 }, iconSx: { width: "25px", height: "25px" }, children: /* @__PURE__ */ e( n, { variant: "body1", component: "div", sx: { marginBottom: "15px" }, children: /* @__PURE__ */ a("ul", { children: [ /* @__PURE__ */ e("li", { children: "Files are bundled into .ZIPs up to 1 GB each." }), /* @__PURE__ */ e("li", { children: "Larger selections are split into multiple packages." }), /* @__PURE__ */ e("li", { children: "Includes only files stored in Synapse native storage." }), /* @__PURE__ */ e("li", { children: "Each package contains a CSV manifest with file annotations and metadata." }) ] }) } ) } ) ] }), /* @__PURE__ */ a("div", { className: i.subSection, children: [ /* @__PURE__ */ a("div", { className: i.subSectionHeader, children: [ /* @__PURE__ */ e("div", { className: i.headline, children: /* @__PURE__ */ a(n, { variant: "headline3", children: [ /* @__PURE__ */ e(d, { icon: "code" }), " Programmatic Download" ] }) }), /* @__PURE__ */ e("div", { className: i.subSectionActions, children: /* @__PURE__ */ e( h, { variant: "contained", onClick: () => { y(!0); }, startIcon: /* @__PURE__ */ e(d, { icon: "download", wrap: !1 }), children: "Get R / Python / CLI Code" } ) }) ] }), /* @__PURE__ */ e( w, { component: /* @__PURE__ */ a(n, { variant: "body1", component: "div", children: [ "Use our Python, R, or command line clients to download files quickly. ", /* @__PURE__ */ e( "a", { href: "https://help.synapse.org/docs/Downloading-Data-Programmatically.2003796248.html", target: "_blank", rel: "noopener noreferrer", children: "More Information." } ) ] }), collapseBoxSx: { backgroundColor: "transparent", p: 0, mt: "15px" }, componentContainerSx: { backgroundColor: "transparent", p: 0 }, iconSx: { width: "25px", height: "25px" }, children: /* @__PURE__ */ e( n, { variant: "body1", component: "div", sx: { marginBottom: "15px" }, children: /* @__PURE__ */ a("ul", { children: [ /* @__PURE__ */ e("li", { children: "Requires a client (R, Python, or CLI)." }), /* @__PURE__ */ e("li", { children: "No limits on individual file size or total download size." }), /* @__PURE__ */ e("li", { children: "Includes files stored both on and off Synapse native storage." }), /* @__PURE__ */ e("li", { children: "Downloads include a CSV manifest with file annotations and metadata." }) ] }) } ) } ) ] }), L && l.numberOfFilesAvailableForDownloadAndEligibleForPackaging < l.numberOfFilesAvailableForDownload && /* @__PURE__ */ a("div", { className: i.subSection, children: [ /* @__PURE__ */ a("div", { className: i.subSectionHeader, children: [ /* @__PURE__ */ e("div", { className: i.headline, children: /* @__PURE__ */ a(n, { variant: "headline3", children: [ /* @__PURE__ */ e(d, { icon: "multiFile" }), " Multi-file Download" ] }) }), /* @__PURE__ */ e("div", { className: i.subSectionActions, children: /* @__PURE__ */ e("div", { className: i.ineligibleDownloadContainer, children: /* @__PURE__ */ e(Q, {}) }) }) ] }), /* @__PURE__ */ e( w, { component: /* @__PURE__ */ a(n, { variant: "body1", component: "div", children: [ "Files which ", /* @__PURE__ */ e("strong", { children: "aren't" }), " included in a ZIP package may be downloaded as a multi-file download. " ] }), collapseBoxSx: { backgroundColor: "transparent", p: 0, mt: "15px" }, componentContainerSx: { backgroundColor: "transparent", p: 0 }, iconSx: { width: "25px", height: "25px" }, children: /* @__PURE__ */ a( n, { variant: "body1", component: "div", sx: { marginBottom: "15px" }, children: [ "Clicking “Start Multi-file Download” initiates a download of all files in your Download List that can’t be bundled into a ZIP—such as large files or external links—in one step. Files are saved one by one with clear progress updates, automatic handling of duplicate names, and retry support if something fails. You can cancel anytime.", /* @__PURE__ */ e("br", {}), /* @__PURE__ */ e("br", {}), "Note: in some browsers, files download individually to your default Downloads folder instead of a selected location." ] } ) } ) ] }) ] }) }), /* @__PURE__ */ a("div", { children: [ b && /* @__PURE__ */ e("div", { ref: N, children: /* @__PURE__ */ e( j, { onPackageCreation: () => { C(!0); } } ) }), /* @__PURE__ */ e("h3", { className: `${i.sectionTitle} pageHeaderTitle`, children: "Download Individual Files" }), /* @__PURE__ */ e("div", { className: i.tabsContainer, children: /* @__PURE__ */ a("ul", { className: i.navTabs, children: [ /* @__PURE__ */ e("li", { className: i.navLabel, children: "View:" }), I.map((o, s) => /* @__PURE__ */ e( "li", { className: `${i.navItem}${u === s ? ` ${i.active}` : ""}`, "aria-selected": u === s, children: /* @__PURE__ */ a( "button", { onClick: () => x(s), children: [ o.label, !r && !m && l && /* @__PURE__ */ e("span", { className: i.fileCount, children: _(l, o.filter) }) ] } ) }, o.label )) ] }) }), /* @__PURE__ */ e("div", { className: i.availableForDownloadTableContainer, children: /* @__PURE__ */ e( W, { filter: F }, F ?? "all" ) }) ] }) ] }), l.numberOfFilesAvailableForDownload === 0 && /* @__PURE__ */ e("div", { className: i.placeholder, children: /* @__PURE__ */ e(n, { variant: "body1Italic", children: "Your Download List is currently empty." }) }) ] }), /* @__PURE__ */ e( Y, { show: O, variant: "success", title: "Package Created", description: "A package has been created with eligible files. The items contained in this .zip file have been removed from your list. If your package is over 1GB, you will need to create multiple packages.", autoCloseAfterDelayInSeconds: 10, onClose: () => { C(!1); } } ), P && /* @__PURE__ */ e( U, { show: !0, onClose: () => y(!1), title: "Download Programmatically", pythonCode: ee, cliCode: ie } ) ] }); } export { xe as DownloadCartPage, xe as default }; //# sourceMappingURL=DownloadCartPage.js.map