Fix tracking links (#81)

src/containers/UnenrollConfirmModal/components/ReasonPane.jsx

@@ -13,6 +13,7 @@ import messages from './messages';
 
 export const ReasonPane = ({
   reason,
+  handleSubmit,
 }) => {
   const { formatMessage } = useIntl();
   const option = (key) => (
@@ -40,7 +41,7 @@ export const ReasonPane = ({
         <Button variant="tertiary" onClick={reason.skip}>
           {formatMessage(messages.reasonSkip)}
         </Button>
-        <Button onClick={reason.submit}>
+        <Button onClick={handleSubmit}>
           {formatMessage(messages.reasonSubmit)}
         </Button>
       </ActionRow>
@@ -57,8 +58,8 @@ ReasonPane.propTypes = {
       onChange: PropTypes.func,
     }),
     selected: PropTypes.string,
-    submit: PropTypes.func,
   }).isRequired,
+  handleSubmit: PropTypes.func.isRequired,
 };
 
 export default ReasonPane;

src/containers/UnenrollConfirmModal/components/ReasonPane.test.jsx

@@ -13,8 +13,8 @@ describe('UnenrollConfirmModal ReasonPane', () => {
         onChange: jest.fn().mockName('props.reason.customOption.onChange'),
       },
       selected: 'props.reason.selected',
-      submit: jest.fn().mockName('props.reason.submit'),
     },
+    handleSubmit: jest.fn().mockName('props.handleSubmit'),
   };
   test('snapshot', () => {
     expect(shallow(<ReasonPane {...props} />)).toMatchSnapshot();

src/containers/UnenrollConfirmModal/components/__snapshots__/ReasonPane.test.jsx.snap

@@ -82,7 +82,7 @@ exports[`UnenrollConfirmModal ReasonPane snapshot 1`] = `
       Skip
     </Button>
     <Button
-      onClick={[MockFunction props.reason.submit]}
+      onClick={[MockFunction props.handleSubmit]}
     >
       Submit
     </Button>

src/containers/UnenrollConfirmModal/hooks/index.js

@@ -28,10 +28,6 @@ export const useUnenrollData = ({ closeModal, dispatch, cardId }) => {
     reason.submittedReason,
     isEntitlement,
   );
-  const handleSubmit = () => {
-    handleTrackReasons();
-    dispatch(thunkActions.app.unenrollFromCourse(cardId, reason.submittedReason));
-  };
 
   let modalState;
   if (isConfirmed) {
@@ -40,6 +36,10 @@ export const useUnenrollData = ({ closeModal, dispatch, cardId }) => {
     modalState = modalStates.confirm;
   }
 
+  const handleSubmitReason = () => {
+    handleTrackReasons();
+    dispatch(thunkActions.app.unenrollFromCourse(cardId, reason.submittedReason));
+  };
   const close = () => {
     closeModal();
     setIsConfirmed(false);
@@ -57,7 +57,7 @@ export const useUnenrollData = ({ closeModal, dispatch, cardId }) => {
     close,
     closeAndRefresh,
     modalState,
-    handleSubmit,
+    handleSubmitReason,
   };
 };
 

src/containers/UnenrollConfirmModal/index.jsx

@@ -27,6 +27,7 @@ export const UnenrollConfirmModal = ({
     closeAndRefresh,
     close,
     modalState,
+    handleSubmitReason,
   } = useUnenrollData({ dispatch, closeModal, cardId });
   const showFullscreen = modalState === modalStates.reason;
   return (
@@ -48,7 +49,7 @@ export const UnenrollConfirmModal = ({
           <FinishedPane handleClose={closeAndRefresh} gaveReason={!reason.isSkipped} />
         )}
         {(modalState === modalStates.reason) && (
-          <ReasonPane reason={reason} />
+          <ReasonPane reason={reason} handleSubmit={handleSubmitReason} />
         )}
       </div>
     </ModalDialog>

src/tracking/trackers/course.js

@@ -59,8 +59,8 @@ export const enterCourseClicked = (...args) => (
   module.courseLinkTracker(eventNames.enterCourseClicked)(...args));
 export const upgradeClicked = (courseId, href) => createLinkTracker(
   () => {
-    module.upgradeButtonClicked(courseId);
-    module.upgradeButtonClickedUpsell(courseId);
+    module.upgradeButtonClicked(courseId)();
+    module.upgradeButtonClickedUpsell(courseId)();
     api.logUpgrade({ courseId });
   },
   href,

src/tracking/trackers/course.test.js

@@ -103,15 +103,19 @@ describe('course trackers', () => {
       it('triggers upgrade actions and api.logUpgrade with courseId', () => {
         const upgradeButtonClicked = jest.fn();
         const upgradeButtonClickedUpsell = jest.fn();
+        const trackUpgradeButtonClicked = jest.fn(() => upgradeButtonClicked);
+        const trackUpgradeButtonClickedUpsell = jest.fn(() => upgradeButtonClickedUpsell);
         jest.spyOn(trackers, moduleKeys.upgradeButtonClicked)
-          .mockImplementationOnce(upgradeButtonClicked);
+          .mockImplementationOnce(trackUpgradeButtonClicked);
         jest.spyOn(trackers, moduleKeys.upgradeButtonClickedUpsell)
-          .mockImplementationOnce(upgradeButtonClickedUpsell);
+          .mockImplementationOnce(trackUpgradeButtonClickedUpsell);
         const out = trackers.upgradeClicked(courseId, href).createLinkTracker;
         expect(out.href).toEqual(href);
         out.cb();
-        expect(upgradeButtonClicked).toHaveBeenCalledWith(courseId);
-        expect(upgradeButtonClickedUpsell).toHaveBeenCalledWith(courseId);
+        expect(trackUpgradeButtonClicked).toHaveBeenCalledWith(courseId);
+        expect(trackUpgradeButtonClickedUpsell).toHaveBeenCalledWith(courseId);
+        expect(upgradeButtonClicked).toHaveBeenCalledWith();
+        expect(upgradeButtonClickedUpsell).toHaveBeenCalledWith();
         expect(api.logUpgrade).toHaveBeenCalledWith({ courseId });
       });
     });

src/widgets/RecommendationsPanel/track.js

@@ -1,9 +1,10 @@
+import { StrictDict } from 'utils';
 import { createLinkTracker, createEventTracker } from 'data/services/segment/utils';
 
-export const eventNames = {
+export const eventNames = StrictDict({
   findCoursesClicked: 'edx.bi.dashboard.find_courses_button.clicked',
   recommendedCourseClicked: 'edx.bi.user.recommended.course.click',
-};
+});
 
 export const findCoursesClicked = (href) => createLinkTracker(
   createEventTracker(eventNames.findCoursesClicked, {
@@ -15,7 +16,7 @@ export const findCoursesClicked = (href) => createLinkTracker(
 );
 
 export const recommendedCourseClicked = (courseKey, isPersonalized, href) => createLinkTracker(
-  createEventTracker(eventNames.recommendedCoursesClicked, {
+  createEventTracker(eventNames.recommendedCourseClicked, {
     course_key: courseKey,
     is_personalized_recommendation: isPersonalized,
   }),