import { Routes, Route, Navigate } from "react-router-dom"
import App from "./App.jsx"
import ProtectedRoute from "./components/ProtectedRoute.jsx"
import Layout from "./components/Layout.jsx"
import DoseReminder from "./components/DoseReminder.jsx"
import Login from "./pages/Login.jsx"
import Signup from "./pages/Signup.jsx"
import Dashboard from "./pages/Dashboard.jsx"
import ScheduleBuilder from "./pages/ScheduleBuilder.jsx"
import Today from "./pages/Today.jsx"
import Leaderboard from "./pages/Leaderboard.jsx"
import Profile from "./pages/Profile.jsx"
import MedsLibrary from "./pages/MedsLibrary.jsx"

export default function AppShell() {
  return (
    <>
    <DoseReminder />
    <Routes>
      <Route path="/login" element={<Login />} />
      <Route path="/signup" element={<Signup />} />

      <Route element={<ProtectedRoute />}>
        {/* Chat keeps its original self-contained layout (App renders its own Sidebar) */}
        <Route path="/chat" element={<App />} />

        {/* All other authenticated pages share the Layout shell */}
        <Route element={<Layout />}>
          <Route path="/dashboard" element={<Dashboard />} />
          <Route path="/schedule" element={<ScheduleBuilder />} />
          <Route path="/today" element={<Today />} />
          <Route path="/medicines" element={<MedsLibrary />} />
          <Route path="/leaderboard" element={<Leaderboard />} />
          <Route path="/profile" element={<Profile />} />
        </Route>

        <Route path="/" element={<Navigate to="/dashboard" replace />} />
      </Route>

      <Route path="*" element={<Navigate to="/dashboard" replace />} />
    </Routes>
    </>
  )
}