import React from "react";
import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
import UserPage from "./pages/UserPage/UserPage";
import TitlesPage from "./pages/TitlesPage/TitlesPage";
import TitlePage from "./pages/TitlePage/TitlePage";
import { LoginPage } from "./pages/LoginPage/LoginPage";
import { Header } from "./components/Header/Header";

// import { OpenAPI } from "./api";

// OpenAPI.WITH_CREDENTIALS = true

const App: React.FC = () => {
  // const username = localStorage.getItem("username") || undefined;
  const userId = localStorage.getItem("user_id");

  return (
    <Router>
      <Header />
      <Routes>
        {/* auth */}
        <Route path="/login" element={<LoginPage />} />
        <Route path="/signup" element={<LoginPage />} />
        {/*<Route path="/signup" element={<LoginPage />} />*/}
        
        {/* users */}
        {/*<Route path="/users" element={<UsersPage />} />*/}
        <Route path="/users/:id" element={<UserPage />} />
        <Route
          path="/profile"
          element={userId ? <UserPage userId={userId} /> : <LoginPage />}
        />

        {/* titles */}
        <Route path="/titles" element={<TitlesPage />} />
        <Route path="/titles/:id" element={<TitlePage />} />
      </Routes>
    </Router>
  );
};


export default App;