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

package/src/hooks/utils.test.js

@@ -1,20 +0,0 @@
-import * as utils from './utils';
-
-jest.unmock('./utils');
-jest.mock('react', () => ({
-  ...jest.requireActual('react'),
-  useCallback: jest.fn((cb, prereqs) => ({ useCallback: { cb, prereqs } })),
-}));
-
-describe('app-level hooks', () => {
-  describe('useValuecallback', () => {
-    it('returns react callback with event target value', () => {
-      const cb = val => ({ cb: val });
-      const prereqs = ['test', 'prereqs'];
-      const value = 'test-value';
-      const out = utils.useValueCallback(cb, prereqs);
-      expect(out.useCallback.cb({ target: { value } })).toEqual({ cb: value });
-      expect(out.useCallback.prereqs).toEqual(prereqs);
-    });
-  });
-});

package/src/i18n/index.js

@@ -1,25 +0,0 @@
-// Placeholder be overridden by `make pull_translations`
-export default {
-  ar: {},
-  'zh-hk': {},
-  'zh-cn': {},
-  uk: {},
-  'tr-tr': {},
-  th: {},
-  te: {},
-  ru: {},
-  'pt-pt': {},
-  'pt-br': {},
-  'it-it': {},
-  id: {},
-  hi: {},
-  he: {},
-  'fr-ca': {},
-  fa: {},
-  'es-es': {},
-  'es-419': {},
-  el: {},
-  'de-de': {},
-  da: {},
-  bo: {},
-};

package/src/messages.js

@@ -1,16 +0,0 @@
-import { defineMessages } from '@openedx/frontend-base';
-
-const messages = defineMessages({
-  'learner-dash.loadingSR': {
-    id: 'learner-dash.loadingSR',
-    description: 'Page loading screen-reader text',
-    defaultMessage: 'Loading...',
-  },
-  'learner-dash.title': {
-    id: 'learner-dash.title',
-    description: 'Page title: Learner Home',
-    defaultMessage: 'Learner Home',
-  },
-});
-
-export default messages;

package/src/routes.jsx

@@ -1,14 +0,0 @@
-import Main from './Main';
-
-const routes = [
-  {
-    id: 'org.openedx.frontend.route.learnerDashboard.main',
-    path: '/',
-    handle: {
-      role: 'org.openedx.frontend.role.dashboard'
-    },
-    Component: Main
-  }
-];
-
-export default routes;

package/src/segment.js

@@ -1,84 +0,0 @@
-// The code in this file is from Segment's website:
-// https://segment.com/docs/sources/website/analytics.js/quickstart/
-import { configuration } from './config';
-
-(function () {
-  // Create a queue, but don't obliterate an existing one!
-  const analytics = window.analytics = window.analytics || [];
-
-  // If the real analytics.js is already on the page return.
-  if (analytics.initialize) return;
-
-  // If the snippet was invoked already show an error.
-  if (analytics.invoked) {
-    if (window.console && console.error) {
-      console.error('Segment snippet included twice.');
-    }
-    return;
-  }
-
-  // Invoked flag, to make sure the snippet
-  // is never invoked twice.
-  analytics.invoked = true;
-
-  // A list of the methods in Analytics.js to stub.
-  analytics.methods = [
-    'trackSubmit',
-    'trackClick',
-    'trackLink',
-    'trackForm',
-    'pageview',
-    'identify',
-    'reset',
-    'group',
-    'track',
-    'ready',
-    'alias',
-    'debug',
-    'page',
-    'once',
-    'off',
-    'on',
-  ];
-
-  // Define a factory to create stubs. These are placeholders
-  // for methods in Analytics.js so that you never have to wait
-  // for it to load to actually record data. The `method` is
-  // stored as the first argument, so we can replay the data.
-  analytics.factory = function (method) {
-    return function () {
-      const args = Array.prototype.slice.call(arguments);
-      args.unshift(method);
-      analytics.push(args);
-      return analytics;
-    };
-  };
-
-  // For each of our methods, generate a queueing stub.
-  for (const key of analytics.methods) {
-    analytics[key] = analytics.factory(key);
-  }
-
-  // Define a method to load Analytics.js from our CDN,
-  // and that will be sure to only ever load it once.
-  analytics.load = function (key, options) {
-    // Create an async script element based on your key.
-    const script = document.createElement('script');
-    script.type = 'text/javascript';
-    script.async = true;
-    script.src = `https://cdn.segment.com/analytics.js/v1/${
-      key}/analytics.min.js`;
-
-    // Insert our script next to the first script element.
-    const first = document.getElementsByTagName('script')[0];
-    first.parentNode.insertBefore(script, first);
-    analytics._loadOptions = options;
-  };
-
-  // Add a version to keep track of what's in the wild.
-  analytics.SNIPPET_VERSION = '4.1.0';
-
-  // Load Analytics.js with your key, which will automatically
-  // load the tools you've enabled for your account. Boosh!
-  analytics.load(configuration.SEGMENT_KEY);
-}());

