chore(ui): utilise le composant react-dsfr

#1618 (closed)

Meilleur typage, des fonctions utilitaires vraiment pratiques, trop bien !

https://github.com/codegouvfr/react-dsfr/issues/368

packages/ui/src/components/_ui/table-auto.tsx

@@ -11,7 +11,7 @@ export interface Column<T = string> {
 }
 
 interface Props {
-  caption: string
+  caption: { value: string; visible: boolean }
   rows: TableRow[]
   columns: readonly Column[]
   initialSort: InitialSort | 'noSort' | 'firstColumnAsc'
@@ -96,12 +96,12 @@ export const TableAuto = defineComponent<Props>(props => {
 
   return () => (
     <div style={{ overflowX: 'auto' }}>
-      <div class={[fr.cx('fr-table'), fr.cx('fr-table--no-scroll')]}>
+      <div class={[fr.cx('fr-table'), fr.cx('fr-table--no-scroll'), props.caption.visible ? null : fr.cx('fr-table--no-caption')]}>
         <div class={[fr.cx('fr-table__wrapper')]} style={{ width: 'auto' }}>
           <div class={[fr.cx('fr-table__container')]}>
             <div class={[fr.cx('fr-table__content')]}>
               <table style={{ display: 'table', width: '100%' }}>
-                <caption>{props.caption}</caption>
+                <caption>{props.caption.value}</caption>
                 <thead>
                   <tr>
                     {props.columns.map(col => (