@openedx/frontend-app-learner-dashboard 1.0.0-alpha.4 → 1.0.0-alpha.6

package/src/containers/CourseCard/components/CourseCardBanners/EntitlementBanner.test.jsx

@@ -1,63 +0,0 @@
-import React from 'react';
-import { shallow } from '@edx/react-unit-test-utils';
-
-import { reduxHooks } from 'hooks';
-import EntitlementBanner from './EntitlementBanner';
-
-jest.mock('components/Banner', () => 'Banner');
-jest.mock('hooks', () => ({
-  utilHooks: {
-    useFormatDate: () => date => date,
-  },
-  reduxHooks: {
-    usePlatformSettingsData: jest.fn(),
-    useCardEntitlementData: jest.fn(),
-    useUpdateSelectSessionModalCallback: jest.fn(
-      (cardId) => jest.fn().mockName(`updateSelectSessionModalCallback(${cardId})`),
-    ),
-  },
-}));
-
-const cardId = 'my-test-course-number';
-
-let el;
-
-const entitlementData = {
-  isEntitlement: true,
-  hasSessions: true,
-  isFulfilled: false,
-  changeDeadline: '11/11/2022',
-  showExpirationWarning: false,
-};
-const platformData = { supportEmail: 'test-support-email' };
-
-const render = (overrides = {}) => {
-  const { entitlement = {} } = overrides;
-  reduxHooks.useCardEntitlementData.mockReturnValueOnce({ ...entitlementData, ...entitlement });
-  reduxHooks.usePlatformSettingsData.mockReturnValueOnce(platformData);
-  el = shallow(<EntitlementBanner cardId={cardId} />);
-};
-
-describe('EntitlementBanner', () => {
-  test('initializes data with course number from entitlement', () => {
-    render();
-    expect(reduxHooks.useCardEntitlementData).toHaveBeenCalledWith(cardId);
-    expect(reduxHooks.useUpdateSelectSessionModalCallback).toHaveBeenCalledWith(cardId);
-  });
-  test('no display if not an entitlement', () => {
-    render({ entitlement: { isEntitlement: false } });
-    expect(el.isEmptyRender()).toEqual(true);
-  });
-  test('snapshot: no sessions available', () => {
-    render({ entitlement: { isFulfilled: false, hasSessions: false } });
-    expect(el.snapshot).toMatchSnapshot();
-  });
-  test('snapshot: expiration warning', () => {
-    render({ entitlement: { showExpirationWarning: true } });
-    expect(el.snapshot).toMatchSnapshot();
-  });
-  test('no display if sessions available and not displaying warning', () => {
-    render();
-    expect(el.isEmptyRender()).toEqual(true);
-  });
-});

package/src/containers/CourseCard/components/CourseCardBanners/RelatedProgramsBanner/ProgramsList.jsx

@@ -1,23 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-
-export const ProgramsList = ({ programs }) => (
-  <ul className="related-programs-list-container">
-    {programs.map((program) => (
-      <li key={program.programUrl} className="my-2">
-        <a href={program.programUrl}>{program.title}</a>
-      </li>
-    ))}
-  </ul>
-);
-
-ProgramsList.propTypes = {
-  programs: PropTypes.arrayOf(
-    PropTypes.shape({
-      programUrl: PropTypes.string,
-      title: PropTypes.string,
-    }),
-  ).isRequired,
-};
-
-export default ProgramsList;

package/src/containers/CourseCard/components/CourseCardBanners/RelatedProgramsBanner/ProgramsList.test.jsx

@@ -1,23 +0,0 @@
-import { shallow } from '@edx/react-unit-test-utils';
-
-import { ProgramsList } from './ProgramsList';
-
-describe('ProgramsList', () => {
-  const programs = [
-    {
-      programUrl: 'http://example.com',
-      title: 'Example Program 1',
-    },
-    {
-      programUrl: 'http://example.com',
-      title: 'Example Program 2',
-    },
-  ];
-
-  it('renders correctly', () => {
-    const wrapper = shallow(<ProgramsList programs={programs} />);
-    expect(wrapper.snapshot).toMatchSnapshot();
-
-    expect(wrapper.instance.findByType('li').length).toEqual(programs.length);
-  });
-});

package/src/containers/CourseCard/components/CourseCardBanners/RelatedProgramsBanner/__snapshots__/ProgramsList.test.jsx.snap

@@ -1,28 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`ProgramsList renders correctly 1`] = `
-<ul
-  className="related-programs-list-container"
->
-  <li
-    className="my-2"
-    key="http://example.com"
-  >
-    <a
-      href="http://example.com"
-    >
-      Example Program 1
-    </a>
-  </li>
-  <li
-    className="my-2"
-    key="http://example.com"
-  >
-    <a
-      href="http://example.com"
-    >
-      Example Program 2
-    </a>
-  </li>
-</ul>
-`;