package/src/setupTest.jsx

@@ -1,45 +0,0 @@
-import '@testing-library/jest-dom';
-
-import siteConfig from 'site.config';
-import { addAppConfigs, configureAnalytics, configureAuth, configureLogging, getSiteConfig, mergeSiteConfig, MockAnalyticsService, MockAuthService, MockLoggingService } from '@openedx/frontend-base';
-
-mergeSiteConfig(siteConfig);
-addAppConfigs();
-
-export function initializeMockServices() {
-  const loggingService = configureLogging(MockLoggingService, {
-    config: getSiteConfig(),
-  });
-
-  const authService = configureAuth(MockAuthService, {
-    config: getSiteConfig(),
-    loggingService,
-  });
-
-  const analyticsService = configureAnalytics(MockAnalyticsService, {
-    config: getSiteConfig(),
-    httpClient: authService.getAuthenticatedHttpClient(),
-    loggingService,
-  });
-
-  return { analyticsService, authService, loggingService };
-}
-
-jest.mock('reselect', () => ({
-  createSelector: jest.fn((preSelectors, cb) => ({ preSelectors, cb })),
-}));
-
-// Mock react-redux hooks
-// unmock for integration tests
-jest.mock('react-redux', () => {
-  const dispatch = jest.fn((...args) => ({ dispatch: args })).mockName('react-redux.dispatch');
-  return {
-    connect: (mapStateToProps, mapDispatchToProps) => (component) => ({
-      mapStateToProps,
-      mapDispatchToProps,
-      component,
-    }),
-    useDispatch: jest.fn(() => dispatch),
-    useSelector: jest.fn((selector) => ({ useSelector: selector })),
-  };
-});

package/src/slots/CourseBannerSlot/README.md

@@ -1,44 +0,0 @@
-# Course Banner Slot
-
-### Slot ID: `org.openedx.frontend.slot.learnerDashboard.courseCardBanner.v1`
-
-### Slot Props
-
-* `cardId`
-
-## Description
-
-This slot is used for replacing or adding content for the `CourseBanner` component. This banner is rendered as a child of the `CourseCard`.
-
-The default CourseBanner looks like this when audit access has expired for the course:
-![Screenshot of the default CourseBanner when audit access has expired](./images/course_banner_slot_default.png)
-
-## Example
-
-The following configuration will render a custom implementation of a CourseBanner under every `CourseCard`.
-
-![Screenshot of custom banner added under CourseCard](./images/course_banner_slot_default.png)
-
-```js
-import { WidgetOperationTypes } from '@openedx/frontend-base';
-import { Alert } from '@openedx/paragon';
-
-const myComponent = ({ cardId }) => (
-  <Alert variant="info" className="mb-0">
-    Course banner for course with {cardId}
-  </Alert>
-)
-
-const config = {
-  slots: [
-    {
-      slotId: 'org.openedx.frontend.slot.learnerDashboard.courseCardBanner.v1',
-      id: 'my.widget',
-      op: WidgetOperationTypes.REPLACE,
-      component: myComponent
-    },
-  ]
-}
-
-export default config;
-```

