{(attendees || []).slice(0, displayCount).map((a, i) => (

{!a.avatarUrl && (a.displayName?.charAt(0) || a.handle?.charAt(0) || '👤')}

))}

{extra > 0 ? `+ ${extra} going` : `${attendees?.length || 0} going`}

); }; return (

{/* HEADER */}

tagalong

user?.handle && openProfile(user.handle)} style={{ width: 32, height: 32, borderRadius: '50%', background: '#eee', backgroundImage: user?.avatarUrl ? `url(${user.avatarUrl})` : 'none', backgroundSize: 'cover', display: 'flex', alignItems: 'center', justifyContent: 'center', cursor: 'pointer' }}> {!user?.avatarUrl && '👤'}

{/* FILTERS */}

{(FILTER_OPTIONS || []).map(opt => { const isActive = activeFilter === opt; const conf = CATEGORIES[opt] || { bg: '#E5E7EB', text: '#374151', emoji: '✨' }; return ( ) })}

{/* FEED */}

{/* CAMPUS BUZZ - Social surface */} {(campusBuzz || []).length > 0 && (

Campus buzz

{totalGoing} students tagging along this week

🔥

{(campusBuzz || []).map((m, idx) => (

m.handle && openProfile(m.handle)} style={{ flexShrink: 0, display: 'flex', flexDirection: 'column', alignItems: 'center', cursor: 'pointer', minWidth: 64 }} >

{!m.avatarUrl && (m.displayName?.charAt(0) || m.handle?.charAt(0) || '👤')}

{idx === 0 && (

★

)}

@{m.handle}

{m.hosting > 0 ? `hosting ${m.hosting}` : `${m.count} plan${m.count === 1 ? '' : 's'}`}

))}

)} {(filteredEvents || []).length === 0 ? (

👀

Nothing happening yet
be the first to post a plan

) : ( (filteredEvents || []).map(ev => { const catConf = CATEGORIES[ev.category] || CATEGORIES['Other']; return (

setSelectedEventId(ev.id)} style={{ background: '#fff', borderRadius: 16, padding: 16, boxShadow: '0 2px 8px rgba(0,0,0,0.04)', border: '1px solid #F3F4F6', cursor: 'pointer', transition: 'transform 0.1s', position: 'relative' }} onPointerDown={(e) => e.currentTarget.style.transform = 'scale(0.98)'} onPointerUp={(e) => e.currentTarget.style.transform = 'scale(1)'} onPointerLeave={(e) => e.currentTarget.style.transform = 'scale(1)'} > {ev.isDemo && (

DEMO

)}

{catConf.emoji} {ev.category}

{formatRelativeTime(ev.date)}

{ev.title}

📍 {ev.location}

@{ev.hostHandle}

) }) )}

{/* FAB */} {/* EVENT DETAIL MODAL */}

setSelectedEventId(null)}>

e.stopPropagation()} > {selectedEvent && (() => { const catConf = CATEGORIES[selectedEvent.category] || CATEGORIES['Other']; return ( <>

{catConf.emoji} {selectedEvent.category}

{selectedEvent.title}

📅

{new Date(selectedEvent.date).toLocaleDateString([], { weekday: 'long', month: 'short', day: 'numeric' })}

{new Date(selectedEvent.date).toLocaleTimeString([], { hour: 'numeric', minute: '2-digit' })}

📍

{selectedEvent.location}

openProfile(selectedEvent.hostHandle)} style={{ display: 'flex', alignItems: 'center', gap: 12, color: '#4B5563', cursor: 'pointer', padding: '4px 0' }} >

{!selectedEvent.hostAvatar && '👤'}

Hosted by

@{selectedEvent.hostHandle}

{selectedEvent.vibe && (

"{selectedEvent.vibe}"

)}

Going ({selectedEvent.attendees?.length || 0})

{(selectedEvent.attendees || []).map(a => (

openProfile(a.handle)} style={{ display: 'flex', alignItems: 'center', gap: 12, cursor: 'pointer' }}>

{!a.avatarUrl && '👤'}

@{a.handle}

))}

) })()}

{/* POST EVENT MODAL */}

setIsPosting(false)}>

e.stopPropagation()} >

Post a plan

What's happening? setFormData({...formData, title: e.target.value})} placeholder="Coffee after 2pm tute" style={{ width: '100%', padding: '16px', borderRadius: 12, border: '1px solid #D1D5DB', fontSize: 16, boxSizing: 'border-box' }} required />

When setFormData({...formData, date: e.target.value})} style={{ width: '100%', padding: '16px', borderRadius: 12, border: '1px solid #D1D5DB', fontSize: 16, boxSizing: 'border-box', fontFamily: 'inherit' }} required />

Where setFormData({...formData, location: e.target.value})} placeholder="The Underground" style={{ width: '100%', padding: '16px', borderRadius: 12, border: '1px solid #D1D5DB', fontSize: 16, boxSizing: 'border-box' }} required />