package/src/containers/CourseCard/components/CourseCardBanners/RelatedProgramsBanner/__snapshots__/index.test.jsx.snap

@@ -1,29 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`RelatedProgramsBanner render with programs 1`] = `
-<Banner
-  className="bg-white border-top border-bottom mb-0 related-programs-banner"
-  icon={[MockFunction icons.Program]}
-  variant="info"
->
-  <span
-    className="font-weight-bolder"
-  >
-    Related Programs: 
-  </span>
-  <ProgramsList
-    programs={
-      [
-        {
-          "title": "Program 1",
-          "url": "http://example.com/program1",
-        },
-        {
-          "title": "Program 2",
-          "url": "http://example.com/program2",
-        },
-      ]
-    }
-  />
-</Banner>
-`;

package/src/containers/CourseCard/components/CourseCardBanners/RelatedProgramsBanner/index.jsx

@@ -1,38 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-
-import { Program } from '@openedx/paragon/icons';
-import { useIntl } from '@openedx/frontend-base';
-
-import { reduxHooks } from '../../../../../hooks';
-import Banner from '../../../../../components/Banner';
-
-import ProgramList from './ProgramsList';
-import messages from './messages';
-
-export const RelatedProgramsBanner = ({ cardId }) => {
-  const { formatMessage } = useIntl();
-
-  const programData = reduxHooks.useCardRelatedProgramsData(cardId);
-
-  if (!programData?.length) {
-    return null;
-  }
-
-  return (
-    <Banner
-      icon={Program}
-      className="bg-white border-top border-bottom mb-0 related-programs-banner"
-    >
-      <span className="font-weight-bolder">
-        {formatMessage(messages.relatedPrograms)}
-      </span>
-      <ProgramList programs={programData.list} />
-    </Banner>
-  );
-};
-RelatedProgramsBanner.propTypes = {
-  cardId: PropTypes.string.isRequired,
-};
-
-export default RelatedProgramsBanner;

package/src/containers/CourseCard/components/CourseCardBanners/RelatedProgramsBanner/index.test.jsx

@@ -1,42 +0,0 @@
-import { shallow } from '@edx/react-unit-test-utils';
-
-import { reduxHooks } from '../../../../../hooks';
-import RelatedProgramsBanner from '.';
-
-jest.mock('./ProgramsList', () => 'ProgramsList');
-
-jest.mock('hooks', () => ({
-  reduxHooks: {
-    useCardRelatedProgramsData: jest.fn(),
-  },
-}));
-
-const cardId = 'test-card-id';
-
-describe('RelatedProgramsBanner', () => {
-  test('render empty', () => {
-    reduxHooks.useCardRelatedProgramsData.mockReturnValue({
-      length: 0,
-    });
-    const el = shallow(<RelatedProgramsBanner cardId={cardId} />);
-    expect(el.isEmptyRender()).toEqual(true);
-  });
-
-  test('render with programs', () => {
-    reduxHooks.useCardRelatedProgramsData.mockReturnValue({
-      list: [
-        {
-          title: 'Program 1',
-          url: 'http://example.com/program1',
-        },
-        {
-          title: 'Program 2',
-          url: 'http://example.com/program2',
-        },
-      ],
-      length: 2,
-    });
-    const el = shallow(<RelatedProgramsBanner cardId={cardId} />);
-    expect(el.snapshot).toMatchSnapshot();
-  });
-});

package/src/containers/CourseCard/components/CourseCardBanners/RelatedProgramsBanner/messages.js

@@ -1,31 +0,0 @@
-import { defineMessages } from '@openedx/frontend-base';
-
-const messages = defineMessages({
-  relatedPrograms: {
-    id: 'learner-dash.courseCard.banners.relatedPrograms',
-    description: 'title for related programs banner',
-    defaultMessage: 'Related Programs: ',
-  },
-  expandBanner: {
-    id: 'learner-dash.courseCard.banners.expandBanner',
-    description: 'expand banner button text',
-    defaultMessage: 'More',
-  },
-  expandBannerAlt: {
-    id: 'learner-dash.courseCard.banners.expandBannerAlt',
-    description: 'expand banner button alt text',
-    defaultMessage: 'Expand banner icon',
-  },
-  collapseBanner: {
-    id: 'learner-dash.courseCard.banners.collapseBanner',
-    description: 'collapse banner button text',
-    defaultMessage: 'Less',
-  },
-  collapseBannerAlt: {
-    id: 'learner-dash.courseCard.banners.collapseBannerAlt',
-    description: 'collapse banner button alt text',
-    defaultMessage: 'Collapse banner icon',
-  },
-});
-
-export default messages;

