Skip to content

Lantern Hub — Quick Start Guide

What is the Lantern Hub?

The Lantern Hub is accessed via the fire icon in the center of the bottom navigation bar. It's your central hub for:

  • Lighting your lantern at venues
  • Viewing waves and connections
  • Scheduling future lights
  • Managing your active lantern status

Visual States

Fire Icon States

StateAppearanceMeaning
ExtinguishedGray outline, no glowNo active lantern
LitAmber with pulsing glowActive lantern at a venue

Using the Lantern Hub

When You Have No Active Lantern

Tap the extinguished fire icon to open the hub and see:

  1. 🔥 Light Lantern (Primary action)

    • Tap to light your lantern at a nearby venue
    • You'll be visible to others at that location
  2. 📅 Schedule a Light (Coming soon)

    • Plan to light your lantern for future events
    • Example: "Yoga class tomorrow at 6 PM"
  3. 📊 Recent Activity (Coming soon)

    • View your connection history
    • See past venues and waves
  4. Nearby Venues (if available)

    • Quick preview of active nearby locations
    • Shows how many lanterns are lit at each venue

When You Have an Active Lantern

Tap the glowing fire icon to open the hub and see:

  1. Your Lantern Status

    • Current venue and time remaining
    • Your interest message and mood
  2. 👋 Waves Received (if any)

    • Count of people who waved at you
    • Tap to view and respond
  3. 💬 Active Chats (if any)

    • Ongoing conversations
    • Tap to open chat
  4. 📅 Upcoming Lights (if scheduled)

    • Your future planned lantern activations
  5. Extinguish Lantern

    • Turn off your lantern
    • Removes you from the venue

Quick Actions

Light a Lantern

  1. Tap extinguished fire icon
  2. Tap "Light Lantern"
  3. Select a venue (or use current location)
  4. Set your interest and mood
  5. Confirm → Fire icon now glows!

View Waves

  1. Tap glowing fire icon (when lit)
  2. Look for "Waves Received" card with badge
  3. Tap to see who's interested
  4. Accept or decline waves

Extinguish

  1. Tap glowing fire icon
  2. Scroll down
  3. Tap "Extinguish Lantern"
  4. Confirm → Fire icon returns to gray

Testing in Storybook

View all states and interactions:

bash
npm run storybook

Navigate to Components → LanternHub to see:

  • No Active Lantern states
  • Active Lantern states
  • With waves, chats, and scheduled lights
  • Interactive playground

Component Files

Full Documentation

For complete details, architecture, and future roadmap, see: 📖 Lantern Hub Feature Documentation

  • Wave-to-Meet - Send and receive connection waves
  • Chat - Anonymous messaging after wave acceptance
  • Beacon - Color-matched meeting coordination

Built with VitePress