From 974de3bc5c896ac1d916d651bd8570f45adb364d Mon Sep 17 00:00:00 2001 From: Austen Money Date: Mon, 25 Nov 2024 13:06:54 -0500 Subject: [PATCH 1/6] add bulk file download to dataset detail page --- .../BulkDownloadButton/BulkDownloadButton.tsx | 0 .../{ => buttons}/BulkDownloadButton/index.ts | 0 .../BulkDownloadButtonFromSearch.tsx | 2 +- .../BulkDownloadButtonFromSearch/index.ts | 0 .../BulkDownloadTextButton.tsx | 24 +++++++++++++++++++ .../buttons/BulkDownloadTextButton/index.ts | 3 +++ .../BulkDataTransferSection.tsx | 17 +++++++++++-- .../detailPage/BulkDataTransfer/const.ts | 3 --- .../CollectionDatasetsTable.tsx | 2 +- .../RelatedEntitiesSectionActions.tsx | 2 +- .../static/js/components/search/Search.tsx | 2 +- .../SearchBarLayout/SearchBarLayout.jsx | 2 +- .../buttons/OutlinedButton/OutlinedButton.tsx | 17 +++++++++++++ .../buttons/OutlinedButton/index.ts | 3 +++ .../style.ts | 0 .../OutlinedLinkButton/OutlinedLinkButton.tsx | 7 +++--- 16 files changed, 70 insertions(+), 14 deletions(-) rename context/app/static/js/components/bulkDownload/{ => buttons}/BulkDownloadButton/BulkDownloadButton.tsx (100%) rename context/app/static/js/components/bulkDownload/{ => buttons}/BulkDownloadButton/index.ts (100%) rename context/app/static/js/components/bulkDownload/{ => buttons}/BulkDownloadButtonFromSearch/BulkDownloadButtonFromSearch.tsx (88%) rename context/app/static/js/components/bulkDownload/{ => buttons}/BulkDownloadButtonFromSearch/index.ts (100%) create mode 100644 context/app/static/js/components/bulkDownload/buttons/BulkDownloadTextButton/BulkDownloadTextButton.tsx create mode 100644 context/app/static/js/components/bulkDownload/buttons/BulkDownloadTextButton/index.ts create mode 100644 context/app/static/js/shared-styles/buttons/OutlinedButton/OutlinedButton.tsx create mode 100644 context/app/static/js/shared-styles/buttons/OutlinedButton/index.ts rename context/app/static/js/shared-styles/buttons/{OutlinedLinkButton => OutlinedButton}/style.ts (100%) diff --git a/context/app/static/js/components/bulkDownload/BulkDownloadButton/BulkDownloadButton.tsx b/context/app/static/js/components/bulkDownload/buttons/BulkDownloadButton/BulkDownloadButton.tsx similarity index 100% rename from context/app/static/js/components/bulkDownload/BulkDownloadButton/BulkDownloadButton.tsx rename to context/app/static/js/components/bulkDownload/buttons/BulkDownloadButton/BulkDownloadButton.tsx diff --git a/context/app/static/js/components/bulkDownload/BulkDownloadButton/index.ts b/context/app/static/js/components/bulkDownload/buttons/BulkDownloadButton/index.ts similarity index 100% rename from context/app/static/js/components/bulkDownload/BulkDownloadButton/index.ts rename to context/app/static/js/components/bulkDownload/buttons/BulkDownloadButton/index.ts diff --git a/context/app/static/js/components/bulkDownload/BulkDownloadButtonFromSearch/BulkDownloadButtonFromSearch.tsx b/context/app/static/js/components/bulkDownload/buttons/BulkDownloadButtonFromSearch/BulkDownloadButtonFromSearch.tsx similarity index 88% rename from context/app/static/js/components/bulkDownload/BulkDownloadButtonFromSearch/BulkDownloadButtonFromSearch.tsx rename to context/app/static/js/components/bulkDownload/buttons/BulkDownloadButtonFromSearch/BulkDownloadButtonFromSearch.tsx index a4c72c3c06..d2f008db0a 100644 --- a/context/app/static/js/components/bulkDownload/BulkDownloadButtonFromSearch/BulkDownloadButtonFromSearch.tsx +++ b/context/app/static/js/components/bulkDownload/buttons/BulkDownloadButtonFromSearch/BulkDownloadButtonFromSearch.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import BulkDownloadButton from 'js/components/bulkDownload/BulkDownloadButton/BulkDownloadButton'; +import BulkDownloadButton from 'js/components/bulkDownload/buttons/BulkDownloadButton/BulkDownloadButton'; import { useSelectableTableStore } from 'js/shared-styles/tables/SelectableTableProvider'; const tooltip = 'Bulk download files for selected datasets.'; diff --git a/context/app/static/js/components/bulkDownload/BulkDownloadButtonFromSearch/index.ts b/context/app/static/js/components/bulkDownload/buttons/BulkDownloadButtonFromSearch/index.ts similarity index 100% rename from context/app/static/js/components/bulkDownload/BulkDownloadButtonFromSearch/index.ts rename to context/app/static/js/components/bulkDownload/buttons/BulkDownloadButtonFromSearch/index.ts diff --git a/context/app/static/js/components/bulkDownload/buttons/BulkDownloadTextButton/BulkDownloadTextButton.tsx b/context/app/static/js/components/bulkDownload/buttons/BulkDownloadTextButton/BulkDownloadTextButton.tsx new file mode 100644 index 0000000000..a206fd6663 --- /dev/null +++ b/context/app/static/js/components/bulkDownload/buttons/BulkDownloadTextButton/BulkDownloadTextButton.tsx @@ -0,0 +1,24 @@ +import React from 'react'; +import { ButtonProps } from '@mui/material/Button'; +import { useBulkDownloadDialog } from 'js/components/bulkDownload/hooks'; +import BulkDownloadDialog from 'js/components/bulkDownload/BulkDownloadDialog'; +import OutlinedButton from 'js/shared-styles/buttons/OutlinedButton'; +import { Box } from '@mui/material'; + +interface BulkDownloadTextButtonProps extends ButtonProps { + uuids: Set; +} +function BulkDownloadTextButton({ uuids, ...rest }: BulkDownloadTextButtonProps) { + const { openDialog, isOpen } = useBulkDownloadDialog(); + + return ( + + openDialog(uuids)} {...rest}> + Download Files with HuBMAP CLT + + {isOpen && } + + ); +} + +export default BulkDownloadTextButton; diff --git a/context/app/static/js/components/bulkDownload/buttons/BulkDownloadTextButton/index.ts b/context/app/static/js/components/bulkDownload/buttons/BulkDownloadTextButton/index.ts new file mode 100644 index 0000000000..370b26b300 --- /dev/null +++ b/context/app/static/js/components/bulkDownload/buttons/BulkDownloadTextButton/index.ts @@ -0,0 +1,3 @@ +import BulkDownloadTextButton from './BulkDownloadTextButton'; + +export default BulkDownloadTextButton; diff --git a/context/app/static/js/components/detailPage/BulkDataTransfer/BulkDataTransferSection.tsx b/context/app/static/js/components/detailPage/BulkDataTransfer/BulkDataTransferSection.tsx index d129a7e5d8..05a6c8cc46 100644 --- a/context/app/static/js/components/detailPage/BulkDataTransfer/BulkDataTransferSection.tsx +++ b/context/app/static/js/components/detailPage/BulkDataTransfer/BulkDataTransferSection.tsx @@ -7,9 +7,11 @@ import { DetailSectionPaper } from 'js/shared-styles/surfaces'; import withShouldDisplay from 'js/helpers/withShouldDisplay'; import { sectionIconMap } from 'js/shared-styles/icons/sectionIconMap'; import { SectionDescription } from 'js/shared-styles/sections/SectionDescription'; +import BulkDownloadTextButton from 'js/components/bulkDownload/buttons/BulkDownloadTextButton'; +import Stack from '@mui/material/Stack'; +import { Typography } from '@mui/material'; import BulkDataTransferPanels from './BulkDataTransferPanels'; import { useProcessedDatasetTabs } from '../ProcessedData/ProcessedDataset/hooks'; -import { BULK_DATA_DESCRIPTION_TEXT } from './const'; function BulkDataTransfer() { const tabs = useProcessedDatasetTabs(); @@ -24,7 +26,18 @@ function BulkDataTransfer() { icon={sectionIconMap['bulk-data-transfer']} > - {BULK_DATA_DESCRIPTION_TEXT} + + + + This section explains how to bulk download the raw and processed data for this dataset. Files for + individual raw or processed data can be downloaded via Globus or dbGaP from the respective tabs. To + download files from multiple Globus directories simultaneously, use the HuBMAP Command Line Transfer (CLT) + Tool. Note that processed data has separate download directories in Globus or dbGaP, distinct from the raw + data directory. + + + + { diff --git a/context/app/static/js/components/detailPage/BulkDataTransfer/const.ts b/context/app/static/js/components/detailPage/BulkDataTransfer/const.ts index 401ef6a8e9..97c9e62f78 100644 --- a/context/app/static/js/components/detailPage/BulkDataTransfer/const.ts +++ b/context/app/static/js/components/detailPage/BulkDataTransfer/const.ts @@ -17,6 +17,3 @@ export const SRA_EXPERIMENT_TEXT = { description: 'Select the "Run" link on the page to download the dataset information.', outboundLink: 'https://www.ncbi.nlm.nih.gov/sra/docs/', }; - -export const BULK_DATA_DESCRIPTION_TEXT = - 'This section explains how to download data in bulk from raw and processed datasets. Processed datasets have separate download directories in Globus or dbGaP, distinct from the raw dataset.'; diff --git a/context/app/static/js/components/detailPage/CollectionDatasetsTable/CollectionDatasetsTable.tsx b/context/app/static/js/components/detailPage/CollectionDatasetsTable/CollectionDatasetsTable.tsx index 22b35e7aee..9d4254f846 100644 --- a/context/app/static/js/components/detailPage/CollectionDatasetsTable/CollectionDatasetsTable.tsx +++ b/context/app/static/js/components/detailPage/CollectionDatasetsTable/CollectionDatasetsTable.tsx @@ -6,7 +6,7 @@ import Typography from '@mui/material/Typography'; import type { Entity } from 'js/components/types'; import { CollapsibleDetailPageSection } from 'js/components/detailPage/DetailPageSection'; import RelatedEntitiesTable from 'js/components/detailPage/related-entities/RelatedEntitiesTable'; -import BulkDownloadButton from 'js/components/bulkDownload/BulkDownloadButton'; +import BulkDownloadButton from 'js/components/bulkDownload/buttons/BulkDownloadButton'; import { SpacedSectionButtonRow } from 'js/shared-styles/sections/SectionButtonRow'; import { sectionIconMap } from 'js/shared-styles/icons/sectionIconMap'; diff --git a/context/app/static/js/components/detailPage/related-entities/RelatedEntitiesSectionActions/RelatedEntitiesSectionActions.tsx b/context/app/static/js/components/detailPage/related-entities/RelatedEntitiesSectionActions/RelatedEntitiesSectionActions.tsx index 4fb1847dbe..fc63f9a3a7 100644 --- a/context/app/static/js/components/detailPage/related-entities/RelatedEntitiesSectionActions/RelatedEntitiesSectionActions.tsx +++ b/context/app/static/js/components/detailPage/related-entities/RelatedEntitiesSectionActions/RelatedEntitiesSectionActions.tsx @@ -4,7 +4,7 @@ import Stack from '@mui/material/Stack'; import { useFlaskDataContext } from 'js/components/Contexts'; import { useTrackEntityPageEvent } from 'js/components/detailPage/useTrackEntityPageEvent'; -import BulkDownloadButton from 'js/components/bulkDownload/BulkDownloadButton'; +import BulkDownloadButton from 'js/components/bulkDownload/buttons/BulkDownloadButton'; interface RelatedEntitiesSectionHeaderProps { searchPageHref: string; diff --git a/context/app/static/js/components/search/Search.tsx b/context/app/static/js/components/search/Search.tsx index 0cee7b1ffd..0700ef76c3 100644 --- a/context/app/static/js/components/search/Search.tsx +++ b/context/app/static/js/components/search/Search.tsx @@ -16,7 +16,7 @@ import history from 'history/browser'; import { useAppContext } from 'js/components/Contexts'; import SelectableTableProvider from 'js/shared-styles/tables/SelectableTableProvider'; import WorkspacesDropdownMenu, { WorkspaceSearchDialogs } from 'js/components/workspaces/WorkspacesDropdownMenu'; -import BulkDownloadButtonFromSearch from 'js/components/bulkDownload/BulkDownloadButtonFromSearch'; +import BulkDownloadButtonFromSearch from 'js/components/bulkDownload/buttons/BulkDownloadButtonFromSearch'; import { entityIconMap } from 'js/shared-styles/icons/entityIconMap'; import { SearchStoreProvider, diff --git a/context/app/static/js/components/searchPage/SearchBarLayout/SearchBarLayout.jsx b/context/app/static/js/components/searchPage/SearchBarLayout/SearchBarLayout.jsx index df245a594c..bf4d551df2 100644 --- a/context/app/static/js/components/searchPage/SearchBarLayout/SearchBarLayout.jsx +++ b/context/app/static/js/components/searchPage/SearchBarLayout/SearchBarLayout.jsx @@ -3,7 +3,7 @@ import PropTypes from 'prop-types'; import { SearchBox, SelectedFilters, SortingSelector, ViewSwitcherToggle, SimpleQueryString } from 'searchkit'; import Stack from '@mui/material/Stack'; -import BulkDownloadButtonFromSearch from 'js/components/bulkDownload/BulkDownloadButtonFromSearch'; +import BulkDownloadButtonFromSearch from 'js/components/bulkDownload/buttons/BulkDownloadButtonFromSearch'; import { withAnalyticsCategory } from 'js/components/searchPage/hooks'; import WorkspacesDropdownMenu from 'js/components/workspaces/WorkspacesDropdownMenu'; import SearchViewSwitch, { DevSearchViewSwitch } from './SearchViewSwitch'; diff --git a/context/app/static/js/shared-styles/buttons/OutlinedButton/OutlinedButton.tsx b/context/app/static/js/shared-styles/buttons/OutlinedButton/OutlinedButton.tsx new file mode 100644 index 0000000000..104d1a23f0 --- /dev/null +++ b/context/app/static/js/shared-styles/buttons/OutlinedButton/OutlinedButton.tsx @@ -0,0 +1,17 @@ +import React from 'react'; +import { StyledButton } from 'js/shared-styles/buttons/OutlinedButton/style'; +import { ButtonProps } from '@mui/material/Button'; + +interface OutlinedButtonProps extends ButtonProps { + children: React.ReactNode; +} + +function OutlinedButton({ children, ...rest }: OutlinedButtonProps) { + return ( + + {children} + + ); +} + +export default OutlinedButton; diff --git a/context/app/static/js/shared-styles/buttons/OutlinedButton/index.ts b/context/app/static/js/shared-styles/buttons/OutlinedButton/index.ts new file mode 100644 index 0000000000..66c3d5a4e1 --- /dev/null +++ b/context/app/static/js/shared-styles/buttons/OutlinedButton/index.ts @@ -0,0 +1,3 @@ +import OutlinedButton from './OutlinedButton'; + +export default OutlinedButton; diff --git a/context/app/static/js/shared-styles/buttons/OutlinedLinkButton/style.ts b/context/app/static/js/shared-styles/buttons/OutlinedButton/style.ts similarity index 100% rename from context/app/static/js/shared-styles/buttons/OutlinedLinkButton/style.ts rename to context/app/static/js/shared-styles/buttons/OutlinedButton/style.ts diff --git a/context/app/static/js/shared-styles/buttons/OutlinedLinkButton/OutlinedLinkButton.tsx b/context/app/static/js/shared-styles/buttons/OutlinedLinkButton/OutlinedLinkButton.tsx index 60aeface4c..05d443f25d 100644 --- a/context/app/static/js/shared-styles/buttons/OutlinedLinkButton/OutlinedLinkButton.tsx +++ b/context/app/static/js/shared-styles/buttons/OutlinedLinkButton/OutlinedLinkButton.tsx @@ -1,7 +1,7 @@ import React, { PropsWithChildren } from 'react'; import LinkIcon from '@mui/icons-material/Link'; import LaunchRounded from '@mui/icons-material/LaunchRounded'; -import { StyledButton } from 'js/shared-styles/buttons/OutlinedLinkButton/style'; +import OutlinedButton from 'js/shared-styles/buttons/OutlinedButton'; interface OutlinedLinkButtonProps extends PropsWithChildren { link: string; @@ -13,15 +13,14 @@ function OutlinedLinkButton({ link, onClick, external, children }: OutlinedLinkB const EndIcon = external ? LaunchRounded : LinkIcon; return ( - } > {children} - + ); } From 11796b0a18c148f62459d5d1c60595a408a1da91 Mon Sep 17 00:00:00 2001 From: Austen Money Date: Mon, 25 Nov 2024 14:30:29 -0500 Subject: [PATCH 2/6] pass in uuids --- .../BulkDataTransfer/BulkDataTransferSection.tsx | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/context/app/static/js/components/detailPage/BulkDataTransfer/BulkDataTransferSection.tsx b/context/app/static/js/components/detailPage/BulkDataTransfer/BulkDataTransferSection.tsx index 05a6c8cc46..9f477672b1 100644 --- a/context/app/static/js/components/detailPage/BulkDataTransfer/BulkDataTransferSection.tsx +++ b/context/app/static/js/components/detailPage/BulkDataTransfer/BulkDataTransferSection.tsx @@ -1,4 +1,6 @@ import React, { useState } from 'react'; +import Stack from '@mui/material/Stack'; +import Typography from '@mui/material/Typography'; import { CollapsibleDetailPageSection } from 'js/components/detailPage/DetailPageSection'; import { FilesContextProvider } from 'js/components/detailPage/files/FilesContext'; @@ -8,13 +10,12 @@ import withShouldDisplay from 'js/helpers/withShouldDisplay'; import { sectionIconMap } from 'js/shared-styles/icons/sectionIconMap'; import { SectionDescription } from 'js/shared-styles/sections/SectionDescription'; import BulkDownloadTextButton from 'js/components/bulkDownload/buttons/BulkDownloadTextButton'; -import Stack from '@mui/material/Stack'; -import { Typography } from '@mui/material'; import BulkDataTransferPanels from './BulkDataTransferPanels'; import { useProcessedDatasetTabs } from '../ProcessedData/ProcessedDataset/hooks'; function BulkDataTransfer() { const tabs = useProcessedDatasetTabs(); + const uuids = new Set(tabs.map((tab) => tab.uuid)); const [openTabIndex, setOpenTabIndex] = useState(0); @@ -35,7 +36,7 @@ function BulkDataTransfer() { Tool. Note that processed data has separate download directories in Globus or dbGaP, distinct from the raw data directory. - + Date: Mon, 25 Nov 2024 16:14:04 -0500 Subject: [PATCH 3/6] update description link --- .../BulkDataTransferSection.tsx | 20 ++++++++++++------- 1 file changed, 13 insertions(+), 7 deletions(-) diff --git a/context/app/static/js/components/detailPage/BulkDataTransfer/BulkDataTransferSection.tsx b/context/app/static/js/components/detailPage/BulkDataTransfer/BulkDataTransferSection.tsx index 9f477672b1..1915177faa 100644 --- a/context/app/static/js/components/detailPage/BulkDataTransfer/BulkDataTransferSection.tsx +++ b/context/app/static/js/components/detailPage/BulkDataTransfer/BulkDataTransferSection.tsx @@ -6,13 +6,25 @@ import { CollapsibleDetailPageSection } from 'js/components/detailPage/DetailPag import { FilesContextProvider } from 'js/components/detailPage/files/FilesContext'; import { Tabs, Tab, TabPanel } from 'js/shared-styles/tables/TableTabs'; import { DetailSectionPaper } from 'js/shared-styles/surfaces'; +import { OutboundLink } from 'js/shared-styles/Links'; import withShouldDisplay from 'js/helpers/withShouldDisplay'; import { sectionIconMap } from 'js/shared-styles/icons/sectionIconMap'; import { SectionDescription } from 'js/shared-styles/sections/SectionDescription'; import BulkDownloadTextButton from 'js/components/bulkDownload/buttons/BulkDownloadTextButton'; +import { LINKS } from 'js/components/bulkDownload/constants'; import BulkDataTransferPanels from './BulkDataTransferPanels'; import { useProcessedDatasetTabs } from '../ProcessedData/ProcessedDataset/hooks'; +const sectionDescription = ( + + This section explains how to bulk download the raw and processed data for this dataset. Files for individual raw or + processed data can be downloaded via Globus or dbGaP from the respective tabs. To download files from multiple + Globus directories simultaneously, use the + HuBMAP Command Line Transfer (CLT) Tool. Note that + processed data has separate download directories in Globus or dbGaP, distinct from the raw data directory. + +); + function BulkDataTransfer() { const tabs = useProcessedDatasetTabs(); const uuids = new Set(tabs.map((tab) => tab.uuid)); @@ -29,13 +41,7 @@ function BulkDataTransfer() { - - This section explains how to bulk download the raw and processed data for this dataset. Files for - individual raw or processed data can be downloaded via Globus or dbGaP from the respective tabs. To - download files from multiple Globus directories simultaneously, use the HuBMAP Command Line Transfer (CLT) - Tool. Note that processed data has separate download directories in Globus or dbGaP, distinct from the raw - data directory. - + {sectionDescription} From 939b28e697d2781035a49f02b36183bb35015db2 Mon Sep 17 00:00:00 2001 From: Austen Money Date: Mon, 25 Nov 2024 16:22:56 -0500 Subject: [PATCH 4/6] add changelog --- CHANGELOG-add-bulk-download-to-detail-pages.md | 1 + 1 file changed, 1 insertion(+) create mode 100644 CHANGELOG-add-bulk-download-to-detail-pages.md diff --git a/CHANGELOG-add-bulk-download-to-detail-pages.md b/CHANGELOG-add-bulk-download-to-detail-pages.md new file mode 100644 index 0000000000..b32d40bbd0 --- /dev/null +++ b/CHANGELOG-add-bulk-download-to-detail-pages.md @@ -0,0 +1 @@ +- Add bulk file download option to the Bulk Download section of dataset detail pages. \ No newline at end of file From e5e2d5102689925bfaa2dff58e9b69c4fb92e0a0 Mon Sep 17 00:00:00 2001 From: Austen Money Date: Mon, 25 Nov 2024 16:37:35 -0500 Subject: [PATCH 5/6] clean up --- .../buttons/BulkDownloadTextButton/BulkDownloadTextButton.tsx | 2 +- .../detailPage/BulkDataTransfer/BulkDataTransferSection.tsx | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/context/app/static/js/components/bulkDownload/buttons/BulkDownloadTextButton/BulkDownloadTextButton.tsx b/context/app/static/js/components/bulkDownload/buttons/BulkDownloadTextButton/BulkDownloadTextButton.tsx index a206fd6663..1ab1b56061 100644 --- a/context/app/static/js/components/bulkDownload/buttons/BulkDownloadTextButton/BulkDownloadTextButton.tsx +++ b/context/app/static/js/components/bulkDownload/buttons/BulkDownloadTextButton/BulkDownloadTextButton.tsx @@ -1,9 +1,9 @@ import React from 'react'; +import Box from '@mui/material/Box'; import { ButtonProps } from '@mui/material/Button'; import { useBulkDownloadDialog } from 'js/components/bulkDownload/hooks'; import BulkDownloadDialog from 'js/components/bulkDownload/BulkDownloadDialog'; import OutlinedButton from 'js/shared-styles/buttons/OutlinedButton'; -import { Box } from '@mui/material'; interface BulkDownloadTextButtonProps extends ButtonProps { uuids: Set; diff --git a/context/app/static/js/components/detailPage/BulkDataTransfer/BulkDataTransferSection.tsx b/context/app/static/js/components/detailPage/BulkDataTransfer/BulkDataTransferSection.tsx index 1915177faa..6eef6ae9cd 100644 --- a/context/app/static/js/components/detailPage/BulkDataTransfer/BulkDataTransferSection.tsx +++ b/context/app/static/js/components/detailPage/BulkDataTransfer/BulkDataTransferSection.tsx @@ -15,7 +15,7 @@ import { LINKS } from 'js/components/bulkDownload/constants'; import BulkDataTransferPanels from './BulkDataTransferPanels'; import { useProcessedDatasetTabs } from '../ProcessedData/ProcessedDataset/hooks'; -const sectionDescription = ( +const description = ( This section explains how to bulk download the raw and processed data for this dataset. Files for individual raw or processed data can be downloaded via Globus or dbGaP from the respective tabs. To download files from multiple @@ -41,7 +41,7 @@ function BulkDataTransfer() { - {sectionDescription} + {description} From 983048247fbb7bcc342db48b45119aa3cbbce9d6 Mon Sep 17 00:00:00 2001 From: Austen Money Date: Tue, 26 Nov 2024 13:04:33 -0500 Subject: [PATCH 6/6] adjust outlined button component --- .../buttons/OutlinedButton/OutlinedButton.tsx | 17 ----------------- .../buttons/OutlinedButton/index.ts | 2 +- .../buttons/OutlinedButton/style.ts | 9 --------- .../buttons/OutlinedButton/style.tsx | 10 ++++++++++ 4 files changed, 11 insertions(+), 27 deletions(-) delete mode 100644 context/app/static/js/shared-styles/buttons/OutlinedButton/OutlinedButton.tsx delete mode 100644 context/app/static/js/shared-styles/buttons/OutlinedButton/style.ts create mode 100644 context/app/static/js/shared-styles/buttons/OutlinedButton/style.tsx diff --git a/context/app/static/js/shared-styles/buttons/OutlinedButton/OutlinedButton.tsx b/context/app/static/js/shared-styles/buttons/OutlinedButton/OutlinedButton.tsx deleted file mode 100644 index 104d1a23f0..0000000000 --- a/context/app/static/js/shared-styles/buttons/OutlinedButton/OutlinedButton.tsx +++ /dev/null @@ -1,17 +0,0 @@ -import React from 'react'; -import { StyledButton } from 'js/shared-styles/buttons/OutlinedButton/style'; -import { ButtonProps } from '@mui/material/Button'; - -interface OutlinedButtonProps extends ButtonProps { - children: React.ReactNode; -} - -function OutlinedButton({ children, ...rest }: OutlinedButtonProps) { - return ( - - {children} - - ); -} - -export default OutlinedButton; diff --git a/context/app/static/js/shared-styles/buttons/OutlinedButton/index.ts b/context/app/static/js/shared-styles/buttons/OutlinedButton/index.ts index 66c3d5a4e1..97749e55a4 100644 --- a/context/app/static/js/shared-styles/buttons/OutlinedButton/index.ts +++ b/context/app/static/js/shared-styles/buttons/OutlinedButton/index.ts @@ -1,3 +1,3 @@ -import OutlinedButton from './OutlinedButton'; +import OutlinedButton from './style'; export default OutlinedButton; diff --git a/context/app/static/js/shared-styles/buttons/OutlinedButton/style.ts b/context/app/static/js/shared-styles/buttons/OutlinedButton/style.ts deleted file mode 100644 index a328a10162..0000000000 --- a/context/app/static/js/shared-styles/buttons/OutlinedButton/style.ts +++ /dev/null @@ -1,9 +0,0 @@ -import { styled } from '@mui/material/styles'; -import Button from '@mui/material/Button'; - -const StyledButton = styled(Button)(({ theme }) => ({ - borderColor: theme.palette.grey[300], - borderRadius: theme.spacing(0.5), -})); - -export { StyledButton }; diff --git a/context/app/static/js/shared-styles/buttons/OutlinedButton/style.tsx b/context/app/static/js/shared-styles/buttons/OutlinedButton/style.tsx new file mode 100644 index 0000000000..29bd4278b8 --- /dev/null +++ b/context/app/static/js/shared-styles/buttons/OutlinedButton/style.tsx @@ -0,0 +1,10 @@ +import React from 'react'; +import { styled } from '@mui/material/styles'; +import Button, { ButtonProps } from '@mui/material/Button'; + +const OutlinedButton = styled((props: ButtonProps) =>