Add scroll depth tracking

package.json

@@ -3,7 +3,7 @@
     "version": "2.0.0",
     "private": true,
     "repository": "https://git.mifi.dev/mifi-ventures/landing.git",
-    "packageManager": "pnpm@10.29.3+sha512.498e1fb4cca5aa06c1dcf2611e6fafc50972ffe7189998c409e90de74566444298ffe43e6cd2acdc775ba1aa7cc5e092a8b7054c811ba8c5770f84693d33d2dc",
+    "packageManager": "pnpm@10.30.0+sha512.2b5753de015d480eeb88f5b5b61e0051f05b4301808a82ec8b840c9d2adf7748eb352c83f5c1593ca703ff1017295bc3fdd3119abb9686efc96b9fcb18200937",
     "description": "mifi Ventures landing site — SvelteKit static build with critical CSS inlining",
     "type": "module",
     "scripts": {

scripts/update-e2e-snapshots.sh

@@ -8,6 +8,7 @@ set -e
 SCRIPT_DIR="${BASH_SOURCE%/*}"
 PROJECT_ROOT="${SCRIPT_DIR}/.."
 cd "$PROJECT_ROOT"
+PROJECT_ROOT="$(pwd)"
 
 if command -v docker >/dev/null 2>&1; then
     PLAYWRIGHT_IMAGE="${PLAYWRIGHT_IMAGE:-mcr.microsoft.com/playwright:v1.58.0-noble}"

src/lib/components/Footer.svelte

@@ -16,6 +16,8 @@
                 target="_blank"
                 rel="noopener noreferrer"
                 aria-label="LinkedIn profile (opens in new tab)"
+                data-umami-event="footer link"
+                data-umami-event-label="linkedin"
             >
                 <LinkedInIcon size={15} />
                 LinkedIn
@@ -27,6 +29,8 @@
                 target="_blank"
                 rel="noopener noreferrer"
                 aria-label="GitHub profile (opens in new tab)"
+                data-umami-event="footer link"
+                data-umami-event-label="github"
             >
                 <GithubIcon size={15} />
                 GitHub

src/lib/components/Hero.svelte

@@ -19,6 +19,8 @@
                 target="_blank"
                 rel="noopener noreferrer"
                 aria-label="Schedule a 30-minute intro call (opens in new tab)"
+                data-umami-event="schedule call"
+                data-umami-event-location="hero section"
             >
                 Schedule a 30-minute intro call
                 <ExternalLinkIcon aria-label="Opens in new tab" size={17} />
@@ -28,6 +30,8 @@
                 class="btn btn-secondary icon-button"
                 download
                 aria-label="Download Mike Fitzpatrick's resume as PDF"
+                data-umami-event="download resume"
+                data-umami-event-location="hero section"
             >
                 Download resume
                 <FiletypePdfIcon aria-label="PDF format file" size={17} />

src/lib/components/Navigation.svelte

@@ -42,20 +42,45 @@
         </span>
         <ul class="nav-list">
             <li class="nav-item">
-                <a href="#what-we-do" class="nav-link">Services</a>
+                <a
+                    href="#what-we-do"
+                    class="nav-link"
+                    data-umami-event="navigation"
+                    data-umami-event-label="services">Services</a
+                >
             </li>
             <li class="nav-item">
-                <a href="#impact" class="nav-link">Impact</a>
+                <a
+                    href="#impact"
+                    class="nav-link"
+                    data-umami-event="navigation"
+                    data-umami-event-label="impact">Impact</a
+                >
             </li>
             <li class="nav-item">
-                <a href="#how-we-work" class="nav-link">Process</a>
+                <a
+                    href="#how-we-work"
+                    class="nav-link"
+                    data-umami-event="navigation"
+                    data-umami-event-label="process">Process</a
+                >
             </li>
             <li class="nav-item">
-                <a href="#schedule" class="nav-link">Contact</a>
+                <a
+                    href="#schedule"
+                    class="nav-link"
+                    data-umami-event="navigation"
+                    data-umami-event-label="contact">Contact</a
+                >
             </li>
         </ul>
         <div class="nav-item nav-back-to-top">
-            <a href="#header" class="nav-link">Back to top</a>
+            <a
+                href="#header"
+                class="nav-link"
+                data-umami-event="navigation"
+                data-umami-event-label="back to top">Back to top</a
+            >
         </div>
     </div>
 </nav>

src/lib/components/ScheduleSection.svelte

@@ -16,6 +16,8 @@
             target="_blank"
             rel="noopener noreferrer"
             aria-label="Schedule a 30-minute intro call (opens in new tab)"
+            data-umami-event="schedule call"
+            data-umami-event-location="schedule section"
         >
             Schedule a 30-minute intro call
             <ExternalLinkIcon aria-label="Opens in new tab" size={17} />

src/routes/+layout.svelte

@@ -30,6 +30,12 @@
     <!-- Google tag (gtag.js) -->
     <script async src="https://www.googletagmanager.com/gtag/js?id=G-36F29PDKRT"></script>
     <script defer src="/assets/js/ga-init.js"></script>
+    <script
+        defer
+        src="https://analytics.mifi.holdings/script.js"
+        data-website-id="72ac01ce-e7fc-4582-8593-703f15add8d5"
+    ></script>
+    <script defer src="/assets/js/umami-helper.js"></script>
 
     <title>{merged.title}</title>
     <meta name="description" content={merged.description ?? ''} />
@@ -143,5 +149,15 @@
     <script src="/assets/js/mobile-menu-helper.js" defer></script>
 </svelte:head>
 
-<a href="#main" class="skip-link">Skip to main content</a>
+<a href="#main" class="skip-link" data-umami-event="skip to main content"
+    >Skip to main content</a
+>
 {@render children()}
+<img
+    src="https://analytics.mifi.holdings/p/wQ9GYnLIg"
+    alt=""
+    width="1"
+    height="1"
+    role="presentation"
+    loading="eager"
+/>

static/assets/js/umami-helper.js

@@ -0,0 +1,28 @@
+// Umami: safe track (no-op if script blocked or not loaded)
+function umamiTrack(name, data) {
+    if (
+        typeof window.umami !== 'undefined' &&
+        typeof window.umami.track === 'function'
+    ) {
+        if (data != null) window.umami.track(name, data);
+        else window.umami.track(name);
+    }
+}
+
+// Umami: scroll depth (25%, 50%, 75%, 100%) – once per milestone
+const scrollMilestones = new Set();
+function onScroll() {
+    const doc = document.documentElement;
+    const scrollTop = doc.scrollTop || document.body.scrollTop;
+    const scrollHeight =
+        (doc.scrollHeight || document.body.scrollHeight) - window.innerHeight;
+    if (scrollHeight <= 0) return;
+    const pct = Math.round((scrollTop / scrollHeight) * 100);
+    for (const m of [25, 50, 75, 100]) {
+        if (pct >= m && !scrollMilestones.has(m)) {
+            scrollMilestones.add(m);
+            umamiTrack('scroll-depth', { depth: String(m) });
+        }
+    }
+}
+window.addEventListener('scroll', onScroll, { passive: true });