diff --git a/judgels-client/src/routes/courses/courses/single/CourseChaptersSidebar/CourseChaptersSidebar.jsx b/judgels-client/src/routes/courses/courses/single/CourseChaptersSidebar/CourseChaptersSidebar.jsx index b559aa628..8bbecc198 100644 --- a/judgels-client/src/routes/courses/courses/single/CourseChaptersSidebar/CourseChaptersSidebar.jsx +++ b/judgels-client/src/routes/courses/courses/single/CourseChaptersSidebar/CourseChaptersSidebar.jsx @@ -10,6 +10,7 @@ import { ProgressTag } from '../../../../../components/ProgressTag/ProgressTag'; import { ProgressBar } from '../../../../../components/ProgressBar/ProgressBar'; import { selectCourse } from '../../modules/courseSelectors'; import { PutCourseChapter } from '../chapters/modules/courseChapterReducer'; +import { selectChapterProblemRefreshKey } from '../chapters/single/problems/single/modules/chapterProblemSelectors'; import * as courseChapterActions from '../chapters/modules/courseChapterActions'; import './CourseChaptersSidebar.scss'; @@ -21,11 +22,19 @@ class CourseChaptersSidebar extends Component { }; async componentDidMount() { - const response = await this.props.onGetChapters(this.props.course.jid); - this.setState({ response }); + await this.refreshChapters(); + } + + async componentDidUpdate(prevProps) { + if (this.props.chapterProblemRefreshKey !== prevProps.chapterProblemRefreshKey) { + await this.refreshChapters(); + } } - componentDidUpdate() {} + refreshChapters = async () => { + const response = await this.props.onGetChapters(this.props.course.jid); + this.setState({ response }); + }; render() { return ( @@ -176,6 +185,7 @@ class CourseChaptersSidebar extends Component { const mapStateToProps = state => ({ course: selectCourse(state), + chapterProblemRefreshKey: selectChapterProblemRefreshKey(state), }); const mapDispatchToProps = { diff --git a/judgels-client/src/routes/courses/courses/single/chapters/single/problems/single/ChapterProblemPage/ChapterProblemPage.jsx b/judgels-client/src/routes/courses/courses/single/chapters/single/problems/single/ChapterProblemPage/ChapterProblemPage.jsx index 245c3f4b4..145394868 100644 --- a/judgels-client/src/routes/courses/courses/single/chapters/single/problems/single/ChapterProblemPage/ChapterProblemPage.jsx +++ b/judgels-client/src/routes/courses/courses/single/chapters/single/problems/single/ChapterProblemPage/ChapterProblemPage.jsx @@ -14,7 +14,7 @@ import { ProblemType } from '../../../../../../../../../modules/api/sandalphon/p import { selectCourse } from '../../../../../../modules/courseSelectors'; import { selectCourseChapter } from '../../../../modules/courseChapterSelectors'; import { selectCourseChapters } from '../../../../modules/courseChaptersSelectors'; -import { selectChapterProblemKey } from '../modules/chapterProblemSelectors'; +import { selectChapterProblemRefreshKey } from '../modules/chapterProblemSelectors'; import { selectStatementLanguage } from '../../../../../../../../../modules/webPrefs/webPrefsSelectors'; import * as chapterProblemActions from '../../modules/chapterProblemActions'; import * as breadcrumbsActions from '../../../../../../../../../modules/breadcrumbs/breadcrumbsActions'; @@ -33,7 +33,7 @@ export class ChapterProblemPage extends Component { async componentDidUpdate(prevProps) { if ( this.props.statementLanguage !== prevProps.statementLanguage || - this.props.chapterProblemKey !== prevProps.chapterProblemKey || + this.props.chapterProblemRefreshKey !== prevProps.chapterProblemRefreshKey || this.props.match.params.problemAlias !== prevProps.match.params.problemAlias ) { await this.refreshProblem(); @@ -155,7 +155,7 @@ const mapStateToProps = state => ({ course: selectCourse(state), chapter: selectCourseChapter(state), chapters: selectCourseChapters(state), - chapterProblemKey: selectChapterProblemKey(state), + chapterProblemRefreshKey: selectChapterProblemRefreshKey(state), statementLanguage: selectStatementLanguage(state), }); const mapDispatchToProps = { diff --git a/judgels-client/src/routes/courses/courses/single/chapters/single/problems/single/modules/chapterProblemReducer.js b/judgels-client/src/routes/courses/courses/single/chapters/single/problems/single/modules/chapterProblemReducer.js index d5d45afdb..99da06d7a 100644 --- a/judgels-client/src/routes/courses/courses/single/chapters/single/problems/single/modules/chapterProblemReducer.js +++ b/judgels-client/src/routes/courses/courses/single/chapters/single/problems/single/modules/chapterProblemReducer.js @@ -1,5 +1,5 @@ export const initialState = { - value: undefined, + refreshKey: undefined, }; export function RefreshChapterProblem(key) { @@ -12,7 +12,7 @@ export function RefreshChapterProblem(key) { export default function chapterProblemReducer(state = initialState, action) { switch (action.type) { case 'jerahmeel/chapterProblem/REFRESH': - return { ...state, value: action.payload }; + return { ...state, refreshKey: action.payload }; default: return state; } diff --git a/judgels-client/src/routes/courses/courses/single/chapters/single/problems/single/modules/chapterProblemSelectors.js b/judgels-client/src/routes/courses/courses/single/chapters/single/problems/single/modules/chapterProblemSelectors.js index 2c1a6ee7f..44d3b7379 100644 --- a/judgels-client/src/routes/courses/courses/single/chapters/single/problems/single/modules/chapterProblemSelectors.js +++ b/judgels-client/src/routes/courses/courses/single/chapters/single/problems/single/modules/chapterProblemSelectors.js @@ -1,3 +1,3 @@ -export function selectChapterProblemKey(state) { - return state.jerahmeel.chapterProblem.value; +export function selectChapterProblemRefreshKey(state) { + return state.jerahmeel.chapterProblem.refreshKey; }