package/src/slots/CourseBannerSlot/index.jsx

@@ -1,18 +0,0 @@
-import PropTypes from 'prop-types';
-import { Slot } from '@openedx/frontend-base';
-import CourseBanner from '../../containers/CourseCard/components/CourseCardBanners/CourseBanner';
-
-const CourseBannerSlot = ({ cardId }) => (
-  <Slot
-    id="org.openedx.frontend.slot.learnerDashboard.courseCardBanner.v1"
-    cardId={cardId}
-  >
-    <CourseBanner cardId={cardId} />
-  </Slot>
-);
-
-CourseBannerSlot.propTypes = {
-  cardId: PropTypes.string.isRequired,
-};
-
-export default CourseBannerSlot;

package/src/slots/CourseCardActionSlot/README.md

@@ -1,53 +0,0 @@
-# Course Card Action Slot
-
-### Slot ID: `org.openedx.frontend.slot.learnerDashboard.courseCardAction.v1`
-
-### Slot Props
-
-* `cardId`
-
-## Description
-
-This slot is used for adding content in the Action buttons section of each Course Card.
-
-## Example
-
-The following configuration will render the `cardId` of the course as `<p>` elements in a `<div>`.
-
-![Screenshot of Content added after the Sequence Container](./images/post_course_card_action.png)
-
-```js
-import { WidgetOperationTypes } from '@openedx/frontend-base';
-import ActionButton from 'containers/CourseCard/components/CourseCardActions/ActionButton';
-
-const myComponent = ({ cardId }) => (
-  <ActionButton variant="outline-primary">
-    📚: {cardId}
-  </ActionButton>
-)
-
-const mySlotId = 'org.openedx.frontend.slot.learnerDashboard.courseCardAction.v1';
-
-const config = {
-  slots: [
-    {
-      slotId: mySlotId,
-      id: 'my.first.widget',
-      op: WidgetOperationTypes.APPEND,
-      element: (
-        <ActionButton variant="outline-primary">
-          Custom Button
-        </ActionButton>
-      )
-    },
-    {
-      slotId: mySlotId,
-      id: 'my.second.widget',
-      op: WidgetOperationTypes.APPEND,
-      component: myComponent
-    },
-  ]
-}
-
-export default config;
-```

package/src/slots/CourseCardActionSlot/index.jsx

@@ -1,15 +0,0 @@
-import PropTypes from 'prop-types';
-import { Slot } from '@openedx/frontend-base';
-
-const CourseCardActionSlot = ({ cardId }) => (
-  <Slot
-    id="org.openedx.frontend.slot.learnerDashboard.courseCardAction.v1"
-    cardId={cardId}
-  />
-);
-
-CourseCardActionSlot.propTypes = {
-  cardId: PropTypes.string.isRequired,
-};
-
-export default CourseCardActionSlot;

package/src/slots/CourseListSlot/README.md

@@ -1,54 +0,0 @@
-# Course List Slot
-
-### Slot ID: `org.openedx.frontend.slot.learnerDashboard.courseList.v1`
-
-### Slot Props
-
-* `courseListData`
-
-## Description
-
-This slot is used for replacing or adding content around the `CourseList` component. The `CourseListSlot` is only rendered if the learner has enrolled in at least one course.
-
-## Example
-
-The space will show the `CourseList` component by default.
-
-![Screenshot of the CourseListSlot](./images/course_list_slot.png)
-
-Using the following configuration will replace the slot's default content with a list of course titles.
-
-![Screenshot of a custom course list](./images/readme_custom_course_list.png)
-
-```js
-import { WidgetOperationTypes } from '@openedx/frontend-base';
-
-const myComponent = ({ courseListData }) => {
-  // Extract the "visibleList"
-  const courses = courseListData.visibleList;
-
-  // Render a list of course names
-  return (
-    <div>
-      {courses.map(courseData => (
-        <p>
-          {courseData.course.courseName}
-        </p>
-      ))}
-    </div>
-  )
-}
-
-const config = {
-  slots: [
-    {
-      slotId: 'org.openedx.frontend.slot.learnerDashboard.courseList.v1',
-      id: 'my.widget',
-      op: WidgetOperationTypes.REPLACE,
-      component: myComponent
-    },
-  ]
-}
-
-export default config;
-```

