diff --git a/src/CourseAuthoringPage.jsx b/src/CourseAuthoringPage.jsx index 41da0bc232..84662e2ac3 100644 --- a/src/CourseAuthoringPage.jsx +++ b/src/CourseAuthoringPage.jsx @@ -7,7 +7,7 @@ import { } from 'react-router-dom'; import { StudioFooter } from '@edx/frontend-component-footer'; import Header from './header'; -import { fetchCourseDetail } from './data/thunks'; +import { fetchCourseDetail, fetchWaffleFlags } from './data/thunks'; import { useModel } from './generic/model-store'; import NotFoundAlert from './generic/NotFoundAlert'; import PermissionDeniedAlert from './generic/PermissionDeniedAlert'; @@ -18,9 +18,12 @@ import Loading from './generic/Loading'; const CourseAuthoringPage = ({ courseId, children }) => { const dispatch = useDispatch(); + const STORE = useSelector(state => state); + console.log('STORE', STORE); useEffect(() => { dispatch(fetchCourseDetail(courseId)); + dispatch(fetchWaffleFlags(courseId)); }, [courseId]); useEffect(() => { diff --git a/src/course-checklist/ChecklistSection/ChecklistItemBody.jsx b/src/course-checklist/ChecklistSection/ChecklistItemBody.jsx index 96a143e80c..6625333919 100644 --- a/src/course-checklist/ChecklistSection/ChecklistItemBody.jsx +++ b/src/course-checklist/ChecklistSection/ChecklistItemBody.jsx @@ -10,7 +10,6 @@ import { import { useSelector } from 'react-redux'; import { CheckCircle, RadioButtonUnchecked } from '@openedx/paragon/icons'; -import { getStudioHomeData } from '../../studio-home/data/selectors'; import messages from './messages'; const ChecklistItemBody = ({ @@ -21,13 +20,13 @@ const ChecklistItemBody = ({ // injected intl, }) => { - const studioHomeData = useSelector(getStudioHomeData); + const waffleFlags = useSelector(state => state.courseDetail.waffleFlags); const navigate = useNavigate(); const handleClick = (e, url) => { e.preventDefault(); - if (studioHomeData?.waffleFlags?.ENABLE_NEW_COURSE_UPDATES_PAGE) { + if (waffleFlags?.useNewUpdatesPage) { navigate(`/course/${courseId}/course_info`); } else { window.location.href = url; diff --git a/src/course-outline/hooks.jsx b/src/course-outline/hooks.jsx index 768939baf7..0f1254d2cf 100644 --- a/src/course-outline/hooks.jsx +++ b/src/course-outline/hooks.jsx @@ -8,7 +8,6 @@ import { copyToClipboard } from '../generic/data/thunks'; import { getSavingStatus as getGenericSavingStatus } from '../generic/data/selectors'; import { RequestStatus } from '../data/constants'; import { COURSE_BLOCK_NAMES } from './constants'; -import { getStudioHomeData } from '../studio-home/data/selectors'; import { setCurrentItem, setCurrentSection, @@ -59,7 +58,7 @@ import { const useCourseOutline = ({ courseId }) => { const dispatch = useDispatch(); const navigate = useNavigate(); - const { waffleFlags } = useSelector(getStudioHomeData); + const waffleFlags = useSelector(state => state.courseDetail.waffleFlags); const { reindexLink, @@ -114,7 +113,7 @@ const useCourseOutline = ({ courseId }) => { }; const getUnitUrl = (locator) => { - if (getConfig().ENABLE_UNIT_PAGE === 'true' || waffleFlags?.ENABLE_NEW_UNIT_PAGE) { + if (getConfig().ENABLE_UNIT_PAGE === 'true' || waffleFlags?.useNewUnitPage) { return `/course/${courseId}/container/${locator}`; } return `${getConfig().STUDIO_BASE_URL}/container/${locator}`; @@ -122,7 +121,7 @@ const useCourseOutline = ({ courseId }) => { const openUnitPage = (locator) => { const url = getUnitUrl(locator); - if (getConfig().ENABLE_UNIT_PAGE === 'true' || waffleFlags?.ENABLE_NEW_UNIT_PAGE) { + if (getConfig().ENABLE_UNIT_PAGE === 'true' || waffleFlags?.useNewUnitPage) { navigate(url); } else { window.location.assign(url); diff --git a/src/course-outline/status-bar/StatusBar.jsx b/src/course-outline/status-bar/StatusBar.jsx index 9d671530e1..a2ad214b2c 100644 --- a/src/course-outline/status-bar/StatusBar.jsx +++ b/src/course-outline/status-bar/StatusBar.jsx @@ -15,7 +15,6 @@ import TagCount from '../../generic/tag-count'; import { useHelpUrls } from '../../help-urls/hooks'; import { VIDEO_SHARING_OPTIONS } from '../constants'; import { useContentTagsCount } from '../../generic/data/apiHooks'; -import { getStudioHomeData } from '../../studio-home/data/selectors'; import messages from './messages'; import { getVideoSharingOptionText } from '../utils'; @@ -46,7 +45,7 @@ const StatusBar = ({ }) => { const intl = useIntl(); const { config } = useContext(AppContext); - const { waffleFlags } = useSelector(getStudioHomeData); + const waffleFlags = useSelector(state => state.courseDetail.waffleFlags); const { courseReleaseDate, @@ -87,7 +86,7 @@ const StatusBar = ({ {courseReleaseDateObj.isValid() ? ( { @@ -18,11 +17,11 @@ const Breadcrumbs = () => { const { ancestorXblocks } = useSelector(getCourseSectionVertical); const [section, subsection] = ancestorXblocks ?? []; const navigate = useNavigate(); - const { waffleFlags } = useSelector(getStudioHomeData); + const waffleFlags = useSelector(state => state.courseDetail.waffleFlags); const handleClick = (e, url) => { e.preventDefault(); - if (waffleFlags?.ENABLE_NEW_COURSE_OUTLINE_PAGE) { + if (waffleFlags?.useNewCourseOutlinePage) { navigate(url); } else { window.location.href = `${getConfig().STUDIO_BASE_URL}/${url}`; diff --git a/src/data/api.js b/src/data/api.js index e338ee54be..22072ae160 100644 --- a/src/data/api.js +++ b/src/data/api.js @@ -15,3 +15,29 @@ export async function getCourseDetail(courseId, username) { return normalizeCourseDetail(data); } + +export async function getWaffleFlags(courseId) { + // const { data } = await getAuthenticatedHttpClient() + // .get(`${getConfig().STUDIO_BASE_URL}/api/contentstore/v1/course_waffle_flags`); + + const data = { + use_new_home_page: true, + use_new_custom_pages: true, + use_new_schedule_details_page: true, + use_new_advanced_settings_page: true, + use_new_grading_page: true, + use_new_updates_page: true, + use_new_import_page: true, + use_new_export_page: true, + use_new_files_uploads_page: true, + use_new_video_uploads_page: true, + use_new_course_outline_page: true, + use_new_unit_page: true, + use_new_course_team_page: true, + use_new_certificates_page: true, + use_new_textbooks_page: true, + use_new_group_configurations_page: true, + }; + + return normalizeCourseDetail(data); +} diff --git a/src/data/slice.js b/src/data/slice.js index 749e53f2be..bdc91917ca 100644 --- a/src/data/slice.js +++ b/src/data/slice.js @@ -18,12 +18,16 @@ const slice = createSlice({ updateCanChangeProviders: (state, { payload }) => { state.canChangeProviders = payload.canChangeProviders; }, + fetchWaffleFlagsSuccess: (state, { payload }) => { + state.waffleFlags = payload.waffleFlags; + }, }, }); export const { updateStatus, updateCanChangeProviders, + fetchWaffleFlagsSuccess, } = slice.actions; export const { diff --git a/src/data/thunks.js b/src/data/thunks.js index 9c797dc6a5..2ae6f426f2 100644 --- a/src/data/thunks.js +++ b/src/data/thunks.js @@ -1,13 +1,13 @@ import { getAuthenticatedUser } from '@edx/frontend-platform/auth'; import { addModel } from '../generic/model-store'; -import { getCourseDetail } from './api'; +import { getCourseDetail, getWaffleFlags } from './api'; import { updateStatus, updateCanChangeProviders, + fetchWaffleFlagsSuccess, } from './slice'; import { RequestStatus } from './constants'; -/* eslint-disable import/prefer-default-export */ export function fetchCourseDetail(courseId) { return async (dispatch) => { dispatch(updateStatus({ courseId, status: RequestStatus.IN_PROGRESS })); @@ -29,3 +29,22 @@ export function fetchCourseDetail(courseId) { } }; } + +export function fetchWaffleFlags(courseId) { + return async (dispatch) => { + dispatch(updateStatus({ courseId, status: RequestStatus.IN_PROGRESS })); + + try { + const waffleFlags = await getWaffleFlags(courseId); + dispatch(updateStatus({ courseId, status: RequestStatus.SUCCESSFUL })); + console.log('fetchWaffleFlags thunk', waffleFlags); + dispatch(fetchWaffleFlagsSuccess({ waffleFlags })); + } catch (error) { + if (error.response && error.response.status === 404) { + dispatch(updateStatus({ courseId, status: RequestStatus.NOT_FOUND })); + } else { + dispatch(updateStatus({ courseId, status: RequestStatus.FAILED })); + } + } + }; +} diff --git a/src/generic/help-sidebar/HelpSidebar.jsx b/src/generic/help-sidebar/HelpSidebar.jsx index 9458e6519f..0017d0512d 100644 --- a/src/generic/help-sidebar/HelpSidebar.jsx +++ b/src/generic/help-sidebar/HelpSidebar.jsx @@ -26,7 +26,7 @@ const HelpSidebar = ({ scheduleAndDetails, groupConfigurations, } = otherLinkURLParams; - const { waffleFlags } = useSelector(getStudioHomeData); + const waffleFlags = useSelector(state => state.courseDetail.waffleFlags); const showOtherLink = (params) => !pathname.includes(params); const generateLegacyURL = (urlParameter) => { @@ -57,46 +57,46 @@ const HelpSidebar = ({