diff --git a/src/courseware/course/Course.jsx b/src/courseware/course/Course.jsx index 217d7336..162fd7a2 100644 --- a/src/courseware/course/Course.jsx +++ b/src/courseware/course/Course.jsx @@ -13,7 +13,6 @@ import ContentTools from './content-tools'; import CourseBreadcrumbs from './CourseBreadcrumbs'; import NotificationTrigger from './NotificationTrigger'; -import CourseSock from '../../generic/course-sock'; import { useModel } from '../../generic/model-store'; import useWindowSize, { responsiveBreakpoints } from '../../generic/tabs/useWindowSize'; @@ -39,10 +38,7 @@ function Course({ ].filter(element => element != null).map(element => element.title); const { - canShowUpgradeSock, celebrations, - offer, - org, verifiedMode, } = course; @@ -109,15 +105,6 @@ function Course({ open /> )} - {canShowUpgradeSock && ( - - )} { /** [MM-P2P] Experiment */ } { MMP2P.meta.modalLock && } diff --git a/src/courseware/course/Course.test.jsx b/src/courseware/course/Course.test.jsx index dd4a7785..ea454d23 100644 --- a/src/courseware/course/Course.test.jsx +++ b/src/courseware/course/Course.test.jsx @@ -79,14 +79,6 @@ describe('Course', () => { expect(getByRole(celebrationModal, 'heading', { name: 'Congratulations!' })).toBeInTheDocument(); }); - it('displays upgrade sock', async () => { - const courseMetadata = Factory.build('courseMetadata', { can_show_upgrade_sock: true }); - const testStore = await initializeTestStore({ courseMetadata, excludeFetchSequence: true }, false); - - render(, { store: testStore }); - expect(screen.getByRole('button', { name: 'Learn About Verified Certificates' })).toBeInTheDocument(); - }); - it('displays notification trigger and toggles active class on click', async () => { useWindowSize.mockReturnValue({ width: 1200 }); render(); diff --git a/src/courseware/data/__factories__/courseMetadata.factory.js b/src/courseware/data/__factories__/courseMetadata.factory.js index 49a06223..55bd3b34 100644 --- a/src/courseware/data/__factories__/courseMetadata.factory.js +++ b/src/courseware/data/__factories__/courseMetadata.factory.js @@ -6,7 +6,6 @@ Factory.define('courseMetadata') .extend(courseMetadataBase) .option('host', '') .attrs({ - can_show_upgrade_sock: false, content_type_gating_enabled: false, course_expired_message: null, end: null, diff --git a/src/generic/course-sock/CourseSock.jsx b/src/generic/course-sock/CourseSock.jsx deleted file mode 100644 index 2ed34d23..00000000 --- a/src/generic/course-sock/CourseSock.jsx +++ /dev/null @@ -1,262 +0,0 @@ -import React, { Component } from 'react'; -import PropTypes from 'prop-types'; -import { getConfig } from '@edx/frontend-platform'; -import { sendTrackEvent, sendTrackingLogEvent } from '@edx/frontend-platform/analytics'; -import { FormattedMessage } from '@edx/frontend-platform/i18n'; -import LearnerQuote1 from './assets/learner-quote.png'; -import LearnerQuote2 from './assets/learner-quote2.png'; -import { UpgradeButton } from '../upgrade-button'; -import VerifiedCert from '../assets/edX_certificate.png'; - -export default class CourseSock extends Component { - constructor(props) { - super(props); - this.state = { showUpsell: false }; - this.sockElement = React.createRef(); - this.commonEventProperties = { - courserun_key: this.props.courseId, - org_key: this.props.orgKey, - }; - this.promotionEventProperties = { - creative: 'original_sock', - name: 'In-Course Verification Prompt', - position: 'sock', - promotion_id: 'courseware_verified_certificate_upsell', - ...this.commonEventProperties, - }; - } - - componentDidMount() { - sendTrackEvent('Promotion Viewed', this.promotionEventProperties); - } - - handleClick = () => { - this.setState(state => ({ - showUpsell: !state.showUpsell, - })); - - const toggleLogEvent = this.state.showUpsell ? 'edx.bi.course.sock.toggle_opened' - : 'edx.bi.course.sock.toggle_closed'; - sendTrackEvent(toggleLogEvent, { - from_page: this.props.pageLocation, - ...this.commonEventProperties, - }); - sendTrackEvent('Promotion Clicked', this.promotionEventProperties); - } - - logClick = () => { - sendTrackingLogEvent('edx.course.enrollment.upgrade.clicked', { - location: 'sock', - ...this.commonEventProperties, - }); - const onCourseHome = this.props.pageLocation === 'Home Page'; - sendTrackEvent('edx.bi.ecommerce.upsell_links_clicked', { - ...this.commonEventProperties, - linkCategory: 'green_upgrade', - linkName: onCourseHome ? 'course_home_sock' : 'in_course_sock', - linkType: 'button', - pageName: onCourseHome ? 'course_home' : 'in_course', - }); - } - - showToUser = () => { - this.setState({ - showUpsell: true, - }, () => { - if (this.sockElement.current) { - this.sockElement.current.scrollIntoView({ behavior: 'smooth' }); - } - }); - } - - render() { - if (!this.props.verifiedMode) { - return null; - } - - const buttonClass = this.state.showUpsell ? 'btn-primary' : 'btn-outline-primary'; - return ( -
-
- -
- {this.state.showUpsell && ( - <> -

- -

-
-
-
- Example Certificate -
-
-
- -
-
-
-
-

- -

-
    -
  • - -
    • -
  • - -
    • -
  • - -
    • -
  • - -
    • -
-

- -

-
    -
  • - -
    • -
  • - -
    • -
  • - -
    • -
  • - -
    • -
- -

- -

-
- Christina Fong -
- -

- — -

-
-
-
- Chery Troell -
- -

- — -

-
-
-
-
- - )} -
- ); - } -} - -CourseSock.defaultProps = { - courseId: null, - offer: null, - orgKey: null, -}; - -CourseSock.propTypes = { - courseId: PropTypes.string, - offer: PropTypes.shape({}), - orgKey: PropTypes.string, - pageLocation: PropTypes.string.isRequired, - verifiedMode: PropTypes.shape({}).isRequired, -}; diff --git a/src/generic/course-sock/CourseSock.test.jsx b/src/generic/course-sock/CourseSock.test.jsx deleted file mode 100644 index 2716ae29..00000000 --- a/src/generic/course-sock/CourseSock.test.jsx +++ /dev/null @@ -1,82 +0,0 @@ -import React from 'react'; -import { sendTrackEvent } from '@edx/frontend-platform/analytics'; -import { - render, screen, fireEvent, initializeMockApp, initializeTestStore, -} from '../../setupTest'; -import CourseSock from './CourseSock'; - -jest.mock('@edx/frontend-platform/analytics'); - -describe('Course Sock', () => { - let store; - const mockData = { - verifiedMode: { - upgradeUrl: 'test-url', - price: 1234, - currency: 'dollars', - currencySymbol: '$', - }, - pageLocation: 'Course Content Page', - }; - - beforeAll(async () => { - // We need to mock AuthService to implicitly use `getAuthenticatedUser` within `AppContext.Provider`. - await initializeMockApp(); - store = await initializeTestStore(); - const { courseware } = store.getState(); - mockData.courseId = courseware.courseId; - }); - - it('hides upsell information on load', () => { - render(); - - expect(screen.getByRole('button', { name: 'Learn About Verified Certificates' })).toBeInTheDocument(); - expect(screen.queryByText('edX Verified Certificate')).not.toBeInTheDocument(); - }); - - it.only('handles click', () => { - sendTrackEvent.mockClear(); - render(); - const learnMoreButton = screen.getByRole('button', { name: 'Learn About Verified Certificates' }); - fireEvent.click(learnMoreButton); - - expect(screen.getByText('edX Verified Certificate')).toBeInTheDocument(); - const { currencySymbol, price } = mockData.verifiedMode; - const upsellButton = screen.getByText(`Upgrade for ${currencySymbol}${price}`); - expect(upsellButton).toBeInTheDocument(); - fireEvent.click(upsellButton); - expect(sendTrackEvent).toHaveBeenCalledTimes(4); - - expect(sendTrackEvent).toHaveBeenCalledWith('Promotion Viewed', { - courserun_key: 'course-v1:edX+DemoX+Demo_Course_1', - creative: 'original_sock', - name: 'In-Course Verification Prompt', - org_key: null, - position: 'sock', - promotion_id: 'courseware_verified_certificate_upsell', - }); - expect(sendTrackEvent).toHaveBeenCalledWith('edx.bi.course.sock.toggle_closed', { - courserun_key: 'course-v1:edX+DemoX+Demo_Course_1', - from_page: 'Course Content Page', - org_key: null, - }); - expect(sendTrackEvent).toHaveBeenCalledWith('Promotion Clicked', { - courserun_key: 'course-v1:edX+DemoX+Demo_Course_1', - creative: 'original_sock', - name: 'In-Course Verification Prompt', - org_key: null, - position: 'sock', - promotion_id: 'courseware_verified_certificate_upsell', - }); - expect(sendTrackEvent).toHaveBeenCalledWith('edx.bi.ecommerce.upsell_links_clicked', { - org_key: null, - courserun_key: mockData.courseId, - linkCategory: 'green_upgrade', - linkName: 'in_course_sock', - linkType: 'button', - pageName: 'in_course', - }); - fireEvent.click(learnMoreButton); - expect(screen.queryByText('edX Verified Certificate')).not.toBeInTheDocument(); - }); -}); diff --git a/src/generic/course-sock/assets/learner-quote.png b/src/generic/course-sock/assets/learner-quote.png deleted file mode 100644 index 46918fa9..00000000 Binary files a/src/generic/course-sock/assets/learner-quote.png and /dev/null differ diff --git a/src/generic/course-sock/assets/learner-quote2.png b/src/generic/course-sock/assets/learner-quote2.png deleted file mode 100644 index b73d71a7..00000000 Binary files a/src/generic/course-sock/assets/learner-quote2.png and /dev/null differ diff --git a/src/generic/course-sock/index.js b/src/generic/course-sock/index.js deleted file mode 100644 index 91968dfa..00000000 --- a/src/generic/course-sock/index.js +++ /dev/null @@ -1,3 +0,0 @@ -import CourseSock from './CourseSock'; - -export default CourseSock;