richie-education 2.29.3-dev50 → 2.29.3-dev55

package/js/widgets/SyllabusCourseRunsList/components/CourseRunItemWithEnrollment/index.product.spec.tsx

@@ -1,5 +1,6 @@
 import { screen, waitFor } from '@testing-library/react';
 import fetchMock from 'fetch-mock';
+import { faker } from '@faker-js/faker';
 import {
   CourseRunFactory,
   RichieContextFactory as mockRichieContextFactory,
@@ -11,12 +12,12 @@ import { render } from 'utils/test/render';
 import {
   CourseLightFactory,
   CredentialOrderFactory,
-  EnrollmentFactory,
   ProductFactory,
 } from 'utils/test/factories/joanie';
 import { setupJoanieSession } from 'utils/test/wrappers/JoanieAppWrapper';
 import { mockPaginatedResponse } from 'utils/test/mockPaginatedResponse';
 import { expectNoSpinner } from 'utils/test/expectSpinner';
+import { ACTIVE_ORDER_STATES, PURCHASABLE_ORDER_STATES } from 'types/Joanie';
 import CourseRunItemWithEnrollment from '.';
 
 jest.mock('utils/context', () => ({
@@ -61,10 +62,9 @@ describe("CourseRunItemWithEnrollment for joanie's product's course run", () =>
     expect(screen.queryByRole('link')).not.toBeInTheDocument();
   });
 
-  it('should not render enrollment information when user is not enrolled to the course run', async () => {
+  it('should not render enrollment information when user has no order for the product', async () => {
     const course = CourseLightFactory().one();
     const product = ProductFactory().one();
-    const order = CredentialOrderFactory().one();
     const user = UserFactory().one();
     const courseRun = CourseRunFactory({
       title: 'run',
@@ -73,6 +73,39 @@ describe("CourseRunItemWithEnrollment for joanie's product's course run", () =>
       resource_link: `https://joanie.endpoint/api/v1.0/courses/${course.code}/products/${product.id}`,
     }).one();
 
+    fetchMock.get(
+      `https://joanie.endpoint/api/v1.0/orders/?course_code=${course.code}&product_id=${product.id}`,
+      mockPaginatedResponse([], 0, false),
+    );
+
+    render(<CourseRunItemWithEnrollment item={courseRun} />, {
+      wrapper: BaseJoanieAppWrapper,
+      queryOptions: { client: createTestQueryClient({ user }) },
+    });
+    await expectNoSpinner();
+
+    // Only dates should be displayed.
+    screen.getByText('Run, from Jan 01, 2023 to Dec 31, 2023');
+    expect(fetchMock.called()).toBe(true);
+    const link = screen.queryByTitle('Go to course') as HTMLAnchorElement;
+    expect(link).not.toBeInTheDocument();
+    expect(screen.queryByLabelText('You are enrolled in this course run')).not.toBeInTheDocument();
+  });
+
+  it('should not render enrollment information when user has no active order for the product', async () => {
+    const course = CourseLightFactory().one();
+    const product = ProductFactory().one();
+    const user = UserFactory().one();
+    const order = CredentialOrderFactory({
+      state: faker.helpers.arrayElement(PURCHASABLE_ORDER_STATES),
+    }).one();
+    const courseRun = CourseRunFactory({
+      title: 'run',
+      start: new Date('2023-01-01').toISOString(),
+      end: new Date('2023-12-31').toISOString(),
+      resource_link: `https://joanie.endpoint/api/v1.0/courses/${course.code}/products/${product.id}`,
+    }).one();
+
     fetchMock.get(
       `https://joanie.endpoint/api/v1.0/orders/?course_code=${course.code}&product_id=${product.id}`,
       mockPaginatedResponse([order], 1, false),
@@ -84,20 +117,19 @@ describe("CourseRunItemWithEnrollment for joanie's product's course run", () =>
     });
     await expectNoSpinner();
 
-    // Only dates should have been displayed.
+    // Only dates should be displayed.
     screen.getByText('Run, from Jan 01, 2023 to Dec 31, 2023');
     expect(fetchMock.called()).toBe(true);
     const link = screen.queryByTitle('Go to course') as HTMLAnchorElement;
-    expect(link).toBeInTheDocument();
-    expect(link.href).toBe(`https://localhost/en/dashboard/courses/orders/${order.id}`);
+    expect(link).not.toBeInTheDocument();
     expect(screen.queryByLabelText('You are enrolled in this course run')).not.toBeInTheDocument();
   });
 
-  it('should render enrollment information when user is enrolled to the course run', async () => {
+  it('should render enrollment information when user has an active order for the product', async () => {
     const course = CourseLightFactory().one();
     const product = ProductFactory().one();
     const order = CredentialOrderFactory({
-      target_enrollments: EnrollmentFactory({ is_active: true }).many(1),
+      state: faker.helpers.arrayElement(ACTIVE_ORDER_STATES),
     }).one();
     const user = UserFactory().one();
     const courseRun = CourseRunFactory({
@@ -121,7 +153,6 @@ describe("CourseRunItemWithEnrollment for joanie's product's course run", () =>
       expect(screen.queryByText('loading...')).not.toBeInTheDocument();
     });
 
-    // Only dates should have been displayed.
     screen.getByText('Run, from Jan 01, 2023 to Dec 31, 2023');
     expect(fetchMock.called()).toBe(true);
 

package/js/widgets/SyllabusCourseRunsList/components/CourseRunItemWithEnrollment/index.tsx

@@ -8,6 +8,8 @@ import { getDashboardBasename } from 'widgets/Dashboard/hooks/useDashboardRouter
 import { LearnerDashboardPaths } from 'widgets/Dashboard/utils/learnerRoutesPaths';
 import useCourseRunOrder from 'hooks/useCourseRunOrder';
 import { Spinner } from 'components/Spinner';
+import { OrderHelper } from 'utils/OrderHelper';
+import { extractResourceMetadata } from 'api/lms/joanie';
 
 const messages = defineMessages({
   goToCourse: {
@@ -33,6 +35,8 @@ type Props = {
 
 const CourseRunItemWithEnrollment = ({ item }: Props) => {
   const intl = useIntl();
+  const resourceLinkResources = extractResourceMetadata(item.resource_link);
+  const isProduct = !!(resourceLinkResources?.course && resourceLinkResources?.product);
   const {
     item: order,
     states: { isFetched },
@@ -43,14 +47,12 @@ const CourseRunItemWithEnrollment = ({ item }: Props) => {
 
   const { enrollmentIsActive: courseRunEnrollmentIsActive } = useCourseEnrollment(
     item.resource_link,
-    isFetched && !order,
+    !isProduct,
   );
 
-  // user is enroll to a product if any of the product's target course have a active enrollment
-  const productEnrollmentIsActive = order?.target_enrollments.some((enrollment) => {
-    return enrollment.is_active;
-  });
-  const enrollmentIsActive = !!(courseRunEnrollmentIsActive || productEnrollmentIsActive);
+  // user is enrolled to a product if there is an active order for the product
+  const orderIsActive = OrderHelper.isActive(order);
+  const enrollmentIsActive = !!(courseRunEnrollmentIsActive || orderIsActive);
 
   if (!isFetched) {
     return <Spinner />;
@@ -58,7 +60,7 @@ const CourseRunItemWithEnrollment = ({ item }: Props) => {
 
   return (
     <>
-      {enrollmentIsActive || !!order ? (
+      {enrollmentIsActive ? (
         // eslint-disable-next-line jsx-a11y/control-has-associated-label
         <a href={courseUrl} title={intl.formatMessage(messages.goToCourse)}>
           <CourseRunItem item={item} />

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "richie-education",
-  "version": "2.29.3-dev50",
+  "version": "2.29.3-dev55",
   "description": "A CMS to build learning portals for Open Education",
   "main": "sandbox/manage.py",
   "scripts": {