From 1a0d6270af38bcf6fcf7c312dd4d5c5c8fc1aa2d Mon Sep 17 00:00:00 2001
From: Roo Code <roomote@roocode.com>
Date: Thu, 22 Jan 2026 02:02:55 +0000
Subject: [PATCH] feat: add HubSpot tracking with consent-based loading

---
 .../src/app/legal/cookies/page.tsx            | 30 +++++++++--
 .../components/providers/hubspot-provider.tsx | 50 +++++++++++++++++++
 .../src/components/providers/providers.tsx    | 13 +++--
 3 files changed, 84 insertions(+), 9 deletions(-)
 create mode 100644 apps/web-roo-code/src/components/providers/hubspot-provider.tsx

diff --git a/apps/web-roo-code/src/app/legal/cookies/page.tsx b/apps/web-roo-code/src/app/legal/cookies/page.tsx
index c8058a34e77..895d7c2b456 100644
--- a/apps/web-roo-code/src/app/legal/cookies/page.tsx
+++ b/apps/web-roo-code/src/app/legal/cookies/page.tsx
@@ -100,6 +100,19 @@ export default function CookiePolicy() {
 									<td className="border border-border px-4 py-3">1 year</td>
 									<td className="border border-border px-4 py-3 font-mono text-sm">ph_*</td>
 								</tr>
+								<tr>
+									<td className="border border-border px-4 py-3 font-medium">HubSpot</td>
+									<td className="border border-border px-4 py-3">
+										Marketing automation and visitor tracking
+									</td>
+									<td className="border border-border px-4 py-3">
+										Analytics (only with your consent)
+									</td>
+									<td className="border border-border px-4 py-3">13 months</td>
+									<td className="border border-border px-4 py-3 font-mono text-sm">
+										hubspotutk, __hstc, __hssrc, __hssc
+									</td>
+								</tr>
 							</tbody>
 						</table>
 					</div>
@@ -122,6 +135,15 @@ export default function CookiePolicy() {
 							PostHog Privacy Policy
 						</a>
 					</p>
+					<p>
+						<a
+							href="https://legal.hubspot.com/privacy-policy"
+							target="_blank"
+							rel="noopener noreferrer"
+							className="text-primary hover:underline">
+							HubSpot Privacy Policy
+						</a>
+					</p>
 
 					<h2 className="mt-12 text-2xl font-bold">Essential cookies</h2>
 					<p>
@@ -133,10 +155,10 @@ export default function CookiePolicy() {
 
 					<h2 className="mt-12 text-2xl font-bold">Analytics cookies</h2>
 					<p>
-						We use PostHog analytics cookies to understand how visitors interact with our website. This
-						helps us improve our services and user experience. Analytics cookies are placed only if you give
-						consent through our cookie banner. The lawful basis for processing these cookies is your
-						consent, which you can withdraw at any time.
+						We use PostHog and HubSpot analytics cookies to understand how visitors interact with our
+						website. This helps us improve our services, user experience, and marketing efforts. Analytics
+						cookies are placed only if you give consent through our cookie banner. The lawful basis for
+						processing these cookies is your consent, which you can withdraw at any time.
 					</p>
 
 					<h2 className="mt-12 text-2xl font-bold">Third-party services</h2>
diff --git a/apps/web-roo-code/src/components/providers/hubspot-provider.tsx b/apps/web-roo-code/src/components/providers/hubspot-provider.tsx
new file mode 100644
index 00000000000..9f0236d62b6
--- /dev/null
+++ b/apps/web-roo-code/src/components/providers/hubspot-provider.tsx
@@ -0,0 +1,50 @@
+"use client"
+
+import { useEffect, useState } from "react"
+import Script from "next/script"
+import { hasConsent, onConsentChange } from "@/lib/analytics/consent-manager"
+
+// HubSpot Account ID
+const HUBSPOT_ID = "243714031"
+
+/**
+ * HubSpot Tracking Provider
+ * Loads HubSpot tracking script only after user consent is given, following GDPR requirements
+ */
+export function HubSpotProvider({ children }: { children: React.ReactNode }) {
+	const [shouldLoad, setShouldLoad] = useState(false)
+
+	useEffect(() => {
+		// Check initial consent status
+		if (hasConsent()) {
+			setShouldLoad(true)
+		}
+
+		// Listen for consent changes
+		const unsubscribe = onConsentChange((consented) => {
+			if (consented) {
+				setShouldLoad(true)
+			}
+		})
+
+		return unsubscribe
+	}, [])
+
+	return (
+		<>
+			{shouldLoad && (
+				<>
+					{/* HubSpot Embed Code */}
+					<Script
+						id="hs-script-loader"
+						src={`//js-na2.hs-scripts.com/${HUBSPOT_ID}.js`}
+						strategy="afterInteractive"
+						async
+						defer
+					/>
+				</>
+			)}
+			{children}
+		</>
+	)
+}
diff --git a/apps/web-roo-code/src/components/providers/providers.tsx b/apps/web-roo-code/src/components/providers/providers.tsx
index a0e532b5e4d..f97c6921456 100644
--- a/apps/web-roo-code/src/components/providers/providers.tsx
+++ b/apps/web-roo-code/src/components/providers/providers.tsx
@@ -4,6 +4,7 @@ import { QueryClient, QueryClientProvider } from "@tanstack/react-query"
 import { ThemeProvider } from "next-themes"
 
 import { GoogleTagManagerProvider } from "./google-tag-manager-provider"
+import { HubSpotProvider } from "./hubspot-provider"
 import { PostHogProvider } from "./posthog-provider"
 
 const queryClient = new QueryClient()
@@ -12,11 +13,13 @@ export const Providers = ({ children }: { children: React.ReactNode }) => {
 	return (
 		<QueryClientProvider client={queryClient}>
 			<GoogleTagManagerProvider>
-				<PostHogProvider>
-					<ThemeProvider attribute="class" defaultTheme="dark" enableSystem={false}>
-						{children}
-					</ThemeProvider>
-				</PostHogProvider>
+				<HubSpotProvider>
+					<PostHogProvider>
+						<ThemeProvider attribute="class" defaultTheme="dark" enableSystem={false}>
+							{children}
+						</ThemeProvider>
+					</PostHogProvider>
+				</HubSpotProvider>
 			</GoogleTagManagerProvider>
 		</QueryClientProvider>
 	)