Public Pages Specification

Status: Canonical Last Updated: 2026-05-11 Source: apps/frontend/app/[locale]/(landing)/

Related specs

• Tech Stack — Frontend routing structure
• Booking Flow — Shows link to booking flow
• Inquiry Forms — Inquiry pages within public pages
• Gamification — Wall page for photo submissions
• User Stories — US-G01 through US-G04 cover guest browsing

Route Structure

[locale]/(landing)/ ├── page.tsx # Homepage ├── about/ ├── artists/ ├── schedule/ ├── reviews/ ├── wall/ ├── experiences/ │ ├── french-mentalist/ │ ├── dinner-theater/ │ └── our-evening/ └── inquiry/ ├── contact/ ├── venue-rental/ ├── workshops/ ├── private-events/ ├── artist-proposal/ └── host-an-event/

Homepage (/)

Sections (top to bottom)

1. Hero — Full-width video/image with headline, CTA
2. Upcoming Experiences Carousel — Next 5-8 events across all shows
3. Experience Schedule — Calendar/list of upcoming shows
4. Why House of Legends — Bento grid features
5. Services — What we offer
6. Community/Wall — Photo wall preview
7. Reviews — Google reviews section
8. Contact Form — Quick contact
9. Partner Logos — Social proof
10. Footer — Links, social, contact

Upcoming Experiences Carousel

• Auto-plays every 6 seconds, pauses on hover
• Touch swipe on mobile
• Each card shows: hero image, show title, date/time, availability badge, price "From X VND"
• Click → navigate to show page (NOT booking)

Show/Experience Pages (/experiences/[slug])

Each experience has:

• Hero — Embedded video (autoplay muted) or image
• Title + Tagline
• "See dates" button — smooth scroll to occurrences
• Description — Rich text storytelling
• Photo gallery — Carousel or masonry
• What to expect — Duration, language, atmosphere
• Artists — If relevant
• UPCOMING DATES — The key conversion zone

Upcoming Dates Section

Vertical list, each row: Friday May 2 7:30 PM ● 12 seats left [Book Now] Saturday May 3 7:30 PM ● Available [Book Now] Friday May 9 7:30 PM ● Few left (3) [Book Now] Saturday May 10 7:30 PM ● Sold out [—]

Badge colors:

• Green: Available (>10 seats)
• Orange: Few left (1-10 seats)
• Grey: Sold out (0 seats, button disabled)

Critical: Clicking Book → /booking/[eventId]/tickets with date/time LOCKED

Inquiry Pages

All inquiry pages use the same pattern:

• Hero section with form
• Form submitted via Convex mutation
• Success state shown inline
• Admin can view in dashboard

Admin Form Management

All inquiry submissions:

1. Stored in formSessions table
2. Admin notification created in notifications table
3. Viewable in /dashboard/inquiries

Admin can:

• Mark as READ, REPLIED, ARCHIVED
• Add follow-up notes
• See submission data and timestamps