feat: assign by course run implementation (#1292)

__mocks__/react-instantsearch-dom.jsx

@@ -2,26 +2,135 @@
 /* eslint-disable react/prop-types */
 
 const React = require('react');
+const dayjs = require('dayjs');
 
 const MockReactInstantSearch = jest.genMockFromModule(
   'react-instantsearch-dom',
 );
 
-// eslint-disable-next-line @typescript-eslint/naming-convention
-const advertised_course_run = {
-  start: '2020-09-09T04:00:00Z',
-  key: 'course-v1:edX+Bee101+3T2020',
-};
+const mockCurrentStartDate = dayjs().add(3, 'months').toISOString();
+const mockEndDate = dayjs().add(2, 'years').toISOString();
+const mockEnrollByDate = dayjs().add(9, 'months').toISOString();
+const mockEnrollByTimestamp = dayjs(mockEnrollByDate).unix();
+const mockUpgradeDeadlineTimestamp = dayjs().add(3, 'months').unix();
+
 const mockNormalizedData = {
-  start_date: '2020-09-09T04:00:00Z',
-  end_date: '2021-09-09T04:00:00Z',
-  enroll_by_date: '2020-09-15T04:00:00Z',
+  start_date: mockCurrentStartDate,
+  end_date: mockEndDate,
+  enroll_by_date: mockEnrollByDate,
 };
 
 /* eslint-disable camelcase */
 const fakeHits = [
-  { objectID: '1', aggregation_key: 'course:Bees101', title: 'bla', partners: [{ name: 'edX' }, { name: 'another_unused' }], advertised_course_run, key: 'Bees101', normalized_metadata: mockNormalizedData },
-  { objectID: '2', aggregation_key: 'course:Wasps200', title: 'blp', partners: [{ name: 'edX' }, { name: 'another_unused' }], advertised_course_run, key: 'Wasps200', normalized_metadata: mockNormalizedData },
+  {
+    objectID: '1',
+    aggregation_key: 'course:Bees101',
+    title: 'bla',
+    partners: [
+      { name: 'edX' },
+      { name: 'another_unused' },
+    ],
+    advertised_course_run: {
+      key: 'course-v1:edx+Bees101+1010',
+      start: mockCurrentStartDate,
+      end: mockEndDate,
+      enroll_by: mockEnrollByTimestamp,
+      has_enroll_by: true,
+      is_active: true,
+      max_effort: 5,
+      min_effort: 1,
+      pacing_type: 'self_paced',
+      weeks_to_complete: 8,
+      upgrade_deadline: mockUpgradeDeadlineTimestamp,
+      content_price: 100,
+    },
+    key: 'Bees101',
+    normalized_metadata: mockNormalizedData,
+    courseRuns: [
+      {
+        key: 'course-v1:edx+Bees101+1010',
+        start: mockCurrentStartDate,
+        end: mockEndDate,
+        enroll_by: mockEnrollByTimestamp,
+        has_enroll_by: true,
+        is_active: true,
+        max_effort: 5,
+        min_effort: 1,
+        pacing_type: 'self_paced',
+        weeks_to_complete: 8,
+        upgrade_deadline: mockUpgradeDeadlineTimestamp,
+        content_price: 100,
+      },
+      {
+        key: 'course-v1:edX+Bee101+3T2020',
+        start: '2020-09-09T04:00:00Z',
+        end: dayjs('2020-09-09T04:00:00Z').add(1, 'year').toISOString(),
+        enroll_by: mockEnrollByTimestamp,
+        has_enroll_by: true,
+        is_active: true,
+        max_effort: 5,
+        min_effort: 1,
+        pacing_type: 'self_paced',
+        weeks_to_complete: 8,
+        upgrade_deadline: mockUpgradeDeadlineTimestamp,
+        content_price: 100,
+      },
+    ],
+  },
+  { objectID: '2',
+    aggregation_key: 'course:Wasps200',
+    title: 'blp',
+    partners: [
+      { name: 'edX' },
+      { name: 'another_unused' },
+    ],
+    advertised_course_run: {
+      key: 'course-v1:edx+Wasps200+1010T2024',
+      start: mockCurrentStartDate,
+      end: mockEndDate,
+      enroll_by: mockEnrollByTimestamp,
+      has_enroll_by: true,
+      is_active: true,
+      max_effort: 5,
+      min_effort: 1,
+      pacing_type: 'self_paced',
+      weeks_to_complete: 8,
+      upgrade_deadline: mockUpgradeDeadlineTimestamp,
+      content_price: 100,
+    },
+    key: 'Wasps200',
+    normalized_metadata: mockNormalizedData,
+    courseRuns: [
+      {
+        key: 'course-v1:edx+Wasps200+1010T2024',
+        start: '2022-10-09T04:00:00Z',
+        end: dayjs('2022-10-09T04:00:00Z').add(1, 'year').toISOString(),
+        enroll_by: mockEnrollByTimestamp,
+        has_enroll_by: true,
+        is_active: true,
+        max_effort: 5,
+        min_effort: 1,
+        pacing_type: 'self_paced',
+        weeks_to_complete: 8,
+        upgrade_deadline: mockUpgradeDeadlineTimestamp,
+        content_price: 100,
+      },
+      {
+        key: 'course-v1:edX+Wasps200+3T2020',
+        start: '2020-09-09T04:00:00Z',
+        end: dayjs('2020-09-09T04:00:00Z').add(1, 'year').toISOString(),
+        enroll_by: mockEnrollByTimestamp,
+        has_enroll_by: true,
+        is_active: true,
+        max_effort: 5,
+        min_effort: 1,
+        pacing_type: 'self_paced',
+        weeks_to_complete: 8,
+        upgrade_deadline: mockUpgradeDeadlineTimestamp,
+        content_price: 100,
+      },
+    ],
+  },
 ];
 /* eslint-enable camelcase */
 

package.json

@@ -11,8 +11,9 @@
     "i18n_extract": "fedx-scripts formatjs extract --throws",
     "build:with-theme": "THEME=npm:@edx/brand-edx.org@latest npm run install-theme && fedx-scripts webpack",
     "check-types": "tsc --noemit",
-    "lint": "fedx-scripts eslint --ext .js --ext .jsx .; npm run check-types",
-    "lint:fix": "fedx-scripts eslint --fix --ext .js --ext .jsx --ext .tsx --ext .ts .",
+    "eslint": "fedx-scripts eslint --ext .js --ext .jsx --ext .ts --ext .tsx .",
+    "lint": "npm run eslint && npm run check-types",
+    "lint:fix": "npm run eslint -- --fix",
     "precommit": "npm run lint",
     "prepublishOnly": "npm run build",
     "postinstall": "patch-package",

src/components/AdvanceAnalyticsV2/charts/ChartWrapper.jsx

@@ -1,9 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
-import {
-  Spinner,
-} from '@openedx/paragon';
+import { Spinner } from '@openedx/paragon';
 import ScatterChart from './ScatterChart';
 import LineChart from './LineChart';
 import BarChart from './BarChart';

src/components/AdvanceAnalyticsV2/tabs/Completions.test.jsx

@@ -5,6 +5,7 @@ import { QueryClientProvider } from '@tanstack/react-query';
 import { IntlProvider } from '@edx/frontend-platform/i18n';
 import '@testing-library/jest-dom';
 import MockAdapter from 'axios-mock-adapter';
+// eslint-disable-next-line import/no-extraneous-dependencies
 import axios from 'axios';
 import { BrowserRouter as Router } from 'react-router-dom';
 import { getAuthenticatedHttpClient } from '@edx/frontend-platform/auth';

src/components/AdvanceAnalyticsV2/tabs/Engagements.test.jsx

@@ -5,6 +5,7 @@ import { QueryClientProvider } from '@tanstack/react-query';
 import { IntlProvider } from '@edx/frontend-platform/i18n';
 import '@testing-library/jest-dom';
 import MockAdapter from 'axios-mock-adapter';
+// eslint-disable-next-line import/no-extraneous-dependencies
 import axios from 'axios';
 import { BrowserRouter as Router } from 'react-router-dom';
 import { getAuthenticatedHttpClient } from '@edx/frontend-platform/auth';

src/components/AdvanceAnalyticsV2/tabs/Enrollments.test.jsx

@@ -5,6 +5,7 @@ import { QueryClientProvider } from '@tanstack/react-query';
 import { IntlProvider } from '@edx/frontend-platform/i18n';
 import '@testing-library/jest-dom';
 import MockAdapter from 'axios-mock-adapter';
+// eslint-disable-next-line import/no-extraneous-dependencies
 import axios from 'axios';
 import { BrowserRouter as Router } from 'react-router-dom';
 import { getAuthenticatedHttpClient } from '@edx/frontend-platform/auth';

src/components/AdvanceAnalyticsV2/tabs/Leaderboard.test.jsx

@@ -5,6 +5,7 @@ import '@testing-library/jest-dom';
 import { IntlProvider } from '@edx/frontend-platform/i18n';
 import { QueryClientProvider } from '@tanstack/react-query';
 import MockAdapter from 'axios-mock-adapter';
+// eslint-disable-next-line import/no-extraneous-dependencies
 import axios from 'axios';
 import { getAuthenticatedHttpClient } from '@edx/frontend-platform/auth';
 import { BrowserRouter as Router } from 'react-router-dom';

src/components/forms/data/reducer.ts

@@ -2,7 +2,11 @@ import groupBy from 'lodash/groupBy';
 import isEmpty from 'lodash/isEmpty';
 import keys from 'lodash/keys';
 import {
-  SetShowErrorsArguments, SET_FORM_FIELD, SET_SHOW_ERRORS, SET_STEP, SET_WORKFLOW_STATE, UPDATE_FORM_FIELDS, RESET_EDIT_STATE,
+  SetShowErrorsArguments,
+  SET_FORM_FIELD, SET_SHOW_ERRORS,
+  SET_STEP, SET_WORKFLOW_STATE,
+  UPDATE_FORM_FIELDS,
+  RESET_EDIT_STATE,
 } from './actions';
 import type {
   FormActionArguments, SetFormFieldArguments, SetStepArguments, SetWorkflowStateArguments, UpdateFormFieldArguments,

src/components/learner-credit-management/AssignmentDetailsTableCell.jsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
-import { Stack, Hyperlink } from '@openedx/paragon';
+import { Hyperlink, Stack } from '@openedx/paragon';
 import { sendEnterpriseTrackEvent } from '@edx/frontend-enterprise-utils';
 
 import { configuration } from '../../config';
@@ -21,6 +21,7 @@ const AssignmentDetailsTableCell = ({ row, enterpriseSlug, enterpriseId }) => {
       state: row.original.state,
     },
   );
+  const courseKey = row.original.isAssignedCourseRun ? row.original.parentContentKey : row.original.contentKey;
   return (
     <Stack gap={1}>
       <EmailAddressTableCell
@@ -31,7 +32,7 @@ const AssignmentDetailsTableCell = ({ row, enterpriseSlug, enterpriseId }) => {
       <div>
         <Hyperlink
           className="x-small"
-          destination={`${ENTERPRISE_LEARNER_PORTAL_URL}/${enterpriseSlug}/course/${row.original.contentKey}`}
+          destination={`${ENTERPRISE_LEARNER_PORTAL_URL}/${enterpriseSlug}/course/${courseKey}`}
           onClick={handleOnViewCourseClick}
           target="_blank"
           isInline
@@ -53,6 +54,7 @@ AssignmentDetailsTableCell.propTypes = {
     original: PropTypes.shape({
       uuid: PropTypes.string,
       learnerEmail: PropTypes.string,
+      parentContentKey: PropTypes.string,
       contentKey: PropTypes.string.isRequired,
       contentTitle: PropTypes.string,
       contentQuantity: PropTypes.number,
@@ -62,6 +64,7 @@ AssignmentDetailsTableCell.propTypes = {
       }),
       learnerState: PropTypes.string,
       state: PropTypes.string,
+      isAssignedCourseRun: PropTypes.bool,
     }).isRequired,
   }).isRequired,
   enterpriseSlug: PropTypes.string,

src/components/learner-credit-management/BudgetDetailPageOverviewAvailability.jsx

@@ -19,9 +19,9 @@ import {
   useEnterpriseCustomer,
   useEnterpriseGroup,
   isLmsBudget,
+  LEARNER_CREDIT_ROUTE,
 } from './data';
 import EVENT_NAMES from '../../eventTracking';
-import { LEARNER_CREDIT_ROUTE } from './constants';
 import { BUDGET_STATUSES } from '../EnterpriseApp/data/constants';
 import BudgetDetail from './BudgetDetail';
 import { useEnterpriseBudgets } from '../EnterpriseSubsidiesContext/data/hooks';

src/components/learner-credit-management/BudgetDetailPageOverviewUtilization.jsx

@@ -9,9 +9,8 @@ import { sendEnterpriseTrackEvent } from '@edx/frontend-enterprise-utils';
 import { generatePath, useParams, Link } from 'react-router-dom';
 
 import { FormattedMessage, useIntl } from '@edx/frontend-platform/i18n';
-import { formatPrice } from './data';
+import { formatPrice, LEARNER_CREDIT_ROUTE } from './data';
 import EVENT_NAMES from '../../eventTracking';
-import { LEARNER_CREDIT_ROUTE } from './constants';
 
 const BudgetDetailPageOverviewUtilization = ({
   budgetId,