diff --git a/docs/src/app/(home)/[[...slug]]/page.tsx b/docs/src/app/(home)/[[...slug]]/page.tsx
index a9a36b4f..20b84e3e 100644
--- a/docs/src/app/(home)/[[...slug]]/page.tsx
+++ b/docs/src/app/(home)/[[...slug]]/page.tsx
@@ -18,6 +18,7 @@ import { ChevronDown, CodeXml, ExternalLink } from 'lucide-react';
import type { Metadata } from 'next';
import Link from 'next/link';
import { notFound, redirect } from 'next/navigation';
+import { PageFeedback } from '@/components/page-feedback';
export default async function Page(props: {
params: Promise<{ slug?: string[] }>;
@@ -270,6 +271,7 @@ export default async function Page(props: {
a: createRelativeLink(source, page),
})}
/>
+
);
diff --git a/docs/src/components/page-feedback.tsx b/docs/src/components/page-feedback.tsx
new file mode 100644
index 00000000..f7067aec
--- /dev/null
+++ b/docs/src/components/page-feedback.tsx
@@ -0,0 +1,53 @@
+'use client';
+
+import { useState } from 'react';
+import posthog from 'posthog-js';
+import { ThumbsUp, ThumbsDown } from 'lucide-react';
+
+export function PageFeedback() {
+ const [feedback, setFeedback] = useState<'helpful' | 'not_helpful' | null>(null);
+
+ const handleFeedback = (isHelpful: boolean) => {
+ const feedbackType = isHelpful ? 'helpful' : 'not_helpful';
+ setFeedback(feedbackType);
+
+ posthog.capture(`page_feedback_${feedbackType}`, {
+ page: window.location.pathname,
+ page_title: document.title,
+ });
+ };
+
+ return (
+
+ {feedback === null ? (
+
+
Was this page helpful?
+
+
+
+
+
+ ) : (
+
+ {feedback === 'helpful'
+ ? 'Thanks for your feedback!'
+ : 'Thanks for your feedback. We\'ll work on improving this page.'}
+
+ )}
+
+ );
+}