Skip to content

Commit 456d8fd

Browse files
committed
Merge pull request #155 from salesforce-ux/analytics-clean-up
Analytics clean up
2 parents bd2a8ea + b64290b commit 456d8fd

File tree

8 files changed

+45
-102
lines changed

8 files changed

+45
-102
lines changed

app_modules/site/components/motion-and-animation/toggle-example/index.jsx

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@ THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND
1111

1212
import React from 'react';
1313
import classNames from 'classnames';
14-
import { logCTAEvent } from 'app_modules/site/util/analytics';
1514
import componentUtil from 'app_modules/ui/util/component';
1615
const pf = componentUtil.prefix;
1716

@@ -41,8 +40,6 @@ class ToggleExample extends React.Component {
4140

4241
const {toggle, title} = this.props;
4342

44-
logCTAEvent('play-example', { title: title });
45-
4643
if (this._isAnimating) return;
4744

4845
if (toggle) {

app_modules/site/components/page/anchor/index.jsx

Lines changed: 2 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -12,12 +12,11 @@ THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND
1212
import React from 'react';
1313
import _ from 'lodash';
1414
import shared from 'app_modules/site/shared';
15-
import CTALink from 'app_modules/site/components/cta-link';
1615
import classNames from 'classnames';
17-
import { logCTAEvent } from 'app_modules/site/util/analytics';
1816
import componentUtil, { prefix as pf } from 'app_modules/ui/util/component';
1917
import navigation from 'app_modules/site/navigation/navigation';
2018
import { getActiveNavItems } from 'app_modules/site/navigation/navigation-utils';
19+
import { Link } from 'react-router';
2120

2221
class Anchor extends React.Component {
2322

@@ -59,11 +58,7 @@ class Anchor extends React.Component {
5958
let breadcrumbs = childNavItems.map(item => {
6059
return (
6160
<li className={pf('list__item')} key={item.id}>
62-
<CTALink
63-
href={item.path}
64-
ctaEventName='anchor-breadcumb'>
65-
{item.label}
66-
</CTALink>
61+
<Link to={item.route}>{item.label}</Link>
6762
</li>
6863
);
6964
});

app_modules/site/components/page/component/flavor/index.jsx

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,6 @@ import componentUtil, { prefix as pf } from 'app_modules/ui/util/component';
2424
import Heading from 'app_modules/site/components/page/heading';
2525
import Tabs from 'ui/components/tabs/index.react';
2626
import CTALink from 'app_modules/site/components/cta-link';
27-
import { logInputEvent } from 'app_modules/site/util/analytics';
2827

2928
import { cssPrefix } from 'app_modules/global';
3029
import whitelistUtilities from '.generated/whitelist-utilities.js';
@@ -200,9 +199,6 @@ export default class ComponentFlavor extends React.Component {
200199

201200
handleCodeMouseUp(tabKey) {
202201
let sel = window.getSelection && window.getSelection();
203-
if (sel && sel.toString().length > 0) {
204-
logInputEvent('component-code-text-select', {flavor: this.props.flavor.id, tab: tabKey});
205-
}
206202
}
207203

208204
onFrameLoad(caller) {
@@ -323,10 +319,10 @@ export default class ComponentFlavor extends React.Component {
323319
const {flavor} = this.props;
324320
return this.state.previewTabs.map((tab, index) => {
325321
const content = (
326-
<CTALink ctaEventName='component-preview-tab-click' ctaExtraValues={{ flavor: flavor.id, tab: tab.key }}>
322+
<span>
327323
<SvgIcon sprite="utility" symbol={tab.icon} className={pf(`icon icon__svg icon-utility-${tab.iconClass} icon--x-small icon-text-default m-right--x-small`)} />
328324
{tab.label}
329-
</CTALink>
325+
</span>
330326
);
331327
return (
332328
<Tabs.Item

app_modules/site/components/page/component/index.jsx

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -13,13 +13,11 @@ import React from 'react';
1313
import Anchor from 'app_modules/site/components/page/anchor';
1414
import Sticky from 'app_modules/site/components/sticky';
1515
import ComponentFlavor from './flavor';
16-
import CTALink from 'app_modules/site/components/cta-link';
1716
import Status from 'app_modules/site/util/component/status';
1817
import TableYAML from './table-yaml';
1918
import PrefsMixin from 'app_modules/site/preferences/mixin';
20-
import componentUtil from 'app_modules/ui/util/component';
21-
const pf = componentUtil.prefix;
22-
19+
import { prefix as pf } from 'app_modules/ui/util/component';
20+
import { Link } from 'react-router';
2321

2422
const ComponentBody = React.createClass({
2523

@@ -66,9 +64,9 @@ const ComponentBody = React.createClass({
6664
const flavors = this.props.component.flavors.filter(this.shouldDisplayFlavor, this).map(flavor => {
6765
return (
6866
<li className={pf('list__name')} key={flavor.uid}>
69-
<CTALink href={`#${flavor.id}`} ctaEventName='variant-link' ctaExtraValues={{ value: flavor.id }}>
67+
<a href={`#${flavor.id}`}>
7068
{flavor.title}
71-
</CTALink>
69+
</a>
7270
</li>
7371
);
7472
});

app_modules/site/util/analytics/index.js

Lines changed: 2 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -52,17 +52,6 @@ function logCTAEvent(type, extraValues) {
5252
logEvent('tagEvent', 'CTA', values);
5353
}
5454

55-
/**
56-
* Records an input event.
57-
*
58-
* @param {string} type - Which CTA was interacted with?
59-
* @param {object} extraValues - Optional extra tracking parameters
60-
*/
61-
function logInputEvent(type, extraValues) {
62-
let values = _.assign({'path': normalizedLocationPathname(), 'type': type, 'usertype': process.env.DEFAULT_USER_TPE}, extraValues);
63-
logEvent('tagEvent', 'Input', values);
64-
}
65-
6655
/**
6756
* Records a download event.
6857
*
@@ -77,6 +66,5 @@ function logDownloadEvent(type, extraValues) {
7766
export default {
7867
logCurrentPageVisit,
7968
logCTAEvent,
80-
logDownloadEvent,
81-
logInputEvent
82-
};
69+
logDownloadEvent
70+
};

site/getting-started/heroku/index.jsx

Lines changed: 32 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,6 @@ import version from '.generated/site.version';
1818
import { prefix as pf } from 'app_modules/ui/util/component';
1919
import { Link } from 'react-router';
2020
import g from 'app_modules/global';
21-
import CTALink from 'app_modules/site/components/cta-link';
2221

2322
export default (
2423
<PageBody anchorTitle="Heroku" contentClassName={pf('grid wrap')}>
@@ -27,39 +26,39 @@ export default (
2726
<h3 className="site-text-heading--label">Steps</h3>
2827
<ul className={pf('list--vertical has-block-links')}>
2928
<li>
30-
<CTALink ctaEventName='heroku-tutorial-step-1-initialize-project' href='#step-1-initialize-project'>
29+
<a href='#step-1-initialize-project'>
3130
1. Initialize your project
32-
</CTALink>
31+
</a>
3332
</li>
3433
<li>
35-
<CTALink ctaEventName='heroku-tutorial-step-2-install-node-dependencies' href='#step-2-install-node-dependencies'>
34+
<a href='#step-2-install-node-dependencies'>
3635
2. Install node dependencies
37-
</CTALink>
36+
</a>
3837
</li>
3938
<li>
40-
<CTALink ctaEventName='heroku-tutorial-step-3-create-index-html' href='#step-3-create-index-html'>
39+
<a href='#step-3-create-index-html'>
4140
3. Create index.html
42-
</CTALink>
41+
</a>
4342
</li>
4443
<li>
45-
<CTALink ctaEventName='heroku-tutorial-step-4-create-server-js' href='#step-4-create-server-js'>
44+
<a href='#step-4-create-server-js'>
4645
4. Create server.js
47-
</CTALink>
46+
</a>
4847
</li>
4948
<li>
50-
<CTALink ctaEventName='heroku-tutorial-step-5-download-slds-assets' href='#step-5-download-slds-assets'>
49+
<a href='#step-5-download-slds-assets'>
5150
5. Download {g.displayName}
52-
</CTALink>
51+
</a>
5352
</li>
5453
<li>
55-
<CTALink ctaEventName='heroku-tutorial-step-6-add-components' href='#step-6-add-components'>
54+
<a href='#step-6-add-components'>
5655
6. Add components
57-
</CTALink>
56+
</a>
5857
</li>
5958
<li>
60-
<CTALink ctaEventName='heroku-tutorial-step-7-deploy-to-heroku' href='#step-7-deploy-to-heroku'>
59+
<a href='#step-7-deploy-to-heroku'>
6160
7. Deploy to Heroku
62-
</CTALink>
61+
</a>
6362
</li>
6463
</ul>
6564
</div>
@@ -75,7 +74,7 @@ export default (
7574
</p>
7675
<p>
7776
If you&rsquo;re interested in a more in-depth tutorial check
78-
out <strong><CTALink ctaEventName='heroku-tutorial-react-app' href={g.herokuLightingReactAppUrl[0].url} target="_blank">Christophe Coenraets&rsquo; GitHub project</CTALink></strong>.
77+
out <strong><a href={g.herokuLightingReactAppUrl[0].url} target="_blank">Christophe Coenraets&rsquo; GitHub project</a></strong>.
7978
His project is a reference application built with the
8079
{g.displayName}, React, Node, Postgres, and Heroku. For a
8180
static example, please continue with the steps below!
@@ -84,30 +83,30 @@ export default (
8483
<p>In this tutorial, we&rsquo;ll assume that you have some knowledge of the following:</p>
8584
<ul className={pf('list--dotted')}>
8685
<li>
87-
<CTALink ctaEventName='heroku-tutorial-nodejs-link' href="https://nodejs.org/" target="_blank">
86+
<a href="https://nodejs.org/" target="_blank">
8887
Node.js
89-
</CTALink>
88+
</a>
9089
</li>
9190
<li>
92-
<CTALink ctaEventName='heroku-tutorial-npm-link' href="https://www.npmjs.com/package/npm" target="_blank">
91+
<a href="https://www.npmjs.com/package/npm" target="_blank">
9392
NPM
94-
</CTALink>
93+
</a>
9594
</li>
9695
<li>
97-
<CTALink ctaEventName='heroku-tutorial-git-link' href="https://git-scm.com/" target="_blank">
96+
<a href="https://git-scm.com/" target="_blank">
9897
Git
99-
</CTALink>
98+
</a>
10099
</li>
101100
<li>
102-
<CTALink ctaEventName='heroku-tutorial-heroku-toolbelt-link' href="https://toolbelt.heroku.com/" target="_blank">
101+
<a href="https://toolbelt.heroku.com/" target="_blank">
103102
Heroku
104-
</CTALink>
103+
</a>
105104
</li>
106105
</ul>
107106

108107
<div className="slds-box slds-box slds-theme--shade slds-theme--alert-texture slds-m-bottom--medium">
109108
<p>
110-
If, for any reason, you wish to bypass the steps to manually create this project, clone the basic setup <CTALink ctaEventName='heroku-tutorial-static-starter' href={g.herokuLightingReactAppUrl[1].url} target="_blank">here</CTALink>. Once you clone the starter respository, <code>npm install</code>. Then, you can skip to <CTALink ctaEventName='heroku-tutorial-step-7-deploy-to-heroku' href="#step-5-download-slds-assets">Step 5: Download {g.displayName}</CTALink>.
109+
If, for any reason, you wish to bypass the steps to manually create this project, clone the basic setup <a href={g.herokuLightingReactAppUrl[1].url} target="_blank">here</a>. Once you clone the starter respository, <code>npm install</code>. Then, you can skip to <a href="#step-5-download-slds-assets">Step 5: Download {g.displayName}</a>.
111110
</p>
112111
</div>
113112

@@ -220,13 +219,13 @@ console.log('Served: http://localhost:' + port);
220219
app.listen(port);
221220
`}</CodeBlock>
222221
</div>
223-
<p><strong>Sanity Checkpoint:</strong> Run <code>node server.js</code> in your terminal and your project will be served on <CTALink ctaEventName='heroku-tutorial-step-7-deploy-to-heroku' href="http://localhost:8080/" target="_blank">http:&#47;&#47;localhost:8080&#47;</CTALink>. You may also run <code>npm run start</code> as it will yield the same results.</p>
222+
<p><strong>Sanity Checkpoint:</strong> Run <code>node server.js</code> in your terminal and your project will be served on <a href="http://localhost:8080/" target="_blank">http:&#47;&#47;localhost:8080&#47;</a>. You may also run <code>npm run start</code> as it will yield the same results.</p>
224223
<figure className={pf('large-size--2-of-2 order--1 large-order--2')}>
225224
<img className={pf('image tutorial-image')} src="/assets/images/tutorial/heroku/image1.png" alt="Sanity checkpoint of static text." />
226225
</figure>
227226

228227
<Heading type="h2" id="step-5-download-slds-assets" className="site-text-heading--large">Step 5: Download the {g.displayName}</Heading>
229-
<p><CTALink ctaEventName='heroku-tutorial-download-slds-assets' href="/resources/downloads/">Download the {g.displayName} CSS framework</CTALink></p>
228+
<p><Link to="/resources/downloads/">Download the {g.displayName} CSS framework</Link></p>
230229
<p>Once you unzip the CSS framework, you need to move a few things into the correct location. Grab the <code>assets/</code> folder and put it in your <code>demo_slds_heroku/public/</code> folder. Your project should have a similar file structure to the following:</p>
231230
<div className={pf('site-code--content scrollable--x')}>
232231
<CodeBlock language="bash">{`
@@ -272,7 +271,7 @@ demo_slds_heroku/
272271
<h3 className="site-text-heading--medium">
273272
A. Use the Grid System Component (Order)
274273
</h3>
275-
<p>Replace the text inside the <code>body</code> tags with the following. You can find the markup on the <CTALink ctaEventName='heroku-tutorial-grid-system-component-link' href="/components/grid-system#order" target="_blank">Grid System component page</CTALink>.</p>
274+
<p>Replace the text inside the <code>body</code> tags with the following. You can find the markup on the <a href="/components/grid-system#order" target="_blank">Grid System component page</a>.</p>
276275
<div className={pf('site-code--content scrollable--x')}>
277276
<CodeBlock language="bash">{`
278277
<div class="slds-grid slds-wrap">
@@ -328,7 +327,7 @@ demo_slds_heroku/
328327
<h3 className="site-text-heading--medium">
329328
B. Use the Page Header Component (Record-Home)
330329
</h3>
331-
<p>Swap the text <strong>Page Header Component</strong> with the markup from the example on the <CTALink ctaEventName='heroku-tutorial-page-header-component-link' href="/components/page-headers#record-home" target="_blank">Page Header component page</CTALink>.</p>
330+
<p>Swap the text <strong>Page Header Component</strong> with the markup from the example on the <a href="/components/page-headers#record-home" target="_blank">Page Header component page</a>.</p>
332331

333332
<h3 className="site-text-heading--medium">C. Add a Fun Image</h3>
334333
<p>Swap the text <code>Image</code> with an image.</p>
@@ -339,16 +338,16 @@ demo_slds_heroku/
339338
</div>
340339

341340
<h3 className="site-text-heading--medium">D. Use the Tabs Component</h3>
342-
<p>Swap the text <code>Tab Component</code> with the markup from the example on the <CTALink ctaEventName='heroku-tutorial-tabs-component-link' href="/components/tabs#default" target="_blank">Tabs component page</CTALink></p>
341+
<p>Swap the text <code>Tab Component</code> with the markup from the example on the <a href="/components/tabs#default" target="_blank">Tabs component page</a></p>
343342

344343
<h3 className="site-text-heading--medium">E. Use the Activity Timeline Component</h3>
345-
<p>Swap the <code>H2</code> tags and its contents <code>Item One Content</code> with the markup from the example on the <CTALink ctaEventName='heroku-tutorial-activity-timeline-link' href="/components/activity-timeline#base" target="_blank">Activity Timeline component page</CTALink>.</p>
344+
<p>Swap the <code>H2</code> tags and its contents <code>Item One Content</code> with the markup from the example on the <a href="/components/activity-timeline#base" target="_blank">Activity Timeline component page</a>.</p>
346345

347346
<h3 className="site-text-heading--medium">F. Use the Card Component (Base)</h3>
348-
<p>Swap the text <code>Card Component</code> with the markup from the example on the <CTALink ctaEventName='heroku-tutorial-card-component-link' href="/components/cards#base" target="_blank">Card component page</CTALink>.</p>
347+
<p>Swap the text <code>Card Component</code> with the markup from the example on the <a href="/components/cards#base" target="_blank">Card component page</a>.</p>
349348

350349
<h3 className="site-text-heading--medium">G. Things are looking kind of squashed!</h3>
351-
<p>If you feel kind of cramped, check out the <CTALink ctaEventName='heroku-tutorial-utilities-spacing-link' href="/components/utilities/spacing" target="_blank">Utilities</CTALink> page for spacing classes.</p>
350+
<p>If you feel kind of cramped, check out the <a href="/components/utilities/spacing" target="_blank">Utilities</a> page for spacing classes.</p>
352351
<figure className={pf('large-size--2-of-2 order--1 large-order--2')}>
353352
<img className={pf('image tutorial-image')} src="/assets/images/tutorial/heroku/image8.png" alt="Static page header, image, tabs, activity timeline, and card components." />
354353
</figure>

site/resources/tokens/_components/row/index.jsx

Lines changed: 1 addition & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -12,38 +12,24 @@ THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND
1212
import React from 'react';
1313
import _ from 'lodash';
1414
import classNames from 'classnames';
15-
import { logInputEvent } from 'app_modules/site/util/analytics';
1615

1716
import ExampleCell from '../cell-example';
1817
import ValueCell from '../cell-value';
1918

2019
class Row extends React.Component {
2120

22-
/*shouldComponentUpdate(nextProps, nextState) {
23-
if (this.props.token !== nextProps.token) return true;
24-
if (this.props.nameFormat !== nextProps.nameFormat) return true;
25-
return false;
26-
}*/
27-
2821
getName() {
2922
const {token, nameFormat} = this.props;
3023
return nameFormat.formatter(token.name);
3124
}
3225

33-
handleMouseUp() {
34-
let sel = window.getSelection && window.getSelection();
35-
if (sel && sel.toString().length > 0) {
36-
logInputEvent('token-name-select', {name: this.props.token.name, formattedName: this.getName(), format: this.props.nameFormat.name});
37-
}
38-
}
39-
4026
render() {
4127
const {token, options} = this.props;
4228
const className = classNames('', this.props.className);
4329
return (
4430
<tr className={className}>
4531
<td>
46-
<code onMouseUp={this.handleMouseUp.bind(this)}>{this.getName()}</code>
32+
<code>{this.getName()}</code>
4733
</td>
4834
{this.renderValues()}
4935
</tr>

site/resources/tokens/index.jsx

Lines changed: 2 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -15,8 +15,6 @@ import Anchor from 'app_modules/site/components/page/anchor';
1515
import Sticky from 'app_modules/site/components/sticky';
1616
import _ from 'lodash';
1717
import classNames from 'classnames';
18-
import { logInputEvent } from 'app_modules/site/util/analytics';
19-
import CTALink from 'app_modules/site/components/cta-link';
2018
import { Link } from 'react-router';
2119
import { prefix as pf } from 'app_modules/ui/util/component';
2220
import Prefs from 'app_modules/site/preferences';
@@ -73,10 +71,6 @@ const Tokens = React.createClass({
7371
return categories;
7472
},
7573

76-
logSearchChange: function(query) {
77-
logInputEvent('design-token-search', { format: this.format().name, query: query });
78-
},
79-
8074
onSearchChange: function(e) {
8175
let {tokensByCategory} = this.state;
8276
const target = event.target || event.currentTarget;
@@ -101,14 +95,6 @@ const Tokens = React.createClass({
10195
tokensByCategory = _.pick(tokensByCategory, tokens => {
10296
return tokens.length > 0;
10397
});
104-
105-
if (this.logSearchChangeDebounce) {
106-
clearTimeout(this.logSearchChangeDebounce);
107-
}
108-
this.logSearchChangeDebounce = setTimeout(() => {
109-
this.logSearchChangeDebounce = null;
110-
this.logSearchChange(query);
111-
}, 600);
11298
}
11399
this.setState({
114100
query,
@@ -175,11 +161,9 @@ const Tokens = React.createClass({
175161
}).map(category => {
176162
return (
177163
<li className={pf('list__item')} key={category.key}>
178-
<CTALink href={`#category-${category.key}`}
179-
ctaEventName='tokens-category-click'
180-
ctaExtraValues={{ category: category.key, format: this.format().name }}>
164+
<a href={`#category-${category.key}`}>
181165
{category.label}
182-
</CTALink>
166+
</a>
183167
</li>
184168
);
185169
});

0 commit comments

Comments
 (0)