From af494d5e13070f3ceb905f402401f2a7b3a78cce Mon Sep 17 00:00:00 2001 From: Jesper Hodge Date: Wed, 3 Apr 2024 11:18:53 -0400 Subject: [PATCH] feat: add basic pagination --- .env.development | 1 + src/index.jsx | 1 + src/studio-home/StudioHome.jsx | 3 +++ src/studio-home/data/api.js | 5 +++++ src/studio-home/data/api.test.js | 4 ++-- src/studio-home/data/thunks.js | 7 +++++-- src/studio-home/tabs-section/index.jsx | 6 +++++- 7 files changed, 22 insertions(+), 5 deletions(-) diff --git a/.env.development b/.env.development index 5a4f81529..597991678 100644 --- a/.env.development +++ b/.env.development @@ -44,4 +44,5 @@ HOTJAR_DEBUG=true INVITE_STUDENTS_EMAIL_TO="someone@domain.com" AI_TRANSLATIONS_BASE_URL='http://localhost:18760' ENABLE_HOME_PAGE_COURSE_API_V2='true' +ENABLE_HOME_PAGE_LIBRARY_API_V2=true ENABLE_CHECKLIST_QUALITY=true diff --git a/src/index.jsx b/src/index.jsx index e270d39ba..05dbd6dd0 100755 --- a/src/index.jsx +++ b/src/index.jsx @@ -126,6 +126,7 @@ initialize({ ENABLE_VIDEO_UPLOAD_PAGE_LINK_IN_CONTENT_DROPDOWN: process.env.ENABLE_VIDEO_UPLOAD_PAGE_LINK_IN_CONTENT_DROPDOWN || 'false', ENABLE_TAGGING_TAXONOMY_PAGES: process.env.ENABLE_TAGGING_TAXONOMY_PAGES || 'false', ENABLE_HOME_PAGE_COURSE_API_V2: process.env.ENABLE_HOME_PAGE_COURSE_API_V2 || 'false', + ENABLE_HOME_PAGE_LIBRARY_API_V2: process.env.ENABLE_HOME_PAGE_LIBRARY_API_V2 || 'false', ENABLE_CHECKLIST_QUALITY: process.env.ENABLE_CHECKLIST_QUALITY || 'true', }, 'CourseAuthoringConfig'); }, diff --git a/src/studio-home/StudioHome.jsx b/src/studio-home/StudioHome.jsx index cd4542e05..843d7e195 100644 --- a/src/studio-home/StudioHome.jsx +++ b/src/studio-home/StudioHome.jsx @@ -27,6 +27,8 @@ import AlertMessage from '../generic/alert-message'; const StudioHome = ({ intl }) => { const isPaginationCoursesEnabled = getConfig().ENABLE_HOME_PAGE_COURSE_API_V2 === 'true'; + const isPaginationLibrariesEnabled = getConfig().ENABLE_HOME_PAGE_LIBRARY_API_V2 === 'true'; + const { isLoadingPage, isFailedLoadingPage, @@ -141,6 +143,7 @@ const StudioHome = ({ intl }) => { isShowProcessing={isShowProcessing} dispatch={dispatch} isPaginationCoursesEnabled={isPaginationCoursesEnabled} + isPaginationLibrariesEnabled={isPaginationLibrariesEnabled} /> diff --git a/src/studio-home/data/api.js b/src/studio-home/data/api.js index e94d5f3f6..45ba73af4 100644 --- a/src/studio-home/data/api.js +++ b/src/studio-home/data/api.js @@ -39,6 +39,11 @@ export async function getStudioHomeLibraries() { return camelCaseObject(data); } +export async function getStudioHomeLibrariesV2(customParams) { + const { data } = await getAuthenticatedHttpClient().get(`${getApiBaseUrl()}/api/contentstore/v2/home/libraries`, { params: customParams }); + return camelCaseObject(data); +} + /** * Handle course notification requests. * @param {string} url diff --git a/src/studio-home/data/api.test.js b/src/studio-home/data/api.test.js index 7e34ccc22..593a2730d 100644 --- a/src/studio-home/data/api.test.js +++ b/src/studio-home/data/api.test.js @@ -44,7 +44,7 @@ describe('studio-home api calls', () => { expect(result).toEqual(expected); }); - fit('should get studio courses data', async () => { + it('should get studio courses data', async () => { const apiLink = `${getApiBaseUrl()}/api/contentstore/v1/home/courses`; axiosMock.onGet(apiLink).reply(200, generateGetStudioCoursesApiResponse()); const result = await getStudioHomeCourses(''); @@ -54,7 +54,7 @@ describe('studio-home api calls', () => { expect(result).toEqual(expected); }); - fit('should get studio courses data v2', async () => { + it('should get studio courses data v2', async () => { const apiLink = `${getApiBaseUrl()}/api/contentstore/v2/home/courses`; axiosMock.onGet(apiLink).reply(200, generateGetStudioCoursesApiResponse()); const result = await getStudioHomeCoursesV2(''); diff --git a/src/studio-home/data/thunks.js b/src/studio-home/data/thunks.js index 495a726aa..eab793bd3 100644 --- a/src/studio-home/data/thunks.js +++ b/src/studio-home/data/thunks.js @@ -5,6 +5,7 @@ import { handleCourseNotification, getStudioHomeCourses, getStudioHomeLibraries, + getStudioHomeLibrariesV2, getStudioHomeCoursesV2, } from './api'; import { @@ -47,12 +48,14 @@ function fetchStudioHomeData(search, hasHomeData, requestParams = {}, isPaginati }; } -function fetchLibraryData() { +function fetchLibraryData(isPaginationEnabled = false, requestParams = {}) { return async (dispatch) => { dispatch(updateLoadingStatuses({ libraryLoadingStatus: RequestStatus.IN_PROGRESS })); try { - const libraryData = await getStudioHomeLibraries(); + const libraryData = isPaginationEnabled + ? await getStudioHomeLibrariesV2(requestParams) + : await getStudioHomeLibraries(); dispatch(fetchLibraryDataSuccess(libraryData)); dispatch(updateLoadingStatuses({ libraryLoadingStatus: RequestStatus.SUCCESSFUL })); } catch (error) { diff --git a/src/studio-home/tabs-section/index.jsx b/src/studio-home/tabs-section/index.jsx index 471b51564..871bd0db8 100644 --- a/src/studio-home/tabs-section/index.jsx +++ b/src/studio-home/tabs-section/index.jsx @@ -19,6 +19,7 @@ const TabsSection = ({ isShowProcessing, dispatch, isPaginationCoursesEnabled, + isPaginationLibrariesEnabled, }) => { const TABS_LIST = { courses: 'courses', @@ -94,6 +95,7 @@ const TabsSection = ({ libraries={libraries} isLoading={isLoadingLibraries} isFailed={isFailedLibrariesPage} + isEnabledPagination={isPaginationLibrariesEnabled} /> )} , @@ -107,7 +109,7 @@ const TabsSection = ({ if (tab === TABS_LIST.libraries && redirectToLibraryAuthoringMfe) { window.location.assign(libraryAuthoringMfeUrl); } else if (tab === TABS_LIST.libraries && !redirectToLibraryAuthoringMfe) { - dispatch(fetchLibraryData()); + dispatch(fetchLibraryData(isPaginationLibrariesEnabled)); } setTabKey(tab); }; @@ -126,6 +128,7 @@ const TabsSection = ({ TabsSection.defaultProps = { isPaginationCoursesEnabled: false, + isPaginationLibrariesEnabled: false, }; TabsSection.propTypes = { @@ -135,6 +138,7 @@ TabsSection.propTypes = { isShowProcessing: PropTypes.bool.isRequired, dispatch: PropTypes.func.isRequired, isPaginationCoursesEnabled: PropTypes.bool, + isPaginationLibrariesEnabled: PropTypes.bool, }; export default injectIntl(TabsSection);