ChapterGrid

{/* Tabs */}

{['events', 'roster'].map(tab => (

setActiveTab(tab)} style={{ fontSize: 24, fontWeight: 800, textTransform: 'uppercase', textDecoration: activeTab === tab ? 'underline' : 'none', textDecorationColor: COLORS.primary, textDecorationThickness: 4, opacity: activeTab === tab ? 1 : 0.4, cursor: 'pointer' }}> {tab}

))}

{/* Events List */} {activeTab === 'events' && (

{(events || []).map(event => (

setSelectedEvent(event)} style={cardStyle}>

{event.date} • {event.time}

{event.title}

📍 {event.location}

{event.attendees?.includes(user.id) && (

IN ✓

)}

))}

)} {/* Roster List */} {activeTab === 'roster' && (

{!isMultiplayer && (

Solo Mode: Share to invite real brothers. Showing sample roster.

)}

{(memberList || []).map(member => (

setSelectedProfile(member)} style={{ ...cardStyle, height: 160, display: 'flex', flexDirection: 'column', justifyContent: 'space-between' }}>

{member.avatarUrl ?

👤

}

{member.displayName}

{profiles[member.id]?.year || 'Member'}

))}

)} {/* FAB */} {/* Event Detail Modal */} {selectedEvent && (

EVENT DETAILS

{selectedEvent.title}

{selectedEvent.date} @ {selectedEvent.time}

📍 {selectedEvent.location}

{selectedEvent.description}

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

{(selectedEvent.attendees || []).map(id => { const m = (memberList || []).find(x => x.id === id) || { displayName: '?' }; return

; })}

)} {/* Profile Detail Modal */} {selectedProfile && (

{selectedProfile.avatarUrl ?

👤

}

{selectedProfile.displayName}

@{selectedProfile.handle || 'brother'}

YEAR

{(profiles[selectedProfile.id] || {}).year || 'Unknown'}

MAJOR

{(profiles[selectedProfile.id] || {}).major || 'Undeclared'}

FUN FACT

{(profiles[selectedProfile.id] || {}).funFact || 'Ask me!'}

{selectedProfile.id === user.id && ( )} {selectedProfile.handle && ( )}

)} {/* Add Event Modal */} {isAddingEvent && (

{selectedEvent.title}

{selectedProfile.displayName}

NEW EVENT