Andal.LND/frontend-app-learner-dashboard
6
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: pr requests

Browse Source
This commit is contained in:
Kira Miller
2025-02-13 00:01:21 +00:00
committed by Jason Wesson
parent 77ab48c59f
commit aa1cae5200
8 changed files with 4 additions and 225 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
src/containers/DashboardModal/hooks.js
View File

@@ -1,48 +0,0 @@
import React from 'react';
import { StrictDict } from 'utils';
import track from 'tracking';
import { reduxHooks } from 'hooks';
import * as module from './hooks';
export const state = StrictDict({
showModal: (val) => React.useState(val), // eslint-disable-line
});
const { modalOpened, modalClosed, modalCTAClicked } = track.enterpriseDashboard;
export const useEnterpriseDashboardHook = () => {
const [showModal, setShowModal] = module.state.showModal(true);
const dashboard = reduxHooks.useEnterpriseDashboardData();
const trackOpened = modalOpened(dashboard.enterpriseUUID);
const trackClose = modalClosed(dashboard.enterpriseUUID, 'Cancel button');
const trackEscape = modalClosed(dashboard.enterpriseUUID, 'Escape');
const handleCTAClick = modalCTAClicked(dashboard.enterpriseUUID, dashboard.url);
const handleClose = () => {
trackClose();
setShowModal(false);
};
const handleEscape = () => {
trackEscape();
setShowModal(false);
};
React.useEffect(() => {
if (dashboard && dashboard.label) {
trackOpened();
}
}, []); // eslint-disable-line
return {
showModal,
handleCTAClick,
handleClose,
handleEscape,
dashboard,
};
};
export default useEnterpriseDashboardHook;

75
src/containers/DashboardModal/hooks.test.js
View File

@@ -1,75 +0,0 @@
import { MockUseState } from 'testUtils';
import { reduxHooks } from 'hooks';
import track from 'tracking';
import * as hooks from './hooks';
jest.mock('hooks', () => ({
reduxHooks: {
useEnterpriseDashboardData: jest.fn(),
},
}));
jest.mock('tracking', () => {
const modalOpenedEvent = jest.fn();
const modalClosedEvent = jest.fn();
const modalCTAClickedEvent = jest.fn();
return {
__esModule: true,
default: {
enterpriseDashboard: {
modalOpenedEvent,
modalClosedEvent,
modalCTAClickedEvent,
modalOpened: jest.fn(() => modalOpenedEvent),
modalClosed: jest.fn(() => modalClosedEvent),
modalCTAClicked: jest.fn(() => modalCTAClickedEvent),
},
},
};
});
const state = new MockUseState(hooks);
const enterpriseDashboardData = { label: 'edX, Inc.', url: '/edx-dashboard' };
describe('EnterpriseDashboard hooks', () => {
reduxHooks.useEnterpriseDashboardData.mockReturnValue({ ...enterpriseDashboardData });
describe('state values', () => {
state.testGetter(state.keys.showModal);
});
describe('behavior', () => {
let out;
beforeEach(() => {
state.mock();
out = hooks.useEnterpriseDashboardHook();
});
afterEach(state.restore);
test('useEnterpriseDashboardHook to return dashboard data from redux hooks', () => {
expect(out.dashboard).toMatchObject(enterpriseDashboardData);
});
test('modal initializes to shown when rendered and closes on click', () => {
state.expectInitializedWith(state.keys.showModal, true);
out.handleClose();
expect(state.values.showModal).toEqual(false);
});
test('modal initializes to shown when rendered and closes on escape', () => {
state.expectInitializedWith(state.keys.showModal, true);
out.handleEscape();
expect(state.values.showModal).toEqual(false);
});
test('CTA click tracks modalCTAClicked', () => {
out.handleCTAClick();
expect(track.enterpriseDashboard.modalCTAClicked).toHaveBeenCalledWith(
enterpriseDashboardData.enterpriseUUID,
enterpriseDashboardData.url,
);
});
});
});

3
src/plugin-slots/DashboardModalSlot/README.md
View File

@@ -22,6 +22,9 @@ const config = {
type: DIRECT_PLUGIN,
priority: 60,
RenderWidget: DashboardModal,
content: {
store,
},
},
},
],

2
src/plugin-slots/README.md
View File

