toDisplayedDate with object params, showGMT, tests

gip-inclusion · Jan 31, 2024 · 4b01fc2 · 4b01fc2
1 parent a49714f
commit 4b01fc2
Show file tree

Hide file tree

Showing 9 changed files with 124 additions and 51 deletions.
diff --git a/front/src/app/components/forms/immersion-assessment/ImmersionDescription.tsx b/front/src/app/components/forms/immersion-assessment/ImmersionDescription.tsx
@@ -8,8 +8,8 @@ export const ImmersionDescription = ({
 }): JSX.Element => {
   const beneficiary = convention.signatories.beneficiary;
   const beneficiaryName = `${beneficiary.firstName} ${beneficiary.lastName}`;
-  const dateStart = toDisplayedDate(new Date(convention.dateStart));
-  const dateEnd = toDisplayedDate(new Date(convention.dateEnd));
+  const dateStart = toDisplayedDate({ date: new Date(convention.dateStart) });
+  const dateEnd = toDisplayedDate({ date: new Date(convention.dateEnd) });
   return (
     <p>
       {convention.internshipKind === "immersion"

diff --git a/front/src/app/contents/admin/conventionValidation.tsx b/front/src/app/contents/admin/conventionValidation.tsx
@@ -11,7 +11,7 @@ import {
 import { ColField, FieldsAndTitle } from "./types";
 
 export const signToBooleanDisplay = (value: string | undefined) =>
-  value ? `✅ (${toDisplayedDate(new Date(value))})` : "❌";
+  value ? `✅ (${toDisplayedDate({ date: new Date(value) })})` : "❌";
 
 const booleanToCheck = (value: boolean) => (value ? "✅" : "❌");
 
@@ -77,9 +77,9 @@ const beneficiaryFields: ColField[] = [
       <span>
         <div className={fr.cx("fr-text--xs")}>
           Date de naissance :{" "}
-          {toDisplayedDate(
-            new Date(convention.signatories.beneficiary.birthdate),
-          )}
+          {toDisplayedDate({
+            date: new Date(convention.signatories.beneficiary.birthdate),
+          })}
         </div>
         <div className={fr.cx("fr-text--xs")}>
           Contact d'urgence :{" "}
@@ -283,15 +283,16 @@ const agencyFields: ColField[] = [
       })
         .with(
           { agencyRefersTo: P.not(P.nullish), dateApproval: P.not(P.nullish) },
-          ({ dateApproval }) => toDisplayedDate(new Date(dateApproval)),
+          ({ dateApproval }) =>
+            toDisplayedDate({ date: new Date(dateApproval) }),
         )
         .with(
           { agencyRefersTo: P.not(P.nullish), dateApproval: undefined },
           () => "",
         )
         .with({ dateValidation: undefined }, () => "")
         .with({ dateValidation: P.string }, ({ dateValidation }) =>
-          toDisplayedDate(new Date(dateValidation)),
+          toDisplayedDate({ date: new Date(dateValidation) }),
         )
         .exhaustive(),
   },
@@ -307,7 +308,7 @@ const agencyRefersToFields: ColField[] = [
     colLabel: "Date de validation",
     getValue: (convention) =>
       convention.dateValidation && convention.agencyRefersTo?.id
-        ? toDisplayedDate(new Date(convention.dateValidation))
+        ? toDisplayedDate({ date: new Date(convention.dateValidation) })
         : "",
   },
 ];
@@ -317,17 +318,19 @@ const immersionPlaceDateFields: ColField[] = [
     key: "dateSubmission",
     colLabel: "Date de soumission",
     getValue: (convention) =>
-      toDisplayedDate(new Date(convention.dateSubmission)),
+      toDisplayedDate({ date: new Date(convention.dateSubmission) }),
   },
   {
     key: "dateStart",
     colLabel: "Début",
-    getValue: (convention) => toDisplayedDate(new Date(convention.dateStart)),
+    getValue: (convention) =>
+      toDisplayedDate({ date: new Date(convention.dateStart) }),
   },
   {
     key: "dateEnd",
     colLabel: "Fin",
-    getValue: (convention) => toDisplayedDate(new Date(convention.dateEnd)),
+    getValue: (convention) =>
+      toDisplayedDate({ date: new Date(convention.dateEnd) }),
   },
   {
     key: "immersionAddress",

diff --git a/front/src/app/pages/admin/TechnicalOptionsSections/ApiConsumersSection.tsx b/front/src/app/pages/admin/TechnicalOptionsSections/ApiConsumersSection.tsx
@@ -96,7 +96,10 @@ export const ApiConsumersSection = () => {
   const tableDataFromApiConsumers = sortedApiConsumers.map((apiConsumer) => [
     formatApiConsumerName(apiConsumer.id, apiConsumer.consumer),
     formatApiConsumerDescription(apiConsumer.description),
-    toDisplayedDate(new Date(apiConsumer.expirationDate), true),
+    toDisplayedDate({
+      date: new Date(apiConsumer.expirationDate),
+      withHours: true,
+    }),
     formatApiConsumerContact(apiConsumer.contact),
     formatApiConsumerRights(apiConsumer.rights),
     makeApiConsumerActionButtons(apiConsumer, onEditButtonClick),

diff --git a/front/src/app/pages/admin/TechnicalOptionsTab.tsx b/front/src/app/pages/admin/TechnicalOptionsTab.tsx
@@ -11,7 +11,6 @@ import { apiConsumerSelectors } from "src/core-logic/domain/apiConsumer/apiConsu
 export const TechnicalOptionsTab = () => {
   const { isLoading: isFeatureFlagsLoading } = useFeatureFlags();
   const isApiConsumersLoading = useAppSelector(apiConsumerSelectors.isLoading);
-
   return (
     <>
       {(isFeatureFlagsLoading || isApiConsumersLoading) && <Loader />}

diff --git a/front/src/app/pages/convention/ConventionDocumentPage.tsx b/front/src/app/pages/convention/ConventionDocumentPage.tsx
@@ -211,7 +211,7 @@ export const ConventionDocumentPage = ({
               né(e) le{" "}
               <strong>
                 {isStringDate(beneficiary.birthdate)
-                  ? toDisplayedDate(new Date(beneficiary.birthdate))
+                  ? toDisplayedDate({ date: new Date(beneficiary.birthdate) })
                   : "Date invalide"}
               </strong>{" "}
               en qualité de <strong>bénéficiaire</strong> {""}
@@ -376,8 +376,9 @@ export const ConventionDocumentPage = ({
           </p>
           <p className={fr.cx("fr-text--bold")}>
             {internshipKind === "immersion" ? "L'immersion" : "Le mini-stage"}{" "}
-            se déroulera du {toDisplayedDate(new Date(convention.dateStart))} au{" "}
-            {toDisplayedDate(new Date(convention.dateEnd))}.
+            se déroulera du{" "}
+            {toDisplayedDate({ date: new Date(convention.dateStart) })} au{" "}
+            {toDisplayedDate({ date: new Date(convention.dateEnd) })}.
           </p>
           <div>
             Les horaires{" "}
@@ -470,9 +471,11 @@ export const ConventionDocumentPage = ({
                   {beneficiary.firstName} {beneficiary.lastName}
                 </strong>{" "}
                 (signé le{" "}
-                {toDisplayedDate(
-                  new Date(throwOnMissingSignDate(beneficiary.signedAt)),
-                )}
+                {toDisplayedDate({
+                  date: new Date(throwOnMissingSignDate(beneficiary.signedAt)),
+                  withHours: true,
+                  showGMT: true,
+                })}
                 )
               </li>
               {beneficiaryRepresentative && (
@@ -481,15 +484,17 @@ export const ConventionDocumentPage = ({
                   <strong>
                     {beneficiaryRepresentative.firstName}{" "}
                     {beneficiaryRepresentative.lastName}
-                  </strong>
+                  </strong>{" "}
                   (signé le{" "}
-                  {toDisplayedDate(
-                    new Date(
+                  {toDisplayedDate({
+                    date: new Date(
                       throwOnMissingSignDate(
                         beneficiaryRepresentative.signedAt,
                       ),
                     ),
-                  )}
+                    withHours: true,
+                    showGMT: true,
+                  })}
                   )
                 </li>
               )}
@@ -500,15 +505,17 @@ export const ConventionDocumentPage = ({
                   <strong>
                     {beneficiaryCurrentEmployer.firstName}{" "}
                     {beneficiaryCurrentEmployer.lastName}
-                  </strong>
+                  </strong>{" "}
                   (signé le{" "}
-                  {toDisplayedDate(
-                    new Date(
+                  {toDisplayedDate({
+                    date: new Date(
                       throwOnMissingSignDate(
                         beneficiaryCurrentEmployer.signedAt,
                       ),
                     ),
-                  )}
+                    withHours: true,
+                    showGMT: true,
+                  })}
                   )
                 </li>
               )}
@@ -519,13 +526,15 @@ export const ConventionDocumentPage = ({
                   {establishmentRepresentative.lastName}
                 </strong>{" "}
                 (signé le{" "}
-                {toDisplayedDate(
-                  new Date(
+                {toDisplayedDate({
+                  date: new Date(
                     throwOnMissingSignDate(
                       establishmentRepresentative.signedAt,
                     ),
                   ),
-                )}
+                  withHours: true,
+                  showGMT: true,
+                })}
                 )
               </li>
               {!convention.agencyRefersTo && (
@@ -535,9 +544,13 @@ export const ConventionDocumentPage = ({
                     ? "de l'immersion"
                     : "du mini-stage"}
                   , <strong>{convention.agencyName}</strong> (validée le{" "}
-                  {toDisplayedDate(
-                    new Date(throwOnMissingSignDate(convention.dateValidation)),
-                  )}
+                  {toDisplayedDate({
+                    date: new Date(
+                      throwOnMissingSignDate(convention.dateValidation),
+                    ),
+                    withHours: true,
+                    showGMT: true,
+                  })}
                   )
                 </li>
               )}
@@ -550,11 +563,13 @@ export const ConventionDocumentPage = ({
                       : "du mini-stage"}
                     , <strong>{convention.agencyRefersTo.name}</strong> (validée
                     le{" "}
-                    {toDisplayedDate(
-                      new Date(
+                    {toDisplayedDate({
+                      date: new Date(
                         throwOnMissingSignDate(convention.dateValidation),
                       ),
-                    )}
+                      withHours: true,
+                      showGMT: true,
+                    })}
                     ).
                   </li>
                   <li>

diff --git a/shared/jest.config.js b/shared/jest.config.js
@@ -0,0 +1,5 @@
+process.env.TZ = "Europe/Paris";
+
+module.exports = {
+  testEnvironment: "node",
+};
diff --git a/shared/src/email/emailTemplatesByName.ts b/shared/src/email/emailTemplatesByName.ts
@@ -288,7 +288,11 @@ export const emailTemplatesByName =
           : "la convention de mini stage "
       } le ${
           isStringDate(signedAt)
-            ? toDisplayedDate(new Date(signedAt), true)
+            ? toDisplayedDate({
+                date: new Date(signedAt),
+                withHours: true,
+                showGMT: true,
+              })
             : "DATE INVALIDE"
         }.
       `,
@@ -635,7 +639,7 @@ export const emailTemplatesByName =
 
       La demande faite par ${beneficiaryFirstName} ${beneficiaryLastName} (né le ${
           isStringDate(beneficiaryBirthdate)
-            ? toDisplayedDate(new Date(beneficiaryBirthdate))
+            ? toDisplayedDate({ date: new Date(beneficiaryBirthdate) })
             : "Date invalide"
         }) pour réaliser une immersion du ${dateStart} au ${dateEnd}, au sein de ${businessName} et encadrée par ${establishmentTutorName} a été validée${
           validatorName ? ` par ${validatorName} ` : " "
@@ -852,11 +856,11 @@ export const emailTemplatesByName =
           : "de mini stage"
       } de ${beneficiaryFirstName} ${beneficiaryLastName} dans l'entreprise ${businessName}, qui devait se dérouler du ${
           isStringDate(dateStart)
-            ? toDisplayedDate(new Date(dateStart), true)
+            ? toDisplayedDate({ date: new Date(dateStart), withHours: true })
             : "DATE INVALIDE"
         } au ${
           isStringDate(dateEnd)
-            ? toDisplayedDate(new Date(dateEnd), true)
+            ? toDisplayedDate({ date: new Date(dateEnd), withHours: true })
             : "DATE INVALIDE"
         } a été annulée par ${agencyName}.
       
@@ -906,11 +910,14 @@ export const emailTemplatesByName =
             : "un mini stage"
         } du ${
           isStringDate(dateStart)
-            ? toDisplayedDate(new Date(dateStart), true)
+            ? toDisplayedDate({
+                date: new Date(dateStart),
+                withHours: true,
+              })
             : "DATE INVALIDE"
         } au ${
           isStringDate(dateEnd)
-            ? toDisplayedDate(new Date(dateEnd), true)
+            ? toDisplayedDate({ date: new Date(dateEnd), withHours: true })
             : "DATE INVALIDE"
         } dans l'entreprise ${businessName} est supprimée.
       
@@ -1083,11 +1090,17 @@ export const emailTemplatesByName =
           } : ${immersionObjective}</li>
           <li>Le bénéficiaire était bien présent aux dates prévues sur la convention, du ${
             isStringDate(dateStart)
-              ? toDisplayedDate(new Date(dateStart), true)
+              ? toDisplayedDate({
+                  date: new Date(dateStart),
+                  withHours: true,
+                })
               : "DATE INVALIDE"
           } au ${
           isStringDate(dateEnd)
-            ? toDisplayedDate(new Date(dateEnd), true)
+            ? toDisplayedDate({
+                date: new Date(dateEnd),
+                withHours: true,
+              })
             : "DATE INVALIDE"
         } : ${assessmentStatus === "FINISHED" ? "oui" : "non"}</li>
           <li>Retour de l'entreprise : ${establishmentFeedback}</li>

diff --git a/shared/src/utils/date.ts b/shared/src/utils/date.ts
@@ -13,7 +13,15 @@ export const timeHHmmRegExp = /^(0[0-9]|1[0-9]|2[0-3]):[0-5][0-9]$/;
 
 export const toDateString = (date: Date): string => format(date, "yyyy-MM-dd");
 
-export const toDisplayedDate = (date: Date, withHours = false): string =>
-  format(date, withHours ? "dd/MM/yyyy 'à' HH'h'mm" : "dd/MM/yyyy");
+export const toDisplayedDate = ({
+  date,
+  withHours = false,
+  showGMT,
+}:
+  | { date: Date; withHours?: false; showGMT?: false }
+  | { date: Date; withHours?: true; showGMT?: boolean }): string =>
+  `${format(date, withHours ? "dd/MM/yyyy 'à' HH'h'mm" : "dd/MM/yyyy")}${
+    showGMT ? " (heure de Paris GMT+1)" : ""
+  }`;
 
 export const isStringDate = (string: string) => isValid(new Date(string));
diff --git a/shared/src/utils/date.unit.test.ts b/shared/src/utils/date.unit.test.ts
@@ -1,13 +1,40 @@
-import { toDateString } from "./date";
+import { parseISO } from "date-fns";
+import { toDateString, toDisplayedDate } from "./date";
 
-describe("Date utils tests", () => {
+describe("Date utils tests - toDateString", () => {
   it("should format a valid date", () => {
-    const date = new Date("2021-01-01");
+    const date = parseISO("2021-01-01");
     expect(toDateString(date)).toBe("2021-01-01");
   });
 
   it("can't format an empty string", () => {
-    const date = new Date("");
+    const date = parseISO("");
     expect(() => toDateString(date)).toThrow("Invalid time value");
   });
 });
+
+describe("Date utils tests - toDisplayedDate", () => {
+  it("should format a valid date", () => {
+    const date = parseISO("2024-01-29 11:36:50.274+00");
+    expect(toDisplayedDate({ date })).toBe("29/01/2024");
+  });
+
+  it("should format a valid date with hours", () => {
+    const date = parseISO("2024-01-29 11:36:50.274+00");
+    expect(toDisplayedDate({ date, withHours: true })).toBe(
+      "29/01/2024 à 12h36",
+    );
+  });
+
+  it("should format a valid date with hours (with GMT mention)", () => {
+    const date = parseISO("2024-01-29 11:36:50.274+00");
+    expect(toDisplayedDate({ date, withHours: true, showGMT: true })).toBe(
+      "29/01/2024 à 12h36 (heure de Paris GMT+1)",
+    );
+  });
+
+  it("can't format an empty string", () => {
+    const date = new Date("");
+    expect(() => toDisplayedDate({ date })).toThrow("Invalid time value");
+  });
+});