import { BrowserRouter, Routes, Route, Navigate } from 'react-router-dom';
import { AuthProvider } from './context/AuthContext';
import Navbar from './components/Navbar';
import ProtectedRoute from './components/ProtectedRoute';
import Login from './pages/Login';
import Products from './pages/Products';
import Warehouses from './pages/Warehouses';
import Transactions from './pages/Transactions';
import Reports from './pages/Reports';

function App() {
  return (
    <AuthProvider>
      <BrowserRouter>
        <div className="min-h-screen flex flex-col">
          <Navbar />
          <main className="flex-1">
            <Routes>
              <Route path="/login" element={<Login />} />
              <Route path="/" element={<Navigate to="/products" replace />} />
              <Route path="/products" element={
                <ProtectedRoute><Products /></ProtectedRoute>
              } />
              <Route path="/warehouses" element={
                <ProtectedRoute><Warehouses /></ProtectedRoute>
              } />
              <Route path="/transactions" element={
                <ProtectedRoute><Transactions /></ProtectedRoute>
              } />
              <Route path="/reports" element={
                <ProtectedRoute><Reports /></ProtectedRoute>
              } />
            </Routes>
          </main>
          <footer className="bg-ink-900 text-ink-200 text-center py-4 text-sm border-t border-primary-500/20">
            &copy; 2026 StockHub Ltd — Stock Management System
          </footer>
        </div>
      </BrowserRouter>
    </AuthProvider>
  );
}

export default App;
