refactor: refactor code by creating 1 instance of header instead of 3 (#1164)
* refactor: refactor code by creating single instance of header instead of 3 * refactor: refactor courseStatus comparsion code --------- Co-authored-by: SundasNoreen <sundas.noreen@arbisoft.com>
This commit is contained in:
@@ -4,6 +4,8 @@
|
||||
@import "~@edx/brand/paragon/overrides";
|
||||
|
||||
@import "~@edx/frontend-component-footer/dist/footer";
|
||||
@import "~@edx/frontend-component-header/dist/index";
|
||||
|
||||
|
||||
#root {
|
||||
display: flex;
|
||||
|
||||
@@ -38,18 +38,6 @@ const TabPage = ({ intl, ...props }) => {
|
||||
title,
|
||||
} = useModel('courseHomeMeta', courseId);
|
||||
|
||||
if (courseStatus === 'loading') {
|
||||
return (
|
||||
<>
|
||||
<Header />
|
||||
<PageLoading
|
||||
srMessage={intl.formatMessage(messages.loading)}
|
||||
/>
|
||||
<Footer />
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
if (courseStatus === 'denied') {
|
||||
const redirectUrl = getAccessDeniedRedirectUrl(courseId, activeTabSlug, courseAccess, start);
|
||||
if (redirectUrl) {
|
||||
@@ -57,41 +45,41 @@ const TabPage = ({ intl, ...props }) => {
|
||||
}
|
||||
}
|
||||
|
||||
// Either a success state or a denied state that wasn't redirected above (some tabs handle denied states themselves,
|
||||
// like the outline tab handling unenrolled learners)
|
||||
if (courseStatus === 'loaded' || courseStatus === 'denied') {
|
||||
return (
|
||||
<>
|
||||
<Toast
|
||||
action={toastBodyText ? {
|
||||
label: toastBodyText,
|
||||
href: toastBodyLink,
|
||||
} : null}
|
||||
closeLabel={intl.formatMessage(genericMessages.close)}
|
||||
onClose={() => dispatch(setCallToActionToast({ header: '', link: null, link_text: null }))}
|
||||
show={!!(toastHeader)}
|
||||
>
|
||||
{toastHeader}
|
||||
</Toast>
|
||||
{metadataModel === 'courseHomeMeta' && (<LaunchCourseHomeTourButton srOnly />)}
|
||||
<Header
|
||||
courseOrg={org}
|
||||
courseNumber={number}
|
||||
courseTitle={title}
|
||||
/>
|
||||
<LoadedTabPage {...props} />
|
||||
<Footer />
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
// courseStatus 'failed' and any other unexpected course status.
|
||||
return (
|
||||
<>
|
||||
<Header />
|
||||
<p className="text-center py-5 mx-auto" style={{ maxWidth: '30em' }}>
|
||||
{intl.formatMessage(messages.failure)}
|
||||
</p>
|
||||
{['loaded', 'denied'].includes(courseStatus) && (
|
||||
<>
|
||||
<Toast
|
||||
action={toastBodyText ? {
|
||||
label: toastBodyText,
|
||||
href: toastBodyLink,
|
||||
} : null}
|
||||
closeLabel={intl.formatMessage(genericMessages.close)}
|
||||
onClose={() => dispatch(setCallToActionToast({ header: '', link: null, link_text: null }))}
|
||||
show={!!(toastHeader)}
|
||||
>
|
||||
{toastHeader}
|
||||
</Toast>
|
||||
{metadataModel === 'courseHomeMeta' && (<LaunchCourseHomeTourButton srOnly />)}
|
||||
</>
|
||||
)}
|
||||
|
||||
<Header courseOrg={org} courseNumber={number} courseTitle={title} />
|
||||
|
||||
{courseStatus === 'loading' && (
|
||||
<PageLoading srMessage={intl.formatMessage(messages.loading)} />
|
||||
)}
|
||||
|
||||
{['loaded', 'denied'].includes(courseStatus) && (
|
||||
<LoadedTabPage {...props} />
|
||||
)}
|
||||
|
||||
{/* courseStatus 'failed' and any other unexpected course status. */}
|
||||
{(!['loading', 'loaded', 'denied'].includes(courseStatus)) && (
|
||||
<p className="text-center py-5 mx-auto" style={{ maxWidth: '30em' }}>
|
||||
{intl.formatMessage(messages.failure)}
|
||||
</p>
|
||||
)}
|
||||
<Footer />
|
||||
</>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user