box: Add local box run

[leszko]

PR Type

Enhancement

---

Description

• Provide optional local dev configs and defaults

• Ensure user clips fallback to empty array

• Always render video player without playback ID

• Make Kafka config optional in server env

---

Changes walkthrough 📝

	Relevant files
Bug fix	BentoGridOverlay.tsx Default empty array for user clips                                              apps/app/components/welcome/featured/BentoGridOverlay.tsx Added nullish coalescing for data.clips Ensures myClips state always gets an array +1/-1
Enhancement	MainContent.tsx Always render video player                                                              apps/app/components/welcome/featured/MainContent.tsx Removed conditional check for stream.output_playback_id Always render LivepeerPlayer component +1/-5
Configuration changes	serverEnv.ts Optional Kafka configuration                                                          apps/app/lib/serverEnv.ts Made kafka config optional in Zod schema Wrapped Kafka initialization behind env check +8/-6      .env.example Enhanced local dev .env defaults                                                  apps/app/.env.example Added default Supabase and DATABASE_URL for local dev Updated stream status URL to local endpoint Introduced fake keys and local URLs for various services Added NEXT_PUBLIC_USE_PRIVY_MOCK flag +18/-12

---

Need help?

Type /help how to ... in the comments thread for any questions about PR-Agent usage.

Check out the documentation for more information.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
pipelines-app	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jun 2, 2025 0:32am

[github-actions]

PR Reviewer Guide 🔍

(Review updated until commit cd91944)

Here are some key observations to aid the review process:

⏱️ Estimated effort to review: 3 🔵🔵🔵⚪⚪

🧪 No relevant tests

🔒 Security concerns Sensitive information exposure: The .env.example file contains what appear to be real Supabase anon and service role JWTs, as well as a postgres URL with credentials. These should be replaced with dummy placeholders to prevent accidental use of real secrets.

⚡ Recommended focus areas for review Unconditional Player Rendering Removing the playback ID conditional causes LivepeerPlayer to render even when no playback ID is available. Confirm that the component handles undefined IDs without errors and that the UI behaves correctly for waiting streams. ) : ( <> <div className="relative w-full h-full"> <LivepeerPlayer /> </div> {!isPlaying && <Overlay />} </> )} Example Credentials The .env.example file includes concrete Supabase JWTs and database URLs. Replace these with clearly marked placeholders to avoid implying sensitive or production credentials. # Default values for local dev supabase SUPABASE_URL="http://127.0.0.1:8000" SUPABASE_ANON_KEY="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyAgCiAgICAicm9sZSI6ICJhbm9uIiwKICAgICJpc3MiOiAic3VwYWJhc2UtZGVtbyIsCiAgICAiaWF0IjogMTY0MTc2OTIwMCwKICAgICJleHAiOiAxNzk5NTM1NjAwCn0.dc_X5iR_VP_qT0zsiyj_I_OZ2T9FtRU2BBNWN8Bu4GE" SUPABASE_SERVICE_ROLE_KEY="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyAgCiAgICAicm9sZSI6ICJzZXJ2aWNlX3JvbGUiLAogICAgImlzcyI6ICJzdXBhYmFzZS1kZW1vIiwKICAgICJpYXQiOiAxNjQxNzY5MjAwLAogICAgImV4cCI6IDE3OTk1MzU2MDAKfQ.DaYlNEoUrrEn2Ig7tqibS-PHK5vgusbcbo7X36XVt4Q" DATABASE_URL="postgres://postgres:your-super-secret-and-long-postgres-password@127.0.0.1:5433/postgres" # Gateway stream status URL - this will be appended with ${streamId}/status STREAM_STATUS_ENDPOINT_URL="http://127.0.0.1:5936/live/video-to-video" STREAM_STATUS_ENDPOINT_USER="ai-gateway-livepeer" Kafka Optional Handling Kafka config is now optional in both the schema and env loader. Ensure that code consuming kafka settings gracefully handles undefined values to avoid runtime errors. gateway_secondary: GatewayConfig.optional(), kafka: KafkaConfig.optional(), gcp: GCPConfig, }); type ServerEnvironmentConfig = z.infer<typeof ServerEnvironmentConfig>; // This is the only environment configuration that is allowed to be server-only // by doing this, we ensure these props do not make their way to the client and expose secrets const serverOnlyEnvConfig = { db: { url: process.env.DATABASE_URL }, // Will replace supabase supabase: { url: process.env.SUPABASE_URL, anonKey: process.env.SUPABASE_ANON_KEY, serviceRoleKey: process.env.SUPABASE_SERVICE_ROLE_KEY, }, gateway: { url: process.env.STREAM_STATUS_ENDPOINT_URL, userId: process.env.STREAM_STATUS_ENDPOINT_USER, password: process.env.STREAM_STATUS_ENDPOINT_PASSWORD, }, gateway_secondary: process.env.STREAM_STATUS_ENDPOINT_URL_SECONDARY ? { url: process.env.STREAM_STATUS_ENDPOINT_URL_SECONDARY, userId: process.env.STREAM_STATUS_ENDPOINT_USER_SECONDARY || process.env.STREAM_STATUS_ENDPOINT_USER, password: process.env.STREAM_STATUS_ENDPOINT_PASSWORD_SECONDARY || process.env.STREAM_STATUS_ENDPOINT_PASSWORD, } : undefined, kafka: process.env.KAFKA_BOOTSTRAP_NODE ? { bootstrapServers: process.env.KAFKA_BOOTSTRAP_NODE, username: process.env.KAFKA_USER, password: process.env.KAFKA_PASSWORD, } : undefined,

[github-actions]

PR Code Suggestions ✨

