import React from 'react';
import { BrowserRouter as Router, Route, Routes } from 'react-router-dom';
import Login from './Login';
import CategorySelection from './CategorySelection';
import RuleDetails from './RuleDetails';
import HostnamesList from './HostnamesList';
import Container from '@mui/material/Container';

function App() {
  return (
    <Container maxWidth="xl" sx={{height: '100%'}}>
      <Router>
        <Routes>
          <Route path="/" element={<Login />} />
          <Route path="/login" element={<Login />} />
          <Route path="/categories" element={<CategorySelection />} />
          <Route path="/categories/:category" element={<HostnamesList />} />
          <Route path="/rules/:ruleName" element={<RuleDetails />} />
          <Route path="/hostnames" element={<HostnamesList />} />
          {/* Add more routes as needed */}
        </Routes>
      </Router>
    </Container>
  );
}

export default App;