Files
gymflow/App.tsx
2025-11-20 22:56:38 +02:00

198 lines
6.0 KiB
TypeScript

import React, { useState, useEffect } from 'react';
import Navbar from './components/Navbar';
import Tracker from './components/Tracker';
import History from './components/History';
import Stats from './components/Stats';
import AICoach from './components/AICoach';
import Plans from './components/Plans';
import Login from './components/Login';
import Profile from './components/Profile';
import { TabView, WorkoutSession, WorkoutSet, WorkoutPlan, User, Language } from './types';
import { getSessions, saveSession, deleteSession } from './services/storage';
import { getCurrentUserProfile, getMe } from './services/auth';
import { getSystemLanguage } from './services/i18n';
function App() {
const [currentUser, setCurrentUser] = useState<User | null>(null);
const [currentTab, setCurrentTab] = useState<TabView>('TRACK');
const [language, setLanguage] = useState<Language>('en');
const [sessions, setSessions] = useState<WorkoutSession[]>([]);
const [activeSession, setActiveSession] = useState<WorkoutSession | null>(null);
const [activePlan, setActivePlan] = useState<WorkoutPlan | null>(null);
useEffect(() => {
// Set initial language
setLanguage(getSystemLanguage());
// Restore session
const restoreSession = async () => {
const token = localStorage.getItem('token');
if (token) {
const res = await getMe();
if (res.success && res.user) {
setCurrentUser(res.user);
} else {
localStorage.removeItem('token');
}
}
};
restoreSession();
}, []);
useEffect(() => {
const loadSessions = async () => {
if (currentUser) {
const s = await getSessions(currentUser.id);
setSessions(s);
// Profile fetch is skipped for now as it returns undefined
} else {
setSessions([]);
}
};
loadSessions();
}, [currentUser]);
const handleLogin = (user: User) => {
setCurrentUser(user);
setCurrentTab('TRACK');
};
const handleLogout = () => {
setCurrentUser(null);
setActiveSession(null);
setActivePlan(null);
};
const handleLanguageChange = (lang: Language) => {
setLanguage(lang);
};
const handleUserUpdate = (updatedUser: User) => {
setCurrentUser(updatedUser);
};
const handleStartSession = (plan?: WorkoutPlan) => {
if (!currentUser) return;
// Get latest weight from profile or default
const profile = getCurrentUserProfile(currentUser.id);
const currentWeight = profile?.weight || 70;
const newSession: WorkoutSession = {
id: crypto.randomUUID(),
startTime: Date.now(),
userBodyWeight: currentWeight,
sets: [],
planId: plan?.id,
planName: plan?.name
};
setActivePlan(plan || null);
setActiveSession(newSession);
setCurrentTab('TRACK');
};
const handleEndSession = () => {
if (activeSession && currentUser) {
const finishedSession = { ...activeSession, endTime: Date.now() };
saveSession(currentUser.id, finishedSession);
setSessions(prev => [finishedSession, ...prev]);
setActiveSession(null);
setActivePlan(null);
}
};
const handleAddSet = (set: WorkoutSet) => {
if (activeSession) {
setActiveSession(prev => {
if (!prev) return null;
return {
...prev,
sets: [...prev.sets, set]
};
});
}
};
const handleRemoveSetFromActive = (setId: string) => {
if (activeSession) {
setActiveSession(prev => {
if (!prev) return null;
return {
...prev,
sets: prev.sets.filter(s => s.id !== setId)
};
});
}
};
const handleUpdateSession = (updatedSession: WorkoutSession) => {
if (!currentUser) return;
saveSession(currentUser.id, updatedSession);
setSessions(prev => prev.map(s => s.id === updatedSession.id ? updatedSession : s));
};
const handleDeleteSession = (sessionId: string) => {
if (!currentUser) return;
deleteSession(currentUser.id, sessionId);
setSessions(prev => prev.filter(s => s.id !== sessionId));
};
if (!currentUser) {
return <Login onLogin={handleLogin} language={language} onLanguageChange={handleLanguageChange} />;
}
return (
<div className="h-screen w-screen bg-surface text-on-surface font-sans flex flex-col md:flex-row overflow-hidden">
{/* Desktop Navigation Rail (Left) */}
<Navbar currentTab={currentTab} onTabChange={setCurrentTab} lang={language} />
{/* Main Content Area */}
<main className="flex-1 h-full relative w-full max-w-5xl mx-auto md:px-4">
<div className="h-full w-full pb-20 md:pb-0 bg-surface">
{currentTab === 'TRACK' && (
<Tracker
userId={currentUser.id}
activeSession={activeSession}
activePlan={activePlan}
onSessionStart={handleStartSession}
onSessionEnd={handleEndSession}
onSetAdded={handleAddSet}
onRemoveSet={handleRemoveSetFromActive}
lang={language}
/>
)}
{currentTab === 'PLANS' && (
<Plans userId={currentUser.id} onStartPlan={handleStartSession} lang={language} />
)}
{currentTab === 'HISTORY' && (
<History
sessions={sessions}
onUpdateSession={handleUpdateSession}
onDeleteSession={handleDeleteSession}
lang={language}
/>
)}
{currentTab === 'STATS' && <Stats sessions={sessions} lang={language} />}
{currentTab === 'AI_COACH' && <AICoach history={sessions} lang={language} />}
{currentTab === 'PROFILE' && (
<Profile
user={currentUser}
onLogout={handleLogout}
lang={language}
onLanguageChange={handleLanguageChange}
onUserUpdate={handleUserUpdate}
/>
)}
</div>
</main>
{/* Mobile Navigation (rendered inside Navbar component, fixed to bottom) */}
</div>
);
}
export default App;