diff --git a/src/locales/en.ts b/src/locales/en.ts index e338883e..cd619b0c 100644 --- a/src/locales/en.ts +++ b/src/locales/en.ts @@ -1531,6 +1531,8 @@ const en = { download: 'Download data', notification: 'Please wait while we generate your report. This process may take a few moments.', + diffGeneTooltip: 'Download differential gene expression across all genes', + sampleTooltip: 'Download gene expression data across all genes', }, about: { title: 'About this dataset', diff --git a/src/views/Analytics/Transcriptomic/Footer/DownloadTranscriptomics/index.module.css b/src/views/Analytics/Transcriptomic/Footer/DownloadTranscriptomics/index.module.css new file mode 100644 index 00000000..ea34dde1 --- /dev/null +++ b/src/views/Analytics/Transcriptomic/Footer/DownloadTranscriptomics/index.module.css @@ -0,0 +1,3 @@ +.overlayTooltip { + max-width: 400px; +} \ No newline at end of file diff --git a/src/views/Analytics/Transcriptomic/Footer/DownloadTranscriptomics/index.tsx b/src/views/Analytics/Transcriptomic/Footer/DownloadTranscriptomics/index.tsx index 57926812..d05b177e 100644 --- a/src/views/Analytics/Transcriptomic/Footer/DownloadTranscriptomics/index.tsx +++ b/src/views/Analytics/Transcriptomic/Footer/DownloadTranscriptomics/index.tsx @@ -2,7 +2,7 @@ import { useState } from 'react'; import intl from 'react-intl-universal'; import { useDispatch } from 'react-redux'; import { DownloadOutlined } from '@ant-design/icons'; -import { Button } from 'antd'; +import { Button, Tooltip } from 'antd'; import { BaseButtonProps } from 'antd/lib/button/button'; import axios from 'axios'; import saveAs from 'file-saver'; @@ -11,58 +11,68 @@ import { getBlobFromResponse } from 'common/downloader'; import { ApiResponse } from 'services/api'; import { globalActions } from 'store/global'; +import styles from './index.module.css'; + type TDownloadTranscriptomics = BaseButtonProps & { handleUrl: () => Promise>; filename: string; displayNotification?: boolean; + tooltip: string; }; const DownloadTranscriptomics = ({ handleUrl, filename, displayNotification = false, + tooltip, ...props }: TDownloadTranscriptomics) => { const [loading, setLoading] = useState(false); const dispatch = useDispatch(); return ( - + await axios({ + url: response.data?.url ?? '', + method: 'GET', + responseType: 'blob', + headers: { + 'Content-Type': 'application/json', + Accept: '*/*', + }, + }).then((response) => { + const blob = getBlobFromResponse(response, 'blob'); + saveAs(blob, filename); + setLoading(false); + dispatch(globalActions.destroyMessages([filename])); + }); + }} + {...props} + > + {intl.get('screen.analytics.transcriptomic.footer.download')} + + ); }; diff --git a/src/views/Analytics/Transcriptomic/Footer/index.tsx b/src/views/Analytics/Transcriptomic/Footer/index.tsx index 36f2f7df..cf24f040 100644 --- a/src/views/Analytics/Transcriptomic/Footer/index.tsx +++ b/src/views/Analytics/Transcriptomic/Footer/index.tsx @@ -105,6 +105,7 @@ const TranscriptomicFooter = ({