diff --git a/src/studio-home/StudioHome.jsx b/src/studio-home/StudioHome.jsx index f67088aea..01b3e5c8c 100644 --- a/src/studio-home/StudioHome.jsx +++ b/src/studio-home/StudioHome.jsx @@ -74,24 +74,27 @@ const StudioHome = ({ intl }) => { } if (redirectToLibraryAuthoringMfe) { libraryHref = `${libraryAuthoringMfeUrl}/create`; + headerButtons.push( + , + ); } - headerButtons.push( - , - ); return headerButtons; } const headerButtons = userIsActive ? getHeaderButtons() : []; + if (isLoadingPage) { + return (); + } return ( <> @@ -118,22 +121,16 @@ const StudioHome = ({ intl }) => { >
- {isLoadingPage ? ( - - ) : ( - <> - {showNewCourseContainer && ( - setShowNewCourseContainer(false)} /> - )} - {isShowOrganizationDropdown && } - setShowNewCourseContainer(true)} - isShowProcessing={isShowProcessing} - /> - + {showNewCourseContainer && ( + setShowNewCourseContainer(false)} /> )} + {isShowOrganizationDropdown && } + setShowNewCourseContainer(true)} + isShowProcessing={isShowProcessing} + />
diff --git a/src/studio-home/StudioHome.test.jsx b/src/studio-home/StudioHome.test.jsx index 74a47665a..c2fd189e7 100644 --- a/src/studio-home/StudioHome.test.jsx +++ b/src/studio-home/StudioHome.test.jsx @@ -1,6 +1,6 @@ import React from 'react'; import { useSelector } from 'react-redux'; -import { getConfig, initializeMockApp } from '@edx/frontend-platform'; +import { initializeMockApp } from '@edx/frontend-platform'; import { getAuthenticatedHttpClient } from '@edx/frontend-platform/auth'; import { IntlProvider, injectIntl } from '@edx/frontend-platform/i18n'; import { AppProvider } from '@edx/frontend-platform/react'; @@ -116,31 +116,21 @@ describe('', async () => { }); describe('render new library button', () => { - it('href should include #libraries-tab', async () => { + it('should not show button', async () => { useSelector.mockReturnValue({ ...studioHomeMock, courseCreatorStatus: COURSE_CREATOR_STATES.granted, }); - const { getByTestId } = render(); - const createNewLibraryButton = getByTestId('new-library-button'); - expect(createNewLibraryButton.getAttribute('href')).toBe(`${getConfig().STUDIO_BASE_URL}/home#libraries-tab`); - }); - it('href should include home_library', async () => { - useSelector.mockReturnValue({ - ...studioHomeMock, - courseCreatorStatus: COURSE_CREATOR_STATES.granted, - splitStudioHome: true, - }); - - const { getByTestId } = render(); - const createNewLibraryButton = getByTestId('new-library-button'); - expect(createNewLibraryButton.getAttribute('href')).toBe(`${getConfig().STUDIO_BASE_URL}/home_library`); + const { queryByTestId } = render(); + const createNewLibraryButton = queryByTestId('new-library-button'); + expect(createNewLibraryButton).toBeNull(); }); it('href should include create', async () => { useSelector.mockReturnValue({ ...studioHomeMock, courseCreatorStatus: COURSE_CREATOR_STATES.granted, + splitStudioHome: true, redirectToLibraryAuthoringMfe: true, }); const libraryAuthoringMfeUrl = 'http://localhost:3001'; @@ -160,10 +150,8 @@ describe('', async () => { const { getByRole, getByText } = render(); const createNewCourseButton = getByRole('button', { name: messages.addNewCourseBtnText.defaultMessage }); - fireEvent.click(createNewCourseButton); - waitFor(() => { - expect(getByText(createNewCourseMessages.createNewCourse.defaultMessage)).toBeInTheDocument(); - }); + await act(() => fireEvent.click(createNewCourseButton)); + expect(getByText(createNewCourseMessages.createNewCourse.defaultMessage)).toBeInTheDocument(); }); it('should hide create new course container', async () => { @@ -187,6 +175,45 @@ describe('', async () => { }); }); + describe('contact administrator card', () => { + it('should show contact administrator card with no add course buttons', () => { + useSelector.mockReturnValue({ + ...studioHomeMock, + courses: null, + courseCreatorStatus: COURSE_CREATOR_STATES.pending, + }); + const { getByText, queryByText } = render(); + const defaultTitleMessage = messages.defaultSection_1_Title.defaultMessage; + const titleWithStudioName = defaultTitleMessage.replace('{studioShortName}', 'Studio'); + const administratorCardTitle = getByText(titleWithStudioName); + + expect(administratorCardTitle).toBeVisible(); + + const addCourseButton = queryByText(messages.btnAddNewCourseText.defaultMessage); + expect(addCourseButton).toBeNull(); + }); + + it('should show contact administrator card with add course buttons', () => { + useSelector.mockReturnValue({ + ...studioHomeMock, + courses: null, + courseCreatorStatus: COURSE_CREATOR_STATES.granted, + }); + const { getByText, getByTestId } = render(); + const defaultTitleMessage = messages.defaultSection_1_Title.defaultMessage; + const titleWithStudioName = defaultTitleMessage.replace('{studioShortName}', 'Studio'); + const administratorCardTitle = getByText(titleWithStudioName); + + expect(administratorCardTitle).toBeVisible(); + + const addCourseButton = getByTestId('contact-admin-create-course'); + expect(addCourseButton).toBeVisible(); + + fireEvent.click(addCourseButton); + expect(getByTestId('create-course-form')).toBeVisible(); + }); + }); + it('should show footer', () => { const { getByText } = render(); expect(getByText('Looking for help with Studio?')).toBeInTheDocument(); diff --git a/src/studio-home/create-new-course-form/index.jsx b/src/studio-home/create-new-course-form/index.jsx index f0b255bfe..b4c80f15c 100644 --- a/src/studio-home/create-new-course-form/index.jsx +++ b/src/studio-home/create-new-course-form/index.jsx @@ -15,7 +15,7 @@ const CreateNewCourseForm = ({ handleOnClickCancel }) => { }; return ( -
+