package/src/slots/CourseListSlot/index.jsx

@@ -1,17 +0,0 @@
-import { Slot } from '@openedx/frontend-base';
-import { CourseList, courseListDataShape } from '../../containers/CoursesPanel/CourseList';
-
-export const CourseListSlot = ({ courseListData }) => (
-  <Slot
-    id="org.openedx.frontend.slot.learnerDashboard.courseList.v1"
-    courseListData={courseListData}
-  >
-    <CourseList courseListData={courseListData} />
-  </Slot>
-);
-
-CourseListSlot.propTypes = {
-  courseListData: courseListDataShape,
-};
-
-export default CourseListSlot;

package/src/slots/DashboardModalSlot/README.md

@@ -1,30 +0,0 @@
-# Dashboard Modal Slot
-
-### Slot ID: `org.openedx.frontend.slot.learnerDashboard.dashboardModal.v1`
-
-## Description
-
-This slot is used for the modal on a dashboard.  The following configuration will render it.
-
-## Example
-
-Learner dashboard will show modal
-![Screenshot of the dashboard modal](./images/dashboard_modal_slot.png)
-
-```js
-import { WidgetOperationTypes } from '@openedx/frontend-base';
-import { ModalDialog } from '@openedx/paragon';
-
-const config = {
-  slots: [
-    {
-      slotId: 'org.openedx.frontend.slot.learnerDashboard.dashboardModal.v1',
-      id: 'my.widget',
-      op: WidgetOperationTypes.Append,
-      element: (<ModalDialog title="Modal that appears on learner dashboard" />)
-    },
-  ]
-}
-
-export default config;
-```

package/src/slots/DashboardModalSlot/index.jsx

@@ -1,7 +0,0 @@
-import { Slot } from '@openedx/frontend-base';
-
-const DashboardModalSlot = () => (
-  <Slot id="org.openedx.frontend.slot.learnerDashboard.dashboardModal.v1" />
-);
-
-export default DashboardModalSlot;

package/src/slots/NoCoursesViewSlot/README.md

@@ -1,34 +0,0 @@
-# No Courses View Slot
-
-### Slot ID: `org.openedx.frontend.slot.learnerDashboard.noCoursesView.v1`
-
-## Description
-
-This slot is used for replacing or adding content around the `NoCoursesView` component. The `NoCoursesViewSlot` only renders if the learner has not yet enrolled in any courses.
-
-## Example
-
-The space will show the `NoCoursesView` by default.
-
-![Screenshot of the no courses view](./images/no_courses_view_slot.png)
-
-Setting configuration to the following will replace the default experience with a custom call-to-action component.
-
-![Screenshot of a custom no courses view](./images/readme_custom_no_courses_view.png)
-
-```js
-import { WidgetOperationTypes } from '@openedx/frontend-base';
-
-const config = {
-  slots: [
-    {
-      slotId: 'org.openedx.frontend.slot.learnerDashboard.noCoursesView.v1',
-      id: 'my.widget',
-      op: WidgetOperationTypes.APPEND,
-      element: (<h3>Check out our catalog of courses and start learning today!</h3>)
-    },
-  ]
-}
-
-export default config;
-```

package/src/slots/NoCoursesViewSlot/index.jsx

@@ -1,11 +0,0 @@
-import { Slot } from '@openedx/frontend-base';
-
-import NoCoursesView from '../../containers/CoursesPanel/NoCoursesView';
-
-export const NoCoursesViewSlot = () => (
-  <Slot id="org.openedx.frontend.slot.learnerDashboard.noCoursesView.v1">
-    <NoCoursesView />
-  </Slot>
-);
-
-export default NoCoursesViewSlot;

package/src/slots/README.md

