Add Hotjar

* add hotjar * use env vars
metaplex-foundation · Feb 28, 2024 · e64fb8b · e64fb8b
1 parent 2e1d1e9
commit e64fb8b
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 0 deletions.
diff --git a/.env.example b/.env.example
@@ -1,3 +1,5 @@
 NEXT_PUBLIC_DOCSEARCH_APP_ID=R2IYF7ETH7
 NEXT_PUBLIC_DOCSEARCH_API_KEY=599cec31baffa4868cae4e79f180729b
 NEXT_PUBLIC_DOCSEARCH_INDEX_NAME=docsearch
+NEXT_PUBLIC_HOTJAR_ID=3793483
+NEXT_PUBLIC_HOTJAR_VERSION=6
diff --git a/package.json b/package.json
@@ -13,6 +13,7 @@
     "@docsearch/react": "^3.2.1",
     "@headlessui/react": "^1.7.13",
     "@heroicons/react": "^2.0.18",
+    "@hotjar/browser": "^1.0.9",
     "@markdoc/markdoc": "0.3.0",
     "@markdoc/next.js": "0.2.3",
     "@sindresorhus/slugify": "^2.1.0",

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/src/components/Layout.jsx b/src/components/Layout.jsx
@@ -1,5 +1,6 @@
 import clsx from 'clsx'
 import Link from 'next/link'
+import Hotjar from '@hotjar/browser';
 
 import { Header } from '@/components/Header'
 import { Navigation } from '@/components/Navigation'
@@ -13,6 +14,9 @@ export function Layout({ children, page }) {
   const Hero = page.activeHero
   useLightense()
   useAccentClass(page.product)
+  if(process.env.NEXT_HOTJAR_ID && process.env.NEXT_HOTJAR_Version){
+    Hotjar.init(process.env.NEXT_HOTJAR_ID, process.env.NEXT_HOTJAR_Version);
+  }
 
   return (
     <>