import React from "react";
import { BrowserRouter, Routes, Route } from "react-router-dom";

import { AuthProvider } from "./context/AuthProvider";
import ChatArea from "./pages/chatArea";
import LogIn from "./pages/login";
import NotFoundPage from "./pages/notFound";
import SignupPage from "./pages/signup";
import VoiceToVoice from "./pages/voiceToVoice";
import ProtectedRoute from "./routes/protectedRoute";
import RedirectIfAuthenticated from "./routes/redirectIfAuthenticated";

const App: React.FC = () => {
  return (
    <AuthProvider>
      <BrowserRouter>
        <Routes>
          <Route element={<RedirectIfAuthenticated />}>
            <Route path="/signin" element={<LogIn />} />
            <Route path="/signup" element={<SignupPage />} />
          </Route>
          <Route element={<ProtectedRoute />}>
            <Route path="/" element={<ChatArea />} />
            <Route path="/voice-to-voice" element={<VoiceToVoice />} />
          </Route>
          <Route path="*" element={<NotFoundPage />} />
        </Routes>
      </BrowserRouter>
    </AuthProvider>
  );
};

export default App;
