import { Loader2 } from 'lucide-react'
import { Route, Routes } from 'react-router-dom'
import { AppShell } from './components/AppShell'
import { Dashboard } from './screens/Dashboard'
import { ScreeningQueue } from './screens/ScreeningQueue'
import { CandidateEvaluation } from './screens/CandidateEvaluation'
import { Requirements } from './screens/Requirements'
import { Candidates } from './screens/Candidates'
import { Slate } from './screens/Slate'
import { CommandCenter } from './screens/CommandCenter'
import { Compliance } from './screens/Compliance'
import { Settings } from './screens/Settings'
import { Placeholder } from './screens/Placeholder'
import { Login } from './screens/Login'
import { AcceptInvite } from './screens/AcceptInvite'
import { AuthProvider } from './lib/AuthContext'
import { useAuth } from './lib/useAuth'

export default function App() {
  return (
    <AuthProvider>
      <Routes>
        <Route path="/accept" element={<AcceptInvite />} />
        <Route path="/*" element={<Gate />} />
      </Routes>
    </AuthProvider>
  )
}

// Gate renders the app only for a validated session; otherwise the login. The session check runs once on
// load, so a reload never flashes the app before auth resolves.
function Gate() {
  const { principal, loading } = useAuth()
  if (loading) {
    return (
      <div className="grid min-h-screen place-items-center bg-navy-950 text-muted">
        <Loader2 className="animate-spin" size={22} />
      </div>
    )
  }
  if (!principal) {
    return <Login />
  }
  return (
    <Routes>
      <Route element={<AppShell />}>
        <Route index element={<Dashboard />} />
        <Route path="screen" element={<ScreeningQueue />} />
        <Route path="evaluate/:candidateId/:requirementId" element={<CandidateEvaluation />} />
        <Route path="requirements" element={<Requirements />} />
        <Route path="candidates" element={<Candidates />} />
        <Route path="slate" element={<Slate />} />
        <Route
          path="pipeline"
          element={
            <Placeholder
              title="Talent Pipeline"
              blurb="Drag and drop candidate stages from Identified through Hired. Wired to the same candidate intelligence."
            />
          }
        />
        <Route path="compliance" element={<Compliance />} />
        <Route path="command-center" element={<CommandCenter />} />
        <Route path="settings" element={<Settings />} />
      </Route>
    </Routes>
  )
}