58 lines
2 KiB
TypeScript
58 lines
2 KiB
TypeScript
/**
|
|
* Page /historique — liste paginée des simulations de l'utilisateur connecté.
|
|
*
|
|
* Consommateurs amont :
|
|
* - `usePlan` (cache partagé avec dashboard/simulation)
|
|
* - `useSimulationsList(page, limit)` — cache `['simulations', 'list', p, l]`
|
|
*
|
|
* Gating Free via `hasAccess(plan, 'dashboard')` délégué à `SimulationsList`.
|
|
* Pagination : Précédent/Suivant via state local `page`.
|
|
*
|
|
* Règle H : aucune logique métier — toute l'orchestration vit dans SimulationsList.
|
|
*/
|
|
|
|
import { useState } from 'react'
|
|
import { useNavigate } from 'react-router-dom'
|
|
import { usePlan } from '@/features/dashboard/hooks/usePlan'
|
|
import { useSimulationsList } from '../hooks/useSimulationsList'
|
|
import { SimulationsList } from '../components/SimulationsList'
|
|
|
|
const PAGE_SIZE = 20
|
|
|
|
export function HistoriquePage() {
|
|
const navigate = useNavigate()
|
|
const [page, setPage] = useState(1)
|
|
|
|
const { data: planData, isLoading: isPlanLoading } = usePlan()
|
|
const { data, isLoading, isError } = useSimulationsList(page, PAGE_SIZE)
|
|
|
|
return (
|
|
<main className="mx-auto max-w-3xl space-y-6 px-4 py-6">
|
|
<header className="space-y-1">
|
|
<h1 className="text-lg font-semibold text-ink-1">Historique</h1>
|
|
<p className="text-sm text-ink-3">
|
|
Retrouvez toutes vos simulations passées et leur progression.
|
|
</p>
|
|
</header>
|
|
|
|
{isPlanLoading || !planData ? (
|
|
<div className="space-y-3" aria-busy="true">
|
|
<div className="h-20 animate-pulse rounded-lg bg-canvas-2" />
|
|
<div className="h-20 animate-pulse rounded-lg bg-canvas-2" />
|
|
</div>
|
|
) : (
|
|
<SimulationsList
|
|
plan={planData.plan}
|
|
data={data}
|
|
isLoading={isLoading}
|
|
isError={isError}
|
|
page={page}
|
|
limit={PAGE_SIZE}
|
|
onPrev={() => setPage((p) => Math.max(1, p - 1))}
|
|
onNext={() => setPage((p) => p + 1)}
|
|
onUpgrade={() => navigate('/plan')}
|
|
/>
|
|
)}
|
|
</main>
|
|
)
|
|
}
|