Files
frontend-app-learning/src/learning-sequence/sub-section/SubSection.jsx
David Joy d097617feb Locking the current unit and sub section nav when we’re on gated content.
Will follow up with a “locked content” UI in the next commit.
2020-01-13 11:22:30 -05:00

43 lines
1.2 KiB
JavaScript

import React, { useContext } from 'react';
import SubSectionNavigation from './SubSectionNavigation';
import CourseStructureContext from '../CourseStructureContext';
import Unit from './Unit';
import {
useLoadSubSectionMetadata,
useExamRedirect,
usePersistentUnitPosition,
} from './data/hooks';
import SubSectionMetadataContext from './SubSectionMetadataContext';
export default function SubSection() {
const {
courseId,
subSectionId,
unitId,
blocks,
} = useContext(CourseStructureContext);
const { metadata } = useLoadSubSectionMetadata(courseId, subSectionId);
usePersistentUnitPosition(courseId, subSectionId, unitId, metadata);
useExamRedirect(metadata, blocks);
const ready = blocks !== null && metadata !== null;
if (!ready) {
return null;
}
const isGated = metadata.gatedContent.gated;
return (
<SubSectionMetadataContext.Provider value={metadata}>
<section className="d-flex flex-column flex-grow-1">
<SubSectionNavigation />
{isGated && <div>This is gated content.</div>}
{!isGated && <Unit id={unitId} unit={blocks[unitId]} />}
</section>
</SubSectionMetadataContext.Provider>
);
}