web: Agent Landing Page A/B testing toolkit (#9018)

Co-authored-by: Roo Code <[email protected]>

Author: brunobergher

apps/web-roo-code/src/app/pr-fixer/content-a.tsx

@@ -0,0 +1,94 @@
+import { type AgentPageContent } from "@/app/shared/agent-page-content"
+import Link from "next/link"
+
+// Workaround for next/image choking on these for some reason
+import hero from "/public/heroes/agent-pr-fixer.png"
+
+// Re-export for convenience
+export type { AgentPageContent }
+
+export const content: AgentPageContent = {
+	agentName: "PR Fixer",
+	hero: {
+		icon: "Wrench",
+		heading: "State-of-the-art fixes for the comments on your PRs.",
+		paragraphs: [
+			"Roo Code's PR Fixer applies high-quality changes to your PRs, right from GitHub. Invoke via a PR comment and it will read the entire comment history to understand context, agreements, and tradeoffs — then implement the right fix.",
+			"As always, you bring the model key; we orchestrate smart, efficient workflows.",
+		],
+		image: {
+			url: hero.src,
+			width: 800,
+			height: 711,
+			alt: "Example of a PR Fixer applying changes from review comments",
+		},
+		crossAgentLink: {
+			text: "Works great with",
+			links: [
+				{
+					text: "PR Reviewer Agent",
+					href: "/reviewer",
+					icon: "GitPullRequest",
+				},
+			],
+		},
+		cta: {
+			buttonText: "Start 14-day Free Trial",
+			disclaimer: "(cancel anytime)",
+		},
+	},
+	howItWorks: {
+		heading: "How It Works",
+		steps: [
+			{
+				title: "1. Connect your GitHub repositories",
+				description: "Pick which repos the PR Fixer can work on by pushing to ongoing branches.",
+				icon: "GitPullRequest",
+			},
+			{
+				title: "2. Invoke from a comment",
+				description:
+					'Ask the agent to fix issues directly from GitHub PR comments (e.g. "@roomote: fix these review comments"). It\'s fully aware of the entire comment history and latest diffs and focuses on fixing them – not random changes to your code.',
+				icon: "MessageSquareCode",
+			},
+			{
+				title: "3. Get clean scoped commits",
+				description: (
+					<>
+						The agent proposes targeted changes and pushes concise commits or patch suggestions you (or{" "}
+						<Link href="/reviewer">PR Reviewer</Link>) can review and merge quickly.
+					</>
+				),
+				icon: "Wrench",
+			},
+		],
+	},
+	whyBetter: {
+		heading: "Why Roo Code's PR Fixer is different",
+		features: [
+			{
+				title: "Comment-history aware",
+				description:
+					"Understands the entire conversation on the PR – previous reviews, your replies, follow-ups – and uses that context to produce accurate fixes.",
+				icon: "History",
+			},
+			{
+				title: "Bring your own key",
+				description:
+					"Use your preferred models at full strength. We optimize prompts and execution without capping your model to protect our margins.",
+				icon: "Key",
+			},
+			{
+				title: "Repository- and diff-aware",
+				description:
+					"Analyzes the full repo context and the latest diff to ensure fixes align with project conventions and pass checks.",
+				icon: "GitPullRequest",
+			},
+		],
+	},
+	cta: {
+		heading: "Ship fixes, not follow-ups.",
+		description: "Let Roo Code's PR Fixer turn your review feedback into clean, ready-to-merge commits.",
+		buttonText: "Start 14-day Free Trial",
+	},
+}

apps/web-roo-code/src/app/pr-fixer/page.tsx

@@ -2,7 +2,9 @@ import type { Metadata } from "next"
 
 import { SEO } from "@/lib/seo"
 import { ogImageUrl } from "@/lib/og"
-import { PrFixerContent } from "./PrFixerContent"
+import { AgentLandingContent } from "@/app/shared/AgentLandingContent"
+import { getContentVariant } from "@/app/shared/getContentVariant"
+import { content as contentA } from "./content-a"
 
 const TITLE = "PR Fixer"
 const DESCRIPTION =
@@ -55,6 +57,11 @@ export const metadata: Metadata = {
 	],
 }
 
-export default function AgentPrFixerPage() {
-	return <PrFixerContent />
+export default async function AgentPrFixerPage({ searchParams }: { searchParams: Promise<{ v?: string }> }) {
+	const params = await searchParams
+	const content = getContentVariant(params, {
+		A: contentA,
+	})
+
+	return <AgentLandingContent content={content} />
 }