richie-education 2.28.0 → 2.28.2-dev23

package/i18n/locales/fr-FR.json

@@ -125,7 +125,7 @@
   },
   "components.ContractStatus.learnerSignedOn": {
     "description": "Label for the date of sign of a training contract by the learner",
-    "message": "Vous avez signé ce contrat de formation. Signée le {date}"
+    "message": "Vous avez signé ce contrat de formation. Signé le {date}"
   },
   "components.ContractStatus.organizationSignedOn": {
     "description": "Label for the date of sign of a training contract by the organization",
@@ -253,7 +253,7 @@
   },
   "components.CourseRunEnrollment.enroll": {
     "description": "CTA for users who can enroll in the course run or could enroll if they logged in.",
-    "message": "S’inscrire maintenant"
+    "message": "Je m'inscris"
   },
   "components.CourseRunEnrollment.enrolled": {
     "description": "Help text for users who see the \"Go to course\" CTA on course run enrollment",
@@ -281,7 +281,7 @@
   },
   "components.CourseRunEnrollment.loginToEnroll": {
     "description": "Helper text in the enroll button for non logged in users",
-    "message": "Connectez-vous pour vous inscrire"
+    "message": "Je me connecte pour m’inscrire"
   },
   "components.CourseRunEnrollment.unenroll": {
     "description": "Help text below the \"Unenroll now\" CTA when an enrollment attempt has already failed.",
@@ -1209,7 +1209,7 @@
   },
   "components.SaleTunnel.loginToPurchase": {
     "description": "Label displayed inside the product's CTA when user is not logged in",
-    "message": "Connectez-vous pour acheter {product}"
+    "message": "Je me connecte pour m’inscrire {product}"
   },
   "components.SaleTunnel.noCourseRunToPurchaseCertificate": {
     "description": "Label displayed below the product's CTA when there is no courseRun",
@@ -1261,7 +1261,7 @@
   },
   "components.SaleTunnelSuccess.successDetailMessage": {
     "description": "Text to remind that order's invoice will be send by email soon",
-    "message": "Vous allez recevoir votre facture par mail dans quelques instants."
+    "message": "Vous allez recevoir votre preuve de paiement par mail dans quelques instants."
   },
   "components.SaleTunnelSuccess.successDetailSignatureMessage": {
     "description": "Text to remind that order needs to be signed",
@@ -1281,7 +1281,7 @@
   },
   "components.SaleTunnelSuccessNotValidated.description": {
     "description": "Text to remind that order's invoice will be send by email soon",
-    "message": "Votre paiement a été accepté mais la validation de votre commande prend plus de temps que prévu, vous pouvez fermer cette fenêtre et revenir plus tard. Vous allez recevoir votre facture par mail dans quelques instants."
+    "message": "Votre paiement a été accepté mais la validation de votre commande prend plus de temps que prévu, vous pouvez fermer cette fenêtre et revenir plus tard. Vous allez recevoir votre preuve de paiement par mail dans quelques instants."
   },
   "components.SaleTunnelSuccessNotValidated.title": {
     "description": "Message to confirm that order has been created",
@@ -1429,7 +1429,7 @@
   },
   "components.SyllabusCourseRun.coursePeriod": {
     "description": "Course date of an opened course run block",
-    "message": "From {startDate} {endDate, select, undefined {} other {to {endDate}}}"
+    "message": "Du {startDate} {endDate, select, undefined {} other {au {endDate}}}"
   },
   "components.SyllabusCourseRun.enrollment": {
     "description": "Title of the enrollment dates section of an opened course run block",
@@ -1437,7 +1437,7 @@
   },
   "components.SyllabusCourseRun.enrollmentPeriod": {
     "description": "Enrollment date of an opened course run block",
-    "message": "From {startDate} {endDate, select, undefined {} other {to {endDate}}}"
+    "message": "Du {startDate} {endDate, select, undefined {} other {au {endDate}}}"
   },
   "components.SyllabusCourseRun.languages": {
     "description": "Title of the languages section of an opened course run block",
@@ -2025,7 +2025,7 @@
   },
   "utils.ContractHelper.learnerSigned": {
     "description": "Label for signed contract status in learner point of view",
-    "message": "Signée"
+    "message": "Signé"
   },
   "utils.ContractHelper.learnerUnsigned": {
     "description": "Label for unsigned contract status in learner point of view",
@@ -2037,7 +2037,7 @@
   },
   "utils.ContractHelper.organizationSigned": {
     "description": "Label for signed contract status in organization point of view",
-    "message": "Signée"
+    "message": "Signé"
   },
   "utils.ContractHelper.organizationUnsigned": {
     "description": "Label for unsigned contract status in organization point of view",

package/js/components/AddressesManagement/AddressForm/validationSchema.spec.ts

@@ -15,7 +15,7 @@ describe('validationSchema', () => {
       first_name: faker.person.firstName(),
       last_name: faker.person.lastName(),
       postcode: faker.location.zipCode(),
-      title: faker.lorem.word(),
+      title: faker.lorem.word({ length: { min: 2, max: 15 } }),
       save: false,
     };
 
@@ -130,7 +130,7 @@ describe('validationSchema', () => {
       result.current.setValue('first_name', faker.person.firstName());
       result.current.setValue('last_name', faker.person.lastName());
       result.current.setValue('postcode', faker.location.zipCode());
-      result.current.setValue('title', faker.lorem.word());
+      result.current.setValue('title', faker.lorem.word({ length: { min: 2, max: 15 } }));
       result.current.trigger();
     });
 

package/js/components/PaymentInterfaces/LyraPopIn.tsx

@@ -25,11 +25,13 @@ const LyraPopIn = ({
   const intl = useIntl();
   const shouldAbort = useRef<Boolean>(true);
 
-  const handleError = (error?: Error) => {
-    if (error) handle(`[LyraPopIn] - ${error}`);
+  const handleError = (error?: Error | string) => {
+    if (error && typeof error === 'string') handle(`[LyraPopIn] - ${error}`);
 
     if (shouldAbort.current) {
       onError(PaymentErrorMessageId.ERROR_ABORTING);
+    } else if (typeof error === 'string') {
+      onError(error);
     } else {
       onError(PaymentErrorMessageId.ERROR_DEFAULT);
     }
@@ -95,8 +97,13 @@ const LyraPopIn = ({
       // Do not close the pop-in if the error is a invalid data error (CLIENT_3XX).
       // https://docs.lyra.com/fr/rest/V4.0/javascript/features/js_error_management.html#client004
       if (!error.errorCode.startsWith('CLIENT_3')) {
+        shouldAbort.current = false;
         await KR.closePopin(formId);
-        handleError();
+        let errorMessages = error.errorMessage;
+        if (error.detailedErrorMessage) {
+          errorMessages += `: ${error.detailedErrorMessage}`;
+        }
+        handleError(errorMessages);
       }
     };
 

package/js/components/PaymentInterfaces/types.ts

@@ -42,5 +42,5 @@ export type Payment = DummyPayment | PayplugPayment | LyraPayment;
 
 export type PaymentInterfaceProps<P extends Payment = Payment> = P & {
   onSuccess: () => void;
-  onError: (messageId: PaymentErrorMessageId) => void;
+  onError: (messageId: string | PaymentErrorMessageId) => void;
 };

package/js/components/PurchaseButton/index.spec.tsx

@@ -6,12 +6,12 @@ import userEvent from '@testing-library/user-event';
 import { CunninghamProvider } from '@openfun/cunningham-react';
 import {
   CourseStateFactory,
+  PacedCourseFactory,
   UserFactory,
   RichieContextFactory as mockRichieContextFactory,
 } from 'utils/test/factories/richie';
 import {
   CertificateProductFactory,
-  CourseLightFactory,
   EnrollmentFactory,
   ProductFactory,
 } from 'utils/test/factories/joanie';
@@ -89,7 +89,7 @@ describe('PurchaseButton', () => {
         <PurchaseButton
           product={product}
           disabled={false}
-          course={CourseLightFactory({ code: '00000' }).one()}
+          course={PacedCourseFactory({ code: '00000' }).one()}
         />
       </Wrapper>,
     );
@@ -112,7 +112,7 @@ describe('PurchaseButton', () => {
         <PurchaseButton
           product={product}
           disabled={false}
-          course={CourseLightFactory({ code: courseCode }).one()}
+          course={PacedCourseFactory({ code: courseCode }).one()}
         />
       </Wrapper>,
     );
@@ -146,7 +146,7 @@ describe('PurchaseButton', () => {
         <PurchaseButton
           product={product}
           disabled={false}
-          course={CourseLightFactory({ code: courseCode }).one()}
+          course={PacedCourseFactory({ code: courseCode }).one()}
         />
       </Wrapper>,
     );
@@ -181,7 +181,7 @@ describe('PurchaseButton', () => {
         <PurchaseButton
           product={product}
           disabled={false}
-          course={CourseLightFactory({ code: courseCode }).one()}
+          course={PacedCourseFactory({ code: courseCode }).one()}
         />
       </Wrapper>,
     );
@@ -214,7 +214,7 @@ describe('PurchaseButton', () => {
         <PurchaseButton
           product={product}
           disabled={false}
-          course={CourseLightFactory({ code: courseCode }).one()}
+          course={PacedCourseFactory({ code: courseCode }).one()}
         />
       </Wrapper>,
     );
@@ -251,7 +251,7 @@ describe('PurchaseButton', () => {
           <PurchaseButton
             product={product}
             disabled={false}
-            course={CourseLightFactory({ code: courseCode }).one()}
+            course={PacedCourseFactory({ code: courseCode }).one()}
           />
         </Wrapper>,
       );
@@ -384,7 +384,7 @@ describe('PurchaseButton', () => {
         <PurchaseButton
           product={product}
           disabled={false}
-          course={CourseLightFactory({ code: courseCode }).one()}
+          course={PacedCourseFactory({ code: courseCode }).one()}
         />
       </Wrapper>,
     );
@@ -414,7 +414,7 @@ describe('PurchaseButton', () => {
         <PurchaseButton
           product={product}
           disabled={true}
-          course={CourseLightFactory({ code: courseCode }).one()}
+          course={PacedCourseFactory({ code: courseCode }).one()}
         />
       </Wrapper>,
     );

package/js/components/PurchaseButton/index.tsx

@@ -7,6 +7,7 @@ import * as Joanie from 'types/Joanie';
 import { isOpenedCourseRunCertificate, isOpenedCourseRunCredential } from 'utils/CourseRuns';
 import { SaleTunnel, SaleTunnelProps } from 'components/SaleTunnel';
 import { Organization } from 'types/Joanie';
+import { PacedCourse } from 'types';
 
 const messages = defineMessages({
   loginToPurchase: {
@@ -52,7 +53,7 @@ interface PurchaseButtonPropsBase {
 
 interface CredentialPurchaseButtonProps extends PurchaseButtonPropsBase {
   product: Joanie.CredentialProduct;
-  course: Joanie.CourseLight;
+  course: PacedCourse;
   enrollment?: undefined;
 }
 

package/js/components/SaleTunnel/GenericPaymentButton/index.tsx

@@ -97,7 +97,7 @@ export const GenericPaymentButton = ({ buildOrderPayload }: Props) => {
   const { methods: orderMethods } = useOrders(undefined, { enabled: false });
   const [payment, setPayment] = useState<PaymentInfo>();
   const [state, setState] = useState<ComponentStates>(ComponentStates.IDLE);
-  const [error, setError] = useState<PaymentErrorMessageId>();
+  const [error, setError] = useState<PaymentErrorMessageId | string>();
   const hasPaymentId = (p: Maybe<Payment>): p is Extract<Payment, PaymentWithId> => {
     return Boolean(p?.hasOwnProperty('payment_id'));
   };
@@ -256,7 +256,9 @@ export const GenericPaymentButton = ({ buildOrderPayload }: Props) => {
     checkOrderValidity();
   };
 
-  const handleError = (messageId: PaymentErrorMessageId = PaymentErrorMessageId.ERROR_DEFAULT) => {
+  const handleError = (
+    messageId: PaymentErrorMessageId | string = PaymentErrorMessageId.ERROR_DEFAULT,
+  ) => {
     setState(ComponentStates.ERROR);
     setError(messageId);
   };
@@ -274,6 +276,8 @@ export const GenericPaymentButton = ({ buildOrderPayload }: Props) => {
         .catch(() => {
           handleError();
         });
+    } else if (error && !messages.hasOwnProperty(error)) {
+      orderMethods.invalidate();
     } else if (state === ComponentStates.ERROR) {
       setPayment(undefined);
     }
@@ -320,7 +324,13 @@ export const GenericPaymentButton = ({ buildOrderPayload }: Props) => {
       )}
       {state === ComponentStates.ERROR && (
         <p className="payment-button__error" id="sale-tunnel-payment-error" tabIndex={-1}>
-          <FormattedMessage {...messages[error || PaymentErrorMessageId.ERROR_DEFAULT]} />
+          {!error || messages.hasOwnProperty(error) ? (
+            <FormattedMessage
+              {...messages[(error as PaymentErrorMessageId) || PaymentErrorMessageId.ERROR_DEFAULT]}
+            />
+          ) : (
+            error
+          )}
         </p>
       )}
     </>

package/js/components/SaleTunnel/hooks/useTerms.tsx

@@ -29,8 +29,8 @@ export const useTerms = ({
   error,
 }: {
   product: Product;
-  onError: (error: PaymentErrorMessageId) => void;
-  error?: PaymentErrorMessageId;
+  onError: (error: PaymentErrorMessageId | string) => void;
+  error?: PaymentErrorMessageId | string;
 }) => {
   const intl = useIntl();
   const [termsAccepted, setTermsAccepted] = useState(false);

package/js/components/SaleTunnel/index.credential.spec.tsx

@@ -2,12 +2,12 @@ import fetchMock from 'fetch-mock';
 import { act, fireEvent, screen, waitFor } from '@testing-library/react';
 import {
   RichieContextFactory as mockRichieContextFactory,
+  PacedCourseFactory,
   UserFactory,
 } from 'utils/test/factories/richie';
 import { setupJoanieSession } from 'utils/test/wrappers/JoanieAppWrapper';
 import {
   AddressFactory,
-  CourseFactory,
   CredentialOrderWithPaymentFactory,
   CredentialProductFactory,
   OrderGroupFactory,
@@ -86,7 +86,7 @@ describe('SaleTunnel / Credential', () => {
   });
 
   it('should create an order with an order group', async () => {
-    const course = CourseFactory().one();
+    const course = PacedCourseFactory().one();
     const product = CredentialProductFactory().one();
     const orderGroup = OrderGroupFactory().one();
     const billingAddress: Joanie.Address = AddressFactory({ is_main: true }).one();

package/js/components/SaleTunnel/index.full-process.spec.tsx

@@ -5,6 +5,7 @@ import userEvent from '@testing-library/user-event';
 import countries from 'i18n-iso-countries';
 import {
   RichieContextFactory as mockRichieContextFactory,
+  PacedCourseFactory,
   UserFactory,
 } from 'utils/test/factories/richie';
 import { render } from 'utils/test/render';
@@ -12,8 +13,8 @@ import { setupJoanieSession } from 'utils/test/wrappers/JoanieAppWrapper';
 import CourseProductItem from 'widgets/SyllabusCourseRunsList/components/CourseProductItem';
 import {
   AddressFactory,
-  CourseProductRelationFactory,
   CredentialOrderWithPaymentFactory,
+  CourseProductRelationFactory,
 } from 'utils/test/factories/joanie';
 import { ACTIVE_ORDER_STATES, CourseRun } from 'types/Joanie';
 import { Priority } from 'types';
@@ -101,9 +102,15 @@ describe('SaleTunnel', () => {
       [],
     );
 
-    render(<CourseProductItem productId={product.id} course={course} />, {
-      queryOptions: { client: createTestQueryClient({ user: richieUser }) },
-    });
+    render(
+      <CourseProductItem
+        productId={product.id}
+        course={PacedCourseFactory({ id: course.id, code: course.code }).one()}
+      />,
+      {
+        queryOptions: { client: createTestQueryClient({ user: richieUser }) },
+      },
+    );
 
     // Wait for product information to be fetched
     await screen.findByRole('heading', { level: 3, name: product.title });

package/js/components/SaleTunnel/index.spec.tsx

@@ -8,7 +8,6 @@ import {
   CertificateOrderWithOneClickPaymentFactory,
   CertificateOrderWithPaymentFactory,
   CertificateProductFactory,
-  CourseFactory,
   CredentialOrderWithOneClickPaymentFactory,
   CredentialOrderWithPaymentFactory,
   CredentialProductFactory,
@@ -17,6 +16,7 @@ import {
 } from 'utils/test/factories/joanie';
 import {
   RichieContextFactory as mockRichieContextFactory,
+  PacedCourseFactory,
   UserFactory,
 } from 'utils/test/factories/richie';
 import { render } from 'utils/test/render';
@@ -70,7 +70,7 @@ describe.each([
   ({ productType, ProductFactory, OrderWithOneClickPaymentFactory, OrderWithPaymentFactory }) => {
     let nbApiCalls: number;
 
-    const course = CourseFactory().one();
+    const course = PacedCourseFactory().one();
     const enrollment =
       productType === ProductType.CERTIFICATE ? EnrollmentFactory().one() : undefined;
 

package/js/components/SaleTunnel/index.stories.tsx

@@ -1,6 +1,7 @@
 import { StoryObj, Meta } from '@storybook/react';
 import { BaseJoanieAppWrapper } from 'utils/test/wrappers/BaseJoanieAppWrapper';
-import { CourseFactory, ProductFactory } from 'utils/test/factories/joanie';
+import { ProductFactory } from 'utils/test/factories/joanie';
+import { PacedCourseFactory } from 'utils/test/factories/richie';
 import { SaleTunnel, SaleTunnelProps } from './index';
 
 export default {
@@ -10,7 +11,7 @@ export default {
       isOpen: true,
       product: ProductFactory().one(),
       onClose: () => {},
-      course: CourseFactory().one(),
+      course: PacedCourseFactory().one(),
       // enrollment?: Enrollment;
       // product: CredentialProduct | CertificateProduct;
       // orderGroup?: OrderGroup;

package/js/components/SaleTunnel/index.tsx

@@ -1,7 +1,6 @@
 import { ModalProps } from '@openfun/cunningham-react';
 import {
   CertificateProduct,
-  CourseLight,
   CredentialProduct,
   Enrollment,
   Order,
@@ -12,12 +11,13 @@ import {
 } from 'types/Joanie';
 import { CredentialSaleTunnel } from 'components/SaleTunnel/CredentialSaleTunnel';
 import { CertificateSaleTunnel } from 'components/SaleTunnel/CertificateSaleTunnel';
+import { PacedCourse } from 'types';
 
 export interface SaleTunnelProps extends Pick<ModalProps, 'isOpen' | 'onClose'> {
   product: Product;
   organizations?: Organization[];
 
-  course?: CourseLight;
+  course?: PacedCourse;
   enrollment?: Enrollment;
   orderGroup?: OrderGroup;
   onFinish?: (order: Order) => void;