package/src/containers/CourseCard/components/CourseCardBanners/__snapshots__/CertificateBanner.test.jsx.snap

@@ -1,205 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`CertificateBanner snapshot is passing and is downloadable 1`] = `
-<Banner
-  icon={[MockFunction icons.CheckCircle]}
-  variant="success"
->
-  Congratulations.  Your certificate is ready.
-</Banner>
-`;
-
-exports[`CertificateBanner snapshot is passing and is earned but unavailable 1`] = `
-<Banner>
-  Your grade and certificate will be ready after 10/20/3030.
-</Banner>
-`;
-
-exports[`CertificateBanner snapshot is passing and not downloadable render empty 1`] = `null`;
-
-exports[`CertificateBanner snapshot is restricted 1`] = `
-<Banner
-  variant="danger"
->
-  Your Certificate of Achievement is being held pending confirmation that the issuance of your Certificate is in compliance with strict U.S. embargoes on Iran, Cuba, Syria, and Sudan.  If you think our system has mistakenly identified you as being connected with one of those countries, please let us know.
-</Banner>
-`;
-
-exports[`CertificateBanner snapshot is restricted and verified 1`] = `
-<Banner
-  variant="danger"
->
-  Your Certificate of Achievement is being held pending confirmation that the issuance of your Certificate is in compliance with strict U.S. embargoes on Iran, Cuba, Syria, and Sudan.  If you think our system has mistakenly identified you as being connected with one of those countries, please let us know.
-    
-  If you would like a refund on your Certificate of Achievement, please contact us.
-</Banner>
-`;
-
-exports[`CertificateBanner snapshot is restricted and verified with billing email 1`] = `
-<Banner
-  variant="danger"
->
-  Your Certificate of Achievement is being held pending confirmation that the issuance of your Certificate is in compliance with strict U.S. embargoes on Iran, Cuba, Syria, and Sudan.  If you think our system has mistakenly identified you as being connected with one of those countries, please let us know.
-    
-  <format-message-function
-    message={
-      {
-        "defaultMessage": "If you would like a refund on your Certificate of Achievement, please contact our billing address {billingEmail}",
-        "description": "Message to learners to contact billing for certificate refunds",
-        "id": "learner-dash.courseCard.banners.certificateRefundContactBilling",
-      }
-    }
-    values={
-      {
-        "billingEmail": <MailtoLink
-          to="billing@email"
-        >
-          billing@email
-        </MailtoLink>,
-      }
-    }
-  />
-</Banner>
-`;
-
-exports[`CertificateBanner snapshot is restricted and verified with support and billing email 1`] = `
-<Banner
-  variant="danger"
->
-  <format-message-function
-    message={
-      {
-        "defaultMessage": "Your Certificate of Achievement is being held pending confirmation that the issuance of your Certificate is in compliance with strict U.S. embargoes on Iran, Cuba, Syria, and Sudan.  If you think our system has mistakenly identified you as being connected with one of those countries, please let us know by contacting {supportEmail}.",
-        "description": "Restricted certificate warning message",
-        "id": "learner-dash.courseCard.banners.certificateRestricted",
-      }
-    }
-    values={
-      {
-        "supportEmail": <MailtoLink
-          to="suport@email"
-        >
-          suport@email
-        </MailtoLink>,
-      }
-    }
-  />
-    
-  <format-message-function
-    message={
-      {
-        "defaultMessage": "If you would like a refund on your Certificate of Achievement, please contact our billing address {billingEmail}",
-        "description": "Message to learners to contact billing for certificate refunds",
-        "id": "learner-dash.courseCard.banners.certificateRefundContactBilling",
-      }
-    }
-    values={
-      {
-        "billingEmail": <MailtoLink
-          to="billing@email"
-        >
-          billing@email
-        </MailtoLink>,
-      }
-    }
-  />
-</Banner>
-`;
-
-exports[`CertificateBanner snapshot is restricted and verified with support email 1`] = `
-<Banner
-  variant="danger"
->
-  <format-message-function
-    message={
-      {
-        "defaultMessage": "Your Certificate of Achievement is being held pending confirmation that the issuance of your Certificate is in compliance with strict U.S. embargoes on Iran, Cuba, Syria, and Sudan.  If you think our system has mistakenly identified you as being connected with one of those countries, please let us know by contacting {supportEmail}.",
-        "description": "Restricted certificate warning message",
-        "id": "learner-dash.courseCard.banners.certificateRestricted",
-      }
-    }
-    values={
-      {
-        "supportEmail": <MailtoLink
-          to="suport@email"
-        >
-          suport@email
-        </MailtoLink>,
-      }
-    }
-  />
-    
-  If you would like a refund on your Certificate of Achievement, please contact us.
-</Banner>
-`;
-
-exports[`CertificateBanner snapshot is restricted with billing email 1`] = `
-<Banner
-  variant="danger"
->
-  Your Certificate of Achievement is being held pending confirmation that the issuance of your Certificate is in compliance with strict U.S. embargoes on Iran, Cuba, Syria, and Sudan.  If you think our system has mistakenly identified you as being connected with one of those countries, please let us know.
-</Banner>
-`;
-
-exports[`CertificateBanner snapshot is restricted with support email 1`] = `
-<Banner
-  variant="danger"
->
-  <format-message-function
-    message={
-      {
-        "defaultMessage": "Your Certificate of Achievement is being held pending confirmation that the issuance of your Certificate is in compliance with strict U.S. embargoes on Iran, Cuba, Syria, and Sudan.  If you think our system has mistakenly identified you as being connected with one of those countries, please let us know by contacting {supportEmail}.",
-        "description": "Restricted certificate warning message",
-        "id": "learner-dash.courseCard.banners.certificateRestricted",
-      }
-    }
-    values={
-      {
-        "supportEmail": <MailtoLink
-          to="suport@email"
-        >
-          suport@email
-        </MailtoLink>,
-      }
-    }
-  />
-</Banner>
-`;
-
-exports[`CertificateBanner snapshot not passing and audit 1`] = `
-<Banner>
-  Grade required to pass the course: 0.8‏%
-</Banner>
-`;
-
-exports[`CertificateBanner snapshot not passing and has finished 1`] = `
-<Banner
-  variant="warning"
->
-  You are not eligible for a certificate.
-    
-  <Hyperlink
-    destination="progressUrl"
-    isInline={true}
-  >
-    View grades.
-  </Hyperlink>
-</Banner>
-`;
-
-exports[`CertificateBanner snapshot not passing and is downloadable 1`] = `
-<Banner
-  icon={[MockFunction icons.CheckCircle]}
-  variant="success"
->
-  Congratulations.  Your certificate is ready.
-</Banner>
-`;
-
-exports[`CertificateBanner snapshot not passing and not audit and not finished 1`] = `
-<Banner
-  variant="warning"
->
-  Grade required for a certificate: 0.8‏%
-</Banner>
-`;

