import './App.css';
import Header from './components/Header';
import React from 'react';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { Container } from '@mui/material';
import { BrowserRouter as Router, Routes, Route, BrowserRouter} from 'react-router-dom'
import Dashboard from './components/Dashboard';
import Projects from './components/projects/Projects';
import { ReactQueryDevtools} from 'react-query/devtools'
import ManageUsers from './components/manage_users/ManageUsers';
import IntranetUsers from './components/intranet_users/IntranetUsers';
import Search from './components/search/Search';
import Admin from './components/admin/Admin';

function App() {
  const queryClient = new QueryClient();
  return (
    <QueryClientProvider client={queryClient}>
      <BrowserRouter>
        <div className="App">
          <Header />
          <Routes>
            <Route path="/" element={<Dashboard />} />
            <Route path="/projects" element={<Projects />} />
            <Route path="/manage-users" element={<ManageUsers />} />
            <Route path="/intranet-users" element={<IntranetUsers />} />
            <Route path="/search" element={<Search />} />
            <Route path="/admin" element={<Admin />} />
          </Routes>
        </div>
      </BrowserRouter>
    {/* <ReactQueryDevtools initialIsOpen={false} /> */}
  </QueryClientProvider>
  );
}

export default App;