fix: full page refresh issue when clicking 'Budgets', added test cove…

…rage and fixed lint issues
openedx · Sep 19, 2023 · b7a7e8c · b7a7e8c
1 parent 0f5e292
commit b7a7e8c
Show file tree

Hide file tree

Showing 8 changed files with 311 additions and 306 deletions.
diff --git a/src/components/EnterpriseSubsidiesContext/data/hooks.js b/src/components/EnterpriseSubsidiesContext/data/hooks.js
@@ -14,7 +14,7 @@ import SubsidyApiService from '../../../data/services/EnterpriseSubsidyApiServic
 export const useEnterpriseOffers = ({ enablePortalLearnerCreditManagementScreen, enterpriseId }) => {
   const [offers, setOffers] = useState([]);
   const [isLoading, setIsLoading] = useState(true);
-  const [canManageLearnerCredit, setCanManageLearnerCredit] = useState(true);
+  const [canManageLearnerCredit, setCanManageLearnerCredit] = useState(false);
 
   dayjs.extend(isSameOrBefore);
   dayjs.extend(isSameOrAfter);
@@ -30,52 +30,51 @@ export const useEnterpriseOffers = ({ enablePortalLearnerCreditManagementScreen,
           }),
         ]);
 
-      // We have to conside both type of offers active and inactive.
-
-      const enterpriseResults = camelCaseObject(enterpriseSubsidyResponse.data).results;
-      const ecommerceResults = camelCaseObject(ecommerceApiResponse.data.results);
-
-      const offerData = [];
-
-      for (let i = 0; i < enterpriseResults.length; i++) {
-        const subsidy = enterpriseResults[i];
-        const source = 'subsidyApi';
-        const isActive = subsidy.isActive; // Always check isActive for enterprise subsidies
-        const isCurrent = isActive; // You can adjust this based on your specific requirements
-        const activeSubsidyData = {
-          id: subsidy.uuid || subsidy.id,
-          name: subsidy.title || subsidy.displayName,
-          start: subsidy.activeDatetime || subsidy.startDatetime,
-          end: subsidy.expirationDatetime || subsidy.endDatetime,
-          isCurrent: isCurrent,
-          source: source,
-        };
-        offerData.push(activeSubsidyData);
-        if (isActive) {
-          setCanManageLearnerCredit(true);
+        // We have to conside both type of offers active and inactive.
+
+        const enterpriseResults = camelCaseObject(enterpriseSubsidyResponse.data).results;
+        const ecommerceResults = camelCaseObject(ecommerceApiResponse.data.results);
+
+        const offerData = [];
+
+        for (let i = 0; i < enterpriseResults.length; i++) {
+          const subsidy = enterpriseResults[i];
+          const source = 'subsidyApi';
+          const { isActive } = subsidy; // Always check isActive for enterprise subsidies
+          const isCurrent = isActive; // You can adjust this based on your specific requirements
+          const activeSubsidyData = {
+            id: subsidy.uuid || subsidy.id,
+            name: subsidy.title || subsidy.displayName,
+            start: subsidy.activeDatetime || subsidy.startDatetime,
+            end: subsidy.expirationDatetime || subsidy.endDatetime,
+            isCurrent,
+            source,
+          };
+          offerData.push(activeSubsidyData);
+          if (isActive) {
+            setCanManageLearnerCredit(true);
+          }
         }
-      }
-
-      for (let i = 0; i < ecommerceResults.length; i++) {
-        const subsidy = ecommerceResults[i];
-        const source = 'ecommerceApi';
-        const isCurrent = subsidy.isCurrent;
-        const activeSubsidyData = {
-          id: subsidy.uuid || subsidy.id,
-          name: subsidy.title || subsidy.displayName,
-          start: subsidy.activeDatetime || subsidy.startDatetime,
-          end: subsidy.expirationDatetime || subsidy.endDatetime,
-          isCurrent: isCurrent,
-          source: source,
-        };
-        offerData.push(activeSubsidyData);
-        if (isCurrent) {
-          setCanManageLearnerCredit(true);
+
+        for (let i = 0; i < ecommerceResults.length; i++) {
+          const subsidy = ecommerceResults[i];
+          const source = 'ecommerceApi';
+          const { isCurrent } = subsidy;
+          const activeSubsidyData = {
+            id: subsidy.uuid || subsidy.id,
+            name: subsidy.title || subsidy.displayName,
+            start: subsidy.activeDatetime || subsidy.startDatetime,
+            end: subsidy.expirationDatetime || subsidy.endDatetime,
+            isCurrent,
+            source,
+          };
+          offerData.push(activeSubsidyData);
+          if (isCurrent) {
+            setCanManageLearnerCredit(true);
+          }
         }
-      }
-
-      setOffers(offerData);
-
+
+        setOffers(offerData);
       } catch (error) {
         logError(error);
       } finally {

diff --git a/src/components/EnterpriseSubsidiesContext/data/tests/BudgetDetailPage.test.jsx b/src/components/EnterpriseSubsidiesContext/data/tests/BudgetDetailPage.test.jsx
@@ -2,105 +2,114 @@
 import React from 'react';
 import { Provider } from 'react-redux';
 import thunk from 'redux-thunk';
-import userEvent from '@testing-library/user-event';
 import configureMockStore from 'redux-mock-store';
 import {
-    screen,
-    render,
-    waitFor,
+  screen,
+  render,
 } from '@testing-library/react';
 import '@testing-library/jest-dom/extend-expect';
 
 import { IntlProvider } from '@edx/frontend-platform/i18n';
-import BudgetDetailPage from '../BudgetDetailPage';
-import { useOfferSummary, useOfferRedemptions } from '../data/hooks';
-import { EXEC_ED_OFFER_TYPE } from '../data/constants';
 import { MemoryRouter } from 'react-router-dom';
+import BudgetDetailPage from '../../../learner-credit-management/BudgetDetailPage';
+import { useOfferSummary, useOfferRedemptions } from '../../../learner-credit-management/data/hooks';
+import { EXEC_ED_OFFER_TYPE } from '../../../learner-credit-management/data/constants';
+import { EnterpriseSubsidiesContext } from '../..';
+
+jest.mock('../../../learner-credit-management/data/hooks');
 
-jest.mock('../data/hooks');
 useOfferSummary.mockReturnValue({
-    isLoading: false,
-    offerSummary: null,
+  isLoading: false,
+  offerSummary: null,
 });
 useOfferRedemptions.mockReturnValue({
-    isLoading: false,
-    offerRedemptions: {
-        itemCount: 0,
-        pageCount: 0,
-        results: [],
-    },
-    fetchOfferRedemptions: jest.fn(),
+  isLoading: false,
+  offerRedemptions: {
+    itemCount: 0,
+    pageCount: 0,
+    results: [],
+  },
+  fetchOfferRedemptions: jest.fn(),
 });
 
 const mockStore = configureMockStore([thunk]);
 const getMockStore = store => mockStore(store);
 const enterpriseId = 'test-enterprise';
 const enterpriseUUID = '1234';
 const initialStore = {
-    portalConfiguration: {
-        enterpriseId,
-        enterpriseSlug:enterpriseId
+  portalConfiguration: {
+    enterpriseId,
+    enterpriseSlug: enterpriseId,
 
-    },
+  },
 };
 const store = getMockStore({ ...initialStore });
 
 const mockEnterpriseOfferId = '123';
-const mockEnterpriseOfferEnrollmentId = 456;
 
 const mockOfferDisplayName = 'Test Enterprise Offer';
 const mockOfferSummary = {
-    totalFunds: 5000,
-    redeemedFunds: 200,
-    remainingFunds: 4800,
-    percentUtilized: 0.04,
-    offerType: EXEC_ED_OFFER_TYPE,
+  totalFunds: 5000,
+  redeemedFunds: 200,
+  remainingFunds: 4800,
+  percentUtilized: 0.04,
+  offerType: EXEC_ED_OFFER_TYPE,
+};
+
+const defaultEnterpriseSubsidiesContextValue = {
+  isLoading: false,
 };
 
-const BudgetDetailPageWrapper = ({ ...rest }) => (
-    <MemoryRouter initialEntries={['/test-enterprise/admin/learner-credit/1234']}>
+const BudgetDetailPageWrapper = ({
+  enterpriseSubsidiesContextValue = defaultEnterpriseSubsidiesContextValue,
+  ...rest
+}) => (
+  <MemoryRouter initialEntries={['/test-enterprise/admin/learner-credit/1234']}>
 
     <Provider store={store}>
-        <IntlProvider locale="en">
-            <BudgetDetailPage {...rest} />
-        </IntlProvider>
+      <IntlProvider locale="en">
+        <EnterpriseSubsidiesContext.Provider value={enterpriseSubsidiesContextValue}>
+          <BudgetDetailPage {...rest} />
+        </EnterpriseSubsidiesContext.Provider>
+      </IntlProvider>
     </Provider>
-    </MemoryRouter>
+  </MemoryRouter>
 );
 
 describe('<BudgetDetailPage />', () => {
-    describe('with enterprise offer', () => {
-        beforeEach(() => {
-            jest.clearAllMocks();
-        });
+  describe('with enterprise offer', () => {
+    beforeEach(() => {
+      jest.clearAllMocks();
+    });
 
-        it('displays table on clicking view budget', async () => {
-            const mockOffer = {
-                id: mockEnterpriseOfferId,
-                name: mockOfferDisplayName,
-                start: '2022-01-01',
-                end: '2023-01-01',
-            };
-            useOfferSummary.mockReturnValue({
-                isLoading: false,
-                offerSummary: mockOfferSummary,
-            });
-            useOfferRedemptions.mockReturnValue({
-                isLoading: false,
-                offerRedemptions: {
-                    itemCount: 0,
-                    pageCount: 0,
-                    results: [],
-                },
-                fetchOfferRedemptions: jest.fn(),
-            });
-            render(<BudgetDetailPageWrapper
-                enterpriseUUID={enterpriseUUID} enterpriseSlug={enterpriseId}
-                offer={mockOffer}
-            />);
-            expect(screen.getByText('Learner Credit Budget Detail'));
-            expect(screen.getByText('Overview'));
-            expect(screen.getByText('No results found'));
-        });
+    it('displays table on clicking view budget', async () => {
+      const mockOffer = {
+        id: mockEnterpriseOfferId,
+        name: mockOfferDisplayName,
+        start: '2022-01-01',
+        end: '2023-01-01',
+      };
+      useOfferSummary.mockReturnValue({
+        isLoading: false,
+        offerSummary: mockOfferSummary,
+      });
+      useOfferRedemptions.mockReturnValue({
+        isLoading: false,
+        offerRedemptions: {
+          itemCount: 0,
+          pageCount: 0,
+          results: [],
+        },
+        fetchOfferRedemptions: jest.fn(),
+      });
+      render(<BudgetDetailPageWrapper
+        enterpriseUUID={enterpriseUUID}
+        enterpriseSlug={enterpriseId}
+        offer={mockOffer}
+      />);
+      expect(screen.getByText('Learner Credit Budget Detail'));
+      expect(screen.getByText('Overview'));
+      expect(screen.getByText('No results found'));
     });
-});
+  });
+});