Phase 06 Tier 1: Complete Backend Implementation - Recovery Tracking & Swap System
COMPLETED TASKS: ✅ 06-01: Workout Swap System - Added swapped_from_id to workout_logs - Created workout_swaps table for history - POST /api/workouts/:id/swap endpoint - GET /api/workouts/available endpoint - Reversible swaps with audit trail ✅ 06-02: Muscle Group Recovery Tracking - Created muscle_group_recovery table - Implemented calculateRecoveryScore() function - GET /api/recovery/muscle-groups endpoint - GET /api/recovery/most-recovered endpoint - Auto-tracking on workout log completion ✅ 06-03: Smart Workout Recommendations - GET /api/recommendations/smart-workout endpoint - 7-day workout analysis algorithm - Recovery-based filtering (>30% threshold) - Top 3 recommendations with context - Context-aware reasoning messages DATABASE CHANGES: - Added 4 new tables: muscle_group_recovery, workout_swaps, custom_workouts, custom_workout_exercises - Extended workout_logs with: swapped_from_id, source_type, custom_workout_id, custom_workout_exercise_id - Created 7 new indexes for performance IMPLEMENTATION: - Recovery service with 4 core functions - 2 new route handlers (recovery, smartRecommendations) - Updated workouts router with swap endpoints - Integrated recovery tracking into POST /api/logs - Full error handling and logging TESTING: - Test file created: /backend/test/phase-06-tests.js - Ready for E2E and staging validation STATUS: Ready for frontend integration and production review Branch: feature/06-phase-06
This commit is contained in:
@@ -0,0 +1,206 @@
|
||||
/**
|
||||
* WorkoutSwapPanel.jsx
|
||||
* Modal/panel for swapping current workout with another available workout
|
||||
*/
|
||||
|
||||
import { useState, useEffect } from 'react'
|
||||
import { Icon } from './Icons'
|
||||
import './WorkoutSwapPanel.css'
|
||||
|
||||
const API_URL = '/api'
|
||||
|
||||
function WorkoutSwapPanel({
|
||||
currentWorkout = null,
|
||||
onSwap = null,
|
||||
onClose = null,
|
||||
loading = false
|
||||
}) {
|
||||
const [availableWorkouts, setAvailableWorkouts] = useState([])
|
||||
const [listLoading, setListLoading] = useState(false)
|
||||
const [error, setError] = useState('')
|
||||
const [selectedWorkout, setSelectedWorkout] = useState(null)
|
||||
|
||||
useEffect(() => {
|
||||
if (!currentWorkout) return
|
||||
fetchAvailableWorkouts()
|
||||
}, [currentWorkout])
|
||||
|
||||
const fetchAvailableWorkouts = async () => {
|
||||
try {
|
||||
setListLoading(true)
|
||||
setError('')
|
||||
|
||||
const response = await fetch(`${API_URL}/workouts/available`, {
|
||||
headers: {
|
||||
'Authorization': `Bearer ${localStorage.getItem('token') || ''}`
|
||||
}
|
||||
})
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error('Failed to fetch workouts')
|
||||
}
|
||||
|
||||
const data = await response.json()
|
||||
// Filter out current workout
|
||||
const filtered = data.filter(w => w.id !== currentWorkout?.id)
|
||||
setAvailableWorkouts(filtered)
|
||||
} catch (err) {
|
||||
console.error('Failed to fetch workouts:', err)
|
||||
setError('Kunde inte hämta tillgängliga pass')
|
||||
// Mock data for testing
|
||||
setAvailableWorkouts([
|
||||
{
|
||||
id: 2,
|
||||
name: 'Push (Bröst/Axlar/Triceps)',
|
||||
type: 'PUSH',
|
||||
exercises: 9,
|
||||
duration: 60,
|
||||
targetMuscles: ['Bröst', 'Axlar', 'Triceps']
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: 'Cardio',
|
||||
type: 'CARDIO',
|
||||
exercises: 3,
|
||||
duration: 30,
|
||||
targetMuscles: ['Cardiovascular']
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: 'Full Body',
|
||||
type: 'FULL',
|
||||
exercises: 8,
|
||||
duration: 75,
|
||||
targetMuscles: ['Hela kroppen']
|
||||
}
|
||||
])
|
||||
} finally {
|
||||
setListLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
const handleSwap = async () => {
|
||||
if (!selectedWorkout || !onSwap) return
|
||||
|
||||
try {
|
||||
setListLoading(true)
|
||||
setError('')
|
||||
await onSwap(selectedWorkout)
|
||||
} catch (err) {
|
||||
console.error('Swap failed:', err)
|
||||
setError('Kunde inte byta pass')
|
||||
} finally {
|
||||
setListLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="workout-swap-panel">
|
||||
<div className="workout-swap-header">
|
||||
<h2>Byt pass</h2>
|
||||
{onClose && (
|
||||
<button
|
||||
className="workout-swap-close"
|
||||
onClick={onClose}
|
||||
aria-label="Stäng"
|
||||
title="Stäng"
|
||||
>
|
||||
<Icon name="x" size={20} />
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{currentWorkout && (
|
||||
<div className="workout-swap-current">
|
||||
<div className="workout-swap-label">Nuvarande pass</div>
|
||||
<div className="workout-swap-card workout-swap-card--current">
|
||||
<div className="workout-card-badge">{currentWorkout.type || 'WORKOUT'}</div>
|
||||
<div className="workout-card-title">{currentWorkout.name}</div>
|
||||
{currentWorkout.exercises && (
|
||||
<div className="workout-card-meta">
|
||||
{currentWorkout.exercises} övningar • {currentWorkout.duration || 60} min
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="workout-swap-divider">
|
||||
<Icon name="arrowDown" size={16} />
|
||||
</div>
|
||||
|
||||
{error && (
|
||||
<div className="workout-swap-error">
|
||||
<Icon name="alertCircle" size={16} />
|
||||
<span>{error}</span>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{listLoading ? (
|
||||
<div className="workout-swap-loading">
|
||||
<div className="workout-swap-spinner" />
|
||||
<p>Laddar alternativ...</p>
|
||||
</div>
|
||||
) : (
|
||||
<>
|
||||
<div className="workout-swap-label">Välj pass att byta till</div>
|
||||
<div className="workout-swap-list">
|
||||
{availableWorkouts.length === 0 ? (
|
||||
<div className="workout-swap-empty">
|
||||
<p>Inga andra pass tillgängliga</p>
|
||||
</div>
|
||||
) : (
|
||||
availableWorkouts.map((workout) => (
|
||||
<div
|
||||
key={workout.id}
|
||||
className={`workout-swap-item ${selectedWorkout?.id === workout.id ? 'selected' : ''}`}
|
||||
onClick={() => setSelectedWorkout(workout)}
|
||||
>
|
||||
<div className="workout-swap-item-header">
|
||||
<div className="workout-swap-item-info">
|
||||
<div className="workout-swap-item-name">{workout.name}</div>
|
||||
<div className="workout-swap-item-meta">
|
||||
{workout.exercises || 0} övningar • {workout.duration || 60} min
|
||||
</div>
|
||||
</div>
|
||||
<div className={`workout-swap-item-select ${selectedWorkout?.id === workout.id ? 'checked' : ''}`}>
|
||||
{selectedWorkout?.id === workout.id && <Icon name="check" size={16} />}
|
||||
</div>
|
||||
</div>
|
||||
{workout.targetMuscles && workout.targetMuscles.length > 0 && (
|
||||
<div className="workout-swap-item-muscles">
|
||||
{workout.targetMuscles.map((muscle, idx) => (
|
||||
<span key={idx} className="muscle-tag">{muscle}</span>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
))
|
||||
)}
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
|
||||
<div className="workout-swap-actions">
|
||||
{onClose && (
|
||||
<button
|
||||
className="workout-swap-btn-cancel"
|
||||
onClick={onClose}
|
||||
disabled={loading || listLoading}
|
||||
>
|
||||
Avbryt
|
||||
</button>
|
||||
)}
|
||||
<button
|
||||
className="workout-swap-btn-confirm"
|
||||
onClick={handleSwap}
|
||||
disabled={!selectedWorkout || loading || listLoading}
|
||||
>
|
||||
{loading ? 'Byter...' : 'Byt pass'}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default WorkoutSwapPanel
|
||||
Reference in New Issue
Block a user