@@ -1,8 +0,0 @@
-# `frontend-app-learner-dashboard` Slots
-
-* [`org.openedx.frontend.slot.learnerDashboard.courseCardBanner.v1`](./CourseBannerSlot/)
-* [`org.openedx.frontend.slot.learnerDashboard.courseCardAction.v1`](./CourseCardActionSlot/)
-* [`org.openedx.frontend.slot.learnerDashboard.courseList.v1`](./CourseListSlot/)
-* [`org.openedx.frontend.slot.learnerDashboard.dashboardModal.v1`](./DashboardModalSlot)
-* [`org.openedx.frontend.slot.learnerDashboard.noCoursesView.v1`](./NoCoursesViewSlot/)
-* [`org.openedx.frontend.slot.learnerDashboard.widgetSidebar.v1`](./WidgetSidebarSlot/)

package/src/slots/WidgetSidebarSlot/README.md

@@ -1,51 +0,0 @@
-# Widget Sidebar Slot
-
-### Slot ID: `org.openedx.frontend.slot.learnerDashboard.widgetSidebar.v1`
-
-## Description
-
-This slot is used for adding content to the right-hand sidebar.
-
-## Example
-
-The slot renders the "Looking for a Challenge" widget by default.
-
-![Screenshot of the widget sidebar](./images/widget_sidebar_slot.png)
-
-Setting configuration to the following will replace the default content with a custom sidebar component.
-
-![Screenshot of a custom call-to-action in the sidebar](./images/readme_custom_sidebar.png)
-
-```js
-import { WidgetOperationTypes } from '@openedx/frontend-base';
-
-const myComponent = () => (
-  <div>
-    <h3>
-      Sidebar Menu
-    </h3>
-    <p>
-      sidebar item #1
-    </p>
-    <p>
-      sidebar item #2
-    </p>
-    <p>
-      sidebar item #3
-    </p>
-  </div>
-)
-
-const config = {
-  slots: [
-    {
-      slotId: 'org.openedx.frontend.slot.learnerDashboard.widgetSidebar.v1',
-      id: 'my.widget',
-      op: WidgetOperationTypes.REPLACE,
-      component: myComponent
-    },
-  ]
-}
-
-export default config;
-```

package/src/slots/WidgetSidebarSlot/index.jsx

@@ -1,10 +0,0 @@
-import { Slot } from '@openedx/frontend-base';
-import LookingForChallengeWidget from '../../widgets/LookingForChallengeWidget';
-
-export const WidgetSidebarSlot = () => (
-  <Slot id="org.openedx.frontend.slot.learnerDashboard.widgetSidebar.v1">
-    <LookingForChallengeWidget />
-  </Slot>
-);
-
-export default WidgetSidebarSlot;

package/src/slots/WidgetSidebarSlot/index.test.jsx

@@ -1,28 +0,0 @@
-import { render, screen } from '@testing-library/react';
-import { IntlProvider } from '@openedx/frontend-base';
-import { MemoryRouter } from 'react-router-dom';
-import { reduxHooks } from '@src/hooks';
-import WidgetSidebarSlot from '.';
-
-jest.mock('@src/hooks', () => ({
-  reduxHooks: {
-    usePlatformSettingsData: jest.fn(),
-  },
-}));
-
-const courseSearchUrl = 'mock-url';
-
-describe('WidgetSidebar', () => {
-  it('renders PluginSlot with correct children', () => {
-    reduxHooks.usePlatformSettingsData.mockReturnValueOnce({ courseSearchUrl });
-    render(
-      <MemoryRouter>
-        <IntlProvider locale="en">
-          <WidgetSidebarSlot />
-        </IntlProvider>
-      </MemoryRouter>
-    );
-    const pluginSlot = screen.getByText('Looking for a new challenge?');
-    expect(pluginSlot).toBeDefined();
-  });
-});

package/src/slots.tsx

@@ -1,9 +0,0 @@
-import { SlotOperation } from '@openedx/frontend-base';
-
-import { learnerDashboardHeaderApp } from './widgets/LearnerDashboardHeader';
-
-const slots: SlotOperation[] = [
-  ...(learnerDashboardHeaderApp.slots as [])
-];
-
-export default slots;