From f7d78a125b89fb3e597ccf98adc3b46641dde610 Mon Sep 17 00:00:00 2001
From: kevin <kevinyooky@gmail.com>
Date: Wed, 12 Jul 2023 19:00:29 -0700
Subject: [PATCH] tooltip for data support

---
 .../BulkDataTransfer/GlobusLink.jsx           | 19 +++++++++++--------
 .../js/components/detailPage/context.js       |  2 +-
 2 files changed, 12 insertions(+), 9 deletions(-)

diff --git a/context/app/static/js/components/detailPage/BulkDataTransfer/GlobusLink.jsx b/context/app/static/js/components/detailPage/BulkDataTransfer/GlobusLink.jsx
index 0d2ead461e..b420760b4f 100644
--- a/context/app/static/js/components/detailPage/BulkDataTransfer/GlobusLink.jsx
+++ b/context/app/static/js/components/detailPage/BulkDataTransfer/GlobusLink.jsx
@@ -3,6 +3,7 @@ import React from 'react';
 import { DetailSectionPaper } from 'js/shared-styles/surfaces';
 import { useFlaskDataContext } from 'js/components/Contexts';
 import { useFilesContext } from 'js/components/detailPage/files/Files/context';
+import { SecondaryBackgroundTooltip } from 'js/shared-styles/tooltips';
 import FilesConditionalLink from './FilesConditionalLink';
 import { StyledExternalLinkIcon, GlobusLinks } from './style';
 import { useFetchProtectedFile } from './hooks';
@@ -22,14 +23,16 @@ function GlobusLink({ uuid, isSupport }) {
   return (
     <DetailSectionPaper>
       {isSupport && 'Support Dataset: '}
-      <FilesConditionalLink
-        href={responseUrl}
-        hasAgreedToDUA={hasAgreedToDUA}
-        openDUA={() => openDUA(responseUrl)}
-        variant="body2"
-      >
-        {isSupport ? '' : hubmap_id} Globus <StyledExternalLinkIcon />
-      </FilesConditionalLink>
+      <SecondaryBackgroundTooltip title="Data generated for visualization of this dataset are also available on Globus.">
+        <FilesConditionalLink
+          href={responseUrl}
+          hasAgreedToDUA={hasAgreedToDUA}
+          openDUA={() => openDUA(responseUrl)}
+          variant="body2"
+        >
+          {isSupport ? '' : hubmap_id} Globus <StyledExternalLinkIcon />
+        </FilesConditionalLink>
+      </SecondaryBackgroundTooltip>
     </DetailSectionPaper>
   );
 }
diff --git a/context/app/static/js/components/detailPage/context.js b/context/app/static/js/components/detailPage/context.js
index 93115c1d01..54ba235f99 100644
--- a/context/app/static/js/components/detailPage/context.js
+++ b/context/app/static/js/components/detailPage/context.js
@@ -5,6 +5,6 @@ const DetailContext = React.createContext({});
 
 DetailContext.displayName = 'DetailContext';
 
-export default DetailContext;
+export { DetailContext };
 
 export const useDetailContext = () => useContext(DetailContext);