feat: modifies logic for setting cookies on dashboard page load

src/components/dashboard/DashboardPage.jsx

@@ -1,13 +1,7 @@
-import React, {
-  useContext, useEffect, useMemo,
-} from 'react';
+import React, { useContext, useEffect, useMemo } from 'react';
 import { Helmet } from 'react-helmet';
 import { useHistory, useLocation } from 'react-router-dom';
-import {
-  Container,
-  Tabs,
-  Tab,
-} from '@edx/paragon';
+import { Container, Tab, Tabs } from '@edx/paragon';
 import { AppContext } from '@edx/frontend-platform/react';
 import { sendEnterpriseTrackEvent } from '@edx/frontend-enterprise-utils';
 import { ProgramListingPage } from '../program-progress';
@@ -18,17 +12,24 @@ import { useLearnerProgramsListData } from '../program-progress/data/hooks';
 import { useInProgressPathwaysData } from '../pathway-progress/data/hooks';
 import CoursesTabComponent from './main-content/CoursesTabComponent';
 import { MyCareerTab } from '../my-career';
-import EnterpriseLearnerFirstVisitRedirect from '../enterprise-redirects/EnterpriseLearnerFirstVisitRedirect';
 import { UserSubsidyContext } from '../enterprise-user-subsidy';
 import { IntegrationWarningModal } from '../integration-warning-modal';
 import SubscriptionExpirationModal from './SubscriptionExpirationModal';
+import { ASSIGNMENT_TYPES } from './main-content/course-enrollments/CourseEnrollments';
+import EnterpriseLearnerFirstVisitRedirect, {
+  isFirstDashboardPageVisit,
+} from '../enterprise-redirects/EnterpriseLearnerFirstVisitRedirect';
 
 const DashboardPage = () => {
   const { state } = useLocation();
   const history = useHistory();
   const { enterpriseConfig, authenticatedUser } = useContext(AppContext);
   const { username } = authenticatedUser;
-  const { subscriptionPlan, showExpirationNotifications } = useContext(UserSubsidyContext);
+  const {
+    subscriptionPlan,
+    showExpirationNotifications,
+    redeemableLearnerCreditPolicies,
+  } = useContext(UserSubsidyContext);
   // TODO: Create a context provider containing these 2 data fetch hooks to future proof when we need to use this data
   const [learnerProgramsListData, programsFetchError] = useLearnerProgramsListData(enterpriseConfig.uuid);
   const [pathwayProgressData, pathwayFetchError] = useInProgressPathwaysData(enterpriseConfig.uuid);
@@ -38,6 +39,17 @@ const DashboardPage = () => {
     },
   } = useEnterpriseCuration(enterpriseConfig.uuid);
 
