fix: Set active courses as default in studio home

openedx · Sep 17, 2024 · 85d498d · 85d498d
1 parent 82a3b7c
commit 85d498d
Show file tree

Hide file tree

Showing 8 changed files with 59 additions and 13 deletions.
diff --git a/src/studio-home/StudioHome.test.jsx b/src/studio-home/StudioHome.test.jsx
@@ -42,6 +42,11 @@ jest.mock('react-router-dom', () => ({
   useNavigate: () => mockNavigate,
 }));
 
+jest.mock('@edx/frontend-platform', () => ({
+  ...jest.requireActual('@edx/frontend-platform'),
+  getConfig: jest.fn(),
+}));
+
 const queryClient = new QueryClient();
 
 const RootWrapper = () => (
@@ -72,6 +77,9 @@ const RootWrapper = () => (
 describe('<StudioHome />', () => {
   describe('api fetch fails', () => {
     beforeEach(async () => {
+      getConfig.mockImplementation(() => ({
+        ...jest.requireActual('@edx/frontend-platform').getConfig(),
+      }));
       initializeMockApp({
         authenticatedUser: {
           userId: 3,
@@ -100,6 +108,9 @@ describe('<StudioHome />', () => {
 
   describe('api fetch succeeds', () => {
     beforeEach(async () => {
+      getConfig.mockImplementation(() => ({
+        ...jest.requireActual('@edx/frontend-platform').getConfig(),
+      }));
       initializeMockApp({
         authenticatedUser: {
           userId: 3,
@@ -332,5 +343,40 @@ describe('<StudioHome />', () => {
       expect(getByText('Looking for help with Studio?')).toBeInTheDocument();
       expect(getByText('LMS')).toHaveAttribute('href', process.env.LMS_BASE_URL);
     });
+
+    describe('Enable pagination', () => {
+      beforeEach(async () => {
+        getConfig.mockImplementation(() => ({
+          ...jest.requireActual('@edx/frontend-platform').getConfig(),
+          ENABLE_HOME_PAGE_COURSE_API_V2: true,
+        }));
+        initializeMockApp({
+          authenticatedUser: {
+            userId: 3,
+            username: 'abc123',
+            administrator: true,
+            roles: [],
+          },
+        });
+        store = initializeStore();
+        axiosMock = new MockAdapter(getAuthenticatedHttpClient());
+        global.window = Object.create(window);
+        Object.defineProperty(window, 'location', {
+          value: {
+            search: '?search=test',
+          },
+        });
+      });
+
+      afterEach(() => {
+        jest.restoreAllMocks();
+      });
+
+      it('should dispatch fetchStudioHomeData with paginated parameters on component mount', async () => {
+        axiosMock.onGet(getStudioHomeApiUrl()).reply(200, studioHomeMock);
+        const { getByText } = render(<RootWrapper />);
+        expect(getByText(`${studioShortName} home`)).toBeInTheDocument();
+      });
+    });
   });
 });
diff --git a/src/studio-home/data/slice.js b/src/studio-home/data/slice.js
@@ -22,7 +22,7 @@ const slice = createSlice({
       search: undefined,
       order: 'display_name',
       archivedOnly: undefined,
-      activeOnly: undefined,
+      activeOnly: true,
       isFiltered: false,
       cleanFilters: false,
     },

diff --git a/src/studio-home/data/slice.test.js b/src/studio-home/data/slice.test.js
@@ -20,7 +20,7 @@ describe('updateStudioHomeCoursesCustomParams action', () => {
       search: undefined,
       order: 'display_name',
       archivedOnly: undefined,
-      activeOnly: undefined,
+      activeOnly: true,
       isFiltered: false,
       cleanFilters: false,
     },

diff --git a/src/studio-home/hooks.jsx b/src/studio-home/hooks.jsx
@@ -33,29 +33,29 @@ const useStudioHome = (isPaginated = false) => {
 
   useEffect(() => {
     if (!isPaginated) {
-      dispatch(fetchStudioHomeData(location.search ?? ''));
+      dispatch(fetchStudioHomeData(location.search ?? '', false, { active_only: true }));
       setShowNewCourseContainer(false);
     }
   }, [location.search]);
 
   useEffect(() => {
     if (isPaginated) {
       const firstPage = 1;
-      dispatch(fetchStudioHomeData(location.search ?? '', false, { page: firstPage }, true));
+      dispatch(fetchStudioHomeData(location.search ?? '', false, { page: firstPage, active_only: true }, true));
     }
   }, []);
 
   useEffect(() => {
     if (courseCreatorSavingStatus === RequestStatus.SUCCESSFUL) {
       dispatch(updateSavingStatuses({ courseCreatorSavingStatus: '' }));
-      dispatch(fetchStudioHomeData());
+      dispatch(fetchStudioHomeData('', false, { active_only: true }));
     }
   }, [courseCreatorSavingStatus]);
 
   useEffect(() => {
     if (deleteNotificationSavingStatus === RequestStatus.SUCCESSFUL) {
       dispatch(updateSavingStatuses({ courseCreatorSavingStatus: '' }));
-      dispatch(fetchStudioHomeData());
+      dispatch(fetchStudioHomeData('', false, { active_only: true }));
     } else if (deleteNotificationSavingStatus === RequestStatus.FAILED) {
       dispatch(updateSavingStatuses({ deleteNotificationSavingStatus: '' }));
     }

diff --git a/src/studio-home/tabs-section/courses-tab/courses-filters/__snapshots__/index.test.jsx.snap b/src/studio-home/tabs-section/courses-tab/courses-filters/__snapshots__/index.test.jsx.snap
@@ -81,7 +81,7 @@ exports[`CoursesFilters snapshot 1`] = `
         id="dropdown-toggle-course-type-menu"
         type="button"
       >
-        All courses
+        Active
       </button>
     </div>
     <div

diff --git a/...n/courses-tab/courses-filters/courses-types-filter-menu/__snapshots__/index.test.jsx.snap b/...n/courses-tab/courses-filters/courses-types-filter-menu/__snapshots__/index.test.jsx.snap
@@ -16,7 +16,7 @@ exports[`CoursesTypesFilterMenu snapshot 1`] = `
       id="dropdown-toggle-course-type-menu"
       type="button"
     >
-      All courses
+      Active
     </button>
   </div>
 </div>

diff --git a/src/studio-home/tabs-section/courses-tab/courses-filters/courses-types-filter-menu/index.jsx b/src/studio-home/tabs-section/courses-tab/courses-filters/courses-types-filter-menu/index.jsx
@@ -39,7 +39,7 @@ const CoursesTypesFilterMenu = ({ onItemMenuSelected }) => {
       id="dropdown-toggle-course-type-menu"
       menuItems={courseTypes}
       onItemMenuSelected={handleCourseTypeSelected}
-      defaultItemSelectedText={intl.formatMessage(messages.coursesTypesFilterMenuAllCurses)}
+      defaultItemSelectedText={intl.formatMessage(messages.coursesTypesFilterMenuActiveCurses)}
     />
   );
 };

diff --git a/...io-home/tabs-section/courses-tab/courses-filters/courses-types-filter-menu/index.test.jsx b/...io-home/tabs-section/courses-tab/courses-filters/courses-types-filter-menu/index.test.jsx
@@ -60,11 +60,11 @@ describe('CoursesTypesFilterMenu', () => {
     const { defaultMessage: activeCoursesMenuText } = message.coursesTypesFilterMenuActiveCurses;
     const { defaultMessage: allCoursesMenuText } = message.coursesTypesFilterMenuAllCurses;
     const { defaultMessage: archiveCoursesMenuText } = message.coursesTypesFilterMenuArchivedCurses;
-    const activeCoursesMenuItem = screen.getByText(activeCoursesMenuText);
-    const allCoursesMenuItem = screen.getByTestId('item-menu-all-courses');
+    const activeCoursesMenuItem = screen.getByTestId('item-menu-active-courses');
+    const allCoursesMenuItem = screen.getByText(allCoursesMenuText);
     const archiveCoursesMenuItem = screen.getByText(archiveCoursesMenuText);
-    expect(activeCoursesMenuItem).toBeInTheDocument();
-    expect(allCoursesMenuItem.textContent).toContain(allCoursesMenuText);
+    expect(activeCoursesMenuItem.textContent).toContain(activeCoursesMenuText);
+    expect(allCoursesMenuItem).toBeInTheDocument();
     expect(archiveCoursesMenuItem).toBeInTheDocument();
   });