// app/(tabs)/library/templates.tsx import { View, ScrollView } from 'react-native'; import { useState, useCallback } from 'react'; import { Text } from '@/components/ui/text'; import { TemplateCard } from '@/components/templates/TemplateCard'; import { FloatingActionButton } from '@/components/shared/FloatingActionButton'; import { SearchHeader } from '@/components/library/SearchHeader'; import { FilterSheet } from '@/components/library/FilterSheet'; import { NewTemplateSheet } from '@/components/library/NewTemplateSheet'; import { useRouter } from 'expo-router'; import { Plus } from 'lucide-react-native'; import { Template, FilterOptions, ContentSource, ExerciseEquipment } from '@/types/library'; // Mock data - move to a separate file later const initialTemplates: Template[] = [ { id: '1', title: 'Full Body Strength', type: 'strength', category: 'Full Body', exercises: [ { title: 'Barbell Squat', targetSets: 3, targetReps: 8 }, { title: 'Bench Press', targetSets: 3, targetReps: 8 }, { title: 'Bent Over Row', targetSets: 3, targetReps: 8 } ], tags: ['strength', 'compound'], source: 'local', isFavorite: true }, { id: '2', title: '20min EMOM', type: 'emom', category: 'Conditioning', exercises: [ { title: 'Kettlebell Swings', targetSets: 1, targetReps: 15 }, { title: 'Push-ups', targetSets: 1, targetReps: 10 }, { title: 'Air Squats', targetSets: 1, targetReps: 20 } ], tags: ['conditioning', 'kettlebell'], source: 'powr', isFavorite: false } ]; export default function TemplatesScreen() { const [searchQuery, setSearchQuery] = useState(''); const [showFilters, setShowFilters] = useState(false); const [showNewTemplate, setShowNewTemplate] = useState(false); const [filterOptions, setFilterOptions] = useState({ equipment: [], tags: [], source: [] }); const [templates, setTemplates] = useState(initialTemplates); const availableFilters = { equipment: ['barbell', 'dumbbell', 'bodyweight', 'machine', 'cable', 'other'] as ExerciseEquipment[], tags: ['strength', 'circuit', 'emom', 'amrap', 'Full Body', 'Upper Body', 'Lower Body', 'Conditioning'], source: ['local', 'powr', 'nostr'] as ContentSource[] }; const filteredTemplates = useCallback(() => { return templates.filter(template => { // Search filter if (searchQuery) { const searchLower = searchQuery.toLowerCase(); if (!template.title.toLowerCase().includes(searchLower) && !template.exercises.some(ex => ex.title.toLowerCase().includes(searchLower) )) { return false; } } // Tags filter (includes type and category) if (filterOptions.tags.length > 0) { if (!filterOptions.tags.includes(template.type) && !filterOptions.tags.includes(template.category) && !template.tags.some(tag => filterOptions.tags.includes(tag))) { return false; } } // Source filter if (filterOptions.source.length > 0) { if (!filterOptions.source.includes(template.source)) { return false; } } return true; }); }, [templates, searchQuery, filterOptions]); const activeFilterCount = Object.values(filterOptions) .reduce((count, filters) => count + filters.length, 0); const handleDelete = (id: string) => { setTemplates(current => current.filter(t => t.id !== id)); }; const handleTemplatePress = (template: Template) => { // TODO: Show template details console.log('Selected template:', template); }; const handleStartWorkout = (template: Template) => { // TODO: Navigate to workout screen with template console.log('Starting workout with template:', template); }; const handleFavorite = (template: Template) => { setTemplates(current => current.map(t => t.id === template.id ? { ...t, isFavorite: !t.isFavorite } : t ) ); }; const handleAddTemplate = (template: Template) => { setTemplates(prev => [...prev, template]); setShowNewTemplate(false); }; // Separate favorites and regular templates const favoriteTemplates = templates.filter(t => t.isFavorite); const regularTemplates = templates.filter(t => !t.isFavorite); return ( setShowFilters(true)} /> {/* Favorites Section */} {favoriteTemplates.length > 0 && ( Favorites {favoriteTemplates.map(template => ( handleTemplatePress(template)} onDelete={handleDelete} onFavorite={() => handleFavorite(template)} onStartWorkout={() => handleStartWorkout(template)} /> ))} )} {/* All Templates Section */} All Templates {regularTemplates.length > 0 ? ( {regularTemplates.map(template => ( handleTemplatePress(template)} onDelete={handleDelete} onFavorite={() => handleFavorite(template)} onStartWorkout={() => handleStartWorkout(template)} /> ))} ) : ( No templates found. Create one by clicking the + button. )} {/* Add some bottom padding for FAB */} setShowNewTemplate(true)} /> setShowNewTemplate(false)} onSubmit={handleAddTemplate} /> setShowFilters(false)} options={filterOptions} onApplyFilters={setFilterOptions} availableFilters={availableFilters} /> ); }