import { Route, Routes, useLocation, useNavigate } from 'react-router-dom';
import AuthenticationScreen from './authentication';
import { Chat } from './chat';
import {MailPage} from './mail';
import DashboardPage from './dashboard';
import TaskPage from './tasks';
import TemplatesPage from './templates';
import {DriveScreen} from './drive';
import SyncPage from './sync/page';

const examples = [
  { name: "Home", href: "authentication" },
  { name: "Dashboard", href: "dashboard" },
  { name: "Chat", href: "chat" },
  { name: "Mail", href: "mail" },
  { name: "Drive", href: "drive" },
  { name: "Tasks", href: "tasks" },
  { name: "Meet", href: "meet" },
  { name: "Templates", href: "templates" },
  { name: "Settings", href: "sync" },
  { name: "Help", href: "help" },
];

export function RootLayout() {
  return (
    <div className="app-container">
          Oi
          <main className="app-main">
            <Routes>
              <Route path="authentication" element={
                <>
                  <AuthenticationScreen />
                </>
              } />
              <Route path="chat" element={
                <>
                  <Chat />
                  
                </>
              } />
              <Route path="dashboard" element={
                <>
                  <DashboardPage />
                  
                </>
              } />
              <Route path="mail" element={
                <>
                  <MailPage />
                  
                </>
              } />
              <Route path="drive" element={<DriveScreen />} />
              <Route path="tasks" element={
                <>
                  <TaskPage />
                  
                </>
              } />
              <Route path="meet" element={<div>Meet Screen (Placeholder)</div>} />
              <Route path="templates" element={
                <>
                  <TemplatesPage />
                  
                </>
              } />
              <Route path="sync" element={<SyncPage />} />
            </Routes>
          </main>
    </div>
  );
}

  export default RootLayout;