[CI] (3393d57) vue/movies

[wizard-ci-bot]

Automated wizard CI run

Source: wizard-pr
Trigger ID: 3393d57
App: vue/movies
App directory: apps/vue/movies
Workbench branch: wizard-ci-3393d57-vue-movies
Wizard branch: release-please--branches--main--components--wizard
Context Mill branch: main
PostHog (MCP) branch: master
Timestamp: 2026-03-17T00:42:00.388Z
Duration: 219.0s

[wizard-ci-bot]

Now I have everything I need. Let me evaluate this PR.

Key observations from my research:

1. .env file exists but is not committed (added to .gitignore). The .env contains VITE_POSTHOG_PROJECT_TOKEN=sTMFPsFhdP1Ssg — this looks like a truncated/test API key, not a real phc_ prefixed key. There is no .env.example file committed to document the required env vars.

2. Auth flow: The app uses fake auth — login() accepts any username/password and stores the sanitized username string. identify() is called with username.value which is the raw username string. This is a username, not a stable user ID, but it's the only identifier available in this app.

3. No reverse proxy configured in vite.config.js.

4. No .env.example is committed — env vars are only documented in the setup report markdown.

---

PR Evaluation Report

Summary

This PR integrates PostHog analytics into a Vue 3 movies application. It installs posthog-js, initializes it in main.js with env-based configuration, adds user identification on login, session reset on logout, captures five meaningful events across the user journey, and sets up error tracking via captureException in a Vue global error handler and in catch blocks.

Files changed	Lines added	Lines removed
8	+67	-2

Confidence score: 4/5 👍

• No .env.example committed: The .env is gitignored (good), but no .env.example or equivalent is committed to document required environment variables. A new developer cloning this repo would not know which env vars to set. [MEDIUM]
• No reverse proxy configured: For a client-only app using posthog-js in the browser, a reverse proxy is recommended to avoid ad blockers. No Vite proxy or custom endpoint was configured. [MEDIUM]
• Username used as distinct_id: posthog.identify(username.value) uses the raw login username as the distinct ID. While this is the only identifier available in this fake-auth app, usernames are not ideal distinct IDs in production (they can change, collide, etc.). Acceptable given the demo app constraints. [LOW]

---

File changes

Filename	Score	Description
apps/vue/movies/.gitignore	5/5	Adds .env to gitignore — correct and necessary
apps/vue/movies/package.json	5/5	Adds posthog-js ^1.360.2 dependency in correct alphabetical position
apps/vue/movies/posthog-setup-report.md	4/5	Setup report documenting events and next steps; not a substitute for .env.example
apps/vue/movies/src/main.js	5/5	Clean PostHog initialization with env vars, defaults config, and Vue error handler
apps/vue/movies/src/components/NavBar.vue	5/5	Captures logout event and calls posthog.reset() before logout
apps/vue/movies/src/views/LoginView.vue	4/5	Identifies user and captures login; also captures exceptions on failure
apps/vue/movies/src/views/MediaDetailView.vue	5/5	Captures media detail views and trailer plays with enriched properties
apps/vue/movies/src/views/SearchView.vue	5/5	Captures search events with query and result count; handles errors

---

App sanity check ⚠️

Criteria	Result	Description
App builds and runs	Yes	No syntax errors, valid imports, PostHog init is straightforward
Preserves existing env vars & configs	Yes	Only additions, no existing code removed (one whitespace change in SearchView is trivial)
No syntax or type errors	Yes	All code is valid Vue/JS/TS syntax
Correct imports/exports	Yes	posthog-js imported correctly in all files
Minimal, focused changes	Yes	All changes directly relate to PostHog integration
Pre-existing issues	None	Base app uses fake auth and has a debug console.log in MediaDetailView

Issues

• No .env.example file: The .env is correctly gitignored, but no .env.example or similar documentation file is committed to guide developers on required environment variables (VITE_POSTHOG_PROJECT_TOKEN, VITE_POSTHOG_HOST). The setup report mentions these but is not a standard approach. [MEDIUM]

Other completed criteria

• Build configuration is valid — posthog-js added to dependencies, no build script changes needed
• Existing app functionality fully preserved
• Code follows existing patterns (Vue SFC setup scripts, consistent import style)

---

PostHog implementation ⚠️

Criteria	Result	Description
PostHog SDKs installed	Yes	posthog-js ^1.360.2 added to package.json
PostHog client initialized	Yes	posthog.init() called in main.js with env-based token, host, and defaults: '2026-01-30'
capture()	Yes	Five meaningful capture calls across four files
identify()	Yes	posthog.identify(username.value) on login, posthog.reset() on logout
Error tracking	Yes	Vue app.config.errorHandler forwards to posthog.captureException(); catch blocks also capture exceptions
Reverse proxy	No	No reverse proxy configured in Vite config; browser-side posthog-js calls go directly to us.i.posthog.com

Issues

• No reverse proxy: Client-only app sends PostHog requests directly to us.i.posthog.com. A Vite dev server proxy and production reverse proxy should be configured to avoid ad blocker interference. [MEDIUM]
• Identify called only on login, not on page refresh: If a user is already logged in (persisted in localStorage), posthog.identify() is not called on app load. This means returning users will have events captured under an anonymous ID until they log in again. Should add an identify call in main.js or a router guard checking localStorage.getItem('auth-user'). [MEDIUM]

Other completed criteria

• API key loaded from VITE_POSTHOG_PROJECT_TOKEN environment variable, not hardcoded
• Host correctly configured to us.i.posthog.com with env var override
• posthog.reset() correctly called on logout
• Error tracking covers both global Vue errors and local catch blocks

---

PostHog insights and events ✅

Filename	PostHog events	Description
src/views/LoginView.vue	user_logged_in, captureException	Captures login success and login failure exceptions
src/components/NavBar.vue	user_logged_out	Captures logout event before resetting PostHog session
src/views/SearchView.vue	media_searched, captureException	Captures search with query and result_count; captures search errors
src/views/MediaDetailView.vue	media_detail_viewed, trailer_played, captureException	Captures media views and trailer plays with media_id, media_type, media_title; captures load errors
src/main.js	captureException (global)	Vue global error handler forwards uncaught exceptions

Issues

• Search query as event property: The media_searched event includes query: query.value as a property. While search queries are generally acceptable as event properties, if users search for personal information (e.g., names), this could inadvertently capture PII. This is a borderline case but acceptable for a movie search app. [LOW]

Other completed criteria

• Events represent real user actions (login, logout, search, view detail, play trailer)
• Events enable product insights — can build login trends, search funnels, content engagement funnels
• Events include enriched properties (media_id, media_type, media_title, query, result_count)
• Event naming is consistent snake_case convention
• No obvious PII in event properties (media metadata only)

---

Reviewed by wizard workbench PR evaluator