From 69f4ce8f931586757198ae4e97514f1ddcb3139a Mon Sep 17 00:00:00 2001
From: SevLG <sebastian.gunnari.lindbom@scilifelab.se>
Date: Mon, 22 Apr 2024 13:26:50 +0200
Subject: [PATCH 1/2] Commented out unused import which prevented building
 image. Changed cards in aboutpage to be placed in the middle

---
 pmp-frontend-app/src/components/HeaderComponent.tsx | 5 ++++-
 pmp-frontend-app/src/pages/AboutProductPage.tsx     | 2 +-
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/pmp-frontend-app/src/components/HeaderComponent.tsx b/pmp-frontend-app/src/components/HeaderComponent.tsx
index 605cfd7..849e8b3 100644
--- a/pmp-frontend-app/src/components/HeaderComponent.tsx
+++ b/pmp-frontend-app/src/components/HeaderComponent.tsx
@@ -1,6 +1,9 @@
 import { Link, NavLink } from 'react-router-dom';
 import { ILink } from '../interfaces/types';
-import { BUTTON_TYPE_ONE, LINK_CLASSES } from '../constants';
+import {
+  //BODY_CLASSES,
+  LINK_CLASSES,
+} from '../constants';
 import sciLifeLogo from '../assets/SciLifeLab logo/Precisionmedicineportal_logo_white.png';
 import { useLocation } from 'react-router-dom';
 import { AboutPageContent, ContactPageContent, DataSourcesPageContent, EventsAndTrainingsPageContent, HomePageContent, PrivacyPageContent } from '../content/content';
diff --git a/pmp-frontend-app/src/pages/AboutProductPage.tsx b/pmp-frontend-app/src/pages/AboutProductPage.tsx
index adee7dd..071b748 100644
--- a/pmp-frontend-app/src/pages/AboutProductPage.tsx
+++ b/pmp-frontend-app/src/pages/AboutProductPage.tsx
@@ -80,7 +80,7 @@ export default function AboutProductPage(): ReactElement {
             <div className="divider">Product</div>
             <p>{PMDDescription}</p>
             <div className="divider pt-16">Team & Contributions</div>
-            <div className="grid grid-cols-3 gap-2">
+            <div className="grid grid-cols-3 place-items-center gap-2">
                 {Object.keys(cardContent).map( key => (
                     <CardComponent cardConfig={cardConfig['teamCard']} cardContent={cardContent[key]} />
                 ))}

From 26547d61398fb40626d7dcc7abf33663e8066063 Mon Sep 17 00:00:00 2001
From: SevLG <sebastian.gunnari.lindbom@scilifelab.se>
Date: Mon, 22 Apr 2024 13:38:05 +0200
Subject: [PATCH 2/2] Also added keys to react component iteration, a minor bug
 causing warnings when running dev

---
 pmp-frontend-app/src/components/FooterComponent.tsx | 6 +++---
 pmp-frontend-app/src/components/HeaderComponent.tsx | 2 +-
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/pmp-frontend-app/src/components/FooterComponent.tsx b/pmp-frontend-app/src/components/FooterComponent.tsx
index 82457c1..69acae0 100644
--- a/pmp-frontend-app/src/components/FooterComponent.tsx
+++ b/pmp-frontend-app/src/components/FooterComponent.tsx
@@ -43,19 +43,19 @@ export default function FooterComponent(): ReactElement {
       <footer className='footer pt-10 px-10 bg-primary text-primary-content'>
         <nav>
         {Object.keys(linksCol1).map( key => (
-            <Link className={linksCol1[key].classes} to={linksCol1[key].link}>{linksCol1[key].text}</Link>
+            <Link className={linksCol1[key].classes} to={linksCol1[key].link} key={key}>{linksCol1[key].text}</Link>
         ))}
         </nav> 
         <nav>
         {Object.keys(linksCol2).map( key => (
-            <Link className={linksCol2[key].classes} to={linksCol2[key].link}>{linksCol2[key].text}</Link>
+            <Link className={linksCol2[key].classes} to={linksCol2[key].link} key={key}>{linksCol2[key].text}</Link>
         ))}
         </nav> 
         <nav>
           <header className="footer-title">Social</header> 
           <div className="grid grid-flow-col gap-4">
             {Object.keys(svgs).map( key => (
-              <a href={svgs[key].href}><svg xmlns={svgs[key].xmlns} width={svgs[key].width} height={svgs[key].height} viewBox={svgs[key].viewBox} className={svgs[key].classes}><path d={svgs[key].svg}></path></svg></a>
+              <a href={svgs[key].href} key={key}><svg xmlns={svgs[key].xmlns} width={svgs[key].width} height={svgs[key].height} viewBox={svgs[key].viewBox} className={svgs[key].classes}><path d={svgs[key].svg}></path></svg></a>
             ))}
           </div>
         </nav>
diff --git a/pmp-frontend-app/src/components/HeaderComponent.tsx b/pmp-frontend-app/src/components/HeaderComponent.tsx
index 849e8b3..cb127e5 100644
--- a/pmp-frontend-app/src/components/HeaderComponent.tsx
+++ b/pmp-frontend-app/src/components/HeaderComponent.tsx
@@ -68,7 +68,7 @@ export default function HeaderComponent() {
             <div className="navbar-center lg:flex">
                 <ul className="menu menu-horizontal text-lg mt-0.5">
                 {Object.keys(links).map( key => (
-                    <li>{<NavLink className={links[key].classes} to={links[key].link}>{links[key].text}</NavLink>}</li>
+                    <li key={key}>{<NavLink className={links[key].classes} to={links[key].link}>{links[key].text}</NavLink>}</li>
                 ))}
                 </ul>
             </div>