From e764e9c502d2c6bcef67c903df6c29c10a96c9d1 Mon Sep 17 00:00:00 2001 From: Jason Wesson Date: Mon, 3 Mar 2025 10:29:12 -0800 Subject: [PATCH] Revert "feat: adding new plugin slot for an enterprise modal" This reverts commit f110a0ade81df363fef27eac9d6ce3c0920ebf83. --- src/containers/Dashboard/index.jsx | 4 +- src/containers/Dashboard/index.test.jsx | 6 +- .../__snapshots__/index.test.jsx.snap | 42 +++++++++++++ .../EnterpriseDashboardModal/index.jsx | 60 +++++++++++++++++++ .../EnterpriseDashboardModal/index.test.jsx | 29 +++++++++ .../EnterpriseDashboardModal/messages.js | 26 ++++++++ .../EnterpriseDashboardModalSlot/README.md | 33 ---------- .../EnterpriseDashboardModalSlot/index.jsx | 8 --- src/plugin-slots/README.md | 3 +- 9 files changed, 163 insertions(+), 48 deletions(-) create mode 100644 src/containers/EnterpriseDashboardModal/__snapshots__/index.test.jsx.snap create mode 100644 src/containers/EnterpriseDashboardModal/index.jsx create mode 100644 src/containers/EnterpriseDashboardModal/index.test.jsx create mode 100644 src/containers/EnterpriseDashboardModal/messages.js delete mode 100644 src/plugin-slots/EnterpriseDashboardModalSlot/README.md delete mode 100644 src/plugin-slots/EnterpriseDashboardModalSlot/index.jsx diff --git a/src/containers/Dashboard/index.jsx b/src/containers/Dashboard/index.jsx index 91230887..d2607733 100644 --- a/src/containers/Dashboard/index.jsx +++ b/src/containers/Dashboard/index.jsx @@ -2,9 +2,9 @@ import React from 'react'; import { reduxHooks } from 'hooks'; import { RequestKeys } from 'data/constants/requests'; +import EnterpriseDashboardModal from 'containers/EnterpriseDashboardModal'; import SelectSessionModal from 'containers/SelectSessionModal'; import CoursesPanel from 'containers/CoursesPanel'; -import EnterpriseDashboardModalSlot from 'plugin-slots/EnterpriseDashboardModalSlot'; import LoadingView from './LoadingView'; import DashboardLayout from './DashboardLayout'; @@ -24,7 +24,7 @@ export const Dashboard = () => {

{pageTitle}

{!initIsPending && ( <> - {hasAvailableDashboards && } + {hasAvailableDashboards && } {(hasCourses && showSelectSessionModal) && } )} diff --git a/src/containers/Dashboard/index.test.jsx b/src/containers/Dashboard/index.test.jsx index 86886ba0..4690ddd7 100644 --- a/src/containers/Dashboard/index.test.jsx +++ b/src/containers/Dashboard/index.test.jsx @@ -2,9 +2,9 @@ import { shallow } from '@edx/react-unit-test-utils'; import { reduxHooks } from 'hooks'; +import EnterpriseDashboardModal from 'containers/EnterpriseDashboardModal'; import SelectSessionModal from 'containers/SelectSessionModal'; import CoursesPanel from 'containers/CoursesPanel'; -import EnterpriseDashboardModalSlot from 'plugin-slots/EnterpriseDashboardModalSlot'; import DashboardLayout from './DashboardLayout'; import LoadingView from './LoadingView'; @@ -20,7 +20,7 @@ jest.mock('hooks', () => ({ }, })); -jest.mock('plugin-slots/EnterpriseDashboardModalSlot', () => 'EnterpriseDashboardModalSlot'); +jest.mock('containers/EnterpriseDashboardModal', () => 'EnterpriseDashboardModal'); jest.mock('containers/CoursesPanel', () => 'CoursesPanel'); jest.mock('./LoadingView', () => 'LoadingView'); jest.mock('./DashboardLayout', () => 'DashboardLayout'); @@ -81,7 +81,7 @@ describe('Dashboard', () => { testContent(contentEl); }); it(`${renderString(showEnterpriseModal)} dashbaord modal`, () => { - expect(wrapper.instance.findByType(EnterpriseDashboardModalSlot).length) + expect(wrapper.instance.findByType(EnterpriseDashboardModal).length) .toEqual(showEnterpriseModal ? 1 : 0); }); it(`${renderString(showSelectSessionModal)} select session modal`, () => { diff --git a/src/containers/EnterpriseDashboardModal/__snapshots__/index.test.jsx.snap b/src/containers/EnterpriseDashboardModal/__snapshots__/index.test.jsx.snap new file mode 100644 index 00000000..b754d057 --- /dev/null +++ b/src/containers/EnterpriseDashboardModal/__snapshots__/index.test.jsx.snap @@ -0,0 +1,42 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`EnterpriseDashboard empty snapshot 1`] = `null`; + +exports[`EnterpriseDashboard snapshot 1`] = ` + +
+

+ You have access to the edX, Inc. dashboard +

+

+ To access the courses available to you through edX, Inc., visit the edX, Inc. dashboard now. +

+ + + + +
+ +`; diff --git a/src/containers/EnterpriseDashboardModal/index.jsx b/src/containers/EnterpriseDashboardModal/index.jsx new file mode 100644 index 00000000..7955574f --- /dev/null +++ b/src/containers/EnterpriseDashboardModal/index.jsx @@ -0,0 +1,60 @@ +import React from 'react'; +// import PropTypes from 'prop-types'; + +import { useIntl } from '@edx/frontend-platform/i18n'; +import { + ModalDialog, ActionRow, Button, +} from '@openedx/paragon'; + +import messages from './messages'; +import useEnterpriseDashboardHook from './hooks'; + +export const EnterpriseDashboardModal = () => { + const { formatMessage } = useIntl(); + const { + showModal, + handleClose, + handleCTAClick, + handleEscape, + dashboard, + } = useEnterpriseDashboardHook(); + if (!dashboard || !dashboard.label) { + return null; + } + return ( + +
+

+ {formatMessage(messages.enterpriseDialogHeader, { + label: dashboard.label, + })} +

+

+ {formatMessage(messages.enterpriseDialogBody, { + label: dashboard.label, + })} +

+ + + + +
+ + ); +}; + +EnterpriseDashboardModal.propTypes = {}; + +export default EnterpriseDashboardModal; diff --git a/src/containers/EnterpriseDashboardModal/index.test.jsx b/src/containers/EnterpriseDashboardModal/index.test.jsx new file mode 100644 index 00000000..a807468c --- /dev/null +++ b/src/containers/EnterpriseDashboardModal/index.test.jsx @@ -0,0 +1,29 @@ +import { shallow } from '@edx/react-unit-test-utils'; +import EnterpriseDashboard from '.'; + +import useEnterpriseDashboardHook from './hooks'; + +jest.mock('./hooks', () => ({ + __esModule: true, + default: jest.fn(), +})); + +describe('EnterpriseDashboard', () => { + test('snapshot', () => { + const hookData = { + dashboard: { label: 'edX, Inc.', url: '/edx-dashboard' }, + showDialog: false, + handleClose: jest.fn().mockName('useEnterpriseDashboardHook.handleClose'), + handleCTAClick: jest.fn().mockName('useEnterpriseDashboardHook.handleCTAClick'), + handleEscape: jest.fn().mockName('useEnterpriseDashboardHook.handleEscape'), + }; + useEnterpriseDashboardHook.mockReturnValueOnce({ ...hookData }); + const el = shallow(); + expect(el.snapshot).toMatchSnapshot(); + }); + test('empty snapshot', () => { + useEnterpriseDashboardHook.mockReturnValueOnce({}); + const el = shallow(); + expect(el.snapshot).toMatchSnapshot(); + }); +}); diff --git a/src/containers/EnterpriseDashboardModal/messages.js b/src/containers/EnterpriseDashboardModal/messages.js new file mode 100644 index 00000000..ff76b0b2 --- /dev/null +++ b/src/containers/EnterpriseDashboardModal/messages.js @@ -0,0 +1,26 @@ +import { defineMessages } from '@edx/frontend-platform/i18n'; + +const messages = defineMessages({ + enterpriseDialogHeader: { + id: 'leanerDashboard.enterpriseDialogHeader', + defaultMessage: 'You have access to the {label} dashboard', + description: 'title for enterpise dashboard dialog', + }, + enterpriseDialogBody: { + id: 'leanerDashboard.enterpriseDialogBody', + defaultMessage: 'To access the courses available to you through {label}, visit the {label} dashboard now.', + description: 'Body text for enterpise dashboard dialog', + }, + enterpriseDialogDismissButton: { + id: 'leanerDashboard.enterpriseDialogDismissButton', + defaultMessage: 'Dismiss', + description: 'Dismiss button to cancel visiting dashboard', + }, + enterpriseDialogConfirmButton: { + id: 'leanerDashboard.enterpriseDialogConfirmButton', + defaultMessage: 'Go to dashboard', + description: 'Confirm button to go to the dashboard url', + }, +}); + +export default messages; diff --git a/src/plugin-slots/EnterpriseDashboardModalSlot/README.md b/src/plugin-slots/EnterpriseDashboardModalSlot/README.md deleted file mode 100644 index f2a7e70b..00000000 --- a/src/plugin-slots/EnterpriseDashboardModalSlot/README.md +++ /dev/null @@ -1,33 +0,0 @@ -# Course Card Action Slot - -### Slot ID: `enterprise_dashboard_modal_slot` - -## Description - -This slot is used for the modal on a dashboard that directs you to the enterprise dashboard if applicable. -The following `env.config.jsx` will render the modal. - -```js -import { DIRECT_PLUGIN, PLUGIN_OPERATIONS } from '@openedx/frontend-plugin-framework'; -import { EnterpriseDashboardModal } from '@edx/frontend-plugin-learner-dashboard'; - -const config = { - pluginSlots: { - enterprise_dashboard_modal_slot: { - plugins: [ - { - op: PLUGIN_OPERATIONS.Insert, - widget: { - id: 'dashboard_modal', - type: DIRECT_PLUGIN, - priority: 60, - RenderWidget: EnterpriseDashboardModal, - }, - }, - ], - } - }, -} - -export default config; -``` diff --git a/src/plugin-slots/EnterpriseDashboardModalSlot/index.jsx b/src/plugin-slots/EnterpriseDashboardModalSlot/index.jsx deleted file mode 100644 index 288939ad..00000000 --- a/src/plugin-slots/EnterpriseDashboardModalSlot/index.jsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react'; -import { PluginSlot } from '@openedx/frontend-plugin-framework'; - -const EnterpriseDashboardModal = () => ( - -); - -export default EnterpriseDashboardModal; diff --git a/src/plugin-slots/README.md b/src/plugin-slots/README.md index 7a44f7e5..d1f6ccac 100644 --- a/src/plugin-slots/README.md +++ b/src/plugin-slots/README.md @@ -4,5 +4,4 @@ * [`footer_slot`](./FooterSlot/) * [`widget_sidebar_slot`](./WidgetSidebarSlot/) * [`course_list_slot`](./CourseListSlot/) -* [`no_courses_view_slot`](./NoCoursesViewSlot/) -* [`enterprise_dashboard_modal_slot](./EnterpriseDashboardModalSlot) \ No newline at end of file +* [`no_courses_view_slot`](./NoCoursesViewSlot/) \ No newline at end of file