Latest suggestions up to cd91944
Explore these optional code suggestions:

Category	Suggestion	Impact
Possible issue	Reset loading state on error Ensure the loading state is reset on API errors by calling setIsLoadingMyClips(false) inside the catch block. This prevents the loading spinner from persisting indefinitely after a failure. apps/app/components/welcome/featured/BentoGridOverlay.tsx [118-119] .catch(error => { console.error("Error fetching user clips:", error); + setIsLoadingMyClips(false); +}) Suggestion importance[1-10]: 7 __ Why: Without calling setIsLoadingMyClips(false) in the .catch block, the loading spinner never stops on API failure, causing a potential UI hang.	Medium
	Add fallback when no stream Add a conditional branch to render a fallback UI when stream?.output_playback_id is not available, to prevent displaying an empty player. This ensures the user sees a meaningful message if the stream hasn't started. apps/app/components/welcome/featured/MainContent.tsx [83-89] -) : ( +) : stream?.output_playback_id ? ( <> <div className="relative w-full h-full"> <LivepeerPlayer /> </div> {!isPlaying && <Overlay />} </> + ) : ( + <div className="w-full h-full flex items-center justify-center text-muted-foreground"> + Waiting for stream to start... + </div> + ) Suggestion importance[1-10]: 6 __ Why: The PR removed the stream?.output_playback_id check which means users won’t see a fallback message when no stream starts; reintroducing this improves UX but isn't critical functionality.	Low
Security	Use placeholders for credentials Replace real-looking credential values with placeholders to avoid accidentally committing sensitive information. This encourages developers to fill in their own keys and keeps example files secure. apps/app/.env.example [19-20] -SUPABASE_ANON_KEY="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyAgCiAgICAicm9sZSI6ICJhbm9uIiwKICAgICJpc3MiOiAic3VwYWJhc2UtZGVtbyIsCiAgICAiaWF0IjogMTY0MTc2OTIwMCwKICAgICJleHAiOiAxNzk5NTM1NjAwCn0.dc_X5iR_VP_qT0zsiyj_I_OZ2T9FtRU2BBNWN8Bu4GE" -SUPABASE_SERVICE_ROLE_KEY="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyAgCiAgICAicm9sZSI6ICJzZXJ2aWNlX3JvbGUiLAogICAgImlzcyI6ICJzdXBhYmFzZS1kZW1vIiwKICAgICJpYXQiOiAxNjQxNzY5MjAwLAogICAgImV4cCI6IDE3OTk1MzU2MDAKfQ.DaYlNEoUrrEn2Ig7qibS-PHK5vgusbcbo7X36XVt4Q" +SUPABASE_ANON_KEY="<YOUR_SUPABASE_ANON_KEY>" +SUPABASE_SERVICE_ROLE_KEY="<YOUR_SUPABASE_SERVICE_ROLE_KEY>" Suggestion importance[1-10]: 6 __ Why: The example file currently contains real-looking Supabase keys which may be accidentally committed; replacing them with placeholders improves security.	Low

---

Previous suggestions

Suggestions up to commit def3bd7

Category	Suggestion	Impact
Possible issue	Restore stream readiness check Restore the conditional check for stream?.output_playback_id before rendering the player to prevent rendering issues when no stream is available, and re-introduce a fallback UI for waiting state. apps/app/components/welcome/featured/MainContent.tsx [83-89] -) : ( +) : stream?.output_playback_id ? ( <> <div className="relative w-full h-full"> <LivepeerPlayer /> </div> {!isPlaying && <Overlay />} </> +) : ( + <div className="w-full h-full flex items-center justify-center text-muted-foreground"> + Waiting for stream to start... + </div> Suggestion importance[1-10]: 8 __ Why: Reintroducing the stream?.output_playback_id guard fixes a functional regression by preventing the player from rendering before a stream is available.	Medium
	Guard against non-array clips Ensure that data.clips is actually an array before setting state to avoid runtime errors if the API returns a non-array or undefined. Use an explicit type guard rather than a nullish coalescing alone. apps/app/components/welcome/featured/BentoGridOverlay.tsx [115] -setMyClips(data.clips ?? []); +setMyClips(Array.isArray(data.clips) ? data.clips : []); Suggestion importance[1-10]: 5 __ Why: Wrapping data.clips in Array.isArray improves safety, but the existing nullish fallback already prevents undefined; this is a minor but valid enhancement.	Low
	Require all Kafka env vars Only build the Kafka configuration if all required environment variables are defined to avoid passing undefined credentials that will fail the schema validation. apps/app/lib/serverEnv.ts [67-73] -kafka: process.env.KAFKA_BOOTSTRAP_NODE - ? { - bootstrapServers: process.env.KAFKA_BOOTSTRAP_NODE, - username: process.env.KAFKA_USER, - password: process.env.KAFKA_PASSWORD, - } - : undefined, +kafka: + process.env.KAFKA_BOOTSTRAP_NODE && + process.env.KAFKA_USER && + process.env.KAFKA_PASSWORD + ? { + bootstrapServers: process.env.KAFKA_BOOTSTRAP_NODE, + username: process.env.KAFKA_USER, + password: process.env.KAFKA_PASSWORD, + } + : undefined, Suggestion importance[1-10]: 5 __ Why: Ensuring all Kafka environment variables are defined avoids passing incomplete credentials, but it’s a moderate improvement to existing optional logic.	Low

[leszko]

I removed this, because I think we don't need it. In staging/prod, we never have a situation when the stream is without output_playback_id. And for the local run, it should not be required.

[github-actions]

Persistent review updated to latest commit cd91944

[mjh1]

Seems fine but probably best to have @junhyr check 🙏