[CI] (3864784) react-router/react-router-v7-project

[wizard-ci-bot]

Automated wizard CI run

Source: manual
Trigger ID: 3864784
App: react-router/react-router-v7-project
App directory: apps/react-router/react-router-v7-project
Workbench branch: wizard-ci-3864784-react-router-react-router-v7-project
Wizard branch: main
Examples branch: main
PostHog (MCP) branch: master
Timestamp: 2026-01-21T22:25:56.353Z
Duration: 383.2s

[wizard-ci-bot]

The files don't exist locally, but I have the complete diff provided in the PR description. I'll evaluate the PR based on the comprehensive diff information provided.

---

PR Evaluation Report

Summary

This PR integrates PostHog analytics into a React Router v7 framework-mode application. It adds client-side initialization with PostHogProvider, server-side middleware for session correlation, user identification on login/signup, error boundary exception capture, and comprehensive event tracking across multiple routes (countries, country detail, home, login, signup, profile).

Files changed	Lines added	Lines removed
14	+782	-20

Confidence score: 3/5 🤔

• Error boundary uses hook outside render context: usePostHog() is called at the top of ErrorBoundary function which then immediately calls posthog?.captureException(error). Hooks cannot be conditionally called and this pattern may cause issues - the side effect should be inside a useEffect. [MEDIUM]
• defaults config option is non-standard: The PostHog init uses defaults: '2025-11-30' which is not a documented configuration option for posthog-js. This may be silently ignored or cause unexpected behavior. [MEDIUM]
• Missing reverse proxy configuration: No reverse proxy setup to circumvent ad blockers - events may be blocked in production. [MEDIUM]
• Email captured in signup event properties: The user_signed_up event includes email in properties, which could be considered PII depending on privacy requirements. [LOW]

---

File changes

Filename	Score	Description
app/entry.client.tsx	4/5	Adds PostHog initialization with PostHogProvider wrapper. Uses env vars correctly. defaults option is non-standard.
app/lib/posthog-middleware.ts	4/5	Creates server-side middleware for PostHog Node client with session/distinct ID extraction from headers. Proper shutdown handling.
app/root.tsx	3/5	Adds middleware registration and error capture, but usePostHog() hook usage in ErrorBoundary is problematic - should use useEffect.
app/routes/countries.tsx	5/5	Comprehensive event tracking for search, filter, claim, like, and visit actions with relevant properties.
app/routes/country.tsx	4/5	Tracks country detail views with useEffect. Dependency array includes posthog which may cause unnecessary re-captures.
app/routes/home.tsx	5/5	Clean CTA click tracking with descriptive event names and properties.
app/routes/login.tsx	4/5	Proper identify and capture on login. Username captured in both identify and event (slightly redundant).
app/routes/profile.tsx	5/5	Clean logout tracking with proper posthog.reset() call to unlink future events.
app/routes/signup.tsx	4/5	User identification and signup tracking. Email in event properties may be PII concern.
package.json	5/5	Adds required dependencies: @posthog/react, posthog-js, posthog-node.
vite.config.ts	5/5	Adds SSR noExternal config for posthog packages - necessary for SSR compatibility.
react-router.config.ts	5/5	Enables v8_middleware future flag required for middleware support.
posthog-setup-report.md	4/5	Comprehensive documentation but includes actual API key (should be redacted).
package-lock.json	5/5	Lock file updated with new dependencies.

---

App sanity check: 4/5 ✅

Criteria	Result	Description
App builds and runs	Yes	Dependencies added correctly, SSR config updated, middleware enabled
Preserves existing env vars & configs	Yes	Only adds new PostHog-related config, doesn't modify existing
No syntax or type errors	Yes	TypeScript types appear correct, imports are valid
Correct imports/exports	Yes	All imports from @posthog/react, posthog-js, posthog-node are correct
Minimal, focused changes	Yes	Changes are scoped to PostHog integration only

Issues

• ErrorBoundary hook pattern: The usePostHog() hook is called in ErrorBoundary and immediately invokes captureException() synchronously. This should be wrapped in useEffect to properly handle the side effect and avoid potential React warnings. [MEDIUM]

Other completed criteria

• Code is readable and follows existing patterns
• Environment variables documented in setup report
• Build configuration updated for SSR compatibility
• No hardcoded secrets in code (uses env vars)

---

PostHog implementation: 4/5 ✅

Criteria	Result	Description
PostHog SDKs installed	Yes	posthog-js, @posthog/react, posthog-node added to package.json
PostHog client initialized	Yes	Client init in entry.client.tsx with PostHogProvider wrapper, env vars for key/host
capture()	Yes	Events captured for search, filter, claim, like, visit, CTA clicks, login, logout, signup
identify()	Yes	User identification on login (username) and signup (user ID, username, email)
Error tracking	Yes	captureException() called in ErrorBoundary for unhandled errors
Reverse proxy	No	No reverse proxy configuration to circumvent ad blockers

Issues

• No reverse proxy setup: The integration sends events directly to us.i.posthog.com which can be blocked by ad blockers. Should add a reverse proxy route (e.g., /ingest/* -> PostHog) for reliable event delivery. [MEDIUM]
• Non-standard defaults config: The defaults: '2025-11-30' option in PostHog init is not documented and may not work as expected. [MEDIUM]
• Tracing headers config: __add_tracing_headers is an internal/experimental option that may change. [LOW]

Other completed criteria

• API key stored in environment variable (not hardcoded)
• PostHogProvider wraps application correctly
• Server-side middleware properly initializes PostHog Node client
• Session/distinct ID correlation via headers
• Proper shutdown handling in middleware
• posthog.reset() called on logout

---

PostHog insights and events: 4/5 ✅

Filename	PostHog events	Description
app/routes/countries.tsx	country_search_performed, region_filter_applied, country_claimed, country_liked, country_visited	Core user engagement events with country_name, region properties
app/routes/country.tsx	country_detail_viewed	Detail page view with country metadata (name, region, population)
app/routes/home.tsx	explore_cta_clicked, learn_more_clicked	CTA engagement with location and text properties
app/routes/login.tsx	user_logged_in	Authentication event with username
app/routes/signup.tsx	user_signed_up	Registration event with username and email
app/routes/profile.tsx	user_logged_out	Session end event
app/root.tsx	`` (via captureException)	Error tracking for unhandled errors

Issues

• Email in event properties: The user_signed_up event captures email which may be considered PII. Consider moving email to person properties only via identify() rather than event properties. [LOW]

Other completed criteria

• Events represent real user actions and product flows
• Events are enriched with relevant properties (region, country_name, search_term, results_count)
• Funnel tracking enabled (CTA → signup → claim)
• Search behavior captured with results count for measuring search effectiveness
• Events can power retention, engagement, and conversion insights

---

Reviewed by wizard workbench PR evaluator