add plausible analytics

troypoulter · May 18, 2023 · 2e892e8 · 2e892e8 · vercel · May 18, 2023
1 parent a43b3b4
commit 2e892e8
Show file tree

Hide file tree

Showing 3 changed files with 39 additions and 3 deletions.
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -1,14 +1,14 @@
 import "@/styles/globals.css"
 import { Metadata } from "next"
-
-import { Analytics } from '@vercel/analytics/react';
+import { Analytics } from "@vercel/analytics/react"
 
 import { siteConfig } from "@/config/site"
 import { fontSans } from "@/lib/fonts"
 import { cn } from "@/lib/utils"
 import { SiteHeader } from "@/components/site-header"
 import { TailwindIndicator } from "@/components/tailwind-indicator"
 import { ThemeProvider } from "@/components/theme-provider"
+import PlausibleScript from "@/components/plausible-script"
 
 export const metadata: Metadata = {
   title: {
@@ -35,7 +35,15 @@ export default function RootLayout({ children }: RootLayoutProps) {
   return (
     <>
       <html lang="en" suppressHydrationWarning>
-        <head />
+        <head>
+          <script
+            async
+            defer
+            src="/stats/js/script.js"
+            data-api="/stats/api/event"
+            data-domain="base64.troypoulter.com"
+          ></script>
+        </head>
         <body
           className={cn(
             "min-h-screen bg-background font-sans antialiased",
@@ -48,6 +56,7 @@ export default function RootLayout({ children }: RootLayoutProps) {
               <div className="flex-1">{children}</div>
             </div>
             <Analytics />
+            {process.env.NODE_ENV === "production" && <PlausibleScript />}
             <TailwindIndicator />
           </ThemeProvider>
         </body>

diff --git a/components/plausible-script.tsx b/components/plausible-script.tsx
@@ -0,0 +1,15 @@
+import Head from "next/head";
+
+const PlausibleScript = () => (
+  <Head>
+    <script
+      key="plausible-script"
+      src="/stats/js/script.js"
+      async
+      defer
+      data-api="/stats/api/event"
+      data-domain="base64.troypoulter.com"
+    />
+  </Head>
+);
+export default PlausibleScript;
diff --git a/vercel.json b/vercel.json
@@ -0,0 +1,12 @@
+{
+    "rewrites": [
+      {
+        "source": "/stats/js/script.js",
+        "destination": "https://plausible.io/js/script.js"
+      },
+      {
+        "source": "/stats/api/event",
+        "destination": "https://plausible.io/api/event"
+      }
+    ]
+  }