💪 Fast and Loose Bootcamp

\n \n {data.members.length} Members • {data.classes.length} Classes\n \n

\n\n {/* Navigation */}\n

\n setActiveTab('schedule')}\n className={`py-4 px-1 border-b-2 font-medium text-sm ${\n activeTab === 'schedule'\n ? 'border-blue-500 text-blue-600'\n : 'border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300'\n }`}\n >\n 📅 Class Schedule\n \n setActiveTab('members')}\n className={`py-4 px-1 border-b-2 font-medium text-sm ${\n activeTab === 'members'\n ? 'border-blue-500 text-blue-600'\n : 'border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300'\n }`}\n >\n 👥 Members\n \n setActiveTab('workouts')}\n className={`py-4 px-1 border-b-2 font-medium text-sm ${\n activeTab === 'workouts'\n ? 'border-blue-500 text-blue-600'\n : 'border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300'\n }`}\n >\n 🏋️ Workout Library\n \n

\n\n {/* Member Selection */}\n {activeTab === 'schedule' && (\n

\n \n Select Member to Book Classes:\n \n {\n const memberId = parseInt(e.target.value);\n const member = data.members.find(m => m.id === memberId) || null;\n setSelectedMember(member);\n }}\n className=\"rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500\"\n >\n \n {data.members.map(member => (\n \n ))}\n \n {selectedMember && (\n \n Selected: {selectedMember.name}\n \n )}\n

\n )}\n\n {/* Main Content */}\n

\n {activeTab === 'schedule' && (\n \n )}\n {activeTab === 'members' && (\n \n )}\n {activeTab === 'workouts' && (\n \n )}\n

\n );\n}","deleted","label",[168,169,150],"frontend","components","permalink","https://www.val.town/x/newbienate/my-first-val/code/frontend/components/App.tsx","extension","actionData","errors"]