Migrate from Redux to React Query and React Context. This modernizes state management while maintaining all existing functionality. All the redux code and files were removed, including all redux and related packages.
42 lines
1.2 KiB
JavaScript
42 lines
1.2 KiB
JavaScript
import React from 'react';
|
|
import { useIntl } from '@edx/frontend-platform/i18n';
|
|
import { Button, Image } from '@openedx/paragon';
|
|
import { Search } from '@openedx/paragon/icons';
|
|
import { baseAppUrl } from 'data/services/lms/urls';
|
|
|
|
import emptyCourseSVG from 'assets/empty-course.svg';
|
|
import { useInitializeLearnerHome } from 'data/hooks';
|
|
|
|
import messages from './messages';
|
|
import './index.scss';
|
|
|
|
export const NoCoursesView = () => {
|
|
const { formatMessage } = useIntl();
|
|
const { data: learnerData } = useInitializeLearnerHome();
|
|
const courseSearchUrl = learnerData?.platformSettings?.courseSearchUrl || '';
|
|
return (
|
|
<div
|
|
id="no-courses-content-view"
|
|
className="d-flex align-items-center justify-content-center mb-4.5"
|
|
>
|
|
<Image src={emptyCourseSVG} alt={formatMessage(messages.bannerAlt)} />
|
|
<h3 className="h1">
|
|
{formatMessage(messages.lookingForChallengePrompt)}
|
|
</h3>
|
|
<p>
|
|
{formatMessage(messages.exploreCoursesPrompt)}
|
|
</p>
|
|
<Button
|
|
variant="brand"
|
|
as="a"
|
|
href={baseAppUrl(courseSearchUrl)}
|
|
iconBefore={Search}
|
|
>
|
|
{formatMessage(messages.exploreCoursesButton)}
|
|
</Button>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default NoCoursesView;
|