fix: UI/UX cleanups for one academy use case (#1108)

openedx · Jul 5, 2024 · eadb971 · eadb971
1 parent 7212f81
commit eadb971
Show file tree

Hide file tree

Showing 4 changed files with 62 additions and 10 deletions.
diff --git a/src/components/academies/GoToAcademy.jsx b/src/components/academies/GoToAcademy.jsx
@@ -14,7 +14,7 @@ const GoToAcademy = () => {
       <p>
         <FormattedMessage
           id="enterprise.dashboard.tab.courses.go.to.academy.message"
-          defaultMessage="Getting started with edX is easy. Simply find a course from your Academy, request enrollment, and get started on your learning journey."
+          defaultMessage="Getting started with edX is easy. Simply find a course from your Academy and get started on your learning journey."
           description="Default message shown to a learner on enterprise dashboard."
         />
       </p>

diff --git a/src/components/dashboard/sidebar/SubsidiesSummary.jsx b/src/components/dashboard/sidebar/SubsidiesSummary.jsx
@@ -10,6 +10,7 @@ import SubscriptionSummaryCard from './SubscriptionSummaryCard';
 import LearnerCreditSummaryCard from './LearnerCreditSummaryCard';
 import SidebarCard from './SidebarCard';
 import {
+  useAcademies,
   useBrowseAndRequest,
   useCouponCodes,
   useEnterpriseCourseEnrollments,
@@ -48,7 +49,7 @@ const SubsidiesSummary = ({
   const { isPlanApproachingExpiry } = useExpirationMetadata(
     learnerCreditSummaryCardData?.expirationDate,
   );
-
+  const { data: academies } = useAcademies();
   const learnerCreditStatusMetadata = getStatusMetadata({
     isPlanApproachingExpiry,
     endDateStr: learnerCreditSummaryCardData?.expirationDate,
@@ -71,19 +72,33 @@ const SubsidiesSummary = ({
     return null;
   }
 
+  const isOneAcademy = enterpriseCustomer?.enableOneAcademy;
   const searchCoursesCta = (
     !programProgressPage && !enterpriseCustomer.disableSearch && showSearchCoursesCta && (
       <Button
         as={Link}
-        to={`/${enterpriseCustomer.slug}/search`}
+        to={(isOneAcademy && academies?.[0]?.uuid)
+          ? `/${enterpriseCustomer.slug}/academies/${academies[0].uuid}`
+          : `/${enterpriseCustomer.slug}/search`}
         variant={ctaButtonVariant}
         block
       >
-        <FormattedMessage
-          id="enterprise.dashboard.sidebar.subsidy.find.course.button"
-          defaultMessage="Find a course"
-          description="Button text for the find a course button on the enterprise dashboard sidebar."
-        />
+        {
+          isOneAcademy ? (
+            <FormattedMessage
+              id="enterprise.dashboard.sidebar.subsidy.go.to.academy.button"
+              defaultMessage="Go to Academy"
+              description="Button text for the go to academy button on the enterprise dashboard sidebar."
+            />
+          )
+            : (
+              <FormattedMessage
+                id="enterprise.dashboard.sidebar.subsidy.find.course.button"
+                defaultMessage="Find a course"
+                description="Button text for the find a course button on the enterprise dashboard sidebar."
+              />
+            )
+        }
       </Button>
     )
   );

diff --git a/src/components/dashboard/sidebar/tests/DashboardSidebar.test.jsx b/src/components/dashboard/sidebar/tests/DashboardSidebar.test.jsx
@@ -31,9 +31,10 @@ import {
   useRedeemablePolicies,
   useSubscriptions,
   useHasAvailableSubsidiesOrRequests,
+  useAcademies,
 } from '../../../app/data';
 import { SUBSIDY_REQUEST_STATE } from '../../../../constants';
-import { enterpriseCustomerFactory } from '../../../app/data/services/data/__factories__';
+import { enterpriseCustomerFactory, academiesFactory } from '../../../app/data/services/data/__factories__';
 
 jest.mock('@edx/frontend-platform/config', () => ({
   ...jest.requireActual('@edx/frontend-platform/config'),
@@ -53,6 +54,7 @@ jest.mock('../../../app/data', () => ({
   useBrowseAndRequest: jest.fn(),
   useIsAssignmentsOnlyLearner: jest.fn(),
   useHasAvailableSubsidiesOrRequests: jest.fn(),
+  useAcademies: jest.fn(),
 }));
 
 const mockEnterpriseOffer = {
@@ -132,6 +134,7 @@ describe('<DashboardSidebar />', () => {
     useHasAvailableSubsidiesOrRequests.mockReturnValue(
       useMockHasAvailableSubsidyOrRequests(mockUseActiveSubsidyOrRequestsData),
     );
+    useAcademies.mockReturnValue({ data: academiesFactory(3) });
   });
 
   test('Coupon codes summary card is displayed when coupon codes are available', () => {
@@ -345,6 +348,37 @@ describe('<DashboardSidebar />', () => {
     renderWithRouter(<DashboardSidebarWithContext />);
     expect(screen.getByText(LEARNER_CREDIT_ASSIGNMENT_ONLY_SUMMARY)).toBeInTheDocument();
   });
+  test('Learner credit summary card with go to academy cta when we have one academy', () => {
+    const policyExpirationDate = '2030-01-01 12:00:00Z';
+    useIsAssignmentsOnlyLearner.mockReturnValue(false);
+    useRedeemablePolicies.mockReturnValue({
+      data: {
+        redeemablePolicies: [{
+          uuid: 'policy-uuid',
+          subsidyExpirationDate: policyExpirationDate,
+          active: true,
+          policyType: POLICY_TYPES.ASSIGNED_CREDIT,
+          learnerContentAssignments: [
+            { state: ASSIGNMENT_TYPES.ALLOCATED },
+          ],
+        }],
+        learnerContentAssignments: {
+          ...emptyRedeemableLearnerCreditPolicies.learnerContentAssignments,
+          allocatedAssignments: [{ state: ASSIGNMENT_TYPES.ALLOCATED }],
+          hasAllocatedAssignments: true,
+          assignmentsForDisplay: [{ state: ASSIGNMENT_TYPES.ALLOCATED }],
+          hasAssignmentsForDisplay: true,
+        },
+      },
+    });
+    useHasAvailableSubsidiesOrRequests.mockReturnValue(useMockHasAvailableSubsidyOrRequests({
+      mockHasAvailableLearnerCreditPolicies: true,
+      mockLearnerCreditSummaryCardData: { expirationDate: dayjs().add(70, 'days').toISOString() },
+    }));
+    useEnterpriseCustomer.mockReturnValue({ data: enterpriseCustomerFactory({ enable_one_academy: true }) });
+    renderWithRouter(<DashboardSidebarWithContext />);
+    expect(screen.getByText('Go to Academy')).toBeInTheDocument();
+  });
 
   test('Find a course button is not rendered when user has no coupon codes or license subsidy', () => {
     useHasAvailableSubsidiesOrRequests.mockReturnValue(

diff --git a/src/components/program-progress/tests/ProgramProgressPage.test.jsx b/src/components/program-progress/tests/ProgramProgressPage.test.jsx
@@ -4,7 +4,7 @@ import { renderWithRouter } from '@edx/frontend-enterprise-utils';
 import { screen } from '@testing-library/react';
 import React from 'react';
 import { ProgramProgressPage } from '../index';
-import { authenticatedUserFactory, enterpriseCustomerFactory } from '../../app/data/services/data/__factories__';
+import { authenticatedUserFactory, enterpriseCustomerFactory, academiesFactory } from '../../app/data/services/data/__factories__';
 import {
   useBrowseAndRequest,
   useCouponCodes,
@@ -16,6 +16,7 @@ import {
   useRedeemablePolicies,
   useSubscriptions,
   useHasAvailableSubsidiesOrRequests,
+  useAcademies,
 } from '../../app/data';
 
 jest.mock('../../app/data', () => ({
@@ -30,6 +31,7 @@ jest.mock('../../app/data', () => ({
   useBrowseAndRequest: jest.fn(),
   useIsAssignmentsOnlyLearner: jest.fn(),
   useHasAvailableSubsidiesOrRequests: jest.fn(),
+  useAcademies: jest.fn(),
 }));
 
 jest.mock('@edx/frontend-platform/react', () => ({
@@ -159,6 +161,7 @@ describe('<ProgramProgressPage />', () => {
       },
     });
     useIsAssignmentsOnlyLearner.mockReturnValue(false);
+    useAcademies.mockReturnValue({ data: academiesFactory(3) });
   });
   it('renders error page', () => {
     useLearnerProgramProgressData.mockReturnValue({