Using @next/thirt-parties for GA, TS fix (#22)

GA is not from from @next/third-parties fixed window typescript error
hanzoai · Feb 22, 2024 · ced79b6 · ced79b6
1 parent ba06620
commit ced79b6
Show file tree

Hide file tree

Showing 6 changed files with 27 additions and 80 deletions.
diff --git a/pkgs/hanzo-ui/next/analytics/fpixel.ts b/pkgs/hanzo-ui/next/analytics/fpixel.ts
@@ -1,3 +1,9 @@
+declare global {
+  interface Window {
+    fbq: Function;
+  }
+}
+
 export const FB_PIXEL_ID = process.env.NEXT_PUBLIC_FACEBOOK_PIXEL_ID
 
 export const pageview = () => {

diff --git a/pkgs/hanzo-ui/next/analytics/google-analytics.tsx b/pkgs/hanzo-ui/next/analytics/google-analytics.tsx
diff --git a/pkgs/hanzo-ui/next/analytics/gtag.ts b/pkgs/hanzo-ui/next/analytics/gtag.ts
diff --git a/pkgs/hanzo-ui/next/root-layout.tsx b/pkgs/hanzo-ui/next/root-layout.tsx
@@ -4,7 +4,7 @@ import Header from '../common/header'
 import type { SiteDef } from '../types'
 import getAppRouterBodyFontClasses from './get-app-router-font-classes'
 import { FacebookPixelHead, FacebookPixel } from './analytics/pixel-analytics'
-import { GoogleAnalytics, GoogleAnalyticsHead } from './analytics/google-analytics'
+import { GoogleAnalytics } from '@next/third-parties/google'
 
 // Next 14: https://nextjs.org/docs/app/building-your-application/upgrading/codemods#use-viewport-export
 const viewport = {
@@ -42,11 +42,10 @@ const RootLayout: React.FC<PropsWithChildren & {
       {/* https://stackoverflow.com/a/75716588/11645689 */ }
       <base target='_blank' />
       <FacebookPixelHead/>
-      <GoogleAnalyticsHead/>
     </head>
     <body className={bodyClasses}>
       <FacebookPixel />
-      <GoogleAnalytics />
+      <GoogleAnalytics gaId={process.env.NEXT_PUBLIC_GA_MEASUREMENT_ID} />
       {header && <Header siteDef={siteDef}/>}
       {children}
     </body>

diff --git a/pkgs/hanzo-ui/package.json b/pkgs/hanzo-ui/package.json
@@ -44,6 +44,7 @@
   },
   "dependencies": {
     "@hookform/resolvers": "^3.3.2",
+    "@next/third-parties": "^14.1.0",
     "@radix-ui/react-accordion": "^1.1.2",
     "@radix-ui/react-avatar": "^1.0.3",
     "@radix-ui/react-checkbox": "^1.0.4",

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml