feat(analytics): draft: dynamic import of @vercel/site-analytics

docs/site/components/analytics/analytics-scripts.tsx

@@ -0,0 +1,45 @@
+"use client";
+
+import { useState, useEffect, type JSX } from "react";
+
+type SiteAnalytics = {
+  analytics: any;
+  consent: any;
+};
+
+function useSiteAnalytics(): SiteAnalytics | null {
+  const [result, setResult] = useState<SiteAnalytics | null>(null);
+
+  useEffect(() => {
+    let didCancel = false;
+
+    import("@vercel/site-analytics")
+      .then((mod) => {
+        console.log("Vercel Site Analytics module loaded successfully.", mod);
+      })
+      .catch(() => {
+        if (!didCancel) setResult(null);
+      });
+
+    return () => {
+      didCancel = true;
+    };
+  });
+
+  return result;
+}
+
+export function AnalyticsScripts({
+  children,
+}: {
+  children?: React.ReactNode;
+}): JSX.Element {
+  useSiteAnalytics();
+
+  return (
+    <>
+      <div>ANALYTICS</div>
+      {children}
+    </>
+  );
+}

docs/site/components/root-provider.tsx

@@ -5,19 +5,22 @@ import type { ReactNode } from "react";
 import { SearchDialog } from "@/components/search-dialog";
 import { LocalStorageProvider } from "./local-storage-hook";
 import { TopLevelMobileMenuProvider } from "./docs-layout/use-mobile-menu-context";
+import { AnalyticsScripts } from "./analytics/analytics-scripts";
 
 export function RootProvider({
   children,
 }: {
   children: ReactNode;
 }): JSX.Element {
   return (
-    <TopLevelMobileMenuProvider>
-      <LocalStorageProvider>
-        <FumaRootProvider search={{ SearchDialog }}>
-          {children}
-        </FumaRootProvider>
-      </LocalStorageProvider>
-    </TopLevelMobileMenuProvider>
+    <AnalyticsScripts>
+      <TopLevelMobileMenuProvider>
+        <LocalStorageProvider>
+          <FumaRootProvider search={{ SearchDialog }}>
+            {children}
+          </FumaRootProvider>
+        </LocalStorageProvider>
+      </TopLevelMobileMenuProvider>
+    </AnalyticsScripts>
   );
 }

docs/site/package.json

@@ -82,6 +82,9 @@
     "tsx": "^4.6.2",
     "typescript": "5.6.3"
   },
+  "optionalDependencies": {
+    "@vercel/site-analytics": "1.0.5"
+  },
   "engines": {
     "node": "20.x"
   }