From 8d959e44d61ec3a172d956757457b25db7e80788 Mon Sep 17 00:00:00 2001
From: shivanshiv <shivanshi.visvanatha@ucalgary.ca>
Date: Sat, 22 Nov 2025 21:38:49 -0700
Subject: [PATCH] Open LinkedIn links in new tab (Closes #520)

---
 src/components/Footer/Footer.tsx           | 1 +
 src/components/SocialMedia/SocialMedia.tsx | 8 +++++++-
 src/components/TeamSection/Profile.tsx     | 1 +
 3 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/components/Footer/Footer.tsx b/src/components/Footer/Footer.tsx
index a3a91618..74c45ac1 100644
--- a/src/components/Footer/Footer.tsx
+++ b/src/components/Footer/Footer.tsx
@@ -34,6 +34,7 @@ const Footer = () => (
         color={SocialMediaColor.Gradient}
         icon={faLinkedin}
         link="https://www.linkedin.com/company/tech-start-ucalgary"
+        newTab={true}
       />
       <SocialMedia
         color={SocialMediaColor.Gradient}
diff --git a/src/components/SocialMedia/SocialMedia.tsx b/src/components/SocialMedia/SocialMedia.tsx
index 665d7a0b..0362b1a8 100644
--- a/src/components/SocialMedia/SocialMedia.tsx
+++ b/src/components/SocialMedia/SocialMedia.tsx
@@ -7,6 +7,7 @@ interface SocialMediaProps {
   color: SocialMediaColor;
   link: string;
   icon: IconDefinition;
+  newTab?: boolean;
 }
 
 const SocialMedia = (props: SocialMediaProps) => {
@@ -16,7 +17,12 @@ const SocialMedia = (props: SocialMediaProps) => {
         <FontAwesomeIcon icon={props.icon} size="3x" />
       </SocialMediaIcon>
       :
-      <SocialMediaIcon color={props.color} href={props.link}>
+      <SocialMediaIcon 
+        color={props.color} 
+        href={props.link}
+        target={props.newTab ? "_blank" : undefined}
+        rel={props.newTab ? "noopener noreferrer" : undefined}
+      >
         <FontAwesomeIcon icon={props.icon} size="3x" />
       </SocialMediaIcon>
   );
diff --git a/src/components/TeamSection/Profile.tsx b/src/components/TeamSection/Profile.tsx
index 36718c03..54a9ff9e 100644
--- a/src/components/TeamSection/Profile.tsx
+++ b/src/components/TeamSection/Profile.tsx
@@ -63,6 +63,7 @@ const Profile = (props: ProfileProps) => {
             color={SocialMediaColor.White}
             icon={faLinkedinIn}
             link={props.member.linkedin}
+            newTab={true}
           />
         </S.LinksSection>
       )}