diff --git a/src/discussions/data/hooks.js b/src/discussions/data/hooks.js index 1b86eb4d..2ac3f0fe 100644 --- a/src/discussions/data/hooks.js +++ b/src/discussions/data/hooks.js @@ -13,6 +13,8 @@ import { getAuthenticatedUser } from '@edx/frontend-platform/auth'; import { useIntl } from '@edx/frontend-platform/i18n'; import { AppContext } from '@edx/frontend-platform/react'; +import selectCourseTabs from '../../components/NavigationBar/data/selectors'; +import { LOADED } from '../../components/NavigationBar/data/slice'; import fetchTab from '../../components/NavigationBar/data/thunks'; import { RequestStatus, Routes } from '../../data/constants'; import { selectTopicsUnderCategory } from '../../data/selectors'; @@ -32,6 +34,7 @@ import { selectIsCourseAdmin, selectIsCourseStaff, selectIsPostingEnabled, + selectIsUserLearner, selectPostThreadCount, selectUserHasModerationPrivileges, selectUserIsGroupTa, @@ -72,22 +75,34 @@ export const useSidebarVisible = () => { return !hideSidebar; }; -export function useCourseDiscussionData(courseId, isEnrolled) { +export function useCourseDiscussionData(courseId) { const dispatch = useDispatch(); - const { authenticatedUser } = useContext(AppContext); useEffect(() => { async function fetchBaseData() { - if (isEnrolled) { - await dispatch(fetchCourseConfig(courseId)); + await dispatch(fetchCourseConfig(courseId)); + await dispatch(fetchTab(courseId)); + } + + fetchBaseData(); + }, [courseId]); +} + +export function useCourseBlockData(courseId) { + const dispatch = useDispatch(); + const { authenticatedUser } = useContext(AppContext); + const { isEnrolled, courseStatus } = useSelector(selectCourseTabs); + const isUserLearner = useSelector(selectIsUserLearner); + + useEffect(() => { + async function fetchBaseData() { + if (courseStatus === LOADED && (!isUserLearner || isEnrolled)) { await dispatch(fetchCourseBlocks(courseId, authenticatedUser.username)); - } else { - await dispatch(fetchTab(courseId)); } } fetchBaseData(); - }, [courseId, isEnrolled]); + }, [courseId, isEnrolled, courseStatus, isUserLearner]); } export function useRedirectToThread(courseId, enableInContextSidebar) { diff --git a/src/discussions/data/selectors.js b/src/discussions/data/selectors.js index cd6da322..3fab39e9 100644 --- a/src/discussions/data/selectors.js +++ b/src/discussions/data/selectors.js @@ -1,8 +1,8 @@ import { createSelector } from '@reduxjs/toolkit'; import selectCourseTabs from '../../components/NavigationBar/data/selectors'; -import { LOADED } from '../../components/NavigationBar/data/slice'; import { PostsStatusFilter, ThreadType } from '../../data/constants'; +import { isCourseStatusValid } from '../utils'; export const selectAnonymousPostingConfig = state => ({ allowAnonymous: state.config.allowAnonymous, @@ -86,7 +86,7 @@ export const selectIsUserLearner = createSelector( && !userIsStaff && !userIsCourseAdmin && !userIsCourseStaff - && courseStatus === LOADED + && isCourseStatusValid(courseStatus) ) || false ), ); diff --git a/src/discussions/discussions-home/DiscussionsHome.jsx b/src/discussions/discussions-home/DiscussionsHome.jsx index 06a302b6..a3ba4bfe 100644 --- a/src/discussions/discussions-home/DiscussionsHome.jsx +++ b/src/discussions/discussions-home/DiscussionsHome.jsx @@ -12,12 +12,11 @@ import { LearningHeader as Header } from '@edx/frontend-component-header'; import { Spinner } from '../../components'; import selectCourseTabs from '../../components/NavigationBar/data/selectors'; -import { LOADED } from '../../components/NavigationBar/data/slice'; import { ALL_ROUTES, DiscussionProvider, Routes as ROUTES } from '../../data/constants'; import DiscussionContext from '../common/context'; import ContentUnavailable from '../content-unavailable/ContentUnavailable'; import { - useCourseDiscussionData, useIsOnDesktop, useRedirectToThread, useSidebarVisible, + useCourseBlockData, useCourseDiscussionData, useIsOnDesktop, useRedirectToThread, useSidebarVisible, } from '../data/hooks'; import { selectDiscussionProvider, selectEnableInContext, selectIsUserLearner } from '../data/selectors'; import { EmptyLearners, EmptyTopics } from '../empty-posts'; @@ -25,6 +24,7 @@ import EmptyPosts from '../empty-posts/EmptyPosts'; import { EmptyTopic as InContextEmptyTopics } from '../in-context-topics/components'; import messages from '../messages'; import { selectPostEditorVisible } from '../posts/data/selectors'; +import { isCourseStatusValid } from '../utils'; import useFeedbackWrapper from './FeedbackWrapper'; const Footer = lazy(() => import('@edx/frontend-component-footer')); @@ -58,8 +58,9 @@ const DiscussionsHome = () => { courseId, postId, topicId, category, learnerUsername, } = params; - useCourseDiscussionData(courseId, isEnrolled); + useCourseDiscussionData(courseId); useRedirectToThread(courseId, enableInContextSidebar); + useCourseBlockData(courseId); useFeedbackWrapper(); /* Display the content area if we are currently viewing/editing a post or creating one. If the window is larger than a particular size, show the sidebar for navigating between posts/topics. @@ -120,7 +121,7 @@ const DiscussionsHome = () => { )} - {(courseStatus === LOADED) && ( + {isCourseStatusValid(courseStatus) && ( !isEnrolled && isUserLearner ? ( )}> diff --git a/src/discussions/discussions-home/DiscussionsHome.test.jsx b/src/discussions/discussions-home/DiscussionsHome.test.jsx index d855ec42..e44c252b 100644 --- a/src/discussions/discussions-home/DiscussionsHome.test.jsx +++ b/src/discussions/discussions-home/DiscussionsHome.test.jsx @@ -230,7 +230,7 @@ describe('DiscussionsHome', () => { it('should display post editor form when click on add a post button in legacy topics view', async () => { axiosMock.onGet(getDiscussionsConfigUrl(courseId)).reply(200, { - enable_in_context: false, + enable_in_context: false, hasModerationPrivileges: true, }); await executeThunk(fetchCourseConfig(courseId), store.dispatch, store.getState); await renderComponent(`/${courseId}/topics`); diff --git a/src/discussions/utils.js b/src/discussions/utils.js index 4ff0893e..71167040 100644 --- a/src/discussions/utils.js +++ b/src/discussions/utils.js @@ -14,6 +14,7 @@ import { import { getConfig } from '@edx/frontend-platform'; +import { DENIED, LOADED } from '../components/NavigationBar/data/slice'; import { ContentActions, Routes, ThreadType, } from '../data/constants'; @@ -313,3 +314,5 @@ export function getAuthorLabel(intl, authorLabel) { return authorLabelMappings[authorLabel] || {}; } + +export const isCourseStatusValid = (courseStatus) => [DENIED, LOADED].includes(courseStatus);