perf: eliminate server-side request waterfalls

[smakosh]

Weekly React/Next.js best-practices audit of the four Next.js apps (apps/ui, apps/code, apps/playground, apps/docs), using Vercel's React best-practices guide as the rulebook. All fixes this week fall in the guide's highest-impact category, Eliminating Waterfalls (CRITICAL) — sequential awaits of independent requests in server components. None of the changes alter rendering, routing, or user-visible behavior; they only change when independent requests start. All of fetchServerData, fetchModels, and fetchProviders catch internally and never reject, so eagerly started promises cannot produce unhandled rejections on early-return/redirect paths.

Fixes

Rule 1.5 — Promise.all() for Independent Operations

• apps/ui/src/app/dashboard/[orgId]/layout.tsx — /user/me, /orgs, and /orgs/{id}/projects were awaited one after another (3 sequential round trips to the API on every dashboard navigation). The three requests are independent, so they now start together; the projects result is consumed only after the org-authorization check, same as before.
• apps/playground/src/app/realtime/page.tsx — the /orgs fetch ran only after models + providers resolved; it now joins their existing Promise.all.

Rule 1.4 — Prevent Waterfall Chains (start independent operations immediately)

• apps/ui/src/app/dashboard/page.tsx — /orgs waited for /user/me to finish even though it doesn't depend on it. Both now start immediately; the login redirect still happens before the orgs result is consumed.
• apps/ui/src/app/dashboard/[orgId]/[projectId]/page.tsx — the /activity fetch (the page's main payload) waited for the /orgs role check. Both now start together; the developer-role redirect still occurs before activity data is used.
• apps/code/src/app/dashboard/survey/page.tsx and apps/code/src/app/dashboard/feedback/dev-plan-cancellation/page.tsx — the eligibility fetch waited for /user/me. Both start together now; unauthenticated users still get redirected before the eligibility result is consumed.
• apps/playground/src/app/playground-shell.tsx — fetchModels()/fetchProviders() (the model catalogue for the main chat page) started only after the entire org/billing chain (/orgs → /chat-plans/status → /playground/chat-org → projects) completed. The promises now start first and are awaited where they always were. The org/billing chain itself is left strictly sequential — its ordering is intentional (comments in the file: the funded-org redirect must run before the chat-org fetch so redirected users never get a Chat org provisioned).

Rule 1.3 — Dependency-Based Parallelization

• apps/playground/src/app/{video,image,audio,canvas}/page.tsx (4 files, identical pattern) — the request chain was 4 sequential blocks: models+providers → /playground/chat-org → /orgs → /orgs/{id}/projects. Only one edge is a real dependency (/orgs?includeChat=true must run after the chat-org ensure call, per the in-code comment). That edge is kept as a .then() chain and everything else now runs in a single Promise.all, collapsing 4 awaits into the longest single chain. The removed try/catch around the projects fetch was dead code — fetchServerData never throws (it logs and returns null internally).

Considered and deliberately skipped

• export const dynamic declarations — untouched everywhere; they are intentional and required for loading environment variables at runtime.
• apps/ui dashboard layout's await import("content-collections") (rule 2.5, statically analyzable imports) — the dynamic import is guarded by a try/catch because content collections may be unavailable during build; converting it to a top-level import could break builds, so left alone.
• Playground share page double-fetch (generateMetadata + page both fetch the share) — already deduplicated by Next.js request memoization; same for the apps/code public profile page (same URL + options within one render pass).
• lucide-react/date-fns/recharts barrel imports (rule 2.1) — already covered: these packages are in Next.js's default optimizePackageImports list (and apps/playground configures it explicitly).
• Playground shell org/billing chain — intentionally sequential (see above); only the independent catalogue fetches were hoisted.
• localStorage reads in useEffect (rules 4.4/6.5) — existing usages (sidebar state, dismissed banners) are already hydration-safe post-mount reads; no change warranted.
• apps/docs — pages are statically generated with generateStaticParams; the getGithubLastEdit call runs at build/revalidate time, not per-request. Nothing actionable found.

Verification

• pnpm build — 17/17 tasks successful
• pnpm format — clean (no diffs beyond the fixes)
• Pre-commit lint-staged (eslint + prettier) passed on all changed files

🤖 Generated with Claude Code

https://claude.ai/code/session_01BFivAdY2xhHim6s1mWPR8G

---

Generated by Claude Code

Summary by CodeRabbit

• Performance Improvements
  • Improved loading times across dashboard, survey, feedback, audio, canvas, image, video, realtime, and playground pages by loading related data concurrently.
  • Reduced wait times when retrieving models, providers, organizations, projects, activities, and eligibility information.
• Bug Fixes
  • Project-loading failures are now surfaced consistently instead of being silently logged, improving error visibility and handling.

[coderabbitai]

Walkthrough

The changes start independent data requests earlier across code, playground, and dashboard pages. Authentication checks, redirects, project fallbacks, and eligibility handling remain in place. Some playground project-fetch errors now reject the combined request.

Changes

Concurrent loading updates

Layer / File(s)	Summary
Eligibility request concurrency apps/code/src/app/dashboard/feedback/dev-plan-cancellation/page.tsx, apps/code/src/app/dashboard/survey/page.tsx	Feedback and survey pages start eligibility requests before completing authentication checks.
Playground data request orchestration apps/playground/src/app/audio/page.tsx, apps/playground/src/app/canvas/page.tsx, apps/playground/src/app/image/page.tsx, apps/playground/src/app/playground-shell.tsx, apps/playground/src/app/realtime/page.tsx, apps/playground/src/app/video/page.tsx	Playground pages overlap model, provider, organization, and conditional project requests. Project-fetch failures now propagate from the combined request on applicable pages.
Dashboard request orchestration apps/ui/src/app/dashboard/page.tsx, apps/ui/src/app/dashboard/[orgId]/layout.tsx, apps/ui/src/app/dashboard/[orgId]/[projectId]/page.tsx	Dashboard pages start organization, user, project, and activity requests earlier and reuse their promises during authentication, redirects, and rendering.

Estimated code review effort: 3 (Moderate) | ~20 minutes

Suggested reviewers: steebchen

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly and concisely describes the main change: removing server-side request waterfalls through concurrent data fetching.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches 💡 1

📝 Generate docstrings 💡

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch chore/react-bp-audit-2026-08-03

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@apps/ui/src/app/dashboard/`[orgId]/layout.tsx:
- Around line 29-37: Defer creation of initialProjectsDataPromise in the
dashboard layout until after the isAuthorizedForOrg check succeeds. Likewise, in
apps/ui/src/app/dashboard/[orgId]/[projectId]/page.tsx at line 32, create
initialActivityDataPromise only after the developer-role redirect; both sites
must prevent protected requests before their respective UI authorization checks.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro Plus

Run ID: 68a92ac4-1892-49f5-ba0b-6f6f4fcf5027

📥 Commits

Reviewing files that changed from the base of the PR and between 44da286 and 16531f4.

📒 Files selected for processing (11)

• apps/code/src/app/dashboard/feedback/dev-plan-cancellation/page.tsx
• apps/code/src/app/dashboard/survey/page.tsx
• apps/playground/src/app/audio/page.tsx
• apps/playground/src/app/canvas/page.tsx
• apps/playground/src/app/image/page.tsx
• apps/playground/src/app/playground-shell.tsx
• apps/playground/src/app/realtime/page.tsx
• apps/playground/src/app/video/page.tsx
• apps/ui/src/app/dashboard/[orgId]/[projectId]/page.tsx
• apps/ui/src/app/dashboard/[orgId]/layout.tsx
• apps/ui/src/app/dashboard/page.tsx