import { createRoot } from 'react-dom/client'
import { HashRouter, Navigate, Route, Routes } from 'react-router-dom'
import '@fontsource-variable/geist'
import '@fontsource-variable/geist-mono'
import '../../../packages/ui/src/tokens.css'
import './app.css'
import { initTheme, ToastProvider } from '@sims/ui'
import { ErrorBoundary } from './components/ErrorBoundary'
import { Layout } from './Layout'
import { Login } from './Login'
import { Home } from './pages/Home'
import { Dashboard } from './pages/Dashboard'
import { Clients } from './pages/Clients'
import { ClientDetail } from './pages/ClientDetail'
import { Modules } from './pages/Modules'
import { Reports } from './pages/Reports'
import { Settings } from './pages/Settings'
import { NewDocument } from './pages/NewDocument'
import { DocumentView } from './pages/DocumentView'
import { Employees } from './pages/Employees'
import { Profile } from './pages/Profile'
import { ImportApex } from './pages/ImportApex'
import { Pipeline } from './pages/Pipeline'
import { Documents } from './pages/Documents'
import { Reminders } from './pages/Reminders'
import { Tickets } from './pages/Tickets'
import { Projects } from './pages/Projects'
import { Renewals } from './pages/Renewals'
import { Mis } from './pages/Mis'
import { Audit } from './pages/Audit'
import { LoginHistory } from './pages/LoginHistory'
import { SmsBalances } from './pages/SmsBalances'
import { ModuleDirectory } from './pages/ModuleDirectory'
import { Portals } from './pages/Portals'

function App() {
  return (
    <HashRouter>
      <Routes>
        <Route path="/login" element={<Login />} />
        <Route element={<Layout />}>
          <Route path="/" element={<Home />} />
          <Route path="/dashboard" element={<Dashboard />} />
          <Route path="/pipeline" element={<Pipeline />} />
          <Route path="/reminders" element={<Reminders />} />
          <Route path="/projects" element={<Projects />} />
          <Route path="/renewals" element={<Renewals />} />
          <Route path="/mis" element={<Mis />} />
          <Route path="/audit" element={<Audit />} />
          <Route path="/login-history" element={<LoginHistory />} />
          <Route path="/sms-balances" element={<SmsBalances />} />
          <Route path="/module-data" element={<ModuleDirectory />} />
          <Route path="/portals" element={<Portals />} />
          <Route path="/tickets" element={<Tickets />} />
          <Route path="/clients" element={<Clients />} />
          <Route path="/clients/:id" element={<ClientDetail />} />
          <Route path="/modules" element={<Modules />} />
          <Route path="/reports" element={<Reports />} />
          <Route path="/settings" element={<Settings />} />
          <Route path="/settings/template" element={<Navigate to="/settings?s=template" replace />} />
          <Route path="/employees" element={<Employees />} />
          <Route path="/profile" element={<Profile />} />
          <Route path="/import" element={<ImportApex />} />
          <Route path="/documents" element={<Documents />} />
          <Route path="/documents/new" element={<NewDocument />} />
          <Route path="/documents/:id" element={<DocumentView />} />
          <Route path="*" element={<Navigate to="/" replace />} />
        </Route>
      </Routes>
    </HashRouter>
  )
}

initTheme()
createRoot(document.getElementById('root')!).render(
  <ErrorBoundary><ToastProvider><App /></ToastProvider></ErrorBoundary>,
)

// PWA: register the service worker in production builds only (a SW in Vite dev
// interferes with HMR). Failure is non-fatal — the app runs fine without it.
if (import.meta.env.PROD && 'serviceWorker' in navigator) {
  window.addEventListener('load', () => {
    navigator.serviceWorker.register('/sw.js').catch(() => { /* PWA is progressive — ignore */ })
  })
}