Last active
September 6, 2024 17:09
-
-
Save kostaspt/9644539c259084b7d1aef5502128b7ec to your computer and use it in GitHub Desktop.
A wrapper for Next.js links that adds Vercel Analytics tracking without modifying existing non-client components.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| 'use client' | |
| import { track } from '@vercel/analytics' | |
| import NextLink, { LinkProps as NextLinkProps } from 'next/link' | |
| import React from 'react' | |
| type TrackableNextLink = NextLinkProps & | |
| React.AnchorHTMLAttributes<HTMLAnchorElement> & { | |
| eventName: string | |
| eventProperties?: Record<string, string | number | boolean | null> | |
| } | |
| export default function TrackableNextLink({ children, eventName, eventProperties, ...props }: TrackableNextLink) { | |
| return ( | |
| <NextLink {...props} onClick={() => track(eventName, eventProperties)}> | |
| {children} | |
| </NextLink> | |
| ) | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment