Enhance navigation and project card links with Umami event tracking

Author: LuisHCK

components/navbar/index.jsx

@@ -36,15 +36,32 @@ function NavBar() {
 
             <div id="navbarMenu" className={navbarMenuClassNames}>
                 <div className="navbar-start">
-                    <Link href="/" className="navbar-item">
+                    <Link
+                        href="/"
+                        className="navbar-item"
+                        data-umami-event="home_link_click"
+                        data-umami-event-type="click"
+                    >
                         Home
                     </Link>
 
-                    <Link href="/projects" className="navbar-item">
+                    <Link
+                        href="/projects"
+                        className="navbar-item"
+                        data-umami-event="projects_link_click"
+                        data-umami-event-type="click"
+                    >
                         Projects
                     </Link>
 
-                    <Link href={Profile.cv} className="navbar-item" target="_blank" rel="noopener noreferrer">
+                    <Link
+                        href={Profile.cv}
+                        className="navbar-item"
+                        target="_blank"
+                        rel="noopener noreferrer"
+                        data-umami-event="cv_link_click"
+                        data-umami-event-type="click"
+                    >
                         CV
                     </Link>
                 </div>

components/project-card/index.jsx

@@ -25,6 +25,8 @@ function ProjectCard({
                     className="has-text-centered"
                     target={link.target}
                     rel={link.rel}
+                    data-umami-event={`project_${link.label.toLowerCase()}_click`}
+                    data-umami-event-type="click"
                 >
                     {link.label}
                 </Link>
@@ -63,7 +65,8 @@ ProjectCard.propTypes = {
         PropTypes.shape({
             label: PropTypes.string,
             url: PropTypes.string,
-            target: PropTypes.string
+            target: PropTypes.string,
+            rel: PropTypes.string,
         })
     )
 }