+  const hasActiveCourseAssignments = (learnerCreditPolicies) => {
+    const learnerContentAssignmentsArray = learnerCreditPolicies?.flatMap(
+      item => item?.learnerContentAssignments || [],
+    );
+    // filters out course assignments that are not considered active
+    const hasActiveAssignments = learnerContentAssignmentsArray.filter(
+      assignment => assignment.state !== ASSIGNMENT_TYPES.cancelled,
+    );
+    return hasActiveAssignments.length > 0;
+  };
+
   const onSelectHandler = (key) => {
     if (key === 'my-career') {
       sendEnterpriseTrackEvent(
@@ -87,14 +99,17 @@ const DashboardPage = () => {
     ),
   ];
 
+  if (!hasActiveCourseAssignments(redeemableLearnerCreditPolicies) && isFirstDashboardPageVisit()) {
+    return <EnterpriseLearnerFirstVisitRedirect />;
+  }
+
   return (
     <>
       <Helmet title={PAGE_TITLE} />
       <Container size="lg">
         <h2 className="h1 mb-4 mt-4">
           {userFirstName ? `Welcome, ${userFirstName}!` : 'Welcome!'}
         </h2>
-        <EnterpriseLearnerFirstVisitRedirect />
         <Tabs defaultActiveKey="courses" onSelect={(k) => onSelectHandler(k)}>{allTabs.filter(tab => tab)}</Tabs>
         {enterpriseConfig.showIntegrationWarning && <IntegrationWarningModal isOpen />}
         {subscriptionPlan && showExpirationNotifications && <SubscriptionExpirationModal />}

src/components/dashboard/main-content/course-enrollments/CourseEnrollments.jsx

@@ -10,8 +10,10 @@
 import CourseAssignmentAlert from './CourseAssignmentAlert';
 import { CourseEnrollmentsContext } from './CourseEnrollmentsContextProvider';
 import {
-  getTransformedAllocatedAssignments, sortedEnrollmentsByEnrollmentDate, sortAssignmentsByAssignmentStatus,
+  getTransformedAllocatedAssignments,
   isAssignmentExpired,
+  sortAssignmentsByAssignmentStatus,
+  sortedEnrollmentsByEnrollmentDate,
 } from './data/utils';
 import { UserSubsidyContext } from '../../../enterprise-user-subsidy';
 import { features } from '../../../../config';
@@ -56,16 +58,15 @@
     setAssignments(assignmentsData);
 
     const hasCancelledAssignments = assignmentsData?.some(
       assignment => assignment.state === ASSIGNMENT_TYPES.cancelled,
     );
     const hasExpiredAssignments = assignmentsData?.some(assignment => isAssignmentExpired(assignment));
 
     setShowCancelledAssignmentsAlert(hasCancelledAssignments);
     setShowExpiredAssignmentsAlert(hasExpiredAssignments);
   }, [redeemableLearnerCreditPolicies]);
-
   const filteredAssignments = assignments?.filter((assignment) => assignment?.state === ASSIGNMENT_TYPES.allocated
     || assignment?.state === ASSIGNMENT_TYPES.cancelled);
   const assignedCourses = getTransformedAllocatedAssignments(filteredAssignments, slug);
 
   const currentCourseEnrollments = useMemo(
@@ -73,9 +74,9 @@
       Object.keys(courseEnrollmentsByStatus).forEach((status) => {
         courseEnrollmentsByStatus[status] = courseEnrollmentsByStatus[status].map((course) => {
           const isAssigned = assignments?.some(assignment => (assignment?.state === ASSIGNMENT_TYPES.accepted
             && course.courseRunId.includes(assignment?.contentKey)));
           if (isAssigned) {
             return { ...course, isCourseAssigned: true };
           }
           return course;
         });
@@ -118,10 +119,10 @@
   return (
     <>
       {showCancelledAssignmentsAlert && (
         <CourseAssignmentAlert variant="cancelled" onClose={() => setShowCancelledAssignmentsAlert(false)}> </CourseAssignmentAlert>
       )}
       {showExpiredAssignmentsAlert && (
         <CourseAssignmentAlert variant="expired" onClose={() => setShowExpiredAssignmentsAlert(false)}> </CourseAssignmentAlert>
       )}
       {showMarkCourseCompleteSuccess && (
         <CourseEnrollmentsAlert variant="success" onClose={() => setShowMarkCourseCompleteSuccess(false)}>
@@ -141,7 +142,7 @@
       {(!hasCourseEnrollments && !hasCourseAssignments) && children}
       <>
         {features.FEATURE_ENABLE_TOP_DOWN_ASSIGNMENT && (
           <CourseSection
             title={COURSE_SECTION_TITLES.assigned}
             courseRuns={assignedCourses}
           />

src/components/dashboard/main-content/course-enrollments/data/hooks.js

@@ -1,6 +1,4 @@
-import {
-  useState, useEffect, useCallback,
-} from 'react';
+import { useCallback, useEffect, useState } from 'react';
 import { camelCaseObject } from '@edx/frontend-platform/utils';
 import { logError } from '@edx/frontend-platform/logging';
 import _camelCase from 'lodash.camelcase';
@@ -11,8 +9,8 @@ import { groupCourseEnrollmentsByStatus, transformCourseEnrollment } from './uti
 import { COURSE_STATUSES } from './constants';
 import CourseService from '../../../../course/data/service';
 import {
-  createEnrollWithLicenseUrl,
   createEnrollWithCouponCodeUrl,
+  createEnrollWithLicenseUrl,
   findCouponCodeForCourse,
   findHighestLevelSeatSku,
   getSubsidyToApplyForCourse,

src/components/dashboard/tests/DashboardPage.test.jsx

@@ -7,21 +7,15 @@ import { breakpoints } from '@edx/paragon';
 import Cookies from 'universal-cookie';
 
 import userEvent from '@testing-library/user-event';
+import { sendEnterpriseTrackEvent } from '@edx/frontend-enterprise-utils';
 import { UserSubsidyContext } from '../../enterprise-user-subsidy';
 import { CourseContextProvider } from '../../course/CourseContextProvider';
-import {
-  SUBSCRIPTION_EXPIRED_MODAL_TITLE,
-  SUBSCRIPTION_EXPIRING_MODAL_TITLE,
-} from '../SubscriptionExpirationModal';
-import {
-  SEEN_SUBSCRIPTION_EXPIRATION_MODAL_COOKIE_PREFIX,
-} from '../../../config/constants';
+import { SUBSCRIPTION_EXPIRED_MODAL_TITLE, SUBSCRIPTION_EXPIRING_MODAL_TITLE } from '../SubscriptionExpirationModal';
+import { SEEN_SUBSCRIPTION_EXPIRATION_MODAL_COOKIE_PREFIX } from '../../../config/constants';
 import { features } from '../../../config';
 import * as hooks from '../main-content/course-enrollments/data/hooks';
 
-import {
-  renderWithRouter,
-} from '../../../utils/tests';
+import { renderWithRouter } from '../../../utils/tests';
 import DashboardPage from '../DashboardPage';
 
 import { LICENSE_ACTIVATION_MESSAGE } from '../data/constants';
@@ -31,6 +25,9 @@ import { LICENSE_STATUS } from '../../enterprise-user-subsidy/data/constants';
 import { SubsidyRequestsContext } from '../../enterprise-subsidy-requests';
 import { SUBSIDY_TYPE } from '../../enterprise-subsidy-requests/constants';
 import { sortAssignmentsByAssignmentStatus } from '../main-content/course-enrollments/data/utils';
+import EnterpriseLearnerFirstVisitRedirect, {
+  isFirstDashboardPageVisit,
+} from '../../enterprise-redirects/EnterpriseLearnerFirstVisitRedirect';
 
 const defaultCouponCodesState = {
   couponCodes: [],
@@ -40,6 +37,11 @@ const defaultCouponCodesState = {
 
 const mockAuthenticatedUser = { username: 'myspace-tom', name: 'John Doe' };
 
+jest.mock('@edx/frontend-enterprise-utils', () => ({
+  ...jest.requireActual('@edx/frontend-enterprise-utils'),
+  sendEnterpriseTrackEvent: jest.fn(),
+}));
+
 jest.mock('../../../config', () => ({
   features: {
     FEATURE_ENABLE_PATHWAY_PROGRESS: jest.fn(),
@@ -52,6 +54,8 @@ jest.mock('../main-content/course-enrollments/data/utils', () => ({
   sortAssignmentsByAssignmentStatus: jest.fn(),
 }));
 
+jest.mock('../../enterprise-redirects/EnterpriseLearnerFirstVisitRedirect');
+
 const defaultAppState = {
   enterpriseConfig: {
     name: 'BearsRUs',
@@ -68,6 +72,7 @@ const defaultAppState = {
 const defaultUserSubsidyState = {
   couponCodes: defaultCouponCodesState,
   enterpriseOffers: [],
+  redeemableLearnerCreditPolicies: [],
 };
 
 const defaultCourseState = {
@@ -176,12 +181,13 @@ describe('<Dashboard />', () => {
   });
 
   beforeEach(() => {
+    jest.clearAllMocks();
     sortAssignmentsByAssignmentStatus.mockReturnValue([]);
   });
 
   it('renders user first name if available', () => {
     renderWithRouter(<DashboardWithContext />);
-    expect(screen.getByText('Welcome, John!'));
+    expect(screen.getByText('Welcome, John!')).toBeInTheDocument();
   });
 
   it('does not render user first name if not available', () => {
@@ -193,15 +199,15 @@ describe('<Dashboard />', () => {
       },
     };
     renderWithRouter(<DashboardWithContext initialAppState={appState} />);
-    expect(screen.getByText('Welcome!'));
+    expect(screen.getByText('Welcome!')).toBeInTheDocument();
   });
 
   it('renders license activation alert on activation success', () => {
     renderWithRouter(
       <DashboardWithContext />,
       { route: '/?activationSuccess=true' },
     );
-    expect(screen.getByText(LICENSE_ACTIVATION_MESSAGE));
+    expect(screen.getByText(LICENSE_ACTIVATION_MESSAGE)).toBeInTheDocument();
   });
 
   it('does not render license activation alert without activation success', () => {
@@ -218,7 +224,7 @@ describe('<Dashboard />', () => {
     renderWithRouter(
       <DashboardWithContext />,
     );
-    expect(screen.getByTestId('sidebar'));
+    expect(screen.getByTestId('sidebar')).toBeInTheDocument();
   });
 
   it('renders subsidies summary on a small screen', () => {
@@ -233,14 +239,14 @@ describe('<Dashboard />', () => {
       }}
       />,
     );
-    expect(screen.getByTestId('subsidies-summary'));
+    expect(screen.getByTestId('subsidies-summary')).toBeInTheDocument();
   });
 
   it('renders "Find a course" when search is enabled for the customer', () => {
     renderWithRouter(
       <DashboardWithContext />,
     );
-    expect(screen.getByText('Find a course'));
+    expect(screen.getByText('Find a course')).toBeInTheDocument();
   });
 
   it('renders Pathways when feature is enabled', () => {
@@ -258,15 +264,15 @@ describe('<Dashboard />', () => {
     renderWithRouter(
       <DashboardWithContext initialAppState={appState} />,
     );
-    expect(screen.getByText('Pathways'));
+    expect(screen.getByText('Pathways')).toBeInTheDocument();
   });
 
   it('renders My Career when feature is enabled', () => {
     features.FEATURE_ENABLE_MY_CAREER.mockImplementation(() => true);
     renderWithRouter(
       <DashboardWithContext />,
     );
-    expect(screen.getByText('My Career'));
+    expect(screen.getByText('My Career')).toBeInTheDocument();
   });
 
   it('does not render "Find a course" when search is disabled for the customer', () => {
@@ -331,6 +337,63 @@ describe('<Dashboard />', () => {
     expect(programsTab).toHaveAttribute('aria-selected', 'false');
   });
 
+  it('should send track event when "my-career" tab selected', () => {
+    renderWithRouter(<DashboardWithContext />);
+
+    const myCareerTab = screen.getByText('My Career');
+    userEvent.click(myCareerTab);
+
+    expect(sendEnterpriseTrackEvent).toHaveBeenCalledTimes(1);
+  });
+
+  it('should render redirect component if no cookie and no courseAssignments exist', () => {
+    isFirstDashboardPageVisit.mockReturnValueOnce(true);
+    EnterpriseLearnerFirstVisitRedirect.mockImplementation(() => (
+      <IntlProvider locale="en">
+        <div>search-page</div>
+      </IntlProvider>
+    ));
+
+    const noActiveCourseAssignmentUserSubsidyState = {
+      ...defaultUserSubsidyState,
+      redeemableLearnerCreditPolicies: [{
+        learnerContentAssignments: [{
+          state: 'cancelled',
+        },
+        ],
+      }],
+    };
+    renderWithRouter(<DashboardWithContext initialUserSubsidyState={noActiveCourseAssignmentUserSubsidyState} />);
+
+    expect(isFirstDashboardPageVisit).toHaveBeenCalled();
+    expect(screen.getByText('search-page')).toBeInTheDocument();
+  });
+
+  it('should not render redirect component if active learnerContentAssignment exist', () => {
+    isFirstDashboardPageVisit.mockReturnValueOnce(true);
+    EnterpriseLearnerFirstVisitRedirect.mockImplementation(() => (
+      <IntlProvider locale="en">
+        <div>search-page</div>
+      </IntlProvider>
+    ));
+
+    const noActiveCourseAssignmentUserSubsidyState = {
+      ...defaultUserSubsidyState,
+      redeemableLearnerCreditPolicies: [{
+        learnerContentAssignments: [{
+          state: 'allocated',
+        },
+        {
+          state: 'accepted',
+        },
+        ],
+      }],
+    };
+    renderWithRouter(<DashboardWithContext initialUserSubsidyState={noActiveCourseAssignmentUserSubsidyState} />);
+
+    expect(screen.queryByText('search-page')).not.toBeInTheDocument();
+  });
+
   describe('SubscriptionExpirationModal', () => {
     it('should not render when > 60 days of access remain', () => {
       renderWithRouter(

src/components/enterprise-redirects/EnterpriseLearnerFirstVisitRedirect.jsx

@@ -2,23 +2,24 @@ import React, { useEffect } from 'react';
 import { Redirect, useParams } from 'react-router-dom';
 import Cookies from 'universal-cookie';
 
+export const isFirstDashboardPageVisit = () => {
+  const cookies = new Cookies();
+
+  const hasUserVisitedDashboard = cookies.get('has-user-visited-learner-dashboard');
+  return !hasUserVisitedDashboard;
+};
+
 const EnterpriseLearnerFirstVisitRedirect = () => {
   const { enterpriseSlug } = useParams();
-
   const cookies = new Cookies();
 
-  const isFirstVisit = () => {
-    const hasUserVisitedDashboard = cookies.get('has-user-visited-learner-dashboard');
-    return !hasUserVisitedDashboard;
-  };
-
   useEffect(() => {
-    if (isFirstVisit()) {
+    if (isFirstDashboardPageVisit()) {
       cookies.set('has-user-visited-learner-dashboard', true, { path: '/' });
     }
   });
 
-  if (isFirstVisit()) {
+  if (isFirstDashboardPageVisit()) {
     return <Redirect to={`/${enterpriseSlug}/search`} />;
   }