package/src/containers/CourseCard/components/CourseCardBanners/__snapshots__/CourseBanner.test.jsx.snap

@@ -1,38 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`CourseBanner audit access expired snapshot: (auditAccessExpired, findAnotherCourse hyperlink) 1`] = `
-<Fragment>
-  <Banner>
-    Your audit access to this course has expired.
-      
-    <Hyperlink
-      destination=""
-      isInline={true}
-    >
-      Find another course
-    </Hyperlink>
-  </Banner>
-</Fragment>
-`;
-
-exports[`CourseBanner snapshot: stacking banners 1`] = `<Fragment />`;
-
-exports[`CourseBanner staff snapshot: isStaff 1`] = `<Fragment />`;
-
-exports[`CourseBanner too early has start date snapshot 1`] = `
-<Fragment>
-  <Banner>
-    You can't access this course just yet because the course hasn't started yet. The course will start on 11/11/3030.
-  </Banner>
-</Fragment>
-`;
-
-exports[`CourseBanner too early no start date snapshot 1`] = `<Fragment />`;
-
-exports[`CourseBanner unmet prerequisites snapshot: unmetPrerequisites 1`] = `
-<Fragment>
-  <Banner>
-    You can't access this course just yet because you have not met the pre-requisites.
-  </Banner>
-</Fragment>
-`;

package/src/containers/CourseCard/components/CourseCardBanners/__snapshots__/EntitlementBanner.test.jsx.snap

