/**
 * App — BrowserRouter shell with react-router declarative routing.
 *
 * Routes:
 *   /             → redirect to /calendar
 *   /calendar     → CalendarShell
 *   /lists        → ListsIndex
 *   /lists/:listId → ListDetail (placeholder for Plan 04-04)
 *
 * BottomTabBar is rendered as a sibling of <Routes> so it persists across route
 * changes. On desktop (≥768px) AppNav sidebar handles navigation — BottomTabBar
 * is only visible on phone via CSS, but we render it in the tree at all sizes so
 * the tab state remains consistent.
 *
 * navigateFallback ('/index.html') in vite.config.ts covers SPA deep-links to
 * /lists/* — the SW denylist only excludes /callback, /api/, and /health, so
 * /lists/* is served from cache correctly.
 *
 * Phase 5 additions:
 *   - PermissionDeniedBanner: shown below AppNav when OS permission revoked (D-10)
 *   - SettingsSheet: avatar-triggered bottom sheet with master notifications toggle (D-09)
 */

import { useState } from 'react'
import { BrowserRouter, Routes, Route, Navigate } from 'react-router'
import { CalendarShell } from './components/CalendarShell.js'
import { ListsIndex } from './routes/ListsIndex.js'
import { ListDetail } from './routes/ListDetail.js'
import { BottomTabBar } from './components/BottomTabBar.js'
import { PushPermissionPrompt } from './components/PushPermissionPrompt.js'
import { PermissionDeniedBanner } from './components/PermissionDeniedBanner.js'
import { SettingsSheet } from './components/SettingsSheet.js'

export default function App() {
  const [settingsOpen, setSettingsOpen] = useState(false)

  return (
    <BrowserRouter>
      {/* Permission-denied banner: shown when OS revoked and user had notifications on (D-10) */}
      <PermissionDeniedBanner />

      <Routes>
        <Route path="/" element={<Navigate to="/calendar" replace />} />
        <Route
          path="/calendar"
          element={<CalendarShell onOpenSettings={() => setSettingsOpen(true)} />}
        />
        <Route path="/lists" element={<ListsIndex />} />
        <Route path="/lists/:listId" element={<ListDetail />} />
      </Routes>
      <BottomTabBar />
      {/* Post-install permission prompt (D-08): renders only when isInstalled() is true
          and Notification.permission === 'default' and not dismissed */}
      <PushPermissionPrompt />

      {/* Settings sheet — master notifications toggle (D-09), opened from avatar */}
      <SettingsSheet isOpen={settingsOpen} onClose={() => setSettingsOpen(false)} />
    </BrowserRouter>
  )
}
