feat: Show exec-ed learner credit only for exec ed offers

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

@@ -15,6 +15,7 @@ import { useOfferRedemptions, useOfferSummary } from './data/hooks';
 import LearnerCreditAggregateCards from './LearnerCreditAggregateCards';
 import LearnerCreditAllocationTable from './LearnerCreditAllocationTable';
 import { ROUTE_NAMES } from '../EnterpriseApp/data/constants';
+import { EXEC_ED_OFFER_TYPE } from './data/constants';
 
 const BudgetCard = ({
   offer,
@@ -136,16 +137,19 @@ const BudgetCard = ({
                 </Stack>
               </Card.Body>
             </Card>
-            <Card
-              orientation="horizontal"
-            >
-              <Card.Body>
-                <Stack gap={4}>
-                  {renderCardHeader('Executive Education')}
-                  {renderCardSection(offerSummary?.remainingFunds, offerSummary?.redeemedFundsExecEd)}
-                </Stack>
-              </Card.Body>
-            </Card>
+            {offerSummary?.offerType === EXEC_ED_OFFER_TYPE
+              && (
+              <Card
+                orientation="horizontal"
+              >
+                <Card.Body>
+                  <Stack gap={4}>
+                    {renderCardHeader('Executive Education')}
+                    {renderCardSection(offerSummary?.remainingFunds, offerSummary?.redeemedFundsExecEd)}
+                  </Stack>
+                </Card.Body>
+              </Card>
+              )}
           </>
         )
         : (

src/components/learner-credit-management/data/constants.js

@@ -14,3 +14,5 @@ export const LOW_REMAINING_BALANCE_PERCENT_THRESHOLD = 0.75;
 export const NO_BALANCE_REMAINING_DOLLAR_THRESHOLD = 100;
 
 export const DATE_FORMAT = 'MMMM DD, YYYY';
+
+export const EXEC_ED_OFFER_TYPE = 'learner_credit';

src/components/learner-credit-management/data/tests/utils.test.js

@@ -1,4 +1,5 @@
 import { transformOfferSummary } from '../utils';
+import { EXEC_ED_OFFER_TYPE } from '../constants';
 
 describe('transformOfferSummary', () => {
   it('should return null if there is no offerSummary', () => {
@@ -11,6 +12,7 @@ describe('transformOfferSummary', () => {
       amountOfOfferSpent: 1.34,
       remainingBalance: -0.34,
       percentOfOfferSpent: 1.34,
+      offerType: EXEC_ED_OFFER_TYPE,
     };
 
     expect(transformOfferSummary(offerSummary)).toEqual({
@@ -20,6 +22,7 @@ describe('transformOfferSummary', () => {
       redeemedFundsOcm: NaN,
       remainingFunds: 0.0,
       percentUtilized: 1.0,
+      offerType: EXEC_ED_OFFER_TYPE,
     });
   });
 
@@ -29,13 +32,15 @@ describe('transformOfferSummary', () => {
       amountOfOfferSpent: 100,
       remainingBalance: null,
       percentOfOfferSpent: null,
+      offerType: 'Site',
     };
 
     expect(transformOfferSummary(offerSummary)).toEqual({
       totalFunds: null,
       redeemedFunds: 100,
       remainingFunds: null,
       percentUtilized: null,
+      offerType: 'Site',
     });
   });
 });

src/components/learner-credit-management/data/utils.js

@@ -37,6 +37,7 @@ export const transformOfferSummary = (offerSummary) => {
   if (percentUtilized) {
     percentUtilized = Math.min(percentUtilized, 1.0);
   }
+  const { offerType } = offerSummary;
 
   return {
     totalFunds,
@@ -45,6 +46,7 @@ export const transformOfferSummary = (offerSummary) => {
     redeemedFundsExecEd,
     remainingFunds,
     percentUtilized,
+    offerType,
   };
 };
 

src/components/learner-credit-management/tests/BudgetCard.test.jsx

@@ -15,6 +15,7 @@ import '@testing-library/jest-dom/extend-expect';
 import { IntlProvider } from '@edx/frontend-platform/i18n';
 import BudgetCard from '../BudgetCard';
 import { useOfferSummary, useOfferRedemptions } from '../data/hooks';
+import { EXEC_ED_OFFER_TYPE } from '../data/constants';
 
 jest.mock('../data/hooks');
 useOfferSummary.mockReturnValue({
@@ -51,6 +52,7 @@ const mockOfferSummary = {
   redeemedFunds: 200,
   remainingFunds: 4800,
   percentUtilized: 0.04,
+  offerType: EXEC_ED_OFFER_TYPE,
 };
 
 const BudgetCardWrapper = ({ ...rest }) => (
@@ -67,7 +69,7 @@ describe('<BudgetCard />', () => {
       jest.clearAllMocks();
     });
 
-    it('displays correctly', () => {
+    it('displays correctly for all offers', () => {
       const mockOffer = {
         id: mockEnterpriseOfferId,
         name: mockOfferDisplayName,
@@ -105,6 +107,50 @@ describe('<BudgetCard />', () => {
       expect(firstElementWithTestId).toHaveTextContent(formattedString);
     });
 
+    it('displays correctly for Offer type Site', () => {
+      const mockOffer = {
+        id: mockEnterpriseOfferId,
+        name: mockOfferDisplayName,
+        start: '2022-01-01',
+        end: '2023-01-01',
+      };
+      const mockOfferRedemption = {
+        created: '2022-02-01',
+        enterpriseEnrollmentId: mockEnterpriseOfferEnrollmentId,
+      };
+      useOfferSummary.mockReturnValue({
+        isLoading: false,
+        offerSummary: {
+          totalFunds: 5000,
+          redeemedFunds: 200,
+          remainingFunds: 4800,
+          percentUtilized: 0.04,
+          offerType: 'Site',
+        },
+      });
+      useOfferRedemptions.mockReturnValue({
+        isLoading: false,
+        offerRedemptions: {
+          results: [mockOfferRedemption],
+          itemCount: 1,
+          pageCount: 1,
+        },
+        fetchOfferRedemptions: jest.fn(),
+      });
+      render(<BudgetCardWrapper
+        offer={mockOffer}
+        enterpriseUUID={enterpriseUUID}
+        enterpriseSlug={enterpriseId}
+      />);
+      expect(screen.getByText('Open Courses Marketplace'));
+      expect(screen.queryByText('Executive Education')).not.toBeInTheDocument();
+      expect(screen.getByText(`$${mockOfferSummary.redeemedFunds.toLocaleString()}`));
+      const formattedString = `${dayjs(mockOffer.start).format('MMMM D, YYYY')} - ${dayjs(mockOffer.end).format('MMMM D, YYYY')}`;
+      const elementsWithTestId = screen.getAllByTestId('offer-date');
+      const firstElementWithTestId = elementsWithTestId[0];
+      expect(firstElementWithTestId).toHaveTextContent(formattedString);
+    });
+
     it('displays table on clicking view budget', async () => {
       const mockOffer = {
         id: mockEnterpriseOfferId,