@@ -1,53 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`EntitlementBanner snapshot: expiration warning 1`] = `
-<Banner>
-  <format-message-function
-    message={
-      {
-        "defaultMessage": "You must {selectSessionButton} by {changeDeadline} to access the course.",
-        "description": "Entitlement course message when the entitlement is expiring soon.",
-        "id": "learner-dash.courseCard.banners.entitlementExpiringSoon",
-      }
-    }
-    values={
-      {
-        "changeDeadline": "11/11/2022",
-        "selectSessionButton": <Button
-          className="m-0 p-0"
-          onClick={[MockFunction updateSelectSessionModalCallback(my-test-course-number)]}
-          size="inline"
-          variant="link"
-        >
-          select a session
-        </Button>,
-      }
-    }
-  />
-</Banner>
-`;
-
-exports[`EntitlementBanner snapshot: no sessions available 1`] = `
-<Banner
-  variant="warning"
->
-  <format-message-function
-    message={
-      {
-        "defaultMessage": "There are no sessions available at the moment.  The course team will create new sessions soon.  If no sessions appear, please contact {emailLink} for information.",
-        "description": "Entitlement course message when no sessions are available",
-        "id": "learner-dash.courseCard.banners.entitlementUnavailable",
-      }
-    }
-    values={
-      {
-        "emailLink": <MailtoLink
-          to="test-support-email"
-        >
-          test-support-email
-        </MailtoLink>,
-      }
-    }
-  />
-</Banner>
-`;

package/src/containers/CourseCard/components/CourseCardBanners/__snapshots__/index.test.jsx.snap

@@ -1,41 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`CourseCardBanners render with isEnrolled false 1`] = `
-<div
-  className="course-card-banners"
-  data-testid="CourseCardBanners"
->
-  <RelatedProgramsBanner
-    cardId="test-card-id"
-  />
-  <CourseBannerSlot
-    cardId="test-card-id"
-  />
-  <EntitlementBanner
-    cardId="test-card-id"
-  />
-</div>
-`;
-
-exports[`CourseCardBanners renders default CourseCardBanners 1`] = `
-<div
-  className="course-card-banners"
-  data-testid="CourseCardBanners"
->
-  <RelatedProgramsBanner
-    cardId="test-card-id"
-  />
-  <CourseBannerSlot
-    cardId="test-card-id"
-  />
-  <EntitlementBanner
-    cardId="test-card-id"
-  />
-  <CertificateBanner
-    cardId="test-card-id"
-  />
-  <CreditBanner
-    cardId="test-card-id"
-  />
-</div>
-`;

package/src/containers/CourseCard/components/CourseCardBanners/index.jsx

@@ -1,28 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-
-import { reduxHooks } from '../../../../hooks';
-import CourseBannerSlot from '../../../../slots/CourseBannerSlot';
-
-import CertificateBanner from './CertificateBanner';
-import CreditBanner from './CreditBanner';
-import EntitlementBanner from './EntitlementBanner';
-import RelatedProgramsBanner from './RelatedProgramsBanner';
-
-export const CourseCardBanners = ({ cardId }) => {
-  const { isEnrolled } = reduxHooks.useCardEnrollmentData(cardId);
-  return (
-    <div className="course-card-banners" data-testid="CourseCardBanners">
-      <RelatedProgramsBanner cardId={cardId} />
-      <CourseBannerSlot cardId={cardId} />
-      <EntitlementBanner cardId={cardId} />
-      {isEnrolled && <CertificateBanner cardId={cardId} />}
-      {isEnrolled && <CreditBanner cardId={cardId} />}
-    </div>
-  );
-};
-CourseCardBanners.propTypes = {
-  cardId: PropTypes.string.isRequired,
-};
-
-export default CourseCardBanners;

package/src/containers/CourseCard/components/CourseCardBanners/index.test.jsx

@@ -1,32 +0,0 @@
-import { shallow } from '@edx/react-unit-test-utils';
-
-import { reduxHooks } from 'hooks';
-
-import CourseCardBanners from '.';
-
-jest.mock('./CourseBanner', () => 'CourseBanner');
-jest.mock('./CertificateBanner', () => 'CertificateBanner');
-jest.mock('./CreditBanner', () => 'CreditBanner');
-jest.mock('./EntitlementBanner', () => 'EntitlementBanner');
-jest.mock('./RelatedProgramsBanner', () => 'RelatedProgramsBanner');
-
-jest.mock('hooks', () => ({
-  reduxHooks: {
-    useCardEnrollmentData: jest.fn(() => ({ isEnrolled: true })),
-  },
-}));
-
-describe('CourseCardBanners', () => {
-  const props = {
-    cardId: 'test-card-id',
-  };
-  test('renders default CourseCardBanners', () => {
-    const wrapper = shallow(<CourseCardBanners {...props} />);
-    expect(wrapper.snapshot).toMatchSnapshot();
-  });
-  test('render with isEnrolled false', () => {
-    reduxHooks.useCardEnrollmentData.mockReturnValueOnce({ isEnrolled: false });
-    const wrapper = shallow(<CourseCardBanners {...props} />);
-    expect(wrapper.snapshot).toMatchSnapshot();
-  });
-});