import { BrowserRouter, Route, Routes } from "react-router-dom";
import Layout from "../Layout";
import Landing from "../Pages/Landing";
import { AuthRoutes } from "./AuthPaths";
import { PageRoutes } from "./Route";
import Messenger from "../Pages/Messenger";
import Error404 from "../Components/Error404";
import RedirectRoute from "./RedirectRoute";

const Routers = () => {
  return (
    <BrowserRouter>
      <Routes>
        <Route path={`${process.env.PUBLIC_URL}` || `/`} element={<Landing />} />
        <Route path={`${process.env.PUBLIC_URL}/messenger`} element={<RedirectRoute><Messenger /></RedirectRoute>} />
        {PageRoutes.map((item, index) => (
          <Route element={<Layout />} key={index}>
            <Route path={item.path} element={item.element} />
            <Route path={`*`} element={<Error404 />} />
          </Route>
        ))}
        {AuthRoutes.map((item, index) => (
          <Route key={index} path={item.path} element={item.element} />
        ))}
      </Routes>
    </BrowserRouter>
  );
};

export default Routers;