Merge pull request #57 from databricks/thisistonydang/analytics

thisistonydang · web-flow · commit 94502cb53ebd · 2026-04-21T20:57:43.000-07:00
feat(analytics): add Vercel Analytics with copy-prompt event tracking
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -32,6 +32,7 @@
     "@hookform/resolvers": "^5.2.2",
     "@mdx-js/react": "^3.0.0",
     "@modelcontextprotocol/sdk": "^1.25.2",
+    "@vercel/analytics": "^2.0.1",
     "@vercel/functions": "^3.4.3",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.0.0",
diff --git a/src/components/home/hero-section.tsx b/src/components/home/hero-section.tsx
@@ -2,6 +2,7 @@ import type { ReactNode } from "react";
 import { useCallback, useRef, useState } from "react";
 import { ArrowRight, Check, Clipboard, LoaderCircle } from "lucide-react";
 import Link from "@docusaurus/Link";
+import { track } from "@vercel/analytics";
 import { Button } from "@/components/ui/button";
 import { getBootstrapPromptApiPath } from "@/lib/bootstrap-prompt";
 
@@ -76,6 +77,7 @@ export function HeroSection(): ReactNode {
       }
 
       setCopyState("copied");
+      track("copy_bootstrap_prompt", { source: "hero" });
     } catch {
       setCopyState("error");
     } finally {
diff --git a/src/components/home/wizard-flow.tsx b/src/components/home/wizard-flow.tsx
@@ -10,6 +10,7 @@ import {
   Sparkles,
   type LucideIcon,
 } from "lucide-react";
+import { track } from "@vercel/analytics";
 import { Button } from "@/components/ui/button";
 import { getBootstrapPromptApiPath } from "@/lib/bootstrap-prompt";
 
@@ -599,6 +600,7 @@ function CopyPromptButton(): ReactNode {
       }
 
       setCopyState("copied");
+      track("copy_bootstrap_prompt", { source: "wizard" });
     } catch {
       setCopyState("error");
     } finally {
diff --git a/src/theme/Root.tsx b/src/theme/Root.tsx
@@ -2,6 +2,7 @@ import type { ReactNode } from "react";
 import Head from "@docusaurus/Head";
 import { useLocation } from "@docusaurus/router";
 import BrowserOnly from "@docusaurus/BrowserOnly";
+import { Analytics } from "@vercel/analytics/react";
 import { Toaster } from "sonner";
 
 // Keep in sync with middleware.ts matcher and vercel.json headers/rewrites
@@ -46,6 +47,7 @@ function SonnerToaster() {
 export default function Root({ children }: { children: ReactNode }): ReactNode {
   return (
     <>
+      <Analytics />
       <MarkdownAlternate />
       {children}
       <BrowserOnly>{() => <SonnerToaster />}</BrowserOnly>
