wip storybook component

front/src/app/components/admin/conventions/ConventionValidation.tsx

@@ -2,8 +2,15 @@ import { Badge } from "@codegouvfr/react-dsfr/Badge";
 import { formatDistance } from "date-fns";
 import { fr } from "date-fns/locale";
 import React from "react";
-import type { ConventionReadDto, ConventionStatus } from "shared";
-import { ConventionValidationDetails } from "./ConventionValidationDetails";
+import { ConventionRenewedInformations } from "react-design-system";
+import { ConventionSummary } from "react-design-system/src/immersionFacile/components/convention-summary";
+import {
+  ConventionReadDto,
+  ConventionStatus,
+  isConventionRenewed,
+  toDisplayedDate,
+} from "shared";
+import { makeConventionSections } from "../../../contents/convention/conventionSummary.helpers";
 
 const beforeAfterString = (date: string) => {
   const eventDate = new Date(date);
@@ -86,7 +93,16 @@ export const ConventionValidation = ({
       {convention.statusJustification && (
         <p>Justification : {convention.statusJustification}</p>
       )}
-      <ConventionValidationDetails convention={convention} />
+      {isConventionRenewed(convention) && (
+        <ConventionRenewedInformations renewed={convention.renewed} />
+      )}
+      <ConventionSummary
+        submittedAt={toDisplayedDate({
+          date: new Date(convention.dateSubmission),
+        })}
+        summary={makeConventionSections(convention)}
+        conventionId={convention.id}
+      />
     </>
   );
 };

front/src/app/components/forms/convention/ConventionFormWrapper.tsx

@@ -4,6 +4,7 @@ import { ButtonsGroup } from "@codegouvfr/react-dsfr/ButtonsGroup";
 import { createModal } from "@codegouvfr/react-dsfr/Modal";
 import React, { useEffect } from "react";
 import { Loader } from "react-design-system";
+import { ConventionSummary } from "react-design-system/src/immersionFacile/components/convention-summary";
 import { createPortal } from "react-dom";
 import { useDispatch } from "react-redux";
 import {
@@ -12,11 +13,11 @@ import {
   InternshipKind,
   decodeMagicLinkJwtWithoutSignatureCheck,
   domElementIds,
+  toDisplayedDate,
 } from "shared";
-import { ConventionValidationSection } from "src/app/components/admin/conventions/ConventionValidationDetails";
 import { ConventionFeedbackNotification } from "src/app/components/forms/convention/ConventionFeedbackNotification";
 import { ConventionForm } from "src/app/components/forms/convention/ConventionForm";
-import { sections } from "src/app/contents/admin/conventionValidation";
+import { makeConventionSections } from "src/app/contents/convention/conventionSummary.helpers";
 import { useAppSelector } from "src/app/hooks/reduxHooks";
 import { useScrollToTop } from "src/app/hooks/window.hooks";
 import { type ConventionImmersionPageRoute } from "src/app/pages/convention/ConventionImmersionPage";
@@ -202,15 +203,14 @@ const ConventionSummarySection = () => {
         //TODO il y a déjà un LOADER dans le composant parent. Nécéssaire?
         isLoading && <Loader />
       }
-      {convention &&
-        sections.map((list, index) => (
-          <ConventionValidationSection
-            // biome-ignore lint/suspicious/noArrayIndexKey: Index is ok here
-            key={index}
-            convention={convention}
-            list={list}
-          />
-        ))}
+      {convention && (
+        <ConventionSummary
+          submittedAt={toDisplayedDate({
+            date: new Date(convention.dateSubmission),
+          })}
+          summary={makeConventionSections(convention)}
+        />
+      )}
       {convention && (
         <ConventionFeedbackNotification
           submitFeedback={submitFeedback}