diff --git a/components/blog/BlogPostViewTracker.tsx b/components/blog/BlogPostViewTracker.tsx
new file mode 100644
index 0000000..5167b46
--- /dev/null
+++ b/components/blog/BlogPostViewTracker.tsx
@@ -0,0 +1,21 @@
+'use client';
+
+import { useEffect } from 'react';
+import { trackEvent } from '../../lib/analytics';
+
+type BlogPostViewTrackerProps = {
+ slug: string;
+ category: string;
+};
+
+export default function BlogPostViewTracker({ slug, category }: BlogPostViewTrackerProps) {
+ useEffect(() => {
+ trackEvent('blog_post_viewed', {
+ post_slug: slug,
+ post_category: category,
+ page_path: window.location.pathname,
+ });
+ }, [slug, category]);
+
+ return null;
+}
diff --git a/components/blog/SimilarPostsSection.tsx b/components/blog/SimilarPostsSection.tsx
index 4ea5392..2ac4559 100644
--- a/components/blog/SimilarPostsSection.tsx
+++ b/components/blog/SimilarPostsSection.tsx
@@ -1,5 +1,9 @@
+'use client';
+
import Image from 'next/image';
+import { useEffect, useRef } from 'react';
import type { BlogPost } from '../../lib/blog';
+import { trackEvent } from '../../lib/analytics';
import BookingCta from '../BookingCta';
import QuestionnaireCta from '../QuestionnaireCta';
import TrackedLink from '../TrackedLink';
@@ -9,6 +13,29 @@ type SimilarPostsSectionProps = {
};
export default function SimilarPostsSection({ posts }: SimilarPostsSectionProps) {
+ const hasTrackedEmptyState = useRef(false);
+
+ useEffect(() => {
+ if (posts.length > 0) {
+ hasTrackedEmptyState.current = false;
+ return;
+ }
+
+ if (hasTrackedEmptyState.current) return;
+ hasTrackedEmptyState.current = true;
+ trackEvent('blog_similar_posts_empty_state_viewed', {
+ page_path: window.location.pathname,
+ });
+ }, [posts.length]);
+
+ const trackRecirculationClick = (destination: string, postSlug?: string) => {
+ trackEvent('blog_post_recirculation_clicked', {
+ destination,
+ ...(postSlug ? { post_slug: postSlug } : {}),
+ page_path: window.location.pathname,
+ });
+ };
+
return (
{posts.length > 0 ? (
@@ -25,6 +52,7 @@ export default function SimilarPostsSection({ posts }: SimilarPostsSectionProps)
location="blog-post"
section="similar-posts"
label={post.title}
+ onClick={() => trackRecirculationClick('similar_post', post.slug)}
>
trackRecirculationClick('blog_index')}
>
View All Posts
→
@@ -70,6 +99,7 @@ export default function SimilarPostsSection({ posts }: SimilarPostsSectionProps)
location="blog-post"
section="similar-posts"
label="View All Posts"
+ onClick={() => trackRecirculationClick('blog_index')}
>
View All Posts
→
@@ -77,10 +107,14 @@ export default function SimilarPostsSection({ posts }: SimilarPostsSectionProps)
)}
-
+ trackRecirculationClick('booking_cta')}
+ />
trackRecirculationClick('questionnaire_cta')}
/>