feat: pirsch analytics events

aufacicenta · Jun 14, 2024 · 0ca88d2 · 0ca88d2
1 parent e1e5c5a
commit 0ca88d2
Show file tree

Hide file tree

Showing 4 changed files with 36 additions and 2 deletions.
diff --git a/app/src/layouts/home-layout/HomeLayout.tsx b/app/src/layouts/home-layout/HomeLayout.tsx
@@ -21,7 +21,20 @@ export const HomeLayout: React.FC<ChatLayoutProps> = ({ children }) => {
   return (
     <>
       {process.env.NEXT_PUBLIC_VERCEL_ENV === "production" && (
-        <Script defer src="https://api.pirsch.io/pa.js" id="pianjs" data-code="X8onK5mQgqhkgQzuKWUBs08SnTqpig5x" />
+        <Script
+          defer
+          src="https://api.pirsch.io/pa.js"
+          id="pianjs"
+          data-code={process.env.NEXT_PUBLIC_PIRSCH_ANALYTICS_PID}
+        />
+      )}
+      {process.env.NEXT_PUBLIC_VERCEL_ENV === "development" && (
+        <Script
+          defer
+          src="https://api.pirsch.io/pa.js"
+          id="pianjs"
+          data-code={process.env.NEXT_PUBLIC_PIRSCH_ANALYTICS_PID}
+        />
       )}
       <Head>
         <meta property="og:locale" content={locale} />

diff --git a/app/src/providers/analytics/events.ts b/app/src/providers/analytics/events.ts
@@ -0,0 +1,7 @@
+export const EventTracking = {
+  click: {
+    homepage: {
+      collection_item: `click.homepage.collection_item`,
+    },
+  },
+};
diff --git a/app/src/providers/analytics/index.ts b/app/src/providers/analytics/index.ts
@@ -0,0 +1,5 @@
+import { EventTracking } from "./events";
+
+export default {
+  EventTracking,
+};
diff --git a/app/src/ui/svpervnder/collections/larskristo_hellheads/grid-item/GridItem.tsx b/app/src/ui/svpervnder/collections/larskristo_hellheads/grid-item/GridItem.tsx
@@ -1,16 +1,25 @@
+/* eslint-disable react/no-unknown-property */
 import clsx from "clsx";
 
 import { Grid } from "ui/grid/Grid";
 import { Card } from "ui/card/Card";
 import { Typography } from "ui/typography/Typography";
 import { Icon } from "ui/icon/Icon";
+import analytics from "providers/analytics";
 
 import styles from "./GridItem.module.scss";
 import { GridItemProps } from "./GridItem.types";
 
 export const GridItem: React.FC<GridItemProps> = ({ item, handleExpand, className }) => (
   <Grid.Col lg={2} xs={6} key={item.thumbnail} className={clsx(styles["grid-item"], className)}>
-    <Card className={styles["grid-item"]} withSpotlightEffect onClick={() => handleExpand(item)}>
+    <Card
+      className={styles["grid-item"]}
+      withSpotlightEffect
+      onClick={() => handleExpand(item)}
+      data-pirsch-event={analytics.EventTracking.click.homepage.collection_item}
+      data-pirsch-name={item.name}
+      data-pirsch-token-id={item.id}
+    >
       <div className={styles["grid-item__img"]}>
         <img src={item.thumbnail} alt={item.name} />
       </div>