From 14b68548b3f4d1490af6c28482b0b603c23b430e Mon Sep 17 00:00:00 2001
From: GaelleA <galtefrohne@ferlab.bio>
Date: Fri, 29 Nov 2024 08:41:20 -0500
Subject: [PATCH] feat(publicstudies): SJIP-1105 add link to login page

---
 .../PublicLayout/Header/HeaderButton/index.tsx        | 11 ++++++++++-
 src/components/PublicLayout/Header/index.tsx          | 10 +++++++++-
 2 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/src/components/PublicLayout/Header/HeaderButton/index.tsx b/src/components/PublicLayout/Header/HeaderButton/index.tsx
index 51be33c6..1364cbd2 100644
--- a/src/components/PublicLayout/Header/HeaderButton/index.tsx
+++ b/src/components/PublicLayout/Header/HeaderButton/index.tsx
@@ -8,14 +8,23 @@ interface OwnProps {
   className?: string;
   icon?: React.ReactElement;
   isActive?: boolean;
+  onClick?: () => void;
   title: string;
 }
 
-const HeaderButton = ({ className = '', icon, isActive = false, title, ...props }: OwnProps) => (
+const HeaderButton = ({
+  className = '',
+  icon,
+  isActive = false,
+  onClick,
+  title,
+  ...props
+}: OwnProps) => (
   <Button
     className={cx(className, style.headerBtn, isActive ? style.active : '')}
     onClick={(event) => {
       event.currentTarget.blur();
+      onClick && onClick();
     }}
     icon={icon}
     {...props}
diff --git a/src/components/PublicLayout/Header/index.tsx b/src/components/PublicLayout/Header/index.tsx
index 45dad2e0..6d5e5228 100644
--- a/src/components/PublicLayout/Header/index.tsx
+++ b/src/components/PublicLayout/Header/index.tsx
@@ -1,4 +1,5 @@
 import intl from 'react-intl-universal';
+import { useNavigate } from 'react-router';
 import {
   DotChartOutlined,
   DownOutlined,
@@ -16,6 +17,7 @@ import ExternalLinkIcon from 'components/Icons/ExternalLinkIcon';
 import IncludeIcon from 'components/Icons/IncludeIcon';
 import LineStyleIcon from 'components/Icons/LineStyleIcon';
 import { trackVisitResources } from 'services/analytics';
+import { STATIC_ROUTES } from 'utils/routes';
 
 import HeaderButton from './HeaderButton';
 
@@ -26,6 +28,7 @@ const iconSize = { width: 14, height: 14 };
 const { Text } = Typography;
 
 const Header = () => {
+  const navigate = useNavigate();
   const ft_variant = getFTEnvVarByKey('VARIANT');
   const ft_analyticsPage = getFTEnvVarByKey('ANALYTICS_PAGE');
 
@@ -159,9 +162,14 @@ const Header = () => {
             className={style.loginBtn}
             key="community"
             icon={<LoginOutlined />}
+            onClick={() => navigate(STATIC_ROUTES.LOGIN)}
             title={intl.get('screen.loginPage.login')}
           />
-          <Button className={style.signUpBtn} type="primary">
+          <Button
+            className={style.signUpBtn}
+            onClick={() => navigate(STATIC_ROUTES.LOGIN)}
+            type="primary"
+          >
             {intl.get('screen.loginPage.signup')}
           </Button>
         </div>,