richie-education 3.2.2-dev58 → 3.2.2-dev60

package/js/components/OpenEdxFullNameForm/index.tsx

@@ -134,7 +134,10 @@ const OpenEdxFullNameForm = () => {
   return (
     <FormProvider {...form}>
       <Form name="openedx-fullname-form" noValidate>
-        <Alert type={formState.errors.name?.message ? VariantType.ERROR : VariantType.WARNING}>
+        <Alert
+          className="mt-s"
+          type={formState.errors.name?.message ? VariantType.ERROR : VariantType.WARNING}
+        >
           <FormattedMessage {...messages.fullNameInputDescription} />
         </Alert>
         <Input

package/js/components/SaleTunnel/SaleTunnelInformation/SaleTunnelInformationSingular.tsx

@@ -112,6 +112,16 @@ const messages = defineMessages({
     description: 'Discount description',
     defaultMessage: 'Discount applied',
   },
+  noPaymentSchedule: {
+    id: 'components.SaleTunnel.Information.noPaymentSchedule',
+    description: 'Message displayed representing the payment schedule when the order is free.',
+    defaultMessage: 'No payment required. This order is fully covered.',
+  },
+  noBillingInformation: {
+    id: 'components.SaleTunnel.Information.noBillingInformation',
+    description: 'Message displayed when the order is part of a batch order',
+    defaultMessage: 'No billing information required. This order is covered by your organization.',
+  },
 });
 
 export const SaleTunnelInformationSingular = () => {
@@ -162,14 +172,6 @@ export const SaleTunnelInformationSingular = () => {
 
   return (
     <>
-      <div>
-        <Voucher
-          discount={discount}
-          voucherError={voucherError}
-          setVoucherError={setVoucherError}
-        />
-        <Total price={price} discountedPrice={discountedPrice} />
-      </div>
       {needsPayment && (
         <div>
           <h3 className="block-title mb-t">
@@ -178,7 +180,6 @@ export const SaleTunnelInformationSingular = () => {
           <div className="description mb-s">
             <FormattedMessage {...messages.description} />
           </div>
-          <AddressSelector />
           {isKeycloakBackend ? (
             <KeycloakAccountEdit />
           ) : (
@@ -189,10 +190,38 @@ export const SaleTunnelInformationSingular = () => {
               </div>
             </>
           )}
+          <AddressSelector />
+        </div>
+      )}
+      {!needsPayment && (
+        <div>
+          <h3 className="block-title">
+            <FormattedMessage {...messages.title} />
+          </h3>
+          <Alert type={VariantType.NEUTRAL}>
+            <FormattedMessage {...messages.noBillingInformation} />
+          </Alert>
         </div>
       )}
       <div>
-        {showPaymentSchedule && <PaymentScheduleBlock schedule={schedule} />}
+        {showPaymentSchedule ? (
+          <PaymentScheduleBlock schedule={schedule!} />
+        ) : (
+          <div>
+            <h4 className="block-title">
+              <FormattedMessage {...messages.paymentSchedule} />
+            </h4>
+            <Alert type={VariantType.NEUTRAL}>
+              <FormattedMessage {...messages.noPaymentSchedule} />
+            </Alert>
+          </div>
+        )}
+        <Voucher
+          discount={discount}
+          voucherError={voucherError}
+          setVoucherError={setVoucherError}
+        />
+        <Total price={price} discountedPrice={discountedPrice} />
         {needsPayment && <WithdrawRightCheckbox />}
       </div>
     </>

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

@@ -44,11 +44,11 @@ export const SaleTunnelInformation = () => {
   ];
   const [purchaseType, setPurchaseType] = useState(FormType.SINGULAR);
 
+  const isCertificate = productType === ProductType.CERTIFICATE;
+
   return (
     <div className="sale-tunnel__main__column sale-tunnel__information">
-      {productType === ProductType.CERTIFICATE ? (
-        <SaleTunnelInformationSingular />
-      ) : (
+      {!isCertificate && (
         <div>
           <h3 className="block-title mb-t">
             <FormattedMessage {...messages.purchaseTypeTitle} />
@@ -65,10 +65,10 @@ export const SaleTunnelInformation = () => {
               setSchedule(undefined);
             }}
           />
-          {purchaseType === FormType.SINGULAR && <SaleTunnelInformationSingular />}
-          {purchaseType === FormType.GROUP && <SaleTunnelInformationGroup />}
         </div>
       )}
+      {purchaseType === FormType.SINGULAR && <SaleTunnelInformationSingular />}
+      {purchaseType === FormType.GROUP && !isCertificate && <SaleTunnelInformationGroup />}
     </div>
   );
 };

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

@@ -374,7 +374,8 @@ describe('SaleTunnel', () => {
     );
     await user.type(screen.getByLabelText('Voucher code'), 'DISCOUNT100');
     await user.click(screen.getByRole('button', { name: 'Validate' }));
-    expect(screen.queryByRole('heading', { name: 'Payment schedule' })).not.toBeInTheDocument();
+    await screen.findByRole('heading', { level: 4, name: 'Payment schedule' });
+    screen.getByText('No payment required. This order is fully covered.');
     await screen.findByTestId('sale-tunnel__total__amount');
     const $totalAmountVoucher = screen.getByTestId('sale-tunnel__total__amount');
     expect($totalAmountVoucher).toHaveTextContent(

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

@@ -484,7 +484,8 @@ describe.each([
         });
       });
     } else {
-      expect(screen.queryByRole('heading', { level: 4, name: 'Payment schedule' })).toBeNull();
+      await screen.findByRole('heading', { level: 4, name: 'Payment schedule' });
+      screen.getByText('No payment required. This order is fully covered.');
       expect(screen.queryByRole('table')).toBeNull();
     }
 
@@ -623,7 +624,8 @@ describe.each([
         });
       });
     } else {
-      expect(screen.queryByRole('heading', { level: 4, name: 'Payment schedule' })).toBeNull();
+      await screen.findByRole('heading', { level: 4, name: 'Payment schedule' });
+      screen.getByText('No payment required. This order is fully covered.');
       expect(screen.queryByRole('table')).toBeNull();
     }
 
@@ -830,6 +832,16 @@ describe.each([
       ).not.toBeInTheDocument(),
     );
     expect(await screen.queryByTestId('withdraw-right-checkbox')).not.toBeInTheDocument();
+
+    expect(
+      screen.getByText(
+        'No billing information required. This order is covered by your organization.',
+      ),
+    ).toBeInTheDocument();
+    expect(screen.getByRole('heading', { level: 4, name: 'Payment schedule' })).toBeInTheDocument();
+    expect(
+      screen.getByText('No payment required. This order is fully covered.'),
+    ).toBeInTheDocument();
   });
 
   it('should hide voucher code input when one is already used', async () => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "richie-education",
-  "version": "3.2.2-dev58",
+  "version": "3.2.2-dev60",
   "description": "A CMS to build learning portals for Open Education",
   "main": "sandbox/manage.py",
   "scripts": {
@@ -157,7 +157,7 @@
     "workerDirectory": "../richie/static/richie/js"
   },
   "volta": {
-    "node": "20.11.0",
+    "node": "20.19.0",
     "yarn": "1.22.22"
   },
   "devDependencies": {