import { BrowserRouter, Routes, Route, Navigate } from 'react-router-dom';
import { ThemeProvider, createTheme } from '@mui/material/styles';
import CssBaseline from '@mui/material/CssBaseline';
import { MainLayout } from './components/layout/MainLayout';
import { ProtectedRoute } from './components/ProtectedRoute';

// Creating a base Material-UI theme to replace Nebular's default
const theme = createTheme({
  palette: {
    mode: 'dark',
    primary: {
      main: '#3b82f6', // Matching dashboard blue
    },
    background: {
      default: '#0b1121', // Dark navy
      paper: '#0f172a',   // Slightly lighter navy
    },
  },
  typography: {
    fontFamily: '"Open Sans", sans-serif',
  },
  components: {
    MuiAppBar: {
      styleOverrides: {
        root: {
          backgroundColor: '#0f172a',
          color: '#f8fafc',
          backgroundImage: 'none',
        }
      }
    },
    MuiPaper: {
      styleOverrides: {
        root: {
          backgroundImage: 'none',
        }
      }
    }
  }
});

import { Login } from './pages/account/Login';
import { Dashboard } from './pages/dashboard/Dashboard';
import { GlobalFeed } from './pages/activity-feeds/GlobalFeed';
import { AuditSession } from './pages/audit-session/AuditSession';

export default function App() {
  return (
    <ThemeProvider theme={theme}>
      <CssBaseline />
      <BrowserRouter>
        <Routes>
          {/* Public Routes */}
          <Route path="/login" element={<Login />} />

          {/* Protected Routes inside the Main Layout */}
          <Route element={<ProtectedRoute />}>
            <Route path="/audit-session" element={<AuditSession />} />
            <Route path="/" element={<MainLayout />}>
              <Route index element={<Navigate to="/dashboard" replace />} />
              <Route path="dashboard" element={<Dashboard />} />
              <Route path="activity-feeds" element={<GlobalFeed />} />
            </Route>
          </Route>

          {/* Catch-all */}
          <Route path="*" element={<Navigate to="/" replace />} />
        </Routes>
      </BrowserRouter>
    </ThemeProvider>
  );
}
