richie-education 3.1.3-dev8 → 3.2.1-dev1

package/js/pages/TeacherDashboardOrganizationCourseLoader/index.spec.tsx

@@ -4,7 +4,7 @@ import userEvent from '@testing-library/user-event';
 import { RichieContextFactory as mockRichieContextFactory } from 'utils/test/factories/richie';
 import {
   CourseListItemFactory,
-  CourseProductRelationFactory,
+  OfferingFactory,
   OrganizationFactory,
 } from 'utils/test/factories/joanie';
 import { expectNoSpinner } from 'utils/test/expectSpinner';
@@ -59,8 +59,8 @@ describe('components/TeacherDashboardOrganizationCourseLoader', () => {
       mockPaginatedResponse(CourseListItemFactory().many(15), 15, false),
     );
     fetchMock.get(
-      `https://joanie.endpoint/api/v1.0/organizations/${organization.id}/course-product-relations/?product_type=credential&page=1&page_size=${perPage}`,
-      mockPaginatedResponse(CourseProductRelationFactory().many(15), 15, false),
+      `https://joanie.endpoint/api/v1.0/organizations/${organization.id}/offerings/?product_type=credential&page=1&page_size=${perPage}`,
+      mockPaginatedResponse(OfferingFactory().many(15), 15, false),
     );
     fetchMock.get(
       `https://joanie.endpoint/api/v1.0/organizations/${organization.id}/contracts/?signature_state=half_signed&page=1`,
@@ -76,7 +76,7 @@ describe('components/TeacherDashboardOrganizationCourseLoader', () => {
     await expectNoSpinner('Loading courses...');
 
     nbApiCalls += 1; // course api call
-    nbApiCalls += 1; // course-product-relations api call
+    nbApiCalls += 1; // offerings api call
     nbApiCalls += 1; // contracts api call
     const calledUrls = fetchMock.calls().map((call) => call[0]);
     expect(calledUrls).toHaveLength(nbApiCalls);
@@ -84,7 +84,7 @@ describe('components/TeacherDashboardOrganizationCourseLoader', () => {
       `https://joanie.endpoint/api/v1.0/organizations/${organization.id}/courses/?has_listed_course_runs=true&page=1&page_size=${perPage}`,
     );
     expect(calledUrls).toContain(
-      `https://joanie.endpoint/api/v1.0/organizations/${organization.id}/course-product-relations/?product_type=credential&page=1&page_size=${perPage}`,
+      `https://joanie.endpoint/api/v1.0/organizations/${organization.id}/offerings/?product_type=credential&page=1&page_size=${perPage}`,
     );
     await expectNoSpinner('Loading organization...');
 
@@ -117,8 +117,8 @@ describe('components/TeacherDashboardOrganizationCourseLoader', () => {
       mockPaginatedResponse(CourseListItemFactory().many(15), 15, false),
     );
     fetchMock.get(
-      `https://joanie.endpoint/api/v1.0/organizations/${organization.id}/course-product-relations/?product_type=credential&page=1&page_size=${perPage}`,
-      mockPaginatedResponse(CourseProductRelationFactory().many(15), 15, false),
+      `https://joanie.endpoint/api/v1.0/organizations/${organization.id}/offerings/?product_type=credential&page=1&page_size=${perPage}`,
+      mockPaginatedResponse(OfferingFactory().many(15), 15, false),
     );
 
     render(<TeacherDashboardOrganizationCourseLoader />, {
@@ -136,22 +136,22 @@ describe('components/TeacherDashboardOrganizationCourseLoader', () => {
       mockPaginatedResponse(CourseListItemFactory().many(5), 5, false),
     );
     fetchMock.get(
-      `https://joanie.endpoint/api/v1.0/organizations/${organization.id}/course-product-relations/?query=text+query&product_type=credential&page=1&page_size=${perPage}`,
-      mockPaginatedResponse(CourseProductRelationFactory().many(5), 5, false),
+      `https://joanie.endpoint/api/v1.0/organizations/${organization.id}/offerings/?query=text+query&product_type=credential&page=1&page_size=${perPage}`,
+      mockPaginatedResponse(OfferingFactory().many(5), 5, false),
     );
     const user = userEvent.setup();
     await user.type(screen.getByRole('textbox', { name: /Search/ }), 'text query');
     await user.click(screen.getByRole('button', { name: /Search/ }));
 
     nbApiCalls = 1; // course api call
-    nbApiCalls += 1; // course-product-relations api call
+    nbApiCalls += 1; // offerings api call
     const calledUrls = fetchMock.calls().map((call) => call[0]);
     expect(calledUrls).toHaveLength(nbApiCalls);
     expect(calledUrls).toContain(
       `https://joanie.endpoint/api/v1.0/organizations/${organization.id}/courses/?query=text+query&has_listed_course_runs=true&page=1&page_size=${perPage}`,
     );
     expect(calledUrls).toContain(
-      `https://joanie.endpoint/api/v1.0/organizations/${organization.id}/course-product-relations/?query=text+query&product_type=credential&page=1&page_size=${perPage}`,
+      `https://joanie.endpoint/api/v1.0/organizations/${organization.id}/offerings/?query=text+query&product_type=credential&page=1&page_size=${perPage}`,
     );
 
     await waitFor(() => {

package/js/pages/TeacherDashboardTraining/TeacherDashboardTrainingLoader.tsx

@@ -1,10 +1,10 @@
 import { FormattedMessage, defineMessages } from 'react-intl';
 import { useParams } from 'react-router';
 
+import { useOffering } from 'hooks/useOffering';
 import { DashboardLayout } from 'widgets/Dashboard/components/DashboardLayout';
 import { TeacherDashboardCourseSidebar } from 'widgets/Dashboard/components/TeacherDashboardCourseSidebar';
 import { Spinner } from 'components/Spinner';
-import { useCourseProductRelation } from 'hooks/useCourseProductRelation';
 import { useBreadcrumbsPlaceholders } from 'hooks/useBreadcrumbsPlaceholders';
 import { TeacherDashboardTraining } from '.';
 
@@ -22,17 +22,17 @@ const messages = defineMessages({
 });
 
 export const TeacherDashboardTrainingLoader = () => {
-  const { courseProductRelationId, organizationId } = useParams<{
-    courseProductRelationId: string;
+  const { offeringId, organizationId } = useParams<{
+    offeringId: string;
     organizationId?: string;
   }>();
 
   const {
-    item: courseProductRelation,
+    item: offering,
     states: { fetching },
-  } = useCourseProductRelation(courseProductRelationId, { organization_id: organizationId });
+  } = useOffering(offeringId, { organization_id: organizationId });
   useBreadcrumbsPlaceholders({
-    courseTitle: courseProductRelation?.product.title ?? '',
+    courseTitle: offering?.product.title ?? '',
   });
   return (
     <DashboardLayout sidebar={<TeacherDashboardCourseSidebar />}>
@@ -48,7 +48,7 @@ export const TeacherDashboardTrainingLoader = () => {
           </span>
         </Spinner>
       ) : (
-        <TeacherDashboardTraining courseProductRelation={courseProductRelation} />
+        <TeacherDashboardTraining offering={offering} />
       )}
     </DashboardLayout>
   );

package/js/pages/TeacherDashboardTraining/index.spec.tsx

@@ -11,7 +11,7 @@ import {
   UserFactory,
 } from 'utils/test/factories/richie';
 import JoanieSessionProvider from 'contexts/SessionContext/JoanieSessionProvider';
-import { CourseProductRelationFactory, OrganizationFactory } from 'utils/test/factories/joanie';
+import { OfferingFactory, OrganizationFactory } from 'utils/test/factories/joanie';
 import { createTestQueryClient } from 'utils/test/createTestQueryClient';
 import { expectNoSpinner } from 'utils/test/expectSpinner';
 import { DashboardBreadcrumbsProvider } from 'widgets/Dashboard/contexts/DashboardBreadcrumbsContext';
@@ -46,15 +46,9 @@ describe('components/TeacherDashboardTrainingLoader', () => {
   });
 
   it('should render TeacherDashboardTrainingLoader page', async () => {
-    const courseProductRelation = CourseProductRelationFactory().one();
-    fetchMock.get(
-      `https://joanie.endpoint/api/v1.0/organizations/?course_product_relation_id=${courseProductRelation.id}`,
-      [],
-    );
-    fetchMock.get(
-      `https://joanie.endpoint/api/v1.0/course-product-relations/${courseProductRelation.id}/`,
-      courseProductRelation,
-    );
+    const offering = OfferingFactory().one();
+    fetchMock.get(`https://joanie.endpoint/api/v1.0/organizations/?offering_id=${offering.id}`, []);
+    fetchMock.get(`https://joanie.endpoint/api/v1.0/offerings/${offering.id}/`, offering);
 
     const user = UserFactory().one();
     render(
@@ -67,12 +61,12 @@ describe('components/TeacherDashboardTrainingLoader', () => {
                   router={createMemoryRouter(
                     [
                       {
-                        path: ':courseProductRelationId',
+                        path: ':offeringId',
                         element: <TeacherDashboardTrainingLoader />,
                       },
                     ],
                     {
-                      initialEntries: [`/${courseProductRelation.id}`],
+                      initialEntries: [`/${offering.id}`],
                     },
                   )}
                 />
@@ -88,12 +82,10 @@ describe('components/TeacherDashboardTrainingLoader', () => {
     await expectNoSpinner('Loading course...');
 
     nbApiCalls += 1; // organizations api call
-    nbApiCalls += 1; // course-product-relations api call
+    nbApiCalls += 1; // offerings api call
     const calledUrls = fetchMock.calls().map((call) => call[0]);
     expect(calledUrls).toHaveLength(nbApiCalls);
-    expect(calledUrls).toContain(
-      `https://joanie.endpoint/api/v1.0/course-product-relations/${courseProductRelation.id}/`,
-    );
+    expect(calledUrls).toContain(`https://joanie.endpoint/api/v1.0/offerings/${offering.id}/`);
 
     // main titles
     expect(
@@ -103,27 +95,27 @@ describe('components/TeacherDashboardTrainingLoader', () => {
     ).toBeInTheDocument();
 
     expect(
-      screen.getAllByRole('heading', { name: capitalize(courseProductRelation.product.title) }),
+      screen.getAllByRole('heading', { name: capitalize(offering.product.title) }),
     ).toHaveLength(2);
 
-    const nbCourseRun = courseProductRelation.product.target_courses.reduce(
+    const nbCourseRun = offering.product.target_courses.reduce(
       (acc, course) => acc + course.course_runs.length,
       0,
     );
     expect(screen.getAllByRole('link', { name: 'Go to course area' })).toHaveLength(nbCourseRun);
   });
 
-  it('should fetch course product relation with organization id if there is one in the path', async () => {
+  it('should fetch offering with organization id if there is one in the path', async () => {
     const organization = OrganizationFactory().one();
-    const courseProductRelation = CourseProductRelationFactory({
+    const offering = OfferingFactory({
       organizations: [organization],
     }).one();
     fetchMock.get(
-      `https://joanie.endpoint/api/v1.0/organizations/${organization.id}/course-product-relations/${courseProductRelation.id}/`,
-      courseProductRelation,
+      `https://joanie.endpoint/api/v1.0/organizations/${organization.id}/offerings/${offering.id}/`,
+      offering,
     );
     fetchMock.get(
-      `https://joanie.endpoint/api/v1.0/organizations/${organization.id}/contracts/?course_product_relation_id=${courseProductRelation.id}&signature_state=half_signed&page=1&page_size=25`,
+      `https://joanie.endpoint/api/v1.0/organizations/${organization.id}/contracts/?offering_id=${offering.id}&signature_state=half_signed&page=1&page_size=25`,
       [],
     );
 
@@ -138,12 +130,12 @@ describe('components/TeacherDashboardTrainingLoader', () => {
                   router={createMemoryRouter(
                     [
                       {
-                        path: '/:organizationId/:courseProductRelationId',
+                        path: '/:organizationId/:offeringId',
                         element: <TeacherDashboardTrainingLoader />,
                       },
                     ],
                     {
-                      initialEntries: [`/${organization.id}/${courseProductRelation.id}`],
+                      initialEntries: [`/${organization.id}/${offering.id}`],
                     },
                   )}
                 />
@@ -159,11 +151,11 @@ describe('components/TeacherDashboardTrainingLoader', () => {
     await expectNoSpinner('Loading course...');
 
     nbApiCalls += 1; // contracts api call
-    nbApiCalls += 1; // course-product-relations api call
+    nbApiCalls += 1; // offerings api call
     const calledUrls = fetchMock.calls().map((call) => call[0]);
     expect(calledUrls).toHaveLength(nbApiCalls);
     expect(calledUrls).toContain(
-      `https://joanie.endpoint/api/v1.0/organizations/${organization.id}/course-product-relations/${courseProductRelation.id}/`,
+      `https://joanie.endpoint/api/v1.0/organizations/${organization.id}/offerings/${offering.id}/`,
     );
 
     // main titles
@@ -174,10 +166,10 @@ describe('components/TeacherDashboardTrainingLoader', () => {
     ).toBeInTheDocument();
 
     expect(
-      screen.getAllByRole('heading', { name: capitalize(courseProductRelation.product.title) }),
+      screen.getAllByRole('heading', { name: capitalize(offering.product.title) }),
     ).toHaveLength(2);
 
-    const nbCourseRun = courseProductRelation.product.target_courses.reduce(
+    const nbCourseRun = offering.product.target_courses.reduce(
       (acc, course) => acc + course.course_runs.length,
       0,
     );

package/js/pages/TeacherDashboardTraining/index.tsx

@@ -6,37 +6,33 @@ import { DashboardLayout } from 'widgets/Dashboard/components/DashboardLayout';
 import { DashboardCard } from 'widgets/Dashboard/components/DashboardCard';
 import { Icon, IconTypeEnum } from 'components/Icon';
 import Banner, { BannerType } from 'components/Banner';
-import { CourseProductRelation } from 'types/Joanie';
+import { Offering } from 'types/Joanie';
 
 const messages = defineMessages({
-  errorNoCourseProductRelation: {
+  errorNoOffering: {
     defaultMessage: "This product doesn't exist",
-    description: 'Message displayed when requested course product relation is not found',
-    id: 'components.TeacherDashboardTraining.errorNoCourseProductRelation',
+    description: 'Message displayed when requested offering is not found',
+    id: 'components.TeacherDashboardTraining.errorNoOffering',
   },
 });
 
 interface TeacherDashboardTrainingProps {
-  courseProductRelation: CourseProductRelation;
+  offering: Offering;
 }
 
-export const TeacherDashboardTraining = ({
-  courseProductRelation,
-}: TeacherDashboardTrainingProps) => {
+export const TeacherDashboardTraining = ({ offering }: TeacherDashboardTrainingProps) => {
   const intl = useIntl();
-  return courseProductRelation ? (
+  return offering ? (
     <div className="teacher-course-page">
       <DashboardCard
         className="icon-arrow-right-rounded"
         header={
           <div>
             <div className="dashboard__title_container--small">
-              <h2 className="dashboard__title--large">
-                {capitalize(courseProductRelation.product.title)}
-              </h2>
+              <h2 className="dashboard__title--large">{capitalize(offering.product.title)}</h2>
             </div>
-            {courseProductRelation.product.description && (
-              <div className="dashboard__quote">{courseProductRelation.product.description}</div>
+            {offering.product.description && (
+              <div className="dashboard__quote">{offering.product.description}</div>
             )}
           </div>
         }
@@ -44,7 +40,7 @@ export const TeacherDashboardTraining = ({
         fullWidth
       />
       <DashboardLayout.NestedSection>
-        {courseProductRelation.product.target_courses.map((course) => (
+        {offering.product.target_courses.map((course) => (
           <DashboardLayout.Section key={`course_target_${course.code}`}>
             <DashboardCard
               className="icon-arrow-right-rounded"
@@ -67,7 +63,7 @@ export const TeacherDashboardTraining = ({
     </div>
   ) : (
     <Banner
-      message={intl.formatMessage(messages.errorNoCourseProductRelation)}
+      message={intl.formatMessage(messages.errorNoOffering)}
       type={BannerType.ERROR}
       rounded
     />

package/js/settings/index.ts

@@ -29,4 +29,5 @@ export const {
   MOCK_SERVICE_WORKER_ENABLED,
   DEBUG_UNION_RESOURCES_HOOK,
   CURRENT_JOANIE_DEV_DEMO_USER,
+  SLIDER_SETTINGS,
 } = settings;

package/js/settings/settings.prod.ts

@@ -61,3 +61,4 @@ export const PER_PAGE = {
 
 export const MOCK_SERVICE_WORKER_ENABLED = false;
 export const DEBUG_UNION_RESOURCES_HOOK = false;
+export const SLIDER_SETTINGS = { autoplayDelay: 3000 };