Merge pull request #8359 from overleaf/ta-settings-tracking

Track Settings Page Upgrade Clicks

GitOrigin-RevId: 92c9f595a3b0f1a1cf40816204cabe3e94d36db3
This commit is contained in:
Miguel Serrano 2022-06-10 10:14:00 +02:00 committed by Copybot
parent f510b8808b
commit c2cfa96983
2 changed files with 26 additions and 8 deletions

View file

@ -3,6 +3,11 @@ import { useTranslation } from 'react-i18next'
import AccessibleModal from '../../../../shared/components/accessible-modal'
import { Button, Modal } from 'react-bootstrap'
import getMeta from '../../../../utils/meta'
import { sendMB } from '../../../../infrastructure/event-tracking'
function trackUpgradeClick() {
sendMB('settings-upgrade-click')
}
type IntegrationLinkingWidgetProps = {
logo: ReactNode
@ -66,7 +71,6 @@ export function IntegrationLinkingWidget({
<div>
<ActionButton
hasFeature={hasFeature}
upgradePath="/user/subscription/plans"
linked={linked}
handleUnlinkClick={handleUnlinkClick}
linkPath={linkPath}
@ -86,7 +90,6 @@ export function IntegrationLinkingWidget({
type ActionButtonProps = {
hasFeature?: boolean
upgradePath: string
linked?: boolean
handleUnlinkClick: () => void
linkPath: string
@ -95,7 +98,6 @@ type ActionButtonProps = {
function ActionButton({
hasFeature,
upgradePath,
linked,
handleUnlinkClick,
linkPath,
@ -105,7 +107,11 @@ function ActionButton({
if (!hasFeature) {
return (
<Button bsStyle="info" href={upgradePath}>
<Button
bsStyle="info"
href="/user/subscription/plans"
onClick={trackUpgradeClick}
>
<span className="text-capitalize">{t('upgrade')}</span>
</Button>
)

View file

@ -1,6 +1,8 @@
import { expect } from 'chai'
import sinon from 'sinon'
import { screen, fireEvent, render, waitFor } from '@testing-library/react'
import { IntegrationLinkingWidget } from '../../../../../../frontend/js/features/settings/components/linking/integration-widget'
import * as eventTracking from '../../../../../../frontend/js/infrastructure/event-tracking'
describe('<IntegrationLinkingWidgetTest/>', function () {
const defaultProps = {
@ -15,18 +17,28 @@ describe('<IntegrationLinkingWidgetTest/>', function () {
}
describe('when the feature is not available', function () {
let sendMBSpy: sinon.SinonSpy
beforeEach(function () {
sendMBSpy = sinon.spy(eventTracking, 'sendMB')
render(<IntegrationLinkingWidget {...defaultProps} hasFeature={false} />)
})
afterEach(function () {
sendMBSpy.restore()
})
it("should render 'Premium feature' label", function () {
screen.getByText('Premium feature')
})
it('should render a link to upgrade the account', function () {
expect(
screen.getByRole('link', { name: 'Upgrade' }).getAttribute('href')
).to.equal('/user/subscription/plans')
it('should render an upgrade link and track clicks', function () {
const upgradeLink = screen.getByRole('link', { name: 'Upgrade' })
expect(upgradeLink.getAttribute('href')).to.equal(
'/user/subscription/plans'
)
fireEvent.click(upgradeLink)
expect(sendMBSpy).to.be.calledOnce
expect(sendMBSpy).calledWith('settings-upgrade-click')
})
})