Lazy-load project tabs

[Blaumaus]

Summary by CodeRabbit

• Refactor
  • Consolidated tab content loading behavior for improved consistency across the project view interface.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: bfe85d53-9644-4ab0-9677-2ef12470fa31

📥 Commits

Reviewing files that changed from the base of the PR and between cf7085d and 311d346.

📒 Files selected for processing (1)

• web/app/pages/Project/View/ViewProject.tsx

---

📝 Walkthrough

Walkthrough

ViewProject.tsx replaces all static tab view imports with React.lazy dynamic imports and consolidates the previously per-tab Suspense wrappers into a single shared Suspense boundary with a Loader fallback covering all tab content, including CaptchaView. Some dateRange-derived from/to props for ExperimentsView and FeatureFlagsView are reformatted in the process.

Changes

Lazy Tab Loading and Shared Suspense Boundary

Layer / File(s)	Summary
Static → React.lazy imports for tab views web/app/pages/Project/View/ViewProject.tsx	Repositions AddAViewModal and ChartManagerProvider imports and converts all tab view components (errors, experiments, feature flags, funnels, goals, performance, profiles, replays, sessions, SEO, traffic) from static imports to React.lazy dynamic imports.
Shared Suspense boundary and tab prop wiring web/app/pages/Project/View/ViewProject.tsx	Replaces scattered per-tab Suspense wrappers with a single Suspense fallback={<Loader />} enclosing all tab content; wires lazy-loaded components inside it and adjusts dateRange-dependent from/to prop formatting for ExperimentsView, FeatureFlagsView, and CaptchaView.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Poem

🐇 Hop hop, the tabs now sleep until called,
No heavy bundles before the page is mauled.
One Suspense to rule them all, one Loader to show,
Lazy little components, ready to go!
The rabbit approves — less weight, faster flow. 🎉

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Description check	⚠️ Warning	The PR description is entirely missing. The description template requires sections for Changes, Community Edition support, Database migrations, and Documentation, but none are provided.	Add a description following the template, explaining the changes, confirming Community Edition support status, confirming no database migrations are needed, and confirming documentation status.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title 'Lazy-load project tabs' is specific and directly related to the main change in the PR, which implements React.lazy-based dynamic imports for tab components.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
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.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch build-optimisation

---

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 and usage tips.}