import { Routes, Route, Navigate } from "react-router-dom";
import { useAuth } from "./contexts/AuthContext";
import Navbar from "./components/Navbar";
import Footer from "./components/Footer";
import Login from "./pages/login/Login";
import Signup from "./pages/Signup";
import Subscribe from "./pages/subscribe/Subscribe";
import CheckoutReturn from "./pages/subscribe/CheckoutReturn";
import Addresses from "./pages/addresses/Addresses";
import Alerts from "./pages/alerts/Alerts";
import AlertHistory from "./pages/alertHistory/AlertHistory";
import Account from "./pages/user_account/Account";
import Terms from "./pages/terms/Terms";
import Privacy from "./pages/privacy/Privacy";
import Support from "./pages/support/Support";

export default function App() {
  const { currentUser, isSubscribed } = useAuth();

  if (!currentUser) {
    return (
      <Routes>
        <Route path="/login" element={<Login />} />
        <Route path="/signup" element={<Signup />} />
        <Route path="/subscribe" element={<Subscribe />} />
        <Route path="/subscribe/return/:sessionId" element={<CheckoutReturn />} />
        <Route path="*" element={<Navigate to="/login" />} />
      </Routes>
    );
  }

  if (!isSubscribed) {
    return (
      <div className="app-layout">
        <div className="app-layout__main">
          <Routes>
            <Route path="/subscribe" element={<Subscribe />} />
            <Route path="/subscribe/return/:sessionId" element={<CheckoutReturn />} />
            <Route path="/account" element={<><Navbar /><Account /></>} />
            <Route path="/terms" element={<><Navbar /><Terms /></>} />
            <Route path="/privacy" element={<><Navbar /><Privacy /></>} />
            <Route path="/support" element={<><Navbar /><Support /></>} />
            <Route path="*" element={<Navigate to="/subscribe" />} />
          </Routes>
        </div>
        <Footer />
      </div>
    );
  }

  return (
    <div className="app-layout">
      <Navbar />
      <div className="app-layout__main">
        <Routes>
          <Route path="/" element={<Addresses />} />
          <Route path="/addresses" element={<Addresses />} />
          <Route path="/alerts" element={<Alerts />} />
          <Route path="/alertevents" element={<AlertHistory />} />
          <Route path="/account" element={<Account />} />
          <Route path="/subscribe" element={<Subscribe />} />
          <Route path="/subscribe/return/:sessionId" element={<CheckoutReturn />} />
          <Route path="/terms" element={<Terms />} />
          <Route path="/privacy" element={<Privacy />} />
          <Route path="/support" element={<Support />} />
          <Route path="*" element={<Navigate to="/addresses" />} />
        </Routes>
      </div>
      <Footer />
    </div>
  );
}
