ENT-7820 Learner Credit table sorting

src/Configuration/Provisioning/DashboardDataTable/tests/DashboardDataTable.test.jsx

@@ -1,21 +1,20 @@
 /* eslint-disable react/prop-types */
 import { renderWithRouter } from '@edx/frontend-enterprise-utils';
-import { screen, waitFor } from '@testing-library/react';
+import { fireEvent, screen, waitFor } from '@testing-library/react';
 import { camelCaseObject } from '@edx/frontend-platform';
 import { DashboardContext, initialStateValue } from '../../../testData/Dashboard';
 import DashboardDataTable from '../DashboardDataTable';
 import { sampleDataTableData } from '../../../testData/constants';
+import SubsidyApiService from '../../../../data/services/SubsidyApiService'
 
 // Mock the debounce function
 jest.mock('lodash.debounce', () => jest.fn((fn) => fn));
 
 // Mock the subsidy list
 const mockGetAllSubsidiesData = sampleDataTableData(10);
-jest.mock('../../../../data/services/SubsidyApiService', () => ({
-  getAllSubsidies: () => Promise.resolve({
-    data: mockGetAllSubsidiesData,
-  }),
-}));
+const apiMock = jest
+  .spyOn(SubsidyApiService, 'getAllSubsidies')
+  .mockImplementation(() => Promise.resolve({ data: mockGetAllSubsidiesData }));
 
 // Mock the enterprise customers list
 const mockCustomerData = camelCaseObject(mockGetAllSubsidiesData).results.map((subsidy) => ({
@@ -47,3 +46,24 @@ describe('DashboardDatatable', () => {
     await waitFor(() => expect(screen.getByText('Enterprise Customer 1')).toBeTruthy());
   });
 });
+
+describe('DashboardDatatable SortBy', ()=> {
+  it('sorts the data asc and desc', async ()=> {
+    renderWithRouter(<DashboardDatatableWrapper />);
+    const tableHeader = screen.getByText('Start date');
+
+    fireEvent.click(tableHeader);
+    await waitFor(() => expect(apiMock).toHaveBeenCalledWith(
+      expect.objectContaining({
+        sortBy: 'active_datetime'
+      })
+    ));
+
+    fireEvent.click(tableHeader);
+    await waitFor(() => expect(apiMock).toHaveBeenCalledWith(
+      expect.objectContaining({
+        sortBy: '-active_datetime'
+      })
+    ));
+  });
+});

src/Configuration/Provisioning/data/utils.js

@@ -7,6 +7,7 @@ import LmsApiService from '../../../data/services/EnterpriseApiService';
 import SubsidyApiService from '../../../data/services/SubsidyApiService';
 import { isValidOpportunityProduct } from '../../../utils';
 import { PREDEFINED_QUERY_DISPLAY_NAMES } from './constants';
+import snakeCase from 'lodash.snakecase';
 
 export const indexOnlyPropType = {
   index: PropTypes.number.isRequired,
@@ -650,10 +651,13 @@ export function sortDataTableData({ sortBy }) {
   if (!sortByObject) {
     return null;
   }
-  if (sortByObject.id === 'isActive') {
-    return sortByObject.desc ? '-expirationDatetime' : 'expirationDatetime';
+  let sortString = sortByObject.id;
+  if ( sortString === 'isActive') {
+     sortString = 'expirationDatetime';
   }
-  return sortByObject.desc ? `-${sortByObject.id}` : sortByObject.id;
+  sortString = snakeCase(sortString);
+  sortString = sortByObject.desc ? `-${sortString}` : sortString;
+  return sortString;
 }
 
 /**

src/data/services/SubsidyApiService.js

@@ -14,7 +14,7 @@ class SubsidyApiService {
     const subsidiesURL = `${getConfig().SUBSIDY_BASE_URL}/api/v1/subsidies/`;
     const optionalUrlParams = new URLSearchParams(snakeCaseObject({
       pageSize,
-      sortBy: sortBy ? snakeCase(sortBy) : 'uuid',
+      sortBy: sortBy ? sortBy : 'uuid',
       ...filteredData,
     })).toString();
     return SubsidyApiService.apiClient().get(`${subsidiesURL}?page=${pageIndex}&${optionalUrlParams}`);