feat: sectional onboarding tester for first-request page

content/docs/documentation/making-your-first-request.mdx

@@ -4,11 +4,13 @@ description: A beginner-friendly guide to making your first Whitepages API reque
 icon: Play
 ---
 
-Ready to test your API key? You can try it right here in your browser, or follow the step-by-step guide using Postman.
+Ready to test your API key? Pick the use case that matches what you're building and try it right here in your browser — or follow the step-by-step guide using Postman.
 
-## Quick Test
+## Try It Now
 
-<ApiKeyTester />
+Paste your API key once, then run a sample request for the use case you care about. Each section links to a deeper guide if you want to learn more.
+
+<OnboardingTester />
 
 ## Using Postman (No Code Required)
 

src/app/api/test-proxy/route.ts → src/app/api/test-proxy/[endpoint]/route.ts

@@ -1,11 +1,20 @@
 import { NextRequest, NextResponse } from "next/server";
 
-export async function GET(request: NextRequest) {
+const ALLOWED_ENDPOINTS = new Set(["person", "property"]);
+
+export async function GET(
+  request: NextRequest,
+  { params }: { params: Promise<{ endpoint: string }> },
+) {
+  const { endpoint } = await params;
+  if (!ALLOWED_ENDPOINTS.has(endpoint)) {
+    return NextResponse.json({ error: "Invalid endpoint" }, { status: 404 });
+  }
+
   const apiKey = request.headers.get("X-Api-Key");
   const { searchParams } = new URL(request.url);
-
   const queryString = searchParams.toString();
-  const url = `https://api.whitepages.com/v2/person?${queryString}`;
+  const url = `https://api.whitepages.com/v2/${endpoint}?${queryString}`;
 
   try {
     const response = await fetch(url, {