From b3e9b766429af09fdff1971db08a9028cb437e41 Mon Sep 17 00:00:00 2001
From: Branko Conjic <brankoconjic@gmail.com>
Date: Wed, 20 Dec 2023 16:57:21 +0100
Subject: [PATCH] feat(docs): add fathom

---
 apps/docs/package.json              |  1 +
 apps/docs/src/app/layout.tsx        |  3 +++
 apps/docs/src/components/Fathom.tsx | 32 +++++++++++++++++++++++++++++
 pnpm-lock.yaml                      |  7 +++++++
 4 files changed, 43 insertions(+)
 create mode 100644 apps/docs/src/components/Fathom.tsx

diff --git a/apps/docs/package.json b/apps/docs/package.json
index 8fa5c99..c19d94a 100644
--- a/apps/docs/package.json
+++ b/apps/docs/package.json
@@ -17,6 +17,7 @@
     "@iconicicons/react": "^1.5.1",
     "@radix-ui/react-scroll-area": "^1.0.5",
     "clsx": "^2.0.0",
+    "fathom-client": "^3.6.0",
     "next": "14.0.4",
     "react": "^18",
     "react-dom": "^18",
diff --git a/apps/docs/src/app/layout.tsx b/apps/docs/src/app/layout.tsx
index 0b2de19..09569b1 100644
--- a/apps/docs/src/app/layout.tsx
+++ b/apps/docs/src/app/layout.tsx
@@ -9,6 +9,7 @@ import { Sidebar } from "@/components/Sidebar";
 
 import "@/styles/globals.css";
 
+import Fathom from "@/components/Fathom";
 import Header from "@/components/Header";
 
 export const metadata: Metadata = {
@@ -27,6 +28,8 @@ export default function RootLayout({ children }: { children: React.ReactNode })
           monoFont.variable
         )}
       >
+        <Fathom />
+
         <div className="min-h-screen-dvh flex flex-col">
           <Providers>
             <Header />
diff --git a/apps/docs/src/components/Fathom.tsx b/apps/docs/src/components/Fathom.tsx
new file mode 100644
index 0000000..077b67f
--- /dev/null
+++ b/apps/docs/src/components/Fathom.tsx
@@ -0,0 +1,32 @@
+// Fathom.tsx
+"use client";
+
+import { Suspense, useEffect } from "react";
+import { usePathname, useSearchParams } from "next/navigation";
+import { load, trackPageview } from "fathom-client";
+
+function TrackPageView() {
+  const pathname = usePathname();
+  const searchParams = useSearchParams();
+  useEffect(() => {
+    load("VDTVBMMX", {
+      includedDomains: ["lemonsqueezy.com"],
+    });
+  }, []);
+
+  useEffect(() => {
+    trackPageview();
+
+    // Record a pageview when route changes
+  }, [pathname, searchParams]);
+
+  return null;
+}
+
+export default function Fathom() {
+  return (
+    <Suspense fallback={null}>
+      <TrackPageView />
+    </Suspense>
+  );
+}
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index a80e08f..69c1e0c 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -90,6 +90,9 @@ importers:
       clsx:
         specifier: ^2.0.0
         version: 2.0.0
+      fathom-client:
+        specifier: ^3.6.0
+        version: 3.6.0
       next:
         specifier: 14.0.4
         version: 14.0.4(@babel/core@7.23.6)(@opentelemetry/api@1.7.0)(react-dom@18.2.0)(react@18.2.0)(sass@1.69.5)
@@ -5515,6 +5518,10 @@ packages:
     dependencies:
       reusify: 1.0.4
 
+  /fathom-client@3.6.0:
+    resolution: {integrity: sha512-/mrgmVvpw4HqDCcqUfPulERhONKgnJGL74RAxfqKDuRQ+7w9lKoTHMzqBWE7WNBvmsgZEthQWJFOWOEjv+T3gA==}
+    dev: false
+
   /fault@2.0.1:
     resolution: {integrity: sha512-WtySTkS4OKev5JtpHXnib4Gxiurzh5NCGvWrFaZ34m6JehfTUhKZvn9njTfw48t6JumVQOmrKqpmGcdwxnhqBQ==}
     dependencies: