import React, { useState } from 'react';
import { AuthProvider, useAuth } from './contexts/AuthContext';
import Login from './pages/Login';
import Register from './pages/Register';
import Dashboard from './pages/Dashboard';
import Habits from './pages/Habits';
import Admin from './pages/Admin';
import Tasks from './pages/Tasks';
import Health from './pages/Health';
import Progress from './pages/Progress';
import './App.css';

type Page = 'dashboard' | 'habits' | 'admin' | 'tasks' | 'health' | 'progress';

const AppContent: React.FC = () => {
  const { user, loading } = useAuth();
  const [showRegister, setShowRegister] = useState(false);
  const [currentPage, setCurrentPage] = useState<Page>('dashboard');

  if (loading) {
    return (
      <div className="loading-screen">
        <div className="loading-spinner">🚀</div>
        <p>Carregando Vida180...</p>
      </div>
    );
  }

  if (user) {
    switch (currentPage) {
      case 'habits':
        return <Habits onBack={() => setCurrentPage('dashboard')} />;
      case 'admin':
        return <Admin onBack={() => setCurrentPage('dashboard')} />;
      case 'tasks':
        return <Tasks onBack={() => setCurrentPage('dashboard')} />;
      case 'health':
        return <Health onBack={() => setCurrentPage('dashboard')} />;
      case 'progress':
        return <Progress onBack={() => setCurrentPage('dashboard')} />;
      case 'dashboard':
      default:
        return <Dashboard onNavigate={setCurrentPage} />;
    }
  }

  return showRegister ? (
    <Register onSwitchToLogin={() => setShowRegister(false)} />
  ) : (
    <Login onSwitchToRegister={() => setShowRegister(true)} />
  );
};

function App() {
  return (
    <AuthProvider>
      <AppContent />
    </AuthProvider>
  );
}

export default App;
