documentation tweaks

Author: stutrek

docs/package-lock.json

@@ -16,6 +16,7 @@
         "@tailwindcss/forms": "^0.5.9",
         "@tailwindcss/typography": "^0.5.15",
         "@types/mdx": "^2.0.13",
+        "@types/umami": "^2.10.0",
         "classnames": "^2.5.1",
         "flowbite-react": "^0.10.2",
         "next": "14.2.13",

docs/package.json

@@ -3,6 +3,7 @@ import logoIcon from '../../public/Logo Icon.png';
 import ogImage from '../../public/OG image.png';
 import './globals.css';
 import './markdown.css';
+import { Tracking } from './tracking';
 
 export default function RootLayout({
     children,
@@ -22,8 +23,10 @@ export default function RootLayout({
                     © 2024 Stu Kabakoff
                 </div>
             </body>
+            <Tracking />
             <script
                 defer
+                async
                 src="https://umami.stutrek.com/script.js"
                 data-website-id="3af56b1c-38b6-421c-b59c-64fe9fb50784"
             />

docs/src/app/layout.tsx

@@ -0,0 +1,25 @@
+'use client';
+import { useEffect } from 'react';
+
+export const Tracking = () => {
+    useEffect(() => {
+        const listener = (event: PointerEvent) => {
+            if (
+                window.umami &&
+                (event.target instanceof HTMLAnchorElement ||
+                    event.target instanceof HTMLButtonElement)
+            ) {
+                const text = event.target.innerText;
+                umami.track('click', {
+                    text,
+                });
+            }
+        };
+        document.body.addEventListener('pointerdown', listener);
+        return () => {
+            document.body.removeEventListener('pointerdown', listener);
+        };
+    }, []);
+
+    return null;
+};