richie 3.0.1.dev8__tar.gz → 3.0.1.dev9__tar.gz

richie-3.0.1.dev9/PKG-INFO

@@ -0,0 +1,161 @@
+Metadata-Version: 2.4
+Name: richie
+Version: 3.0.1.dev9
+Summary: A CMS to build learning portals for open education
+Author-email: "Open FUN (France Université Numérique)" <fun.dev@fun-mooc.fr>
+License: MIT License
+        
+        Copyright (c) 2018-present GIP FUN MOOC.
+        
+        Permission is hereby granted, free of charge, to any person obtaining a copy
+        of this software and associated documentation files (the "Software"), to deal
+        in the Software without restriction, including without limitation the rights
+        to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+        copies of the Software, and to permit persons to whom the Software is
+        furnished to do so, subject to the following conditions:
+        
+        The above copyright notice and this permission notice shall be included in all
+        copies or substantial portions of the Software.
+        
+        THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+        IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+        FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+        AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+        LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+        OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+        SOFTWARE.
+        
+        
+Project-URL: Bug Tracker, https://github.com/openfun/richie/issues/new
+Project-URL: Changelog, https://github.com/openfun/richie/blob/master/CHANGELOG.md
+Project-URL: Homepage, https://github.com/openfun/richie
+Project-URL: Repository, https://github.com/openfun/richie
+Project-URL: Documentation, https://richie.education/
+Project-URL: Demonstration website, https://demo.richie.education/
+Keywords: Django,Django-CMS,Open edX
+Classifier: Development Status :: 5 - Production/Stable
+Classifier: Framework :: Django
+Classifier: Framework :: Django :: 4
+Classifier: Intended Audience :: Developers
+Classifier: License :: OSI Approved :: MIT License
+Classifier: Natural Language :: English
+Classifier: Programming Language :: Python :: 3
+Classifier: Programming Language :: Python :: 3.8
+Classifier: Programming Language :: Python :: 3.9
+Classifier: Programming Language :: Python :: 3.10
+Classifier: Programming Language :: Python :: 3.11
+Requires-Python: >=3.8
+Description-Content-Type: text/markdown
+License-File: LICENSE
+Requires-Dist: arrow<2
+Requires-Dist: babel<3
+Requires-Dist: Django<5
+Requires-Dist: djangocms-file<4
+Requires-Dist: djangocms-googlemap<3
+Requires-Dist: djangocms-link<6,>=5.0.0
+Requires-Dist: djangocms-picture<5
+Requires-Dist: djangocms-text-ckeditor<6
+Requires-Dist: djangocms-video<4
+Requires-Dist: djangorestframework<4
+Requires-Dist: django-autocomplete-light<4
+Requires-Dist: django-cms<4.0.0,>=3.11.0
+Requires-Dist: django-parler<3,>=2.3
+Requires-Dist: django-redis<6,>=4.11.0
+Requires-Dist: django-treebeard<5
+Requires-Dist: dj-pagination<3
+Requires-Dist: easy_thumbnails[svg]<3,>=2.8
+Requires-Dist: elasticsearch<7.0.0,>=6.0.0
+Requires-Dist: exrex<1
+Requires-Dist: importlib-metadata<9
+Requires-Dist: oauthlib<4,>=3.2.2
+Requires-Dist: requests<3,>=2.32.3
+Provides-Extra: dev
+Requires-Dist: bandit==1.8.3; extra == "dev"
+Requires-Dist: black==25.1.0; extra == "dev"
+Requires-Dist: pyRdfa3==3.6.4; extra == "dev"
+Requires-Dist: cssselect==1.3.0; extra == "dev"
+Requires-Dist: factory-boy==3.3.3; extra == "dev"
+Requires-Dist: flake8==7.2.0; extra == "dev"
+Requires-Dist: flake8-pyproject==1.2.3; extra == "dev"
+Requires-Dist: htmlmin==0.1.12; extra == "dev"
+Requires-Dist: ipdb==0.13.13; extra == "dev"
+Requires-Dist: ipython==9.0.2; extra == "dev"
+Requires-Dist: isort==6.0.1; extra == "dev"
+Requires-Dist: lxml==5.3.1; extra == "dev"
+Requires-Dist: msgpack==1.1.0; extra == "dev"
+Requires-Dist: mysqlclient==2.2.7; extra == "dev"
+Requires-Dist: pylint==3.3.6; extra == "dev"
+Requires-Dist: pylint-django==2.6.1; extra == "dev"
+Requires-Dist: pytest==8.3.5; extra == "dev"
+Requires-Dist: pytest-cov==6.0.0; extra == "dev"
+Requires-Dist: pytest-django==4.10.0; extra == "dev"
+Requires-Dist: responses==0.25.7; extra == "dev"
+Provides-Extra: ci
+Requires-Dist: twine==6.1.0; extra == "ci"
+Provides-Extra: sandbox
+Requires-Dist: boto3<1.36; extra == "sandbox"
+Requires-Dist: django-storages==1.14.5; extra == "sandbox"
+Requires-Dist: django-configurations==2.5.1; extra == "sandbox"
+Requires-Dist: dockerflow==2024.4.2; extra == "sandbox"
+Requires-Dist: factory-boy==3.3.3; extra == "sandbox"
+Requires-Dist: gunicorn==23.0.0; extra == "sandbox"
+Requires-Dist: psycopg2-binary==2.9.10; extra == "sandbox"
+Requires-Dist: sentry-sdk==2.24.1; extra == "sandbox"
+Dynamic: license-file
+
+# Richie, the best OpenSource CMS to build education portals
+
+[![CircleCI](https://circleci.com/gh/openfun/richie/tree/master.svg?style=svg)](https://circleci.com/gh/openfun/richie/tree/master)
+
+## Overview
+
+`Learning Management Systems` (LMS) are great tools for hosting and playing interactive online
+courses and MOOCs.
+
+However, if you need to build a complete website with flexible content to aggregate your courses,
+in several languages and from different sources, **you will soon need a CMS**.
+
+At "France Université Numérique", we wanted to build an OpenSource portal with `Python` and
+`Django`. That's why we built `Richie` on top of [DjangoCMS](https://www.django-cms.org), one of
+the best CMS on the market, as a toolbox to easily create full fledged websites with a catalog of
+online courses.
+
+Among the features that `Richie` offers out of the box:
+
+- multi-lingual by default,
+- advanced access rights and moderation,
+- catalog of courses synchronized with one or more `LMS` instances,
+- search engine based on `Elasticsearch` and pre-configured to offer full-text queries,
+  multi-facetting, auto-complete,...
+- flexible custom pages for courses, organizations, categories, teachers, blog posts,
+  programs (and their inter-relations),
+- Extensible with any third-party `DjangoCMS` plugin or any third-party `Django` application.
+
+## Discover Richie
+
+If you're looking for a quick preview of `Richie`, you can take a look and have a tour of
+`Richie` on our dedicated [demo site](https://demo.richie.education).
+
+It is connected back-to-back with a demo of OpenEdX running on
+[OpenEdX Docker](https://github.com/openfun/openedx-docker).
+
+Two users are available for testing:
+
+- admin: `admin@example.com`/`admin`
+- student: `edx@example.com`/`edx`
+
+The database is regularly flushed.
+
+## Getting started
+
+Take a look at our [documentation](https://richie.education/docs/discover) to get started with Richie.
+
+## Contributing
+
+### [Contributing guide](https://richie.education/docs/contributing-guide)
+
+Read our [contributing guide](https://richie.education/docs/contributing-guide) to learn about our development process and get started developing on `Richie`.
+
+### License
+
+This work is released under the MIT License (see [LICENSE](./LICENSE)).

richie-3.0.1.dev9/src/frontend/js/components/CourseGlimpse/CourseGlimpseFooter.tsx

@@ -0,0 +1,110 @@
+import { defineMessages, FormattedNumber, useIntl } from 'react-intl';
+import { Icon, IconTypeEnum } from 'components/Icon';
+import { CommonDataProps } from 'types/commonDataProps';
+import { CourseGlimpseCourse } from 'components/CourseGlimpse/index';
+import { CourseOffer } from 'types/Course';
+
+const messages = defineMessages({
+  dateIconAlt: {
+    defaultMessage: 'Availability',
+    description: 'Course date logo alternative text for screen reader users',
+    id: 'components.CourseGlimpseFooter.dateIconAlt',
+  },
+  enrollmentOfferIconFreeAlt: {
+    defaultMessage: 'All content is available for free',
+    description: 'Course offers free alternative text',
+    id: 'components.CourseGlimpseFooter.enrollmentOfferIconFreeAlt',
+  },
+  enrollmentOfferIconPartiallyFreeAlt: {
+    defaultMessage: 'Most of the content is available for free',
+    description: 'Course offers partially free alternative text',
+    id: 'components.CourseGlimpseFooter.enrollmentOfferIconPartiallyFreeAlt',
+  },
+  enrollmentOfferIconPaidAlt: {
+    defaultMessage: 'Access requires payment',
+    description: 'Course offers paid alternative text',
+    id: 'components.CourseGlimpseFooter.enrollmentOfferIconPaidAlt',
+  },
+  enrollmentOfferIconSubscriptionAlt: {
+    defaultMessage: 'Access requires a subscription',
+    description: 'Course offers subscription alternative text',
+    id: 'components.CourseGlimpseFooter.enrollmentOfferIconSubscriptionAlt',
+  },
+  certificateOfferIconAlt: {
+    defaultMessage: 'An exam is available',
+    description: 'Course certificate offer alternative text',
+    id: 'components.CourseGlimpseFooter.certificateOfferIconAlt',
+  },
+});
+
+const courseOfferMessages = {
+  [CourseOffer.FREE]: messages.enrollmentOfferIconFreeAlt,
+  [CourseOffer.PARTIALLY_FREE]: messages.enrollmentOfferIconPartiallyFreeAlt,
+  [CourseOffer.PAID]: messages.enrollmentOfferIconPaidAlt,
+  [CourseOffer.SUBSCRIPTION]: messages.enrollmentOfferIconSubscriptionAlt,
+};
+
+type OfferIconType =
+  | IconTypeEnum.OFFER_SUBSCRIPTION
+  | IconTypeEnum.OFFER_PAID
+  | IconTypeEnum.OFFER_PARTIALLY_FREE
+  | IconTypeEnum.OFFER_FREE;
+
+/**
+ * <CourseGlimpseFooter />.
+ * This is spun off from <CourseGlimpse /> to allow easier override through webpack.
+ */
+export const CourseGlimpseFooter: React.FC<{ course: CourseGlimpseCourse } & CommonDataProps> = ({
+  course,
+}) => {
+  const intl = useIntl();
+  const offer = course.offer ?? CourseOffer.FREE;
+  const certificateOffer = course.certificate_offer ?? null;
+  const hasCertificateOffer = certificateOffer !== null;
+  const hasEnrollmentOffer = offer !== CourseOffer.FREE;
+  const offerIcon = `icon-offer-${offer}` as OfferIconType;
+  const offerCertificateIcon = hasCertificateOffer && IconTypeEnum.SCHOOL;
+  const offerPrice = hasEnrollmentOffer && course.price;
+
+  return (
+    <div className="course-glimpse-footer">
+      <div className="course-glimpse-footer__column course-glimpse-footer__date">
+        <Icon
+          name={IconTypeEnum.CALENDAR}
+          title={intl.formatMessage(messages.dateIconAlt)}
+          size="small"
+        />
+        <span>
+          {course.state.text.charAt(0).toUpperCase() +
+            course.state.text.substring(1) +
+            (course.state.datetime
+              ? ` ${intl.formatDate(new Date(course.state.datetime!), {
+                  year: 'numeric',
+                  month: 'long',
+                  day: 'numeric',
+                })}`
+              : '')}
+        </span>
+      </div>
+      <div className="course-glimpse-footer__column course-glimpse-footer__price">
+        {offerCertificateIcon && (
+          <Icon
+            className="offer-certificate__icon"
+            name={offerCertificateIcon}
+            title={intl.formatMessage(messages.certificateOfferIconAlt)}
+          />
+        )}
+        <Icon
+          className="offer__icon"
+          name={offerIcon}
+          title={intl.formatMessage(courseOfferMessages[offer])}
+        />
+        {offerPrice && (
+          <span className="offer__price">
+            <FormattedNumber value={offerPrice} currency={course.price_currency} style="currency" />
+          </span>
+        )}
+      </div>
+    </div>
+  );
+};

richie-3.0.1.dev9/src/frontend/js/components/CourseGlimpse/index.spec.tsx

@@ -0,0 +1,223 @@
+import { render, screen, within } from '@testing-library/react';
+import { IntlProvider } from 'react-intl';
+import { MemoryRouter } from 'react-router';
+import { CommonDataProps } from 'types/commonDataProps';
+import { RichieContextFactory } from 'utils/test/factories/richie';
+import { CourseStateTextEnum } from 'types';
+import { CourseCertificateOffer, CourseOffer } from 'types/Course';
+import { CourseGlimpse, CourseGlimpseCourse } from '.';
+
+const renderCourseGlimpse = ({
+  course,
+  contextProps,
+}: {
+  course: CourseGlimpseCourse;
+  contextProps: CommonDataProps['context'];
+}) => {
+  return render(
+    <IntlProvider locale="en">
+      <MemoryRouter>
+        <CourseGlimpse context={contextProps} course={course} />
+      </MemoryRouter>
+    </IntlProvider>,
+  );
+};
+
+describe('widgets/Search/components/CourseGlimpse', () => {
+  const course: CourseGlimpseCourse = {
+    course_url: 'https://example/com/courses/42/',
+    code: '123abc',
+    cover_image: {
+      sizes: '330px',
+      src: '/thumbs/small.png',
+      srcset: 'some srcset',
+    },
+    icon: {
+      sizes: '60px',
+      src: '/thumbs/icon_small.png',
+      srcset: 'some srcset',
+      title: 'Some icon',
+    },
+    id: '742',
+    organization: {
+      title: 'Some Organization',
+      image: {
+        sizes: '330px',
+        src: '/thumbs/org_small.png',
+        srcset: 'some srcset',
+      },
+    },
+    state: {
+      call_to_action: 'enroll now',
+      datetime: '2019-03-14T10:35:47.823Z',
+      priority: 0,
+      text: CourseStateTextEnum.STARTING_ON,
+    },
+    title: 'Course 42',
+    offer: CourseOffer.PAID,
+    price: 42.0,
+    certificate_offer: CourseCertificateOffer.FREE,
+    certificate_price: null,
+    price_currency: 'EUR',
+  };
+
+  const contextProps: CommonDataProps['context'] = RichieContextFactory().one();
+
+  it('renders a course glimpse with its data', () => {
+    const { container } = renderCourseGlimpse({ course, contextProps });
+
+    // first text we encounter should be the title, so that screen reader users get it first
+    expect(container.textContent?.indexOf('Course 42')).toBe(0);
+
+    // The course glimpse container should have the a variant class according to their offers
+    const containerElement = container.querySelector('.course-glimpse');
+    expect(containerElement).toHaveClass('course-glimpse--offer-paid');
+    expect(containerElement).toHaveClass('course-glimpse--offer-certificate');
+
+    // The link that wraps the course glimpse should have no title as its content is explicit enough
+    const link = container.querySelector('.course-glimpse__link');
+    expect(link).not.toHaveAttribute('title');
+    // The course glimpse shows the relevant information
+    screen.getByRole('heading', { name: 'Course 42', level: 3 });
+    screen.getByLabelText('Course code');
+    screen.getByText('123abc');
+    screen.getByLabelText('Organization');
+    screen.getByText('Some Organization');
+    screen.getByText('Category');
+    // Matches on 'Starting on March 14, 2019', date is wrapped with intl <span>
+    screen.getByLabelText('Availability');
+    screen.getByText('Starting on March 14, 2019');
+
+    // Check course logo
+    const courseGlipseMedia = container.getElementsByClassName('course-glimpse__media');
+    expect(courseGlipseMedia.length).toBe(1);
+    expect(courseGlipseMedia[0]).toHaveAttribute('aria-hidden', 'true');
+    const mediaLink = courseGlipseMedia[0].firstChild;
+    expect(mediaLink).toHaveAttribute('tabindex', '-1');
+    const img = mediaLink?.firstChild;
+    expect(img).toBeInstanceOf(HTMLImageElement);
+    // The logo is rendered along with alt text "" as it is decorative and included in a link block
+    expect(img).toHaveAttribute('alt', '');
+    expect(img).toHaveAttribute('src', '/thumbs/small.png');
+
+    // Check organization logo
+    const orgLogoElement = container.getElementsByClassName('course-glimpse__organization-logo');
+    expect(orgLogoElement.length).toBe(1);
+    const orgImg = orgLogoElement[0].firstChild;
+    expect(orgImg).toBeInstanceOf(HTMLImageElement);
+    // The logo is rendered along with alt text "" as it is decorative and included in a link block
+    expect(orgImg).toHaveAttribute('alt', '');
+    expect(orgImg).toHaveAttribute('src', '/thumbs/org_small.png');
+
+    // Check certificate offer
+    within(container).getByRole('img', { name: 'An exam is available' });
+
+    // Check offer information
+    const offerIcon = within(container).getByRole('img', { name: 'Access requires payment' });
+    const useElement = offerIcon.lastChild;
+    expect(useElement).toHaveAttribute('href', '#icon-offer-paid');
+
+    const offerPrice = offerIcon.nextSibling;
+    expect(offerPrice).toHaveTextContent('€42.00');
+  });
+
+  it('works when there is no call to action or datetime on the state (eg. an archived course)', () => {
+    renderCourseGlimpse({
+      contextProps,
+      course: {
+        ...course,
+        state: {
+          ...course.state,
+          call_to_action: null,
+          text: CourseStateTextEnum.ARCHIVED,
+        },
+      },
+    });
+
+    // Make sure the component renders and shows the state
+    screen.getByRole('heading', { name: 'Course 42', level: 3 });
+    const dateFormatter = Intl.DateTimeFormat('en', {
+      day: 'numeric',
+      month: 'long',
+      year: 'numeric',
+    });
+    const formatedDatetime = dateFormatter.format(new Date(course.state.datetime!));
+    screen.getByText(`Archived ${formatedDatetime}`);
+  });
+
+  it('shows the "Cover" placeholder div when the course is missing a cover image', () => {
+    render(
+      <IntlProvider locale="en">
+        <CourseGlimpse context={contextProps} course={{ ...course, cover_image: null }} />
+      </IntlProvider>,
+    );
+
+    screen.getByRole('heading', { name: 'Course 42', level: 3 });
+    screen.getByText('Cover');
+  });
+
+  it('does include "-" if the course code is not set', () => {
+    renderCourseGlimpse({
+      contextProps,
+      course: { ...course, code: null },
+    });
+
+    expect(screen.getByText('-').parentElement).toHaveClass(
+      'course-glimpse__metadata',
+      'course-glimpse__metadata--code',
+    );
+  });
+
+  it('does not show certificate offer if the course does not offer a certificate', () => {
+    const { container } = renderCourseGlimpse({
+      contextProps,
+      course: { ...course, certificate_offer: null },
+    });
+
+    const containerElement = container.querySelector('.course-glimpse');
+    expect(containerElement).not.toHaveClass('course-glimpse--offer-certificate');
+
+    const certificicateOfferIcon = within(container).queryByRole('img', {
+      name: 'The course offers a certification.',
+    });
+    expect(certificicateOfferIcon).not.toBeInTheDocument();
+  });
+
+  it('does show free course offer if the course has no offer', () => {
+    const { container } = renderCourseGlimpse({
+      contextProps,
+      course: { ...course, offer: null },
+    });
+
+    const containerElement = container.querySelector('.course-glimpse');
+    expect(containerElement).toHaveClass('course-glimpse--offer-free');
+
+    const offerIcon = within(container).getByRole('img', {
+      name: 'All content is available for free',
+    });
+    const useElement = offerIcon.lastChild;
+    expect(useElement).toHaveAttribute('href', '#icon-offer-free');
+
+    // And no price is shown
+    expect(offerIcon.nextSibling).not.toBeInTheDocument();
+  });
+
+  it.each([
+    [CourseOffer.FREE, 'All content is available for free'],
+    [CourseOffer.PARTIALLY_FREE, 'Most of the content is available for free'],
+    [CourseOffer.PAID, 'Access requires payment'],
+    [CourseOffer.SUBSCRIPTION, 'Access requires a subscription'],
+  ])('does show a specific course offer icon', (offer, altText) => {
+    const { container } = renderCourseGlimpse({
+      contextProps,
+      course: { ...course, offer },
+    });
+
+    const containerElement = container.querySelector('.course-glimpse');
+    expect(containerElement).toHaveClass(`course-glimpse--offer-${offer}`);
+
+    const offerIcon = within(container).getByRole('img', { name: altText });
+    const useElement = offerIcon.lastChild;
+    expect(useElement).toHaveAttribute('href', `#icon-offer-${offer}`);
+  });
+});