John conroy/fix conditional link icon (#3184)

* Show icon for link before DUA is agreed upon * Add changelog --------- Co-authored-by: John Conroy <[email protected]>
hubmapconsortium · Jul 17, 2023 · 8fab96f · 8fab96f
1 parent 62a78a5
commit 8fab96f
Show file tree

Hide file tree

Showing 3 changed files with 3 additions and 11 deletions.
diff --git a/CHANGELOG-fix-conditional-link-icon.md b/CHANGELOG-fix-conditional-link-icon.md
@@ -0,0 +1 @@
+- Fix bug causing the outbound link icon to not display in Globus links before the DUA has been agreed upon.
diff --git a/context/app/static/js/components/detailPage/BulkDataTransfer/FilesConditionalLink.jsx b/context/app/static/js/components/detailPage/BulkDataTransfer/FilesConditionalLink.jsx
@@ -4,8 +4,6 @@ import PropTypes from 'prop-types';
 import OutboundLink from 'js/shared-styles/Links/OutboundLink';
 import OutboundIconLink from 'js/shared-styles/Links/iconLinks/OutboundIconLink';
 
-import { AlignedLink } from './style';
-
 function getOutboundLinkComponent(hasIcon) {
   if (hasIcon) {
     return OutboundIconLink;
@@ -24,7 +22,7 @@ function FilesConditionalLink({ hasAgreedToDUA, openDUA, href, children, hasIcon
   }
 
   return (
-    <AlignedLink
+    <Link
       onClick={() => {
         openDUA();
       }}
@@ -33,7 +31,7 @@ function FilesConditionalLink({ hasAgreedToDUA, openDUA, href, children, hasIcon
       {...rest}
     >
       {children}
-    </AlignedLink>
+    </Link>
   );
 }
 

diff --git a/context/app/static/js/components/detailPage/BulkDataTransfer/style.js b/context/app/static/js/components/detailPage/BulkDataTransfer/style.js
@@ -6,8 +6,6 @@ import BlockIcon from '@material-ui/icons/Block';
 import Box from '@material-ui/core/Box';
 import WarningRoundedIcon from '@material-ui/icons/WarningRounded';
 
-import { LightBlueLink } from 'js/shared-styles/Links';
-
 const StyledContainer = styled.div`
   > div {
     margin-bottom: ${(props) => props.theme.spacing(1.25)}px;
@@ -61,10 +59,6 @@ const StyledBlockIcon = styled(BlockIcon)`
   color: ${(props) => props.theme.palette.warning.main};
 `;
 
-const AlignedLink = styled(LightBlueLink)`
-  vertical-align: baseline;
-`;
-
 const ObliqueSpan = styled.span`
   font-style: oblique 10deg;
 `;
@@ -100,7 +94,6 @@ export {
   StyledLink,
   GreenCheckCircleIcon,
   StyledBlockIcon,
-  AlignedLink,
   ObliqueSpan,
   StyledHeader,
   StyledDiv,