EventHall Pakistan — Booking Platform
A production-ready event hall booking platform built with Next.js 14, featuring real-time slot availability, Stripe payments, role-based dashboards, and automated email notifications.
4 Slots
Time System
Stripe
Payments
Admin Panel
Analytics
Product showcase
Screens from the live experience. Open fullscreen for a closer look.
1 / 5 · Click a thumbnail or use fullscreen to browse
Overview
A full-stack event hall booking platform built with Next.js 14 App Router, TypeScript, Tailwind CSS, and MongoDB. Users can browse venues across Pakistani cities, check real-time time slot availability (Morning, Afternoon, Evening, Full Day), and complete bookings through a 3-step wizard with Stripe payment integration. The platform includes a customer dashboard for managing bookings and leaving reviews, a full admin panel with revenue analytics using Recharts, venue CRUD management, and automated email reminders via Nodemailer. Authentication is handled with NextAuth v5 using JWT strategy with role-based access control for customers and admins.
Tech Stack
Frontend
Database
Payments
Other
Core Requirements
Real-time slot availability checking per venue per date
3-step booking wizard with Stripe payment integration
Role-based access control for customers and admins
Customer dashboard with booking history and cancellations
Admin panel with revenue charts and venue/booking management
Automated booking confirmation and reminder emails
Fully responsive design for mobile, tablet, and desktop
Challenges & Solutions
Slot Availability Conflict Logic
The Problem
Implementing correct blocking rules where booking a Full Day slot must block all individual slots, and booking any individual slot must block Full Day — without race conditions when two users book simultaneously.
The Solution
Built a dedicated computeAvailability() utility in lib/slots.ts that queries only pending and confirmed bookings for the selected date, then applies blocking rules server-side inside a server action. A double-check runs again at createBooking() time before writing to DB, preventing race conditions.
NextAuth v5 + Server Actions Integration
The Problem
NextAuth v5 (beta) required a different configuration pattern compared to v4, and integrating session access inside Next.js 14 server actions and middleware caused type errors and auth() call mismatches.
The Solution
Used the new NextAuth v5 auth() export directly in server actions and middleware.ts, storing id and role in the JWT token via callbacks, then extending the Session and JWT types in types/index.ts to resolve all TypeScript errors.
Stripe Webhook Reliability
The Problem
Handling Stripe webhook events reliably in Next.js App Router required disabling the default body parser, which conflicted with the standard request handling pipeline.
The Solution
Created a dedicated webhook route that reads the raw request body as text using req.text(), then verified the Stripe signature before processing payment_intent.succeeded and payment_intent.payment_failed events to update booking status in MongoDB.