@@ -5,4 +5,4 @@
* [`widget_sidebar_slot`](./WidgetSidebarSlot/)
* [`course_list_slot`](./CourseListSlot/)
* [`no_courses_view_slot`](./NoCoursesViewSlot/)
* [`dashboard_modal_slot](./DashboardModalSlot)
* [`dashboard_modal_slot`](./DashboardModalSlot)

8
src/tracking/constants.js
View File

@@ -20,13 +20,8 @@ export const events = StrictDict({
leaveSession: 'leaveSession',
unenrollReason: 'unenrollReason',
entitlementUnenrollReason: 'entitlementUnenrollReason',
dashboardModalOpened: 'dashboardModalOpened',
dashboardModalCTAClicked: 'dashboardModalCTAClicked',
dashboardModalClosed: 'dashboardModalClosed',
});
const learnerPortal = 'edx.ui.enterprise.lms.dashboard.learner_portal_modal';
export const eventNames = StrictDict({
enterCourseClicked: 'edx.bi.dashboard.enter_course.clicked',
courseImageClicked: 'edx.bi.dashboard.course_image.clicked',
@@ -39,9 +34,6 @@ export const eventNames = StrictDict({
leaveSession: 'course-dashboard.leave-session',
unenrollReason: 'unenrollment_reason.selected',
entitlementUnenrollReason: 'entitlement_unenrollment_reason.selected',
dashboardModalOpened: `${learnerPortal}.opened`,
dashboardModalCTAClicked: `${learnerPortal}.dashboard_cta.clicked`,
dashboardModalClosed: `${learnerPortal}.closed`,
findCoursesClicked: 'edx.bi.dashboard.find_courses_button.clicked',
purchaseCredit: 'edx.bi.credit.clicked_purchase_credit',
filterClicked: 'course-dashboard.filter.clicked',

2
src/tracking/index.js
View File

@@ -1,7 +1,6 @@
import course from './trackers/course';
import credit from './trackers/credit';
import engagement from './trackers/engagement';
import enterpriseDashboard from './trackers/enterpriseDashboard';
import entitlements from './trackers/entitlements';
import socialShare from './trackers/socialShare';
import findCourses from './trackers/findCourses';
@@ -11,7 +10,6 @@ export default {
course,
credit,
engagement,
enterpriseDashboard,
entitlements,
socialShare,
findCourses,

44
src/tracking/trackers/enterpriseDashboard.js
View File

@@ -1,44 +0,0 @@
import { createEventTracker, createLinkTracker } from 'data/services/segment/utils';
import { eventNames } from '../constants';
/** Enterprise Dashboard events**/
/**
* Creates tracking callback for Enterprise Dashboard Modal open event
* @param {string} enterpriseUUID - enterprise identifier
* @return {func} - Callback that tracks the event when fired.
*/
export const modalOpened = (enterpriseUUID) => () => createEventTracker(
eventNames.dashboardModalOpened,
{ enterpriseUUID },
);
/**
* Creates tracking callback for Enterprise Dashboard Modal Call-to-action click-event
* @param {string} enterpriseUUID - enterprise identifier
* @param {string} href - destination url
* @return {func} - Callback that tracks the event when fired and then loads the passed href.
*/
export const modalCTAClicked = (enterpriseUUID, href) => createLinkTracker(
createEventTracker(
eventNames.dashboardModalCTAClicked,
{ enterpriseUUID },
),
href,
);
/**
* Creates tracking callback for Enterprise Dashboard Modal close event
* @param {string} enterpriseUUID - enterprise identifier
* @param {string} source - close event soruce ("Cancel button" vs "Escape")
* @return {func} - Callback that tracks the event when fired.
*/
export const modalClosed = (enterpriseUUID, source) => createEventTracker(
eventNames.dashboardModalClosed,
{ enterpriseUUID, source },
);
export default {
modalOpened,
modalCTAClicked,
modalClosed,
};

47
src/tracking/trackers/enterpriseDashboard.test.js
View File

@@ -1,47 +0,0 @@
import { createEventTracker } from 'data/services/segment/utils';
import { eventNames } from '../constants';
import * as trackers from './enterpriseDashboard';
jest.mock('data/services/segment/utils', () => ({
createEventTracker: jest.fn(args => ({ createEventTracker: args })),
createLinkTracker: jest.fn((cb, href) => ({ createLinkTracker: { cb, href } })),
}));
const enterpriseUUID = 'test-enterprise-uuid';
const source = 'test-source';
describe('enterpriseDashboard trackers', () => {
describe('modalOpened', () => {
it('creates event tracker for dashboard modal opened event', () => {
expect(trackers.modalOpened(enterpriseUUID, source)()).toEqual(
createEventTracker(
eventNames.dashboardModalOpened,
{ enterpriseUUID, source },
),
);
});
});
describe('modalCTAClicked', () => {
const testHref = 'test-href';
it('creates link tracker for dashboard modal cta click event', () => {
const { cb, href } = trackers.modalCTAClicked(enterpriseUUID, testHref).createLinkTracker;
expect(href).toEqual(testHref);
expect(cb).toEqual(
createEventTracker(
eventNames.dashboardModalCTAClicked,
{ enterpriseUUID, source },
),
);
});
});
describe('modalClosed', () => {
it('creates event tracker for dashboard modal closed event with close source', () => {
expect(trackers.modalClosed(enterpriseUUID, source)).toEqual(
createEventTracker(
eventNames.dashboardModalClosed,
{ enterpriseUUID, source },
),
);
});
});
});