feat: remove UpgradeButton

src/containers/CourseCard/components/CourseCardActions/BeginCourseButton.test.jsx

@@ -27,7 +27,7 @@ reduxHooks.useCardCourseRunData.mockReturnValue({ homeUrl });
 const execEdPath = (cardId) => `exec-ed-tracking-path=${cardId}`;
 reduxHooks.useCardExecEdTrackingParam.mockImplementation(execEdPath);
 reduxHooks.useTrackCourseEvent.mockImplementation(
-  (eventName, cardId, upgradeUrl) => ({ trackCourseEvent: { eventName, cardId, upgradeUrl } }),
+  (eventName, cardId, url) => ({ trackCourseEvent: { eventName, cardId, url } }),
 );
 
 describe('BeginCourseButton', () => {

src/containers/CourseCard/components/CourseCardActions/ResumeButton.test.jsx

@@ -26,7 +26,7 @@ reduxHooks.useCardCourseRunData.mockReturnValue({ resumeUrl });
 const execEdPath = (cardId) => `exec-ed-tracking-path=${cardId}`;
 reduxHooks.useCardExecEdTrackingParam.mockImplementation(execEdPath);
 reduxHooks.useTrackCourseEvent.mockImplementation(
-  (eventName, cardId, upgradeUrl) => ({ trackCourseEvent: { eventName, cardId, upgradeUrl } }),
+  (eventName, cardId, url) => ({ trackCourseEvent: { eventName, cardId, url } }),
 );
 
 let wrapper;

src/containers/CourseCard/components/CourseCardActions/ViewCourseButton.test.jsx

@@ -15,7 +15,7 @@ jest.mock('hooks', () => ({
   reduxHooks: {
     useCardCourseRunData: jest.fn(() => ({ homeUrl: 'homeUrl' })),
     useTrackCourseEvent: jest.fn(
-      (eventName, cardId, upgradeUrl) => ({ trackCourseEvent: { eventName, cardId, upgradeUrl } }),
+      (eventName, cardId, url) => ({ trackCourseEvent: { eventName, cardId, url } }),
     ),
   },
 }));

src/containers/CourseCard/components/CourseCardActions/messages.js

@@ -1,11 +1,6 @@
 import { defineMessages } from '@edx/frontend-platform/i18n';
 
 const messages = defineMessages({
-  upgrade: {
-    id: 'learner-dash.courseCard.actions.upgrade',
-    description: 'Course card upgrade button text',
-    defaultMessage: 'Upgrade',
-  },
   beginCourse: {
     id: 'learner-dash.courseCard.actions.beginCourse',
     description: 'Course card begin-course button text',

src/containers/CourseCard/components/CourseCardImage.test.jsx

@@ -18,8 +18,8 @@ jest.mock('hooks', () => ({
     useCardCourseData: jest.fn(() => ({ bannerImgSrc: 'banner-img-src' })),
     useCardCourseRunData: jest.fn(() => ({ homeUrl })),
     useCardEnrollmentData: jest.fn(() => ({ isVerified: true })),
-    useTrackCourseEvent: jest.fn((eventName, cardId, upgradeUrl) => ({
-      trackCourseEvent: { eventName, cardId, upgradeUrl },
+    useTrackCourseEvent: jest.fn((eventName, cardId, url) => ({
+      trackCourseEvent: { eventName, cardId, url },
     })),
   },
 }));

src/containers/CourseCard/components/CourseCardTitle.test.jsx

@@ -17,8 +17,8 @@ jest.mock('hooks', () => ({
   reduxHooks: {
     useCardCourseData: jest.fn(() => ({ courseName: 'course-name' })),
     useCardCourseRunData: jest.fn(() => ({ homeUrl })),
-    useTrackCourseEvent: jest.fn((eventName, cardId, upgradeUrl) => ({
-      trackCourseEvent: { eventName, cardId, upgradeUrl },
+    useTrackCourseEvent: jest.fn((eventName, cardId, url) => ({
+      trackCourseEvent: { eventName, cardId, url },
     })),
   },
 }));

src/containers/CourseCard/components/hooks.js

@@ -3,27 +3,25 @@ import { reduxHooks } from 'hooks';
 export const useActionDisabledState = (cardId) => {
   const { isMasquerading } = reduxHooks.useMasqueradeData();
   const {
-    canUpgrade, hasAccess, isAudit, isAuditAccessExpired,
+    hasAccess, isAudit, isAuditAccessExpired,
   } = reduxHooks.useCardEnrollmentData(cardId);
   const {
     isEntitlement, isFulfilled, canChange, hasSessions,
   } = reduxHooks.useCardEntitlementData(cardId);
 
-  const { resumeUrl, homeUrl, upgradeUrl } = reduxHooks.useCardCourseRunData(cardId);
+  const { resumeUrl, homeUrl } = reduxHooks.useCardCourseRunData(cardId);
 
   const disableBeginCourse = !homeUrl || (isMasquerading || !hasAccess || (isAudit && isAuditAccessExpired));
   const disableResumeCourse = !resumeUrl || (isMasquerading || !hasAccess || (isAudit && isAuditAccessExpired));
   const disableViewCourse = !hasAccess || (isAudit && isAuditAccessExpired);
   const disableSelectSession = !isEntitlement || isMasquerading || !hasAccess || (!canChange || !hasSessions);
-  const disableUpgradeCourse = !upgradeUrl || (isMasquerading && !canUpgrade);
 
   const disableCourseTitle = (isEntitlement && !isFulfilled) || disableViewCourse;
 
   return {
     disableBeginCourse,
     disableResumeCourse,
     disableViewCourse,
-    disableUpgradeCourse,
     disableSelectSession,
     disableCourseTitle,
   };

src/containers/CourseCard/components/hooks.test.js

@@ -26,7 +26,6 @@ describe('useActionDisabledState', () => {
     isAuditAccessExpired: false,
     resumeUrl: 'resume.url',
     homeUrl: 'home.url',
-    upgradeUrl: 'upgrade.url',
   };
   const mockHooksData = (args) => {
     const {
@@ -41,7 +40,6 @@ describe('useActionDisabledState', () => {
       isAuditAccessExpired,
       resumeUrl,
       homeUrl,
-      upgradeUrl,
     } = { ...defaultData, ...args };
     reduxHooks.useMasqueradeData.mockReturnValueOnce({ isMasquerading });
     reduxHooks.useCardEnrollmentData.mockReturnValueOnce({
@@ -59,7 +57,6 @@ describe('useActionDisabledState', () => {
     reduxHooks.useCardCourseRunData.mockReturnValueOnce({
       resumeUrl,
       homeUrl,
-      upgradeUrl,
     });
   };
 
@@ -121,21 +118,6 @@ describe('useActionDisabledState', () => {
       testDisabled({ hasAccess: true }, false);
     });
   });
-  describe('disableUpgradeCourse', () => {
-    const testDisabled = (data, expected) => {
-      mockHooksData(data);
-      expect(runHook().disableUpgradeCourse).toBe(expected);
-    };
-    it('disable when upgradeUrl is invalid', () => {
-      testDisabled({ upgradeUrl: null }, true);
-    });
-    it('disable when isMasquerading is true and canUpgrade is false', () => {
-      testDisabled({ isMasquerading: true, canUpgrade: false }, true);
-    });
-    it('enable when all conditions are met', () => {
-      testDisabled({ canUpgrade: true }, false);
-    });
-  });
   describe('disableSelectSession', () => {
     const testDisabled = (data, expected) => {
       mockHooksData(data);

src/data/redux/app/selectors/courseCard.js

@@ -52,7 +52,6 @@ export const courseCard = StrictDict({
 
       homeUrl: courseRun.homeUrl,
       marketingUrl: courseRun.marketingUrl,
-      upgradeUrl: courseRun.upgradeUrl,
 
       progressUrl: baseAppUrl(courseRun.progressUrl),
       resumeUrl: baseAppUrl(courseRun.resumeUrl), // resume will route this to learning mfe.
@@ -91,6 +90,7 @@ export const courseCard = StrictDict({
         hasStarted: enrollment.hasStarted,
 
         accessExpirationDate: module.loadDateVal(enrollment.accessExpirationDate),
+        // TODO: find out where "canUpgrade" comes from and if it's still needed by other components (see CourseBanner)
         canUpgrade: enrollment.canUpgrade,
         isAudit: enrollment.isAudit,
         isAuditAccessExpired: enrollment.isAuditAccessExpired,

src/data/redux/app/selectors/courseCard.test.js

@@ -156,7 +156,6 @@ describe('courseCard selectors module', () => {
 
           homeUrl: 'test-home-url',
           marketingUrl: 'test-marketing-url',
-          upgradeUrl: 'test-upgrade-url',
 
           progressUrl: 'test-progress-url',
           resumeUrl: 'test-resume-url',
@@ -181,10 +180,9 @@ describe('courseCard selectors module', () => {
       it('passes minPassingGrade floored from float to a percentage value', () => {
         expect(selected.minPassingGrade).toEqual(93);
       });
-      it('passes [homeUrl, marketingUrl, upgradeUrl]', () => {
+      it('passes [homeUrl, marketingUrl]', () => {
         expect(selected.homeUrl).toEqual(testData.homeUrl);
         expect(selected.marketingUrl).toEqual(testData.marketingUrl);
-        expect(selected.upgradeUrl).toEqual(testData.upgradeUrl);
       });
       it('passes [progressUrl, unenrollUrl, resumeUrl], converted to baseAppUrl', () => {
         expect(selected.progressUrl).toEqual(baseAppUrl(testData.progressUrl));

src/data/services/lms/api.js

@@ -50,12 +50,6 @@ export const logEvent = ({ eventName, data, courseId }) => post(urls.event(), {
   event: JSON.stringify(data),
 });
 
-export const logUpgrade = ({ courseId }) => module.logEvent({
-  eventName: eventNames.upgradeButtonClickedEnrollment,
-  courseId,
-  data: { location: 'learner-dashboard' },
-});
-
 export const logShare = ({ courseId, site }) => module.logEvent({
   eventName: eventNames.shareClicked,
   courseId,
@@ -78,7 +72,6 @@ export default {
   updateEntitlementEnrollment,
   deleteEntitlementEnrollment,
   logEvent,
-  logUpgrade,
   logShare,
   createCreditRequest,
 };

src/data/services/lms/api.test.js

@@ -130,13 +130,6 @@ describe('lms api methods', () => {
       beforeEach(() => {
         jest.spyOn(api, moduleKeys.logEvent).mockImplementation(logEvent);
       });
-      test('logUpgrade sends enrollment upgrade click event with learner dashboard location', () => {
-        expect(api.logUpgrade({ courseId })).toEqual(logEvent({
-          eventName: eventNames.upgradeButtonClickedEnrollment,
-          courseId,
-          data: { location: 'learner-dashboard' },
-        }));
-      });
       test('logShare sends share clicke vent with course id, side and location', () => {
         const site = 'test-site';
         expect(api.logShare({ courseId, site })).toEqual(logEvent({

src/data/services/lms/fakeData/courses.js

@@ -779,9 +779,6 @@ export const compileCourseRunData = ({ courseName, ...data }, index) => {
     courseProvider: getOption(providerOptions, index),
     programs: getOption(programsOptions, index),
   };
-  if (out.enrollment.canUpgrade) {
-    out.courseRun.upgradeUrl = 'test-upgrade-url';
-  }
   return out;
 };
 

src/plugin-slots/CourseCardActionSlot/index.jsx

@@ -2,27 +2,14 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { PluginSlot } from '@openedx/frontend-plugin-framework';
 
-import { reduxHooks } from 'hooks';
-import UpgradeButton from 'containers/CourseCard/components/CourseCardActions/UpgradeButton';
-
-const CourseCardActionSlot = ({ cardId }) => {
-  const { isEntitlement } = reduxHooks.useCardEntitlementData(cardId);
-  const {
-    isVerified,
-    isExecEd2UCourse,
-  } = reduxHooks.useCardEnrollmentData(cardId);
-
-  return (
-    <PluginSlot
-      id="course_card_action_slot"
-      pluginProps={{
-        cardId,
-      }}
-    >
-      {!(isEntitlement || isVerified || isExecEd2UCourse) && <UpgradeButton cardId={cardId} />}
-    </PluginSlot>
-  );
-};
+const CourseCardActionSlot = ({ cardId }) => (
+  <PluginSlot
+    id="course_card_action_slot"
+    pluginProps={{
+      cardId,
+    }}
+  />
+);
 
 CourseCardActionSlot.propTypes = {
   cardId: PropTypes.string.isRequired,

src/tracking/constants.js

@@ -2,7 +2,6 @@ import { StrictDict } from 'utils';
 
 export const categories = StrictDict({
   dashboard: 'dashboard',
-  upgrade: 'upgrade',
   userEngagement: 'user-engagement',
   searchButton: 'search_button',
   credit: 'credit',
@@ -14,9 +13,6 @@ export const events = StrictDict({
   courseImageClicked: 'courseImageClicked',
   courseTitleClicked: 'courseTitleClicked',
   courseOptionsDropdownClicked: 'courseOptionsDropdownClicked',
-  upgradeButtonClicked: 'upgradeButtonClicked',
-  upgradeButtonClickedEnrollment: 'upgradeButtonClickedEnrollment',
-  upgradeButtonClickedUpsell: 'upgradeButtonClickedUpsell',
   shareClicked: 'shareClicked',
   userSettingsChanged: 'userSettingsChanged',
   newSession: 'newSession',
@@ -36,9 +32,6 @@ export const eventNames = StrictDict({
   courseImageClicked: 'edx.bi.dashboard.course_image.clicked',
   courseTitleClicked: 'edx.bi.dashboard.course_title.clicked',
   courseOptionsDropdownClicked: 'edx.bi.dashboard.course_options_dropdown.clicked',
-  upgradeButtonClicked: 'edx.bi.dashboard.upgrade_button.clicked',
-  upgradeButtonClickedEnrollment: 'edx.course.enrollment.upgrade.clicked',
-  upgradeButtonClickedUpsell: 'edx.bi.ecommerce.upsell_links_clicked',
   shareClicked: 'edx.course.share_clicked',
   userSettingsChanged: 'edx.user.settings.changed',
   newSession: 'course-dashboard.new-session',

src/tracking/trackers/course.js

@@ -1,4 +1,3 @@
-import api from 'data/services/lms/api';
 import { createEventTracker, createLinkTracker } from 'data/services/segment/utils';
 import { categories, eventNames } from '../constants';
 import * as module from './course';
@@ -31,20 +30,6 @@ export const courseLinkTracker = (eventName) => (courseId, href) => (
   createLinkTracker(module.courseEventTracker(eventName, courseId), href)
 );
 
-// Upgrade Events
-/**
- * There are currently multiple tracked api events for the upgrade event, with different targets.
- * Goal here is to split out the tracked events for easier testing.
- */
-export const upgradeButtonClicked = (courseId) => createEventTracker(
-  eventNames.upgradeButtonClicked,
-  { category: categories.upgrade, label: courseId },
-);
-export const upgradeButtonClickedUpsell = (courseId) => createEventTracker(
-  eventNames.upgradeButtonClickedUpsell,
-  { ...upsellOptions, courseId },
-);
-
 // Non-Link events
 export const courseOptionsDropdownClicked = (courseId) => (
   module.courseEventTracker(eventNames.courseOptionsDropdownClicked, courseId)
@@ -57,19 +42,10 @@ export const courseTitleClicked = (...args) => (
   module.courseLinkTracker(eventNames.courseTitleClicked)(...args));
 export const enterCourseClicked = (...args) => (
   module.courseLinkTracker(eventNames.enterCourseClicked)(...args));
-export const upgradeClicked = (courseId, href) => createLinkTracker(
-  () => {
-    module.upgradeButtonClicked(courseId)();
-    module.upgradeButtonClickedUpsell(courseId)();
-    api.logUpgrade({ courseId });
-  },
-  href,
-);
 
 export default {
   courseImageClicked,
   courseOptionsDropdownClicked,
   courseTitleClicked,
   enterCourseClicked,
-  upgradeClicked,
 };