import React from 'react';
import { AuthProvider, useAuth } from './context/AuthContext';
import Login from './components/Login';
import Header from './components/Header';
import Dashboard from './components/Dashboard';
import LogoutScreen from './components/LogoutScreen';

function MainContent() {
  const { user, isLoggingOut } = useAuth();

  if (isLoggingOut) {
    return <LogoutScreen user={user} />;
  }

  if (!user) {
    return <Login />;
  }

  return (
    <div style={{ minHeight: '100vh', background: '#f4f6f9' }}>
      <Header />
      <Dashboard />
    </div>
  );
}

export default function App() {
  return (
    <AuthProvider>
      <MainContent />
    </AuthProvider>
  );
}