fix(frontend): i18n reactive badges + fr-FR dates on detail/admin + FR footer (design-review)

- StatusBadge/SimulationStatusBadge: swap bare i18n.t() helper for
  useTranslation() hook so badges re-render reactively on i18n init
- EngagementDetailPage: formatDate() on start_date/end_date/created_at
  (was: raw ISO string, formatDateTime with noisy 00:00:00)
- UsersAdminPage: formatDate() on created_at column (was: raw ISO string)
- Layout footer: t('nav.footer') with FR string in fr.json

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

frontend/src/components/Layout.tsx

@@ -124,7 +124,7 @@ export function Layout(): JSX.Element {
       {/* footer — fixed dark slab, never inverts */}
       <footer className="bg-slab text-slab-text">
         <div className="mx-auto w-full max-w-page px-xl py-xl text-[12px] text-slab-muted">
-          Mimic — Internal Purple Team tooling. Authorized engagements only.
+          {t('nav.footer')}
         </div>
       </footer>
     </div>

frontend/src/components/SimulationStatusBadge.tsx

@@ -1,5 +1,5 @@
+import { useTranslation } from 'react-i18next';
 import type { SimulationStatus } from '@/api/types';
-import { simulationStatusLabel } from '@/i18n/status';
 
 const STYLES: Record<SimulationStatus, string> = {
   pending: 'bg-cloud text-graphite border border-hairline',
@@ -9,13 +9,14 @@ const STYLES: Record<SimulationStatus, string> = {
 };
 
 export function SimulationStatusBadge({ status }: { status: SimulationStatus }): JSX.Element {
+  const { t } = useTranslation();
   return (
     <span
       className={`inline-flex items-center rounded-pill px-3 py-[6px] text-[14px] leading-[1.3] font-medium ${STYLES[status]}`}
       data-testid="simulation-status-badge"
       data-status={status}
     >
-      {simulationStatusLabel(status)}
+      {t(`status.simulation.${status}`)}
     </span>
   );
 }

frontend/src/components/StatusBadge.tsx

@@ -1,5 +1,5 @@
+import { useTranslation } from 'react-i18next';
 import type { EngagementStatus } from '@/api/types';
-import { engagementStatusLabel } from '@/i18n/status';
 
 const STYLES: Record<EngagementStatus, string> = {
   planned: 'bg-warn-soft text-warn border border-warn',
@@ -8,13 +8,14 @@ const STYLES: Record<EngagementStatus, string> = {
 };
 
 export function StatusBadge({ status }: { status: EngagementStatus }): JSX.Element {
+  const { t } = useTranslation();
   return (
     <span
       className={`inline-flex items-center rounded-pill px-3 py-[6px] text-[14px] leading-[1.3] font-medium ${STYLES[status]}`}
       data-testid="status-badge"
       data-status={status}
     >
-      {engagementStatusLabel(status)}
+      {t(`status.engagement.${status}`)}
     </span>
   );
 }

frontend/src/i18n/fr.json

@@ -23,7 +23,8 @@
     "templates": "Templates",
     "users": "Utilisateurs",
     "signOut": "Se déconnecter",
-    "brand": "Mimic"
+    "brand": "Mimic",
+    "footer": "Mimic — Outillage interne Purple Team. Engagements autorisés uniquement."
   },
   "auth": {
     "login": {

frontend/src/pages/EngagementDetailPage.tsx

@@ -12,7 +12,7 @@ import { SimulationList } from '@/components/SimulationList';
 import { ExportEngagementButton } from '@/components/ExportEngagementButton';
 import { BackLink } from '@/components/BackLink';
 import { Tabs } from '@/components/Tabs';
-import { formatDateTime } from '@/lib/format';
+import { formatDate } from '@/lib/format';
 
 type TabId = 'description' | 'simulations';
 
@@ -78,13 +78,13 @@ export function EngagementDetailPage(): JSX.Element {
             <header className="flex items-start justify-between gap-md">
               <dl className="grid grid-cols-2 gap-x-lg gap-y-xxs text-caption-md">
                 <dt className="text-graphite">{t('engagement.detail.schedule.startDate')}</dt>
-                <dd className="font-mono">{eng.start_date}</dd>
+                <dd className="font-mono">{formatDate(eng.start_date)}</dd>
                 <dt className="text-graphite">{t('engagement.detail.schedule.endDate')}</dt>
-                <dd className="font-mono">{eng.end_date ?? '—'}</dd>
+                <dd className="font-mono">{eng.end_date ? formatDate(eng.end_date) : '—'}</dd>
                 <dt className="text-graphite">{t('engagement.detail.schedule.status')}</dt>
                 <dd><StatusBadge status={eng.status} /></dd>
                 <dt className="text-graphite">{t('engagement.detail.schedule.createdAt')}</dt>
-                <dd className="font-mono">{formatDateTime(eng.created_at)}</dd>
+                <dd className="font-mono">{formatDate(eng.created_at)}</dd>
               </dl>
               {canEditEngagements ? (
                 <Link to={`/engagements/${eng.id}/edit`} className="btn-outline shrink-0">

frontend/src/pages/UsersAdminPage.tsx

@@ -1,4 +1,5 @@
 import { Fragment, useState, type FormEvent } from 'react';
+import { formatDate } from '@/lib/format';
 import { useTranslation } from 'react-i18next';
 import { extractApiError } from '@/api/client';
 import type { Role, User } from '@/api/types';
@@ -225,7 +226,7 @@ export function UsersAdminPage(): JSX.Element {
                             disabled={patchMutation.isPending}
                           />
                         </td>
-                        <td className="text-charcoal font-mono">{u.created_at}</td>
+                        <td className="text-charcoal font-mono">{formatDate(u.created_at)}</td>
                         <td className="text-right">
                           <div className="inline-flex gap-sm">
                             <button