Skip to content

Commit

Permalink
feat: use new sendEnterpriseTrackEvent from frontend-enterprise-utils
Browse files Browse the repository at this point in the history
  • Loading branch information
@long74100
long74100 committed Oct 15, 2021
1 parent 3e3c3f0 commit a79346c
Show file tree
Hide file tree
Showing 7 changed files with 179 additions and 31 deletions.
46 changes: 43 additions & 3 deletions package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@
"@edx/brand": "npm:@edx/brand-edx.org@^2.0.3",
"@edx/frontend-enterprise-catalog-search": "0.1.10",
"@edx/frontend-enterprise-logistration": "0.1.11",
"@edx/frontend-enterprise-utils": "0.1.7",
"@edx/frontend-enterprise-utils": "1.1.0",
"@edx/frontend-platform": "1.11.0",
"@edx/paragon": "^16.8.0",
"@fortawesome/fontawesome-svg-core": "1.2.35",
Expand Down
27 changes: 18 additions & 9 deletions src/components/subscriptions/expiration/SubscriptionExpirationBanner.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import React, { useContext, useState } from 'react';
import { Alert } from '@edx/paragon';
import PropTypes from 'prop-types';
import { sendTrackEvent } from '@edx/frontend-platform/analytics';
import { sendEnterpriseTrackEvent } from '@edx/frontend-enterprise-utils';

import {
SUBSCRIPTION_DAYS_REMAINING_MODERATE,
Expand All @@ -20,6 +20,7 @@ const SubscriptionExpirationBanner = ({ isSubscriptionPlanDetails }) => {
daysUntilExpiration: daysUntilPlanExpiration,
expirationDate,
showExpirationNotifications,
enterpriseCustomerUuid,
},
} = useContext(SubscriptionDetailContext);
const [showBanner, setShowBanner] = useState(true);
Expand Down Expand Up @@ -82,17 +83,25 @@ const SubscriptionExpirationBanner = ({ isSubscriptionPlanDetails }) => {
}

const emitAlertActionEvent = () => {
sendTrackEvent('edx.ui.admin_portal.subscriptions.expiration.alert.support_cta.clicked', {
expiration_threshold: subscriptionExpirationThreshold,
days_until_expiration: daysUntilExpiration,
});
sendEnterpriseTrackEvent(
enterpriseCustomerUuid,
'edx.ui.admin_portal.subscriptions.expiration.alert.support_cta.clicked',
{
expiration_threshold: subscriptionExpirationThreshold,
days_until_expiration: daysUntilExpiration,
},
);
};

const emitAlertDismissedEvent = () => {
sendTrackEvent('edx.ui.admin_portal.subscriptions.expiration.alert.dismissed', {
expiration_threshold: subscriptionExpirationThreshold,
days_until_expiration: daysUntilExpiration,
});
sendEnterpriseTrackEvent(
enterpriseCustomerUuid,
'edx.ui.admin_portal.subscriptions.expiration.alert.dismissed',
{
expiration_threshold: subscriptionExpirationThreshold,
days_until_expiration: daysUntilExpiration,
},
);
};

const actions = [];
Expand Down
27 changes: 18 additions & 9 deletions src/components/subscriptions/expiration/SubscriptionExpirationModals.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import Cookies from 'universal-cookie';
import { useToggle } from '@edx/paragon';
import { sendTrackEvent } from '@edx/frontend-platform/analytics';
import { sendEnterpriseTrackEvent } from '@edx/frontend-enterprise-utils';

import SubscriptionExpiredModal from './SubscriptionExpiredModal';
import SubscriptionExpiringModal from './SubscriptionExpiringModal';
Expand All @@ -30,6 +30,7 @@ const SubscriptionExpirationModals = ({ enterpriseId }) => {
const {
subscription: {
agreementNetDaysUntilExpiration, showExpirationNotifications,
enterpriseCustomerUuid,
},
} = useContext(SubscriptionDetailContext);
const isSubscriptionExpired = agreementNetDaysUntilExpiration <= 0;
Expand Down Expand Up @@ -96,17 +97,25 @@ const SubscriptionExpirationModals = ({ enterpriseId }) => {
}, [isSubscriptionExpired]);

const emitAlertActionEvent = () => {
sendTrackEvent('edx.ui.admin_portal.subscriptions.expiration.modal.support_cta.clicked', {
expiration_threshold: subscriptionExpirationThreshold,
days_until_expiration: agreementNetDaysUntilExpiration,
});
sendEnterpriseTrackEvent(
enterpriseCustomerUuid,
'edx.ui.admin_portal.subscriptions.expiration.modal.support_cta.clicked',
{
expiration_threshold: subscriptionExpirationThreshold,
days_until_expiration: agreementNetDaysUntilExpiration,
},
);
};

const emitAlertDismissedEvent = () => {
sendTrackEvent('edx.ui.admin_portal.subscriptions.expiration.modal.dismissed', {
expiration_threshold: subscriptionExpirationThreshold,
days_until_expiration: agreementNetDaysUntilExpiration,
});
sendEnterpriseTrackEvent(
enterpriseCustomerUuid,
'edx.ui.admin_portal.subscriptions.expiration.modal.dismissed',
{
expiration_threshold: subscriptionExpirationThreshold,
days_until_expiration: agreementNetDaysUntilExpiration,
},
);
};

const handleCloseModal = (closeModal) => {
Expand Down
8 changes: 4 additions & 4 deletions src/components/subscriptions/tests/TestUtilities.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,10 +13,10 @@ import SubscriptionDetailContextProvider from '../SubscriptionDetailContextProvi
import * as hooks from '../data/hooks';

export const TEST_ENTERPRISE_CUSTOMER_SLUG = 'test-enterprise';
const TEST_ENTERPRISE_CUSTOMER_UUID = 'b5f07fee-1b34-458f-b672-19b55fc1bd10';
const TEST_ENTERPRISE_CUSTOMER_CATALOG_UUID = 'ff7acb5e-584a-4e5f-bacc-33a9995794f9';
const TEST_SUBSCRIPTION_PLAN_TITLE = 'Test Subscription Plan';
const TEST_SUBSCRIPTION_PLAN_UUID = '28d4dcdc-c026-4c02-a263-82dd9c0d8b43';
export const TEST_ENTERPRISE_CUSTOMER_UUID = 'b5f07fee-1b34-458f-b672-19b55fc1bd10';
export const TEST_ENTERPRISE_CUSTOMER_CATALOG_UUID = 'ff7acb5e-584a-4e5f-bacc-33a9995794f9';
export const TEST_SUBSCRIPTION_PLAN_TITLE = 'Test Subscription Plan';
export const TEST_SUBSCRIPTION_PLAN_UUID = '28d4dcdc-c026-4c02-a263-82dd9c0d8b43';

export const SUBSCRIPTION_PLAN_ZERO_STATE = {
daysUntilExpiration: 240,
Expand Down
35 changes: 33 additions & 2 deletions src/components/subscriptions/tests/expiration/SubscriptionExpirationBanner.test.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import {
} from '@testing-library/react';
import userEvent from '@testing-library/user-event';

import * as enterpriseUtils from '@edx/frontend-enterprise-utils';
import SubscriptionExpirationBanner from '../../expiration/SubscriptionExpirationBanner';
import {
SUBSCRIPTION_DAYS_REMAINING_MODERATE,
Expand All @@ -13,10 +14,11 @@ import {
import {
SUBSCRIPTION_PLAN_ZERO_STATE,
SubscriptionManagementContext,
TEST_ENTERPRISE_CUSTOMER_UUID,
} from '../TestUtilities';

jest.mock('@edx/frontend-platform/analytics', () => ({
sendTrackEvent: jest.fn(),
jest.mock('@edx/frontend-enterprise-utils', () => ({
sendEnterpriseTrackEvent: jest.fn(),
}));

// PropType validation for state is done by SubscriptionManagementContext
Expand All @@ -28,6 +30,8 @@ const ExpirationBannerWithContext = ({ detailState, isSubscriptionPlanDetails =
);

describe('<SubscriptionExpirationBanner />', () => {
afterEach(() => jest.clearAllMocks());

test('does not render an alert before the "moderate" days until expiration threshold', () => {
const detailStateCopy = {
...SUBSCRIPTION_PLAN_ZERO_STATE,
Expand Down Expand Up @@ -63,6 +67,14 @@ describe('<SubscriptionExpirationBanner />', () => {
userEvent.click(screen.getByText('Dismiss'));
await waitForElementToBeRemoved(screen.queryByRole('alert'));
expect(screen.queryByRole('alert')).toBeNull();
expect(enterpriseUtils.sendEnterpriseTrackEvent).toHaveBeenCalledWith(
TEST_ENTERPRISE_CUSTOMER_UUID,
'edx.ui.admin_portal.subscriptions.expiration.alert.dismissed',
{
expiration_threshold: threshold,
days_until_expiration: threshold,
},
);
});

test('does not render an alert when subscription expiration notifications are disabled', () => {
Expand Down Expand Up @@ -97,4 +109,23 @@ describe('<SubscriptionExpirationBanner />', () => {
expect(screen.queryByText("This subscription plan's end date has passed")).toBeNull();
}
});

test('handles customer support button click', () => {
const agreementNetDaysUntilExpiration = 0;
const detailStateCopy = {
...SUBSCRIPTION_PLAN_ZERO_STATE,
agreementNetDaysUntilExpiration,
};

render(<ExpirationBannerWithContext detailState={detailStateCopy} />);
userEvent.click(screen.getByText('Contact customer support'));
expect(enterpriseUtils.sendEnterpriseTrackEvent).toHaveBeenCalledWith(
TEST_ENTERPRISE_CUSTOMER_UUID,
'edx.ui.admin_portal.subscriptions.expiration.alert.support_cta.clicked',
{
expiration_threshold: SUBSCRIPTION_DAYS_REMAINING_EXCEPTIONAL,
days_until_expiration: agreementNetDaysUntilExpiration,
},
);
});
});
65 changes: 62 additions & 3 deletions src/components/subscriptions/tests/expiration/SubscriptionExpirationModals.test.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import {
import '@testing-library/jest-dom/extend-expect';
import userEvent from '@testing-library/user-event';

import * as enterpriseUtils from '@edx/frontend-enterprise-utils';
import SubscriptionExpirationModals from '../../expiration/SubscriptionExpirationModals';
import { EXPIRED_MODAL_TITLE } from '../../expiration/SubscriptionExpiredModal';
import { EXPIRING_MODAL_TITLE } from '../../expiration/SubscriptionExpiringModal';
Expand All @@ -14,12 +15,13 @@ import {
SUBSCRIPTION_DAYS_REMAINING_EXCEPTIONAL,
} from '../../data/constants';
import {
TEST_ENTERPRISE_CUSTOMER_UUID,
SUBSCRIPTION_PLAN_ZERO_STATE,
SubscriptionManagementContext,
} from '../TestUtilities';

jest.mock('@edx/frontend-platform/analytics', () => ({
sendTrackEvent: jest.fn(),
jest.mock('@edx/frontend-enterprise-utils', () => ({
sendEnterpriseTrackEvent: jest.fn(),
}));

// PropType validation for state is done by SubscriptionManagementContext
Expand All @@ -31,6 +33,8 @@ const ExpirationModalsWithContext = ({ detailState }) => (
);

describe('<SubscriptionExpirationModals />', () => {
afterEach(() => jest.clearAllMocks());

describe('non-expired and non-expiring', () => {
test('does not render any expiration modals', () => {
render(<ExpirationModalsWithContext detailState={SUBSCRIPTION_PLAN_ZERO_STATE} />);
Expand Down Expand Up @@ -62,14 +66,42 @@ describe('<SubscriptionExpirationModals />', () => {
});

test('expired modal is dismissible', () => {
const agreementNetDaysUntilExpiration = 0;
const detailStateCopy = {
...SUBSCRIPTION_PLAN_ZERO_STATE,
agreementNetDaysUntilExpiration: 0,
agreementNetDaysUntilExpiration,
};
render(<ExpirationModalsWithContext detailState={detailStateCopy} />);
expect(screen.queryByLabelText(EXPIRED_MODAL_TITLE)).toBeTruthy();
userEvent.click(screen.getByText('Dismiss'));
expect(screen.queryByLabelText(EXPIRED_MODAL_TITLE)).toBeFalsy();
expect(enterpriseUtils.sendEnterpriseTrackEvent).toHaveBeenCalledWith(
TEST_ENTERPRISE_CUSTOMER_UUID,
'edx.ui.admin_portal.subscriptions.expiration.modal.dismissed',
{
expiration_threshold: SUBSCRIPTION_DAYS_REMAINING_EXCEPTIONAL,
days_until_expiration: agreementNetDaysUntilExpiration,
},
);
});

test('handles customer support button click', () => {
const agreementNetDaysUntilExpiration = 0;
const detailStateCopy = {
...SUBSCRIPTION_PLAN_ZERO_STATE,
agreementNetDaysUntilExpiration,
};

render(<ExpirationModalsWithContext detailState={detailStateCopy} />);
userEvent.click(screen.getByText('Contact customer support'));
expect(enterpriseUtils.sendEnterpriseTrackEvent).toHaveBeenCalledWith(
TEST_ENTERPRISE_CUSTOMER_UUID,
'edx.ui.admin_portal.subscriptions.expiration.modal.support_cta.clicked',
{
expiration_threshold: SUBSCRIPTION_DAYS_REMAINING_EXCEPTIONAL,
days_until_expiration: agreementNetDaysUntilExpiration,
},
);
});
});

Expand Down Expand Up @@ -112,6 +144,33 @@ describe('<SubscriptionExpirationModals />', () => {
expect(screen.queryByLabelText(EXPIRING_MODAL_TITLE)).toBeTruthy();
userEvent.click(screen.getByText('Dismiss'));
expect(screen.queryByLabelText(EXPIRING_MODAL_TITLE)).toBeFalsy();
expect(enterpriseUtils.sendEnterpriseTrackEvent).toHaveBeenCalledWith(
TEST_ENTERPRISE_CUSTOMER_UUID,
'edx.ui.admin_portal.subscriptions.expiration.modal.dismissed',
{
expiration_threshold: threshold,
days_until_expiration: threshold,
},
);
});

test('handles customer support button click', () => {
const agreementNetDaysUntilExpiration = 0;
const detailStateCopy = {
...SUBSCRIPTION_PLAN_ZERO_STATE,
agreementNetDaysUntilExpiration,
};

render(<ExpirationModalsWithContext detailState={detailStateCopy} />);
userEvent.click(screen.getByText('Contact customer support'));
expect(enterpriseUtils.sendEnterpriseTrackEvent).toHaveBeenCalledWith(
TEST_ENTERPRISE_CUSTOMER_UUID,
'edx.ui.admin_portal.subscriptions.expiration.modal.support_cta.clicked',
{
expiration_threshold: SUBSCRIPTION_DAYS_REMAINING_EXCEPTIONAL,
days_until_expiration: agreementNetDaysUntilExpiration,
},
);
});
});
});

0 comments on commit a79346c

Please sign in to comment.