From 6f7b53030aeca7025e580af8110fa106e221f6a1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Filip=20Dupanovi=C4=87?= <filip.dupanovic@gmail.com>
Date: Tue, 18 Jun 2024 13:37:52 +0200
Subject: [PATCH] feat(web): Defer outbound link tracking

Defers outbound link tracking to GTAG.
---
 apps/web/src/components/header/index.tsx | 15 ++------
 apps/web/src/components/index.ts         |  1 -
 apps/web/src/components/link.tsx         | 44 ------------------------
 3 files changed, 3 insertions(+), 57 deletions(-)
 delete mode 100644 apps/web/src/components/link.tsx

diff --git a/apps/web/src/components/header/index.tsx b/apps/web/src/components/header/index.tsx
index 048cd282f..e9ebd5e45 100644
--- a/apps/web/src/components/header/index.tsx
+++ b/apps/web/src/components/header/index.tsx
@@ -1,7 +1,6 @@
 import styled from '@emotion/styled'
 
 import { animations, colors, fonts, layers, media } from '../../styles'
-import { Link } from '../link'
 import { Docker, Github, Keybase, Npm, Stackoverflow } from './icons'
 
 export const Header = () => (
@@ -42,17 +41,9 @@ export const Header = () => (
           ],
         ] as const
       ).map(([name, href, title, icon]) => (
-        <EnhancedLink
-          key={name}
-          href={href}
-          title={title}
-          target="_blank"
-          eventCategory="Social Links"
-          eventAction="click"
-          eventLabel={name}
-        >
+        <Link key={name} href={href} title={title}>
           {icon}
-        </EnhancedLink>
+        </Link>
       ))}
     </Nav>
   </Root>
@@ -90,7 +81,7 @@ const Nav = styled.nav`
   justify-content: center;
 `
 
-const EnhancedLink: typeof Link = styled(Link)`
+const Link = styled.a`
   color: ${colors.text};
   font-size: 3.2rem;
   text-decoration: none;
diff --git a/apps/web/src/components/index.ts b/apps/web/src/components/index.ts
index 509ec9380..6cb67c862 100644
--- a/apps/web/src/components/index.ts
+++ b/apps/web/src/components/index.ts
@@ -1,4 +1,3 @@
 export * from './drone'
 export * from './header'
-export * from './link'
 export * from './scene'
diff --git a/apps/web/src/components/link.tsx b/apps/web/src/components/link.tsx
deleted file mode 100644
index 345b411d8..000000000
--- a/apps/web/src/components/link.tsx
+++ /dev/null
@@ -1,44 +0,0 @@
-import * as React from 'react'
-
-export interface LinkProps {
-  children: React.ReactElement
-  eventAction: string
-  eventCategory: string
-  eventLabel: string
-  href: string
-  target: string
-  title: string
-}
-
-export const Link: React.FC<LinkProps> = ({
-  eventAction,
-  eventCategory,
-  eventLabel,
-  children,
-  ...props
-}) => {
-  // Use the 'useCallback' hook for optimized event handler
-  const handleClick: React.MouseEventHandler<HTMLAnchorElement> =
-    React.useCallback(
-      (event) => {
-        event.preventDefault()
-
-        gtag('event', eventAction, {
-          event_category: eventCategory,
-          event_label: eventLabel,
-
-          event_callback: () => {
-            window.location.href = props.href
-          },
-          event_timeout: 2000,
-        })
-      },
-      [eventCategory, eventAction, eventLabel],
-    )
-
-  return (
-    <a {...props} onClick={handleClick}>
-      {children}
-    </a>
-  )
-}