fix: wrap dynamic components in Suspense to fix build and add My Bookings to Navbar [fixes #56]

[Aarush2112]

Description

This Pull Request resolves the unresponsive/outdated navbar links issue by fixing Next.js production build failures and adding the missing dashboard navigation link:

1. Prerendering Suspense Fix: Wrapped both Navbar (which calls usePathname()) and PostHogProvider (which internally tracks search params and routes) in <Suspense> boundaries within app/layout.tsx. This stops Next.js from crashing with Uncached data was accessed outside of <Suspense> during static site generation on dynamic routes like /events/[slug].
2. My Bookings Link: Added the missing "My Bookings" link to the Navbar component, resolving navigation to the dashboard /my-bookings as outlined in the project's setup guide.

Fixes # (issue number if applicable)

Type of Change

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)

How Has This Been Tested?

• Build Verification: Ran MONGODB_URI=mongodb://localhost:27017/dummy npm run build to verify the production compiler runs to completion without any dynamic prerendering errors.
• Manual Navigation Testing: Started the local server on http://localhost:3001 and tested the navbar links sequentially (Home -> Events -> Create Event -> My Bookings -> Home) using automated browser interactions to ensure links correctly redirect the user and change paths.

Checklist:

• My code follows the style guidelines of this project
• I have performed a self-review of my own code
• I have commented my code, particularly in hard-to-understand areas
• My changes generate no new warnings or console errors

Summary by CodeRabbit

• New Features

  • Added "My Bookings" link to the navigation bar.

• Improvements

  • Enhanced loading experience with improved navigation display handling during page initialization.

[vercel]

@Aarush2112 is attempting to deploy a commit to the niharika-mente's projects Team on Vercel.

A member of the Team first needs to authorize it.

[coderabbitai]

Too much diff to scan? Review this PR in Change Stack to start with the highest-impact changes.

📝 Walkthrough

Walkthrough

The root layout now imports Suspense and wraps PostHogProvider and Navbar in a Suspense boundary with a sticky glass header skeleton as the fallback. While Navbar loads, the skeleton displays placeholder navigation. The Navbar component gains a new /my-bookings navigation link with active-state styling.

Changes

Layout Suspense and Bookings Navigation

Layer / File(s)	Summary
Layout Suspense boundaries and fallback skeleton app/layout.tsx	Suspense is imported and wraps PostHogProvider and Navbar in a Suspense boundary that displays a sticky glass header skeleton fallback while Navbar is pending.
Bookings navigation link components/Navbar.tsx	A new navigation item links to /my-bookings with active-state aria-current logic and existing navLinkClass styling.

Sequence Diagram

sequenceDiagram
  participant Browser
  participant RootLayout
  participant PostHogProvider
  participant SuspenseBoundary
  participant NavbarFallback
  participant Navbar
  Browser->>RootLayout: Render layout
  RootLayout->>PostHogProvider: Wrap children
  PostHogProvider->>SuspenseBoundary: Begin suspense boundary
  SuspenseBoundary->>Navbar: Start rendering navbar
  Navbar-->>SuspenseBoundary: Suspend (async loading)
  SuspenseBoundary->>NavbarFallback: Show fallback
  NavbarFallback-->>Browser: Render sticky glass header skeleton
  Navbar-->>SuspenseBoundary: Resolve
  SuspenseBoundary->>Navbar: Replace fallback with navbar
  Navbar-->>Browser: Render full navbar

Loading

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

Suggested labels

SSoC26, Medium

🚥 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	The description covers all required template sections including a detailed summary with issue context, type of change selections, comprehensive testing methodology, and completed checklist items.
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.
Title check	✅ Passed	The title accurately describes the two main changes: wrapping components in Suspense to fix build issues and adding My Bookings to the Navbar.

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

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

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.}

[SatyamPandey-07]

@Aarush2112 write issue no too

[SatyamPandey-07]

@Aarush2112 resolve conflicts too

[Aarush2112]

@SatyamPandey-07 Solves issue no #56