import { Link, useParams } from 'react-router-dom'; import { extractApiError } from '@/api/client'; import { useAuth } from '@/hooks/useAuth'; import { useEngagement } from '@/hooks/useEngagements'; import { LoadingState } from '@/components/LoadingState'; import { ErrorState } from '@/components/ErrorState'; import { StatusBadge } from '@/components/StatusBadge'; export function EngagementDetailPage(): JSX.Element { const { id } = useParams<{ id: string }>(); const numericId = id ? Number(id) : undefined; const { canEditEngagements } = useAuth(); const detail = useEngagement(numericId); if (detail.isLoading) return ; if (detail.isError) { return ( detail.refetch()} /> ); } if (!detail.data) return ; const eng = detail.data; return (
← Back to engagements

{eng.name}

Created by {eng.created_by.username}
{canEditEngagements ? ( Edit ) : null}

Schedule

Start date
{eng.start_date}
End date
{eng.end_date ?? '—'}
Status
{eng.status}
Created at
{eng.created_at}

Description

{eng.description?.trim() ? eng.description : 'No description provided.'}

{/* Sprint 2 placeholder per AC-4.9 */}

Simulations

Simulations à venir au Sprint 2 — tracking of red team tests and SOC detection